/* TEE Doctrine v12 premium layer loaded after the core mobile first stylesheet. */

/* Login surface */
.login-card {
    overflow: visible;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 18px;
    background:
        radial-gradient(circle at 12% 0%, rgba(197,160,89,.06), transparent 20rem),
        linear-gradient(155deg, rgba(255,255,255,.022), transparent 42%),
        rgba(17,17,19,.96);
    box-shadow: 0 26px 76px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.035);
}
.login-form input {
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 12px;
    background: #101012;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.018);
    outline: none;
}
.login-form input:focus,
.login-form input:focus-visible {
    outline: none;
    border-color: rgba(232,197,120,.74);
    box-shadow: 0 0 0 1px rgba(232,197,120,.28), inset 0 1px 0 rgba(255,255,255,.025);
}
.login-form .button-primary {
    width: 100%;
    min-height: 49px;
    appearance: none;
    -webkit-appearance: none;
    overflow: hidden;
    border: 1px solid rgba(226,198,132,.72);
    border-radius: 12px;
    background: linear-gradient(180deg, #e8cd87 0%, #d4b061 100%);
    background-clip: border-box;
    color: #101010;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.34), 0 9px 22px rgba(0,0,0,.26);
    text-shadow: none;
}
.login-form .button-primary:hover {
    transform: none;
    background: linear-gradient(180deg, #ecd694 0%, #dbb96c 100%);
    border-color: rgba(239,214,157,.82);
}

/* The wrapper only clips the native reCAPTCHA surface. It does not draw a second frame. */
.captcha-wrap {
    position: relative;
    width: 304px;
    max-width: 100%;
    height: 78px;
    min-height: 0;
    margin-inline: auto;
    overflow: hidden;
    border: 0;
    border-radius: 10px;
    background: transparent;
    box-shadow: none;
    line-height: 0;
}
.captcha-wrap .g-recaptcha,
.captcha-wrap .g-recaptcha > div {
    width: 304px;
    height: 78px;
    transform-origin: top left;
}
.captcha-wrap .g-recaptcha > div,
.captcha-wrap iframe {
    overflow: hidden;
    border: 0 !important;
    border-radius: 10px !important;
}
.captcha-wrap::after {
    content: "";
    position: absolute;
    z-index: 3;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    pointer-events: none;
    background: rgba(17,17,19,.99);
}

/* Telegram identity gate */
.telegram-auth-panel {
    display: grid;
    gap: 12px;
    margin-top: 20px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 14px;
    background:
        radial-gradient(circle at 0 0, rgba(143,182,255,.07), transparent 18rem),
        rgba(12,12,14,.72);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
}
.telegram-auth-copy {
    display: grid;
    gap: 3px;
}
.telegram-auth-copy > span {
    color: var(--gold-bright);
    font-size: .67rem;
    font-weight: 830;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.telegram-auth-copy strong {
    font-size: .93rem;
}
.telegram-auth-copy small {
    color: var(--text-tertiary);
    line-height: 1.48;
}
.telegram-widget-shell {
    min-height: 42px;
    overflow: hidden;
    border-radius: 10px;
}
.telegram-widget-shell iframe {
    display: block;
    max-width: 100%;
    border-radius: 10px !important;
}
.telegram-auth-verified {
    border-color: rgba(114,217,167,.18);
    background: rgba(114,217,167,.035);
}
.telegram-reset-form {
    margin: 0;
}
.telegram-reset-form button {
    min-height: 36px;
    padding: 7px 10px;
    border: 1px solid var(--line-soft);
    border-radius: 9px;
    background: rgba(255,255,255,.025);
    color: var(--text-secondary);
    cursor: pointer;
    font: inherit;
    font-size: .76rem;
}
.telegram-reset-form button:hover {
    color: var(--text-primary);
    background: rgba(255,255,255,.05);
}

/* Licensed session watermark. Exact values are also present in the rendered DOM provenance attributes. */
.licensed-session-watermark {
    position: fixed;
    inset: 0;
    z-index: 65;
    pointer-events: none;
    user-select: none;
}
.licensed-session-watermark::before {
    content: attr(data-watermark);
    position: absolute;
    right: max(10px, env(safe-area-inset-right));
    bottom: calc(7px + env(safe-area-inset-bottom));
    max-width: min(88vw, 760px);
    color: rgba(255,255,255,.13);
    font: 600 8px/1.25 "SFMono-Regular", Consolas, monospace;
    letter-spacing: .015em;
    text-align: right;
    text-shadow: 0 1px 3px rgba(0,0,0,.7);
}

/* VIP entitlement notice */
.vip-license-banner {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    gap: 14px;
    align-items: start;
    margin: 0 0 20px;
    padding: 16px;
    border: 1px solid rgba(197,160,89,.22);
    border-radius: 16px;
    background:
        radial-gradient(circle at 0 0, rgba(197,160,89,.11), transparent 19rem),
        rgba(17,17,19,.9);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.vip-license-mark {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    border: 1px solid rgba(197,160,89,.26);
    background: rgba(197,160,89,.09);
    color: var(--gold-bright);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
}
.vip-license-kicker {
    display: block;
    margin-bottom: 3px;
    color: var(--gold-bright);
    font-size: .68rem;
    font-weight: 820;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.vip-license-banner strong { display:block; }
.vip-license-banner p { margin: 5px 0 0; color: var(--text-secondary); }

/* TrustZone map */
.trustzone-stack {
    display: grid;
    gap: 6px;
    margin: 20px 0;
}
.tz-row {
    display: grid;
    grid-template-columns: 58px minmax(0,1fr);
    gap: 4px 12px;
    align-items: center;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(17,17,19,.88);
}
.tz-row > span {
    grid-row: span 2;
    align-self: stretch;
    display: grid;
    place-items: center;
    border-right: 1px solid var(--line);
    color: var(--gold-bright);
    font: 800 .72rem/1 "SFMono-Regular", Consolas, monospace;
}
.tz-row strong { font-size: .94rem; }
.tz-row small { color: var(--text-tertiary); line-height: 1.42; }
.tz-row.secure { border-color: rgba(183,164,255,.15); }
.tz-row.normal { border-color: rgba(143,182,255,.14); }
.tz-row.accent {
    background: linear-gradient(90deg, rgba(197,160,89,.065), transparent), rgba(17,17,19,.9);
    border-color: rgba(197,160,89,.22);
}
.tz-divider {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--text-tertiary);
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.tz-divider::before, .tz-divider::after {
    content: "";
    height: 1px;
    flex: 1;
    background: rgba(183,164,255,.17);
}
.tz-divider.normal::before, .tz-divider.normal::after { background: rgba(143,182,255,.16); }

/* Module 3 connector */
.pipeline-diagram {
    position: relative;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
}
.pipeline-node {
    min-height: 0 !important;
    grid-template-columns: 40px minmax(0,1fr) !important;
    padding: 14px 15px !important;
    border-radius: 14px;
}
.pipeline-node:not(:last-child) { margin-bottom: 16px; }
.pipeline-node:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    left: 29px !important;
    right: auto !important;
    top: auto !important;
    bottom: -17px !important;
    width: 1px !important;
    height: 17px !important;
    display: block !important;
    border-radius: 0 !important;
    background: linear-gradient(to bottom, rgba(197,160,89,.44), rgba(255,255,255,.09)) !important;
    color: transparent !important;
    transform: none !important;
    z-index: 1;
}
.pipeline-index {
    position: relative;
    z-index: 2;
    box-shadow: 0 0 0 4px var(--bg-main);
}

/* Cache doctrine */
.cache-geometry-grid {
    display: grid;
    gap: 9px;
    margin: 18px 0;
}
.geometry-card {
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: rgba(17,17,19,.9);
}
.geometry-card > span {
    display: block;
    color: var(--gold-bright);
    font-size: .68rem;
    font-weight: 820;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.geometry-card strong { display:block; margin:4px 0; }
.geometry-card p { margin:0; color:var(--text-secondary); font-size:.9rem; }
.cache-phase-grid {
    display: grid;
    gap: 8px;
    align-items: stretch;
}
.cache-phase {
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #101012;
}
.cache-phase > span { color:var(--gold-bright); font-size:.68rem; font-weight:850; }
.cache-phase strong { display:block; margin:3px 0; }
.cache-phase p { margin:0; color:var(--text-secondary); font-size:.86rem; }
.phase-connector {
    width: 1px;
    height: 18px;
    margin-inline: 25px;
    background: linear-gradient(var(--gold), rgba(255,255,255,.08));
}
.lab-card-spaced { margin-top: 14px; }

/* Trace engineering */
.trace-schema {
    margin: 18px 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--bg-surface);
}
.trace-schema-head {
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:11px 13px;
    border-bottom:1px solid var(--line);
}
.trace-schema-head span { color:var(--text-tertiary); font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; }
.trace-schema-head strong { font-size:.82rem; }
.trace-schema-grid {
    display:grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap:1px;
    background:var(--line);
}
.trace-schema-grid code {
    display:block;
    padding:10px 11px;
    background:#101012;
    color:#d9dde6;
    font-size:.74rem;
}
.lab-sequence { display:grid; gap:10px; }

/* Clever Tech institutional credit */
.clever-tech-promo {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:14px;
    align-items:center;
    margin: 34px 0 18px;
    padding:18px;
    border:1px solid var(--line);
    border-radius:16px;
    background:
        radial-gradient(circle at 100% 0, rgba(143,182,255,.055), transparent 23rem),
        linear-gradient(150deg, rgba(255,255,255,.025), transparent 46%),
        rgba(17,17,19,.92);
}
.clever-tech-institution {
    border-color: rgba(197,160,89,.18);
    background:
        radial-gradient(circle at 100% 0, rgba(197,160,89,.07), transparent 24rem),
        linear-gradient(150deg, rgba(255,255,255,.025), transparent 46%),
        rgba(17,17,19,.94);
}
.clever-tech-brand {
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:13px;
    border:1px solid var(--line-soft);
    background:var(--bg-elevated);
    color:#f5f5f7;
    font-weight:900;
    letter-spacing:-.06em;
}
.clever-tech-copy span { color:var(--text-tertiary); font-size:.68rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.clever-tech-copy h2 { margin:2px 0 4px; font-size:1.25rem; }
.clever-tech-copy p { margin:0; color:var(--text-secondary); }
.clever-tech-promo .button { grid-column:1 / -1; width:100%; }

/* Legal footer */
.legal-panel {
    margin-top: 38px;
    padding:18px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:16px;
    background:rgba(14,14,16,.9);
}
.legal-panel h2 { margin:0; font-size:clamp(1.35rem,5vw,1.9rem); letter-spacing:-.035em; }
.legal-grid { display:grid; gap:8px; margin-top:14px; }
.legal-grid > div {
    padding:12px;
    border:1px solid var(--line);
    border-radius:11px;
    background:rgba(255,255,255,.012);
}
.legal-grid strong { font-size:.84rem; }
.legal-grid p { margin:4px 0 0; color:var(--text-secondary); font-size:.82rem; }
.legal-fineprint { margin:14px 0 0; color:var(--text-tertiary); font-size:.73rem; }

/* Motion */
.motion-reveal {
    opacity: 0;
    transform: translate3d(0, 12px, 0) scale(.997);
    transition: opacity .48s var(--ease), transform .48s var(--ease);
    will-change: opacity, transform;
}
.motion-reveal.is-visible { opacity:1; transform:none; }
.motion-reveal.reveal-delay-1 { transition-delay:70ms; }
.motion-reveal.reveal-delay-2 { transition-delay:140ms; }
details.is-animating { overflow:hidden !important; }
.drawer-backdrop {
    opacity:0;
    transition:opacity .28s var(--ease);
}
.drawer-backdrop.open { opacity:1; }
.mobile-toc {
    opacity:0;
    transition: transform .31s cubic-bezier(.2,.78,.22,1), opacity .24s ease;
}
.mobile-toc.open { opacity:1; }
.explain-box summary::after { transition:transform .24s var(--ease); }

@media (min-width: 700px) {
    .cache-geometry-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .cache-phase-grid { grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr) 30px minmax(0,1fr); align-items:center; }
    .phase-connector { width:100%; height:1px; margin:0; background:linear-gradient(90deg,var(--gold),rgba(255,255,255,.08)); }
    .trace-schema-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
    .lab-sequence { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .lab-sequence .lab-card { min-height:100%; }
    .clever-tech-promo { grid-template-columns:auto minmax(0,1fr) auto; }
    .clever-tech-promo .button { grid-column:auto; width:auto; white-space:nowrap; }
    .legal-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .telegram-auth-verified { grid-template-columns:minmax(0,1fr) auto; align-items:center; }
}

@media (max-width: 560px) {
    .vip-license-banner { padding:13px; gap:11px; }
    .vip-license-mark { width:40px; height:40px; border-radius:11px; }
    .tz-row { grid-template-columns:50px minmax(0,1fr); padding:10px 11px; }
    .pipeline-node { grid-template-columns:36px minmax(0,1fr) !important; padding:13px !important; }
    .pipeline-node:not(:last-child)::after { left:26px !important; }
    .clever-tech-promo { padding:14px; }
    .legal-panel { padding:14px; }
    .course-brand { max-width:48vw; }
    .telegram-auth-panel { padding:12px; }
}

@media (max-width: 360px) {
    .login-card { padding-inline:18px; border-radius:16px; }
    .captcha-wrap { width:268px; height:69px; border-radius:9px; }
    .captcha-wrap .g-recaptcha { transform:scale(.88); }
}

@media (max-width: 330px) {
    .captcha-wrap { width:250px; height:64px; border-radius:8px; }
    .captcha-wrap .g-recaptcha { transform:scale(.82); }
}

@media (prefers-reduced-motion: reduce) {
    .motion-reveal { opacity:1 !important; transform:none !important; transition:none !important; }
    .drawer-backdrop, .mobile-toc, .explain-box summary::after { transition:none !important; }
}