
/*
 * AMZ Auto — Spatial Operations UI
 * Presentation-only layer loaded after the existing application styles.
 * Every brand treatment derives from the existing --primary/--accent/--sidebar-bg
 * variables emitted by portal_theme_style(). No route, form, or feature contract
 * is changed by this stylesheet.
 */

:root{
    --amz-font-display: "Aptos Display","Segoe UI Variable Display","Segoe UI",ui-sans-serif,system-ui,sans-serif;
    --amz-font-body: "Aptos","Segoe UI Variable Text","Segoe UI",ui-sans-serif,system-ui,sans-serif;
    --amz-font-mono: "SFMono-Regular",Consolas,"Liberation Mono",monospace;
    --amz-space-1:4px;
    --amz-space-2:8px;
    --amz-space-3:12px;
    --amz-space-4:16px;
    --amz-space-5:20px;
    --amz-space-6:24px;
    --amz-space-8:32px;
    --amz-space-10:40px;
    --amz-space-12:48px;
    --amz-shell-max:1760px;
    --amz-topbar-height:78px;
    --amz-ease:cubic-bezier(.2,.8,.2,1);
    --amz-ease-mechanical:cubic-bezier(.16,1,.3,1);
    --amz-fast:160ms;
    --amz-normal:280ms;
    --amz-slow:680ms;
    --amz-chamfer:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));
    --amz-panel-radius:clamp(8px,var(--radius,18px),24px);
    --amz-control-radius:clamp(5px,calc(var(--radius,18px) * .38),10px);
}

html[data-theme="light"],
body[data-theme="light"]{
    --amz-canvas:#edf0f3;
    --amz-canvas-2:#f7f8f8;
    --amz-surface:#ffffff;
    --amz-surface-raised:#fbfcfc;
    --amz-surface-sunk:#e7ebee;
    --amz-surface-translucent:rgba(255,255,255,.78);
    --amz-ink:#12171b;
    --amz-ink-soft:#3d474f;
    --amz-muted:#6d7880;
    --amz-line:rgba(18,23,27,.12);
    --amz-line-strong:rgba(18,23,27,.22);
    --amz-highlight:rgba(255,255,255,.86);
    --amz-shadow:0 28px 80px rgba(13,24,32,.12),0 2px 8px rgba(13,24,32,.06);
    --amz-shadow-soft:0 14px 36px rgba(13,24,32,.08),0 1px 3px rgba(13,24,32,.05);
    --amz-inset:inset 0 1px 0 rgba(255,255,255,.9);
    --amz-grid:rgba(18,23,27,.055);
    --amz-panel-glow:color-mix(in srgb,var(--primary) 7%,transparent);
}

html[data-theme="dark"],
body[data-theme="dark"]{
    --amz-canvas:#07090b;
    --amz-canvas-2:#0c1013;
    --amz-surface:#11161a;
    --amz-surface-raised:#151c21;
    --amz-surface-sunk:#090d10;
    --amz-surface-translucent:rgba(15,20,24,.78);
    --amz-ink:#f3f6f7;
    --amz-ink-soft:#c0c9ce;
    --amz-muted:#87949c;
    --amz-line:rgba(255,255,255,.10);
    --amz-line-strong:rgba(255,255,255,.18);
    --amz-highlight:rgba(255,255,255,.08);
    --amz-shadow:0 34px 110px rgba(0,0,0,.48),0 2px 12px rgba(0,0,0,.35);
    --amz-shadow-soft:0 18px 48px rgba(0,0,0,.30),0 1px 4px rgba(0,0,0,.28);
    --amz-inset:inset 0 1px 0 rgba(255,255,255,.07);
    --amz-grid:rgba(255,255,255,.045);
    --amz-panel-glow:color-mix(in srgb,var(--primary) 11%,transparent);
}

html{
    background:var(--amz-canvas);
}

body{
    min-width:320px;
    font-family:var(--amz-font-body);
    color:var(--amz-ink);
    background:
        linear-gradient(var(--amz-grid) 1px,transparent 1px),
        linear-gradient(90deg,var(--amz-grid) 1px,transparent 1px),
        radial-gradient(circle at 8% 10%,color-mix(in srgb,var(--primary) 13%,transparent),transparent 32%),
        radial-gradient(circle at 92% 4%,color-mix(in srgb,var(--accent) 11%,transparent),transparent 27%),
        linear-gradient(145deg,var(--amz-canvas-2),var(--amz-canvas));
    background-size:44px 44px,44px 44px,auto,auto,auto;
    background-attachment:fixed;
    --font:var(--amz-font-body);
    --bg:var(--amz-canvas);
    --bg-2:var(--amz-canvas-2);
    --surface:var(--amz-surface);
    --surface-2:var(--amz-surface-raised);
    --panel:var(--amz-surface);
    --panel-soft:var(--amz-surface-translucent);
    --text:var(--amz-ink);
    --heading:var(--amz-ink);
    --muted:var(--amz-muted);
    --muted-2:var(--amz-muted);
    --line:var(--amz-line);
    --line-strong:var(--amz-line-strong);
    --shadow:var(--amz-shadow);
    --shadow-soft:var(--amz-shadow-soft);
    --body-gradient:none;
}

body::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:-3;
    pointer-events:none;
    background:
        linear-gradient(112deg,transparent 0 48%,color-mix(in srgb,var(--primary) 4%,transparent) 48% 49%,transparent 49%),
        linear-gradient(68deg,transparent 0 72%,color-mix(in srgb,var(--accent) 4%,transparent) 72% 73%,transparent 73%);
}

::selection{
    color:var(--on-primary,#fff);
    background:var(--primary);
}

:focus-visible{
    outline:3px solid color-mix(in srgb,var(--accent) 74%,white);
    outline-offset:3px;
}

h1,h2,h3,h4,h5,h6{
    font-family:var(--amz-font-display);
    color:var(--amz-ink);
    text-wrap:balance;
}

p{
    text-wrap:pretty;
}

.amz-spatial-backdrop{
    position:fixed;
    inset:0;
    z-index:-2;
    pointer-events:none;
    overflow:hidden;
    opacity:.82;
}

.amz-spatial-backdrop canvas,
.auth-spatial-stage canvas{
    display:block;
    width:100%;
    height:100%;
}

.amz-spatial-haze{
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg,var(--amz-canvas) 0%,transparent 22%,transparent 78%,var(--amz-canvas) 100%),
        linear-gradient(180deg,transparent 0 62%,var(--amz-canvas) 100%);
}

/* ───────────────────────── Application shell / command bridge ───────────── */

.app-frame{
    position:relative;
    z-index:1;
    display:block;
    min-height:100vh;
    background:transparent;
}

.main-frame{
    min-width:0;
    min-height:100vh;
    display:flex;
    flex-direction:column;
}

.workspace-shell{
    width:100%;
    max-width:var(--amz-shell-max);
    margin:0 auto;
    padding:22px clamp(18px,3vw,54px) 72px;
}

.content-frame{
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
}

.topbar{
    position:sticky;
    top:0;
    z-index:60;
    min-height:var(--amz-topbar-height);
    padding:10px clamp(14px,2.6vw,44px);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    border:0;
    border-bottom:1px solid var(--amz-line);
    background:
        linear-gradient(180deg,color-mix(in srgb,var(--amz-surface-translucent) 96%,transparent),color-mix(in srgb,var(--amz-surface-translucent) 82%,transparent));
    box-shadow:0 10px 34px rgba(0,0,0,.04);
    backdrop-filter:blur(24px) saturate(1.2);
}

.topbar::after{
    content:"";
    position:absolute;
    left:clamp(14px,2.6vw,44px);
    right:clamp(14px,2.6vw,44px);
    bottom:-1px;
    height:1px;
    background:linear-gradient(90deg,var(--primary),var(--accent),transparent 72%);
    opacity:.7;
}

.topbar-command,
.topbar-actions,
.topbar-identity,
.menu-toggle{
    display:flex;
    align-items:center;
}

.topbar-command{
    min-width:0;
    gap:16px;
}

.menu-toggle{
    min-width:116px;
    width:auto;
    height:48px;
    padding:0 16px;
    gap:11px;
    border:1px solid var(--amz-line-strong);
    border-radius:8px;
    color:var(--amz-ink);
    background:
        linear-gradient(145deg,var(--amz-highlight),transparent 46%),
        var(--amz-surface);
    box-shadow:var(--amz-inset),var(--amz-shadow-soft);
    font-size:13px;
    font-weight:800;
    letter-spacing:.02em;
    cursor:pointer;
    transition:transform var(--amz-fast) var(--amz-ease),border-color var(--amz-fast),box-shadow var(--amz-fast);
}

.menu-toggle:hover{
    transform:translateY(-2px);
    border-color:color-mix(in srgb,var(--primary) 48%,var(--amz-line-strong));
    box-shadow:var(--amz-inset),0 16px 34px color-mix(in srgb,var(--primary) 12%,transparent);
}

.menu-toggle-grid{
    width:18px;
    height:18px;
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:3px;
    transform:rotate(8deg);
}

.menu-toggle-grid i{
    display:block;
    border:1px solid color-mix(in srgb,var(--primary) 70%,var(--amz-ink));
    background:color-mix(in srgb,var(--primary) 14%,transparent);
}

.topbar-identity{
    min-width:0;
    gap:11px;
}

.topbar-identity-mark{
    width:10px;
    height:36px;
    display:block;
    border-radius:2px;
    background:linear-gradient(180deg,var(--accent),var(--primary));
    box-shadow:0 0 20px color-mix(in srgb,var(--accent) 42%,transparent);
    transform:skewY(-14deg);
}

.topbar-identity span:last-child,
.topbar-title-group{
    min-width:0;
    display:grid;
    gap:2px;
}

.topbar-identity small,
.topbar-kicker{
    color:var(--amz-muted);
    font-size:10px;
    font-weight:800;
    line-height:1.2;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.topbar-identity strong,
.topbar-title-group strong{
    overflow:hidden;
    color:var(--amz-ink);
    font-size:14px;
    font-weight:800;
    line-height:1.25;
    letter-spacing:-.015em;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.topbar-divider{
    width:1px;
    height:36px;
    background:var(--amz-line);
}

.topbar-actions{
    flex-shrink:0;
    gap:10px;
}

.health-pill,
.live-badge{
    min-height:38px;
    padding:0 13px;
    border:1px solid color-mix(in srgb,#1aa979 30%,var(--amz-line));
    border-radius:7px;
    color:color-mix(in srgb,#15956d 84%,var(--amz-ink));
    background:color-mix(in srgb,#1aa979 9%,var(--amz-surface));
    box-shadow:var(--amz-inset);
    font-size:11px;
    font-weight:850;
    letter-spacing:.04em;
    text-transform:uppercase;
}

.health-pill i,
.live-badge i{
    position:relative;
    width:7px;
    height:7px;
    background:#21bd86;
    box-shadow:0 0 0 4px rgba(33,189,134,.13),0 0 18px rgba(33,189,134,.46);
}

.health-pill i::after{
    content:"";
    position:absolute;
    inset:-5px;
    border:1px solid rgba(33,189,134,.36);
    border-radius:50%;
    animation:amz-signal-pulse 2.2s ease-out infinite;
}

.theme-toggle{
    width:122px;
    height:42px;
    padding:4px;
    border:1px solid var(--amz-line);
    border-radius:8px;
    color:var(--amz-muted);
    background:var(--amz-surface-sunk);
    box-shadow:var(--amz-inset);
}

.theme-toggle-option{
    width:56px;
    height:32px;
    gap:5px;
    font-size:11px;
    font-weight:800;
}

.theme-toggle-option svg{
    width:14px;
    height:14px;
}

.theme-toggle-knob{
    top:4px;
    left:4px;
    width:56px;
    height:32px;
    border-radius:5px;
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--primary) 94%,white),color-mix(in srgb,var(--accent) 88%,white));
    box-shadow:0 8px 22px color-mix(in srgb,var(--primary) 28%,transparent);
}

.theme-toggle[data-mode="dark"] .theme-toggle-knob{
    transform:translateX(56px);
}

.soft-btn,
.primary-btn,
.auth-form button[type="submit"],
.tpr-submit{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    border-radius:7px;
    font-weight:820;
    letter-spacing:.01em;
    transition:transform var(--amz-fast) var(--amz-ease),box-shadow var(--amz-fast),border-color var(--amz-fast),filter var(--amz-fast);
}

.soft-btn{
    min-height:42px;
    padding:0 15px;
    border:1px solid var(--amz-line);
    color:var(--amz-ink);
    background:
        linear-gradient(145deg,var(--amz-highlight),transparent 52%),
        var(--amz-surface);
    box-shadow:var(--amz-inset),0 8px 18px rgba(0,0,0,.04);
}

.soft-btn:hover,
.primary-btn:hover,
.auth-form button[type="submit"]:hover,
.tpr-submit:hover{
    transform:translateY(-2px);
}

.soft-btn:hover{
    border-color:color-mix(in srgb,var(--primary) 42%,var(--amz-line));
    box-shadow:var(--amz-inset),0 14px 28px color-mix(in srgb,var(--primary) 10%,transparent);
}

.primary-btn,
.auth-form button[type="submit"],
.tpr-submit{
    min-height:46px;
    border:1px solid color-mix(in srgb,var(--primary) 70%,black);
    color:var(--on-primary,#fff);
    background:
        linear-gradient(110deg,transparent 0 38%,rgba(255,255,255,.18) 48%,transparent 58%) -160% 0/240% 100% no-repeat,
        linear-gradient(135deg,var(--primary),color-mix(in srgb,var(--primary) 62%,var(--accent)));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.22),
        0 14px 34px color-mix(in srgb,var(--primary) 27%,transparent);
}

.primary-btn:hover,
.auth-form button[type="submit"]:hover,
.tpr-submit:hover{
    background-position:160% 0,0 0;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.24),
        0 20px 42px color-mix(in srgb,var(--primary) 33%,transparent);
}

.logout-button{
    min-width:44px;
}

.logout-button svg{
    width:16px;
    height:16px;
}

/* ───────────────────────────── Module matrix drawer ─────────────────────── */

.sidebar{
    position:fixed;
    inset:12px auto 12px 12px;
    z-index:90;
    width:min(880px,calc(100vw - 24px));
    height:calc(100vh - 24px);
    padding:0;
    color:#f8fbfc;
    border:1px solid rgba(255,255,255,.12);
    border-radius:12px;
    background:
        linear-gradient(145deg,color-mix(in srgb,var(--primary) 23%,transparent),transparent 31%),
        linear-gradient(315deg,color-mix(in srgb,var(--accent) 13%,transparent),transparent 36%),
        linear-gradient(180deg,color-mix(in srgb,var(--sidebar-bg) 95%,#0f151a),color-mix(in srgb,var(--sidebar-bg) 88%,#020405));
    box-shadow:0 44px 130px rgba(0,0,0,.52);
    transform:translateX(calc(-100% - 38px)) perspective(1200px) rotateY(8deg);
    transform-origin:left center;
    opacity:0;
    visibility:hidden;
    transition:
        transform 520ms var(--amz-ease-mechanical),
        opacity 260ms ease,
        visibility 0s linear 520ms;
    overflow:hidden;
}

.sidebar::before,
.sidebar::after{
    content:"";
    position:absolute;
    pointer-events:none;
}

.sidebar::before{
    inset:0;
    background:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size:32px 32px;
    mask-image:linear-gradient(135deg,#000,transparent 76%);
}

.sidebar::after{
    width:280px;
    height:280px;
    right:-120px;
    top:-100px;
    border:1px solid color-mix(in srgb,var(--accent) 32%,transparent);
    border-radius:50%;
    box-shadow:
        0 0 0 38px color-mix(in srgb,var(--primary) 6%,transparent),
        0 0 0 76px color-mix(in srgb,var(--accent) 4%,transparent);
}

.sidebar.is-open{
    transform:translateX(0) perspective(1200px) rotateY(0);
    opacity:1;
    visibility:visible;
    transition:
        transform 520ms var(--amz-ease-mechanical),
        opacity 260ms ease,
        visibility 0s;
}

.sidebar-scrim{
    position:fixed;
    inset:0;
    z-index:80;
    display:block;
    width:100%;
    height:100%;
    border:0;
    background:rgba(1,4,6,.52);
    backdrop-filter:blur(7px);
    opacity:0;
    visibility:hidden;
    cursor:default;
    transition:opacity 260ms ease,visibility 0s linear 260ms;
}

body.sidebar-open{
    overflow:hidden;
}

body.sidebar-open .sidebar-scrim{
    opacity:1;
    visibility:visible;
    transition:opacity 260ms ease,visibility 0s;
}

.module-drawer-shell{
    position:relative;
    z-index:1;
    height:100%;
    padding:24px;
    display:grid;
    grid-template-rows:auto auto minmax(0,1fr) auto;
    gap:20px;
}

.module-drawer-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}

.brand-mark{
    min-width:0;
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    grid-template-rows:auto auto;
    column-gap:13px;
    row-gap:2px;
}

.brand-mark span{
    grid-row:1/3;
    width:48px;
    height:48px;
    border:1px solid rgba(255,255,255,.25);
    border-radius:7px;
    color:var(--on-primary,#fff);
    background:
        linear-gradient(145deg,rgba(255,255,255,.22),transparent 44%),
        linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 16px 34px color-mix(in srgb,var(--primary) 32%,transparent);
    transform:skewY(-4deg);
}

.brand-mark strong{
    align-self:end;
    overflow:hidden;
    color:#fff;
    font-size:17px;
    font-weight:850;
    letter-spacing:-.025em;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.brand-mark small{
    color:rgba(238,246,250,.58);
    font-family:var(--amz-font-mono);
    font-size:10px;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.module-drawer-close{
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border:1px solid rgba(255,255,255,.14);
    border-radius:7px;
    color:#fff;
    background:rgba(255,255,255,.07);
    cursor:pointer;
    transition:background var(--amz-fast),transform var(--amz-fast);
}

.module-drawer-close span{
    font-size:28px;
    font-weight:300;
    line-height:1;
}

.module-drawer-close:hover{
    transform:rotate(4deg);
    background:rgba(255,255,255,.13);
}

.module-drawer-intro{
    max-width:620px;
    display:grid;
    gap:6px;
}

.module-drawer-intro > span,
.sidebar-footer-kicker{
    color:color-mix(in srgb,var(--accent) 78%,white);
    font-family:var(--amz-font-mono);
    font-size:10px;
    font-weight:750;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.module-drawer-intro strong{
    color:#fff;
    font-family:var(--amz-font-display);
    font-size:clamp(24px,3.2vw,38px);
    line-height:1.04;
    letter-spacing:-.045em;
}

.module-drawer-intro p{
    max-width:600px;
    margin:0;
    color:rgba(238,246,250,.62);
    font-size:13px;
    line-height:1.65;
}

.side-nav{
    min-height:0;
    overflow:auto;
    padding:3px 6px 12px 0;
    display:grid;
    align-content:start;
    gap:20px;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.22) transparent;
}

.module-group{
    display:grid;
    gap:9px;
}

.module-group h2{
    margin:0;
    color:rgba(238,246,250,.46);
    font-family:var(--amz-font-mono);
    font-size:10px;
    font-weight:750;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.module-group-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
}

.side-nav a.module-link{
    position:relative;
    min-height:76px;
    padding:12px;
    display:grid;
    grid-template-columns:42px minmax(0,1fr) 18px;
    align-items:center;
    gap:11px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:8px;
    color:rgba(241,247,250,.76);
    background:
        linear-gradient(145deg,rgba(255,255,255,.07),transparent 52%),
        rgba(255,255,255,.035);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
    transition:transform var(--amz-fast) var(--amz-ease),border-color var(--amz-fast),background var(--amz-fast);
}

.side-nav a.module-link:hover{
    transform:translateY(-2px);
    color:#fff;
    border-color:color-mix(in srgb,var(--accent) 42%,rgba(255,255,255,.14));
    background:
        linear-gradient(145deg,color-mix(in srgb,var(--primary) 28%,transparent),transparent 54%),
        rgba(255,255,255,.065);
}

.side-nav a.module-link.is-active{
    color:#fff;
    border-color:color-mix(in srgb,var(--accent) 54%,rgba(255,255,255,.12));
    background:
        linear-gradient(115deg,color-mix(in srgb,var(--primary) 58%,transparent),color-mix(in srgb,var(--accent) 20%,transparent)),
        rgba(255,255,255,.08);
    box-shadow:inset 3px 0 0 var(--accent),0 18px 38px rgba(0,0,0,.22);
}

.module-link-icon{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.12);
    border-radius:6px;
    background:rgba(255,255,255,.06);
}

.module-link-icon svg{
    width:19px;
    height:19px;
}

.module-link-copy{
    min-width:0;
    display:grid;
    gap:3px;
}

.module-link-copy strong{
    overflow:hidden;
    color:inherit;
    font-size:13px;
    font-weight:820;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.module-link-copy small{
    overflow:hidden;
    color:rgba(238,246,250,.48);
    font-size:10px;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.module-link-arrow{
    color:rgba(238,246,250,.34);
    font-size:14px;
}

.sidebar-footer{
    margin:0;
    padding:13px 15px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:2px 18px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:8px;
    color:rgba(238,246,250,.66);
    background:rgba(255,255,255,.045);
}

.sidebar-footer strong{
    color:#fff;
    font-size:12px;
}

.sidebar-footer small{
    grid-row:1/3;
    grid-column:2;
    color:rgba(238,246,250,.42);
    font-family:var(--amz-font-mono);
    font-size:9px;
    letter-spacing:.08em;
    text-transform:uppercase;
}

/* ───────────────────────────── Page architecture ────────────────────────── */

.alert-stack{
    position:relative;
    z-index:4;
    margin:0 0 16px;
}

.app-alert{
    padding:14px 16px 14px 44px;
    border-radius:7px;
    box-shadow:var(--amz-shadow-soft);
}

.app-alert::before{
    content:"";
    position:absolute;
    left:16px;
    top:50%;
    width:10px;
    height:10px;
    border-radius:2px;
    transform:translateY(-50%) rotate(45deg);
    background:currentColor;
}

.page-hero{
    position:relative;
    min-height:226px;
    margin:0 0 22px;
    padding:clamp(28px,4vw,52px);
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(260px,34%);
    align-items:center;
    gap:30px;
    overflow:hidden;
    border:1px solid color-mix(in srgb,var(--primary) 28%,var(--amz-line));
    border-radius:10px;
    color:var(--amz-ink);
    background:
        linear-gradient(115deg,color-mix(in srgb,var(--primary) 11%,var(--amz-surface)) 0%,var(--amz-surface) 48%,color-mix(in srgb,var(--accent) 9%,var(--amz-surface)) 100%);
    box-shadow:var(--amz-shadow),var(--amz-inset);
    clip-path:var(--amz-chamfer);
    transform-style:preserve-3d;
}

.page-hero::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(90deg,transparent 0 63%,color-mix(in srgb,var(--primary) 10%,transparent) 63% 63.3%,transparent 63.3%),
        linear-gradient(var(--amz-grid) 1px,transparent 1px),
        linear-gradient(90deg,var(--amz-grid) 1px,transparent 1px);
    background-size:auto,26px 26px,26px 26px;
    mask-image:linear-gradient(90deg,transparent 0 34%,#000 72%);
}

.page-hero::after{
    content:"AMZ / AUTO / CONTROL";
    position:absolute;
    right:24px;
    bottom:14px;
    color:color-mix(in srgb,var(--amz-muted) 62%,transparent);
    font-family:var(--amz-font-mono);
    font-size:9px;
    letter-spacing:.18em;
}

.page-hero > div:first-child{
    position:relative;
    z-index:2;
    max-width:820px;
}

.page-hero .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin:0 0 13px;
    color:color-mix(in srgb,var(--primary) 82%,var(--amz-ink));
    font-family:var(--amz-font-mono);
    font-size:10px;
    font-weight:800;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.page-hero .eyebrow::before{
    content:"";
    width:22px;
    height:2px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
    box-shadow:0 0 12px color-mix(in srgb,var(--accent) 34%,transparent);
}

.page-hero h1{
    max-width:760px;
    margin:0;
    color:var(--amz-ink);
    font-size:clamp(34px,4.4vw,64px);
    font-weight:780;
    line-height:.98;
    letter-spacing:-.055em;
}

.page-hero p{
    max-width:760px;
    margin:18px 0 0;
    color:var(--amz-muted);
    font-size:clamp(14px,1.35vw,17px);
    line-height:1.68;
}

.hero-orb{
    position:relative;
    justify-self:stretch;
    width:100%;
    height:156px;
    border:0;
    border-radius:0;
    background:transparent;
    animation:none;
    transform:perspective(700px) rotateX(58deg) rotateZ(-13deg);
    transform-style:preserve-3d;
}

.hero-orb::before,
.hero-orb::after{
    content:"";
    position:absolute;
    inset:12px;
    border:1px solid color-mix(in srgb,var(--primary) 40%,var(--amz-line));
    background:
        linear-gradient(color-mix(in srgb,var(--primary) 20%,transparent) 1px,transparent 1px),
        linear-gradient(90deg,color-mix(in srgb,var(--accent) 20%,transparent) 1px,transparent 1px),
        linear-gradient(135deg,color-mix(in srgb,var(--primary) 10%,transparent),transparent);
    background-size:22px 22px,22px 22px,auto;
    box-shadow:
        0 24px 30px color-mix(in srgb,var(--primary) 14%,transparent),
        inset 0 0 46px color-mix(in srgb,var(--accent) 10%,transparent);
}

.hero-orb::after{
    inset:34px 22px;
    border-color:color-mix(in srgb,var(--accent) 62%,transparent);
    background:
        radial-gradient(circle at 18% 60%,var(--accent) 0 3px,transparent 4px),
        radial-gradient(circle at 48% 28%,var(--primary) 0 4px,transparent 5px),
        radial-gradient(circle at 76% 65%,var(--accent) 0 3px,transparent 4px),
        linear-gradient(110deg,transparent 18%,color-mix(in srgb,var(--accent) 56%,transparent) 19% 20%,transparent 21% 48%,color-mix(in srgb,var(--primary) 48%,transparent) 49% 50%,transparent 51%);
    box-shadow:0 0 34px color-mix(in srgb,var(--accent) 18%,transparent);
    animation:amz-route-scan 4.8s var(--amz-ease) infinite alternate;
}

/* Common content planes */
.glass-panel,
.stat-card,
.site-card,
.plan-card,
.preview-card,
.settings-shortcut,
.dept2-panel,
.dept2-card,
.scan-live-feed-card,
.scan2-card,
.ticket-card,
.owner-email-card,
.tpr-card{
    border:1px solid var(--amz-line);
    border-radius:9px;
    background:
        linear-gradient(145deg,var(--amz-highlight),transparent 44%),
        linear-gradient(180deg,var(--amz-surface-raised),var(--amz-surface));
    box-shadow:var(--amz-shadow-soft),var(--amz-inset);
}

.glass-panel{
    position:relative;
    padding:clamp(18px,2.2vw,28px);
    overflow:hidden;
}

.glass-panel::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:74px;
    height:2px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
    box-shadow:0 0 18px color-mix(in srgb,var(--accent) 34%,transparent);
}

.panel-head{
    position:relative;
    z-index:1;
    margin-bottom:20px;
    padding-bottom:15px;
    border-bottom:1px solid var(--amz-line);
}

.panel-head h2,
.glass-panel h2{
    margin:4px 0 0;
    color:var(--amz-ink);
    font-size:clamp(20px,2vw,28px);
    line-height:1.12;
    letter-spacing:-.035em;
}

.eyebrow{
    color:color-mix(in srgb,var(--primary) 78%,var(--amz-muted));
    font-family:var(--amz-font-mono);
    font-size:10px;
    font-weight:800;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.dashboard-grid{
    gap:14px;
}

.stat-card{
    position:relative;
    min-height:142px;
    padding:20px;
    display:grid;
    align-content:space-between;
    gap:10px;
    overflow:hidden;
    transform-style:preserve-3d;
}

.stat-card::before{
    content:"";
    position:absolute;
    inset:auto -30px -46px auto;
    width:116px;
    height:116px;
    border:1px solid color-mix(in srgb,var(--primary) 18%,transparent);
    transform:rotate(35deg);
    box-shadow:
        0 0 0 16px color-mix(in srgb,var(--accent) 3%,transparent),
        0 0 0 32px color-mix(in srgb,var(--primary) 3%,transparent);
}

.stat-card::after{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:4px;
    height:100%;
    background:linear-gradient(180deg,var(--primary),var(--accent));
    opacity:.88;
}

.stat-label{
    color:var(--amz-muted);
    font-family:var(--amz-font-mono);
    font-size:10px;
    font-weight:800;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.stat-value{
    color:var(--amz-ink);
    font-family:var(--amz-font-display);
    font-size:clamp(30px,3vw,44px);
    font-weight:780;
    line-height:1;
    letter-spacing:-.055em;
}

.stat-note{
    max-width:28ch;
    color:var(--amz-muted);
    font-size:12px;
    line-height:1.45;
}

.stat-icon,
.scan2-stat-icon,
.site-icon{
    border-radius:7px;
    background:color-mix(in srgb,var(--primary) 10%,var(--amz-surface));
    color:var(--primary);
}

.settings-shortcuts{
    gap:10px;
}

.settings-shortcut{
    position:relative;
    min-height:88px;
    padding:16px;
    overflow:hidden;
}

.settings-shortcut::after{
    content:"";
    position:absolute;
    right:-16px;
    top:-16px;
    width:52px;
    height:52px;
    border:1px solid var(--amz-line);
    transform:rotate(45deg);
}

.settings-shortcut.active{
    border-color:color-mix(in srgb,var(--primary) 42%,var(--amz-line));
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--primary) 14%,var(--amz-surface)),color-mix(in srgb,var(--accent) 7%,var(--amz-surface)));
    box-shadow:inset 3px 0 0 var(--accent),var(--amz-shadow-soft);
}

.settings-shortcut span{
    color:color-mix(in srgb,var(--primary) 78%,var(--amz-ink));
    font-family:var(--amz-font-mono);
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:.1em;
}

.settings-shortcut strong{
    color:var(--amz-ink);
}

/* Forms */
.form-grid,
.settings-form,
.auth-form{
    gap:15px;
}

.form-grid label,
.settings-form label,
.auth-form label,
.tpr-reply label{
    color:var(--amz-ink);
    font-size:12px;
    font-weight:800;
    letter-spacing:.01em;
}

.form-grid input,
.form-grid select,
.form-grid textarea,
.settings-form input,
.settings-form select,
.settings-form textarea,
.auth-form input,
.auth-form select,
.auth-form textarea,
.tpr-reply textarea{
    min-height:48px;
    border:1px solid var(--amz-line-strong);
    border-radius:7px;
    color:var(--amz-ink);
    background:
        linear-gradient(180deg,var(--amz-surface-sunk),color-mix(in srgb,var(--amz-surface) 92%,var(--primary)));
    box-shadow:inset 0 1px 2px rgba(0,0,0,.05),0 1px 0 var(--amz-highlight);
    transition:border-color var(--amz-fast),box-shadow var(--amz-fast),background var(--amz-fast);
}

.form-grid textarea,
.settings-form textarea,
.auth-form textarea,
.tpr-reply textarea{
    padding:13px 14px;
    line-height:1.55;
}

.form-grid input:hover,
.form-grid select:hover,
.form-grid textarea:hover,
.settings-form input:hover,
.settings-form select:hover,
.settings-form textarea:hover,
.auth-form input:hover{
    border-color:color-mix(in srgb,var(--primary) 36%,var(--amz-line-strong));
}

.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus,
.settings-form input:focus,
.settings-form select:focus,
.settings-form textarea:focus,
.auth-form input:focus,
.auth-form select:focus,
.auth-form textarea:focus,
.tpr-reply textarea:focus{
    border-color:var(--accent);
    box-shadow:
        0 0 0 4px color-mix(in srgb,var(--accent) 14%,transparent),
        inset 0 1px 2px rgba(0,0,0,.04);
}

input[type="color"]{
    min-height:52px!important;
    padding:6px!important;
}

input[type="checkbox"],
input[type="radio"]{
    accent-color:var(--primary);
}

.switch-field{
    border-radius:7px;
    border-color:var(--amz-line);
    background:var(--amz-surface-sunk);
}

.password-field{
    border-radius:7px;
}

.password-field input{
    border-radius:7px;
}

.password-field button{
    color:var(--primary);
    font-weight:850;
}

.sticky-actions{
    bottom:14px;
    padding:12px;
    gap:10px;
    border-radius:9px;
    border-color:var(--amz-line-strong);
    background:color-mix(in srgb,var(--amz-surface-translucent) 92%,transparent);
    box-shadow:0 18px 50px rgba(0,0,0,.12),var(--amz-inset);
    backdrop-filter:blur(20px) saturate(1.2);
}

/* Data */
.table-panel{
    margin-top:18px;
}

.table-wrap{
    border:1px solid var(--amz-line);
    border-radius:9px;
    background:var(--amz-surface);
    box-shadow:var(--amz-shadow-soft);
}

.data-table{
    border-collapse:collapse;
    border-spacing:0;
}

.data-table th{
    position:sticky;
    top:0;
    z-index:2;
    padding:13px 14px;
    border-bottom:1px solid var(--amz-line-strong);
    color:var(--amz-muted);
    background:color-mix(in srgb,var(--amz-surface-sunk) 88%,var(--primary));
    font-family:var(--amz-font-mono);
    font-size:9px;
    font-weight:800;
    letter-spacing:.12em;
}

.data-table td{
    padding:14px;
    border:0;
    border-bottom:1px solid var(--amz-line);
    color:var(--amz-ink-soft);
    background:var(--amz-surface);
}

.data-table td:first-child,
.data-table td:last-child{
    border-left:0;
    border-right:0;
    border-radius:0;
}

.data-table tbody tr{
    transition:background var(--amz-fast),transform var(--amz-fast);
}

.data-table tbody tr:hover td{
    background:color-mix(in srgb,var(--primary) 5%,var(--amz-surface));
}

.data-table td strong{
    color:var(--amz-ink);
}

.data-table td small{
    color:var(--amz-muted);
}

.status-badge{
    min-height:28px;
    padding:0 10px;
    border:1px solid currentColor;
    border-radius:5px;
    font-family:var(--amz-font-mono);
    font-size:9px;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.pagination,
.table-actions,
.inline-actions,
.card-actions{
    gap:8px;
}

.empty-state{
    position:relative;
    min-height:120px;
    padding:34px;
    display:grid;
    place-items:center;
    border:1px dashed color-mix(in srgb,var(--primary) 35%,var(--amz-line-strong));
    border-radius:8px;
    color:var(--amz-muted);
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--primary) 5%,var(--amz-surface)),var(--amz-surface));
    text-align:center;
}

.empty-state::before{
    content:"";
    position:absolute;
    top:13px;
    left:13px;
    width:24px;
    height:24px;
    border-top:2px solid var(--primary);
    border-left:2px solid var(--primary);
    opacity:.48;
}

.mini-list a,
.mini-list>div,
.details-grid div,
.settings-info-list div,
.preview-card{
    border-radius:8px;
    border-color:var(--amz-line);
    background:var(--amz-surface-raised);
}

.bulk-action-panel,
.filter-bar,
.scan2-toolbar,
.dept2-tabs{
    border-radius:8px;
    border-color:var(--amz-line);
    background:var(--amz-surface-raised);
    box-shadow:var(--amz-inset);
}

/* Modal / dropdown / toast */
.modal,
.icon-modal,
.dialog-panel,
[data-modal-panel]{
    border-radius:10px;
    border-color:var(--amz-line-strong);
    background:var(--amz-surface);
    box-shadow:0 36px 120px rgba(0,0,0,.38);
}

.toast-stack{
    right:18px;
    bottom:18px;
}

.toast{
    border:1px solid color-mix(in srgb,var(--accent) 32%,var(--amz-line));
    border-radius:7px;
    color:#fff;
    background:color-mix(in srgb,var(--sidebar-bg) 90%,#12191e);
    box-shadow:0 22px 56px rgba(0,0,0,.34);
}

/* ───────────────────────────── Authentication stage ────────────────────── */

.auth-body{
    position:relative;
    min-height:100vh;
    display:block;
    padding:0;
    overflow:hidden auto;
    background:
        linear-gradient(var(--amz-grid) 1px,transparent 1px),
        linear-gradient(90deg,var(--amz-grid) 1px,transparent 1px),
        linear-gradient(135deg,var(--amz-canvas-2),var(--amz-canvas));
    background-size:42px 42px,42px 42px,auto;
}

.auth-body::after{
    display:none;
}

.auth-spatial-stage{
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
}

.auth-spatial-stage::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg,transparent 0 46%,color-mix(in srgb,var(--amz-canvas) 72%,transparent) 64%,var(--amz-canvas) 100%),
        linear-gradient(180deg,transparent 0 72%,var(--amz-canvas) 100%);
}

.auth-spatial-grid{
    position:absolute;
    left:-10vw;
    bottom:-28vh;
    width:72vw;
    height:70vh;
    border:1px solid color-mix(in srgb,var(--primary) 20%,transparent);
    background:
        linear-gradient(color-mix(in srgb,var(--primary) 12%,transparent) 1px,transparent 1px),
        linear-gradient(90deg,color-mix(in srgb,var(--accent) 10%,transparent) 1px,transparent 1px);
    background-size:36px 36px,36px 36px;
    transform:perspective(700px) rotateX(64deg) rotateZ(-16deg);
    transform-origin:center;
    box-shadow:0 0 100px color-mix(in srgb,var(--primary) 12%,transparent);
}

.auth-layout{
    position:relative;
    z-index:2;
    width:min(1540px,100%);
    min-height:100vh;
    margin:0 auto;
    padding:clamp(28px,5vw,76px);
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(380px,520px);
    align-items:center;
    gap:clamp(42px,8vw,130px);
}

.auth-narrative{
    min-height:620px;
    padding:clamp(12px,2vw,28px);
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.auth-narrative-brand{
    display:flex;
    align-items:center;
    gap:14px;
}

.auth-narrative-mark{
    width:54px;
    height:54px;
    display:grid;
    place-items:center;
    border:1px solid color-mix(in srgb,var(--accent) 48%,var(--amz-line));
    border-radius:8px;
    color:var(--on-primary,#fff);
    background:
        linear-gradient(145deg,rgba(255,255,255,.22),transparent 46%),
        linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 20px 50px color-mix(in srgb,var(--primary) 30%,transparent);
    font-size:20px;
    font-weight:900;
    transform:skewY(-5deg);
}

.auth-narrative-brand div{
    display:grid;
    gap:3px;
}

.auth-narrative-brand strong{
    color:var(--amz-ink);
    font-size:16px;
    font-weight:850;
}

.auth-narrative-brand small{
    color:var(--amz-muted);
    font-family:var(--amz-font-mono);
    font-size:9px;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.auth-narrative-copy{
    max-width:760px;
    display:grid;
    gap:18px;
}

.auth-narrative-kicker{
    color:color-mix(in srgb,var(--accent) 72%,var(--amz-ink));
    font-family:var(--amz-font-mono);
    font-size:11px;
    font-weight:800;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.auth-narrative h2{
    margin:0;
    color:var(--amz-ink);
    font-size:clamp(46px,6vw,86px);
    font-weight:760;
    line-height:.94;
    letter-spacing:-.065em;
}

.auth-narrative p{
    max-width:650px;
    margin:0;
    color:var(--amz-muted);
    font-size:clamp(15px,1.5vw,19px);
    line-height:1.7;
}

.auth-signal-strip{
    display:flex;
    flex-wrap:wrap;
    gap:10px 20px;
}

.auth-signal-strip span{
    display:flex;
    align-items:center;
    gap:8px;
    color:var(--amz-muted);
    font-family:var(--amz-font-mono);
    font-size:10px;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.auth-signal-strip i{
    width:7px;
    height:7px;
    border:1px solid var(--accent);
    transform:rotate(45deg);
    background:color-mix(in srgb,var(--accent) 22%,transparent);
    box-shadow:0 0 14px color-mix(in srgb,var(--accent) 32%,transparent);
}

.auth-shell{
    width:100%;
    max-width:520px;
    justify-self:end;
}

.auth-card{
    position:relative;
    padding:clamp(26px,3.2vw,42px);
    overflow:hidden;
    border:1px solid var(--amz-line-strong);
    border-radius:11px;
    color:var(--amz-ink);
    background:
        linear-gradient(145deg,var(--amz-highlight),transparent 42%),
        color-mix(in srgb,var(--amz-surface-translucent) 96%,transparent);
    box-shadow:0 36px 110px rgba(0,0,0,.20),var(--amz-inset);
    backdrop-filter:blur(28px) saturate(1.15);
    clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,0 100%);
}

.auth-card::before{
    inset:auto 0 0 auto;
    width:160px;
    height:160px;
    background:
        linear-gradient(var(--amz-grid) 1px,transparent 1px),
        linear-gradient(90deg,var(--amz-grid) 1px,transparent 1px);
    background-size:22px 22px;
    mask-image:linear-gradient(135deg,transparent,#000);
    opacity:.72;
}

.auth-card::after{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:96px;
    height:3px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
    box-shadow:0 0 22px color-mix(in srgb,var(--accent) 38%,transparent);
}

.auth-brand{
    margin-bottom:28px;
}

.auth-brand span{
    width:44px;
    height:44px;
    border-radius:7px;
    background:linear-gradient(135deg,var(--primary),var(--accent));
}

.auth-card h1{
    font-size:clamp(34px,4vw,48px);
    font-weight:760;
    letter-spacing:-.055em;
}

.auth-card p{
    color:var(--amz-muted);
}

.auth-security-note{
    border-radius:7px;
    border-color:var(--amz-line);
    background:var(--amz-surface-sunk);
}

.auth-theme-toggle{
    position:fixed;
    top:22px;
    right:22px;
    z-index:80;
}

/* Ticket reply inherits tenant colors from --tpr-* while using the same material */
.tpr-shell{
    --primary:var(--tpr-primary);
    --accent:var(--tpr-accent);
    width:min(100%,1180px);
    margin:0 auto;
}

.tpr-page{
    color:var(--amz-ink);
}

.tpr-top,
.tpr-hero,
.tpr-info-grid article,
.tpr-error{
    border-radius:9px;
    border-color:var(--amz-line);
    background:var(--amz-surface);
    box-shadow:var(--amz-shadow-soft);
}

.tpr-hero{
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--tpr-primary) 16%,var(--amz-surface)),color-mix(in srgb,var(--tpr-accent) 8%,var(--amz-surface)));
}

.tpr-logo{
    border-radius:7px;
}

.tpr-msg{
    border-radius:8px;
}

.tpr-submit{
    background:linear-gradient(135deg,var(--tpr-primary),color-mix(in srgb,var(--tpr-primary) 55%,var(--tpr-accent)));
}

/* ───────────────────────────── Responsive transformation ───────────────── */

@media (max-width:1180px){
    .topbar-identity{
        display:none;
    }

    .page-hero{
        grid-template-columns:minmax(0,1fr) minmax(220px,32%);
    }

    .dashboard-grid-4{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .auth-layout{
        grid-template-columns:minmax(0,1fr) minmax(360px,480px);
        gap:48px;
    }

    .auth-narrative h2{
        font-size:clamp(44px,6vw,68px);
    }
}

@media (max-width:900px){
    .workspace-shell{
        padding:18px 18px 56px;
    }

    .topbar{
        gap:12px;
    }

    .topbar-title-group,
    .topbar-divider,
    .health-pill{
        display:none;
    }

    .menu-toggle{
        min-width:48px;
        width:48px;
        padding:0;
        justify-content:center;
    }

    .menu-toggle > span:last-child{
        position:absolute;
        width:1px;
        height:1px;
        overflow:hidden;
        clip:rect(0,0,0,0);
    }

    .page-hero{
        min-height:210px;
        grid-template-columns:1fr;
    }

    .hero-orb{
        position:absolute;
        right:-40px;
        bottom:-32px;
        width:42%;
        min-width:250px;
        opacity:.56;
    }

    .auth-layout{
        grid-template-columns:1fr;
        align-items:start;
        padding-top:92px;
    }

    .auth-narrative{
        min-height:auto;
        padding:0;
        gap:28px;
    }

    .auth-narrative-copy{
        max-width:760px;
    }

    .auth-narrative h2{
        font-size:clamp(42px,9vw,72px);
    }

    .auth-signal-strip{
        display:none;
    }

    .auth-shell{
        max-width:620px;
        justify-self:start;
    }

    .auth-spatial-stage::after{
        background:linear-gradient(180deg,transparent 0 38%,var(--amz-canvas) 72%);
    }
}

@media (max-width:720px){
    .topbar{
        min-height:68px;
        padding:10px 12px;
        align-items:center;
    }

    .topbar-actions{
        gap:7px;
        flex-wrap:nowrap;
    }

    .theme-toggle{
        width:42px;
        height:42px;
        border-radius:7px;
    }

    .theme-toggle-option{
        position:absolute;
        inset:4px;
        width:32px;
        height:32px;
    }

    .theme-toggle-option span{
        display:none;
    }

    .theme-toggle-light{
        opacity:1;
    }

    .theme-toggle-dark{
        opacity:0;
    }

    .theme-toggle[data-mode="dark"] .theme-toggle-light{
        opacity:0;
    }

    .theme-toggle[data-mode="dark"] .theme-toggle-dark{
        opacity:1;
    }

    .theme-toggle-knob{
        display:none;
    }

    .logout-button{
        width:42px;
        min-width:42px;
        padding:0;
    }

    .logout-button span{
        position:absolute;
        width:1px;
        height:1px;
        overflow:hidden;
        clip:rect(0,0,0,0);
    }

    .module-drawer-shell{
        padding:18px;
    }

    .module-drawer-intro p{
        display:none;
    }

    .module-group-grid{
        grid-template-columns:1fr;
    }

    .side-nav a.module-link{
        min-height:66px;
    }

    .sidebar-footer{
        display:none;
    }

    .page-hero{
        min-height:190px;
        padding:28px 22px 56px;
        clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));
    }

    .page-hero h1{
        font-size:clamp(32px,10vw,48px);
    }

    .page-hero p{
        font-size:14px;
    }

    .hero-orb{
        right:-100px;
        width:66%;
        opacity:.36;
    }

    .dashboard-grid,
    .dashboard-grid-3,
    .dashboard-grid-4,
    .panel-grid,
    .settings-grid,
    .form-grid,
    .form-grid-3,
    .plan-grid,
    .details-grid,
    .tpr-info-grid{
        grid-template-columns:1fr!important;
    }

    .glass-panel{
        padding:18px;
    }

    .data-table{
        min-width:720px;
    }

    .sticky-actions{
        position:relative;
        bottom:auto;
        display:grid;
        grid-template-columns:1fr;
    }

    .sticky-actions > *{
        width:100%;
    }

    .auth-layout{
        padding:82px 14px 30px;
        gap:30px;
    }

    .auth-narrative{
        gap:16px;
    }

    .auth-narrative-brand{
        display:none;
    }

    .auth-narrative h2{
        font-size:clamp(38px,12vw,56px);
    }

    .auth-narrative p{
        font-size:14px;
    }

    .auth-card{
        padding:26px 20px;
    }

    .auth-theme-toggle{
        top:14px;
        right:14px;
    }

    .auth-option-row{
        align-items:flex-start;
        flex-direction:column;
    }
}

@media (max-width:420px){
    .workspace-shell{
        padding-inline:10px;
    }

    .topbar{
        padding-inline:8px;
    }

    .page-hero{
        border-radius:8px;
    }

    .page-hero::after{
        right:14px;
        font-size:7px;
    }

    .module-drawer-shell{
        padding:14px;
    }

    .module-drawer-intro strong{
        font-size:23px;
    }

    .module-link-copy small{
        white-space:normal;
    }

    .auth-layout{
        padding-inline:10px;
    }
}

/* Motion */
@keyframes amz-signal-pulse{
    0%{transform:scale(.7);opacity:.8}
    75%,100%{transform:scale(1.8);opacity:0}
}

@keyframes amz-route-scan{
    0%{transform:translate3d(-7px,5px,18px);filter:brightness(.85)}
    100%{transform:translate3d(8px,-6px,38px);filter:brightness(1.18)}
}

@media (prefers-reduced-motion:reduce){
    .health-pill i::after,
    .hero-orb::after{
        animation:none!important;
    }

    .sidebar{
        transition-duration:.01ms!important;
    }
}

@media (forced-colors:active){
    .page-hero,
    .glass-panel,
    .stat-card,
    .sidebar,
    .auth-card{
        border:1px solid CanvasText;
        box-shadow:none;
    }

    .page-hero::before,
    .page-hero::after,
    .hero-orb,
    .amz-spatial-backdrop,
    .auth-spatial-stage{
        display:none;
    }
}

.amz-enter{
    opacity:0;
    transform:translateY(18px);
    transition:
        opacity 520ms var(--amz-ease) var(--amz-enter-delay,0ms),
        transform 620ms var(--amz-ease-mechanical) var(--amz-enter-delay,0ms);
}

body.amz-ready .amz-enter{
    opacity:1;
    transform:translateY(0);
}

@media (prefers-reduced-motion:reduce){
    .amz-enter,
    body.amz-ready .amz-enter{
        opacity:1;
        transform:none;
        transition:none;
    }
}

.auth-layout.is-wide{
    width:min(1320px,100%);
    grid-template-columns:1fr;
    align-items:start;
    padding-top:92px;
}

.auth-layout.is-wide .auth-shell{
    width:100%;
    max-width:none;
    justify-self:stretch;
}

.auth-layout.is-wide + *{
    position:relative;
}

/* Preserve the existing database-backed panel-radius setting without making
   every element share the same geometry. */
.glass-panel,
.stat-card,
.site-card,
.plan-card,
.preview-card,
.settings-shortcut,
.dept2-panel,
.dept2-card,
.scan-live-feed-card,
.scan2-card,
.ticket-card,
.owner-email-card,
.tpr-card,
.page-hero{
    border-radius:var(--amz-panel-radius);
}

.soft-btn,
.primary-btn,
.auth-form button[type="submit"],
.tpr-submit,
.form-grid input,
.form-grid select,
.form-grid textarea,
.settings-form input,
.settings-form select,
.settings-form textarea,
.auth-form input,
.auth-form select,
.auth-form textarea,
.theme-toggle,
.menu-toggle,
.status-badge{
    border-radius:var(--amz-control-radius);
}

/* Specificity bridge for the original portal theme styles and legacy tokens. */
body[data-theme="light"],
body[data-theme="dark"]{
    --font:var(--amz-font-body);
    --bg:var(--amz-canvas);
    --bg-2:var(--amz-canvas-2);
    --surface:var(--amz-surface);
    --surface-2:var(--amz-surface-raised);
    --panel:var(--amz-surface);
    --panel-soft:var(--amz-surface-translucent);
    --text:var(--amz-ink);
    --heading:var(--amz-ink);
    --muted:var(--amz-muted);
    --muted-2:var(--amz-muted);
    --line:var(--amz-line);
    --line-strong:var(--amz-line-strong);
    --shadow:var(--amz-shadow);
    --shadow-soft:var(--amz-shadow-soft);
    --body-gradient:none;
}

body[data-portal="organization"] .sidebar,
body[data-portal="owner"] .sidebar{
    background:
        linear-gradient(145deg,color-mix(in srgb,var(--primary) 23%,transparent),transparent 31%),
        linear-gradient(315deg,color-mix(in srgb,var(--accent) 13%,transparent),transparent 36%),
        linear-gradient(180deg,color-mix(in srgb,var(--sidebar-bg) 95%,#0f151a),color-mix(in srgb,var(--sidebar-bg) 88%,#020405));
}

body[data-portal="organization"] .page-hero,
body[data-portal="owner"] .page-hero{
    color:var(--amz-ink);
    background:
        linear-gradient(115deg,color-mix(in srgb,var(--primary) 11%,var(--amz-surface)) 0%,var(--amz-surface) 48%,color-mix(in srgb,var(--accent) 9%,var(--amz-surface)) 100%);
}

body[data-portal="organization"] .brand-mark span,
body[data-portal="owner"] .brand-mark span,
body[data-portal="auth"] .auth-brand span{
    background:
        linear-gradient(145deg,rgba(255,255,255,.22),transparent 44%),
        linear-gradient(135deg,var(--primary),var(--accent));
}

body[data-portal="organization"] .primary-btn,
body[data-portal="owner"] .primary-btn,
body[data-portal="owner"] .auth-form button,
body[data-portal="auth"] .auth-form button{
    background:
        linear-gradient(110deg,transparent 0 38%,rgba(255,255,255,.18) 48%,transparent 58%) -160% 0/240% 100% no-repeat,
        linear-gradient(135deg,var(--primary),color-mix(in srgb,var(--primary) 62%,var(--accent)));
}

/* ─────────────────────── Feature-specific operational polish ───────────── */

/* Scanner / crawler */
.scan2-progress-panel,
.scan-live-panel{
    position:relative;
    overflow:hidden;
}

.scan2-progress-panel::after,
.scan-live-panel::after{
    content:"";
    position:absolute;
    right:-90px;
    top:-90px;
    width:210px;
    height:210px;
    border:1px solid color-mix(in srgb,var(--accent) 17%,transparent);
    border-radius:50%;
    box-shadow:
        0 0 0 28px color-mix(in srgb,var(--primary) 4%,transparent),
        0 0 0 56px color-mix(in srgb,var(--accent) 3%,transparent);
    pointer-events:none;
}

.scan2-progress-bar,
.scan-live-progress{
    position:relative;
    min-height:10px;
    overflow:hidden;
    border:1px solid var(--amz-line);
    border-radius:3px;
    background:var(--amz-surface-sunk);
    box-shadow:inset 0 2px 6px rgba(0,0,0,.12);
}

.scan2-progress-bar > span,
.scan-live-progress > span{
    position:relative;
    display:block;
    height:100%;
    min-height:8px;
    border-radius:2px;
    background:
        linear-gradient(90deg,var(--primary),var(--accent));
    box-shadow:0 0 18px color-mix(in srgb,var(--accent) 44%,transparent);
}

.scan2-progress-bar > span::after,
.scan-live-progress > span::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(100deg,transparent 0 38%,rgba(255,255,255,.45) 48%,transparent 58%);
    background-size:180px 100%;
    animation:amz-progress-sweep 2.4s linear infinite;
}

.scan2-stat-grid{
    gap:10px;
}

.scan2-stat-grid article,
.scan-live-metrics article{
    position:relative;
    overflow:hidden;
    border:1px solid var(--amz-line);
    border-radius:var(--amz-control-radius);
    background:
        linear-gradient(145deg,var(--amz-highlight),transparent 46%),
        var(--amz-surface-raised);
    box-shadow:var(--amz-inset);
}

.scan2-stat-grid article::after,
.scan-live-metrics article::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:44%;
    height:2px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
}

.scan-live-grid{
    perspective:1400px;
}

.scan-live-browser{
    transform-style:preserve-3d;
}

.scan-live-window{
    position:relative;
    border:1px solid color-mix(in srgb,var(--primary) 28%,var(--amz-line));
    border-radius:var(--amz-panel-radius);
    background:
        linear-gradient(145deg,var(--amz-highlight),transparent 38%),
        var(--amz-surface-sunk);
    box-shadow:0 26px 70px rgba(0,0,0,.18),var(--amz-inset);
    transform:rotateY(3deg) rotateX(1deg);
    transform-origin:left center;
}

.scan-live-window-top{
    border-bottom-color:var(--amz-line);
    background:color-mix(in srgb,var(--amz-surface-raised) 92%,var(--primary));
}

.scan-live-window-top > span{
    border-radius:2px;
    transform:rotate(45deg);
}

.scan-live-window-top > span:nth-child(2){
    background:var(--accent);
    box-shadow:0 0 12px color-mix(in srgb,var(--accent) 45%,transparent);
}

.scan-live-page{
    position:relative;
    background:
        linear-gradient(var(--amz-grid) 1px,transparent 1px),
        linear-gradient(90deg,var(--amz-grid) 1px,transparent 1px),
        var(--amz-surface);
    background-size:20px 20px,20px 20px,auto;
}

.scan-live-scanline{
    height:2px;
    background:linear-gradient(90deg,transparent,var(--accent),transparent);
    box-shadow:0 0 22px color-mix(in srgb,var(--accent) 72%,transparent);
    animation:amz-live-scanline 3.2s var(--amz-ease) infinite;
}

.scan-live-faux-content .scan-live-line,
.scan-live-faux-content .scan-live-hero-line,
.scan-live-card-row span{
    background:linear-gradient(90deg,color-mix(in srgb,var(--primary) 16%,var(--amz-surface-sunk)),color-mix(in srgb,var(--accent) 10%,var(--amz-surface-sunk)));
}

.scan-live-pipeline{
    border-top-color:var(--amz-line);
}

.scan-live-pipeline > div{
    position:relative;
    font-family:var(--amz-font-mono);
    font-size:9px;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.scan-live-pipeline > div:not(:last-child)::after{
    content:"";
    position:absolute;
    left:calc(50% + 12px);
    right:calc(-50% + 12px);
    top:7px;
    height:1px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
    opacity:.45;
}

.scan-live-pipeline i{
    border-radius:2px;
    transform:rotate(45deg);
}

.scan-live-panel.is-active .scan-live-pipeline .is-on i{
    box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 12%,transparent),0 0 18px color-mix(in srgb,var(--accent) 42%,transparent);
}

.scan-live-feed-item{
    border-radius:var(--amz-control-radius);
    border-left:2px solid color-mix(in srgb,var(--accent) 68%,var(--amz-line));
}

/* Conversations / tickets */
[data-chat-transcript],
.ticket-chat-thread,
.tpr-chat{
    background:
        linear-gradient(var(--amz-grid) 1px,transparent 1px),
        linear-gradient(90deg,var(--amz-grid) 1px,transparent 1px),
        var(--amz-surface-sunk);
    background-size:24px 24px,24px 24px,auto;
}

.chat-message,
.ticket-chat-message,
.tpr-msg{
    border:1px solid var(--amz-line);
    box-shadow:var(--amz-inset);
}

.chat-message.visitor,
.ticket-chat-message.is-visitor,
.tpr-msg.is-visitor{
    border-left:2px solid var(--accent);
    background:color-mix(in srgb,var(--accent) 7%,var(--amz-surface));
}

.chat-message.assistant,
.ticket-chat-message.is-assistant,
.tpr-msg.is-assistant{
    border-left:2px solid var(--primary);
    background:color-mix(in srgb,var(--primary) 7%,var(--amz-surface));
}

.chat-message.human,
.ticket-chat-message.is-team,
.tpr-msg.is-team{
    border-right:2px solid color-mix(in srgb,var(--primary) 62%,var(--accent));
    background:color-mix(in srgb,var(--primary) 11%,var(--amz-surface));
}

/* Sites, organizations and departments */
.site-grid,
.plan-grid,
.dept2-grid{
    gap:12px;
}

.site-card,
.plan-card,
.dept2-card{
    position:relative;
    overflow:hidden;
}

.site-card::before,
.plan-card::before,
.dept2-card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:68px;
    height:2px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
}

.site-card:hover,
.plan-card:hover,
.dept2-card:hover{
    border-color:color-mix(in srgb,var(--primary) 34%,var(--amz-line));
}

.dept2-tabs{
    padding:6px;
    gap:5px;
}

.dept2-tabs a,
.dept2-tabs button{
    border-radius:var(--amz-control-radius);
}

.dept2-tabs .active,
.dept2-tabs .is-active{
    color:var(--on-primary,#fff);
    background:linear-gradient(135deg,var(--primary),color-mix(in srgb,var(--primary) 58%,var(--accent)));
    box-shadow:0 10px 24px color-mix(in srgb,var(--primary) 24%,transparent);
}

/* Usage rings and data visuals */
.usage-ring .ring-track{
    stroke:color-mix(in srgb,var(--amz-line-strong) 80%,transparent);
}

.usage-ring .ring-progress{
    stroke:var(--accent);
    filter:drop-shadow(0 0 5px color-mix(in srgb,var(--accent) 50%,transparent));
}

[data-mini-chart]{
    position:relative;
    overflow:hidden;
    border-radius:var(--amz-control-radius);
    background:
        linear-gradient(var(--amz-grid) 1px,transparent 1px),
        linear-gradient(90deg,var(--amz-grid) 1px,transparent 1px),
        color-mix(in srgb,var(--primary) 4%,var(--amz-surface-sunk));
    background-size:18px 18px,18px 18px,auto;
}

/* Destructive and semantic controls remain visibly distinct. */
.danger-soft,
.soft-btn.danger,
button.danger-soft{
    color:#c43d3d;
    border-color:color-mix(in srgb,#d64747 34%,var(--amz-line));
    background:color-mix(in srgb,#d64747 7%,var(--amz-surface));
}

.app-alert,
.status-badge{
    position:relative;
}

@keyframes amz-progress-sweep{
    from{background-position:-180px 0}
    to{background-position:calc(100% + 180px) 0}
}

@keyframes amz-live-scanline{
    0%{top:4%;opacity:0}
    15%{opacity:1}
    84%{opacity:1}
    100%{top:96%;opacity:0}
}

@media (prefers-reduced-motion:reduce){
    .scan2-progress-bar > span::after,
    .scan-live-progress > span::after,
    .scan-live-scanline{
        animation:none!important;
    }

    .scan-live-window{
        transform:none;
    }
}


/* ───────────────────── Persistent Spatial Navigation Refinement ───────────
   The ambient scene never reads pointer coordinates. Interaction motion is
   limited to explicit navigation, button, submit, scan and state actions.
   ───────────────────────────────────────────────────────────────────────── */
:root{
    --amz-sidebar-expanded:304px;
    --amz-sidebar-collapsed:84px;
    --amz-sidebar-gap:14px;
    --amz-mobile-gutter:12px;
}

body{
    font-size:15px;
    line-height:1.58;
}

.main-frame{
    transition:margin-left 360ms var(--amz-ease-mechanical);
}

.sidebar{
    width:min(360px,calc(100vw - 24px));
    transform:translate3d(calc(-100% - 32px),0,0);
    transform-origin:left center;
}

.sidebar.is-open{
    transform:translate3d(0,0,0);
}

.sidebar-head-actions{
    display:flex;
    align-items:center;
    gap:8px;
    flex:0 0 auto;
}

.sidebar-collapse-toggle{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border:1px solid rgba(255,255,255,.14);
    border-radius:7px;
    color:#fff;
    background:rgba(255,255,255,.07);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
    cursor:pointer;
    transition:
        background var(--amz-fast),
        border-color var(--amz-fast),
        box-shadow var(--amz-fast);
}

.sidebar-collapse-toggle:hover,
.sidebar-collapse-toggle:focus-visible{
    border-color:color-mix(in srgb,var(--accent) 55%,rgba(255,255,255,.16));
    background:color-mix(in srgb,var(--accent) 16%,rgba(255,255,255,.07));
}

.sidebar-collapse-glyph{
    display:block;
    font-family:var(--amz-font-body);
    font-size:26px;
    font-weight:500;
    line-height:1;
    transition:transform 300ms var(--amz-ease-mechanical);
}

.module-group-grid{
    grid-template-columns:1fr;
}

.side-nav a.module-link{
    min-height:62px;
    padding:9px 10px;
    grid-template-columns:38px minmax(0,1fr) 16px;
}

.module-link-icon{
    width:38px;
    height:38px;
}

.module-link-copy strong{
    font-size:13.5px;
    font-weight:760;
    letter-spacing:-.01em;
}

.module-link-copy small{
    font-size:11px;
    line-height:1.35;
}

.side-nav a.module-link.is-active,
.side-nav a.module-link[aria-current="page"]{
    border-color:color-mix(in srgb,var(--accent) 64%,rgba(255,255,255,.16));
    background:
        linear-gradient(110deg,color-mix(in srgb,var(--primary) 62%,transparent),color-mix(in srgb,var(--accent) 24%,transparent)),
        rgba(255,255,255,.085);
    box-shadow:
        inset 3px 0 0 var(--accent),
        inset 0 1px 0 rgba(255,255,255,.10),
        0 12px 28px rgba(0,0,0,.20);
}

.side-nav a.module-link.is-active .module-link-icon,
.side-nav a.module-link[aria-current="page"] .module-link-icon{
    border-color:color-mix(in srgb,var(--accent) 68%,rgba(255,255,255,.18));
    background:color-mix(in srgb,var(--accent) 18%,rgba(255,255,255,.08));
    box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 9%,transparent);
}

.module-drawer-intro{
    padding:12px 13px;
    gap:4px;
    border:1px solid rgba(255,255,255,.085);
    border-radius:8px;
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--primary) 18%,transparent),transparent 62%),
        rgba(255,255,255,.035);
}

.module-drawer-intro strong{
    font-size:17px;
    line-height:1.2;
    letter-spacing:-.025em;
}

.module-drawer-intro p{
    font-size:11.5px;
    line-height:1.5;
}

.module-group h2{
    padding-inline:2px;
    font-family:var(--amz-font-body);
    font-size:10px;
    font-weight:800;
    letter-spacing:.11em;
}

.page-hero h1{
    max-width:24ch;
    font-size:clamp(34px,3.7vw,56px);
    line-height:1.02;
    letter-spacing:-.045em;
}

.page-hero p,
.glass-panel p,
.panel-copy,
.form-help,
.help-text{
    max-width:72ch;
}

.panel-head h2,
.glass-panel h2{
    font-size:clamp(21px,1.8vw,27px);
    letter-spacing:-.025em;
}

.primary-btn,
.soft-btn,
.auth-form button[type="submit"],
.tpr-submit,
.menu-toggle,
.side-nav a.module-link{
    position:relative;
    isolation:isolate;
    overflow:hidden;
}

.amz-action-activated::after{
    content:"";
    position:absolute;
    z-index:-1;
    left:50%;
    top:50%;
    width:18px;
    height:18px;
    border-radius:50%;
    background:color-mix(in srgb,var(--accent) 34%,transparent);
    transform:translate(-50%,-50%) scale(.2);
    animation:amz-action-confirm 620ms var(--amz-ease-mechanical);
    pointer-events:none;
}

.amz-nav-activated{
    animation:amz-nav-confirm 520ms var(--amz-ease-mechanical);
}

.amz-form-committing{
    animation:amz-form-commit 760ms var(--amz-ease);
}

@keyframes amz-action-confirm{
    0%{opacity:.92;transform:translate(-50%,-50%) scale(.2)}
    70%{opacity:.18;transform:translate(-50%,-50%) scale(12)}
    100%{opacity:0;transform:translate(-50%,-50%) scale(15)}
}

@keyframes amz-nav-confirm{
    0%{box-shadow:inset 3px 0 0 var(--accent),0 0 0 0 color-mix(in srgb,var(--accent) 26%,transparent)}
    58%{box-shadow:inset 3px 0 0 var(--accent),0 0 0 7px color-mix(in srgb,var(--accent) 0%,transparent)}
    100%{box-shadow:inset 3px 0 0 var(--accent),0 0 0 0 transparent}
}

@keyframes amz-form-commit{
    0%,100%{filter:none}
    42%{filter:drop-shadow(0 0 12px color-mix(in srgb,var(--accent) 22%,transparent))}
}

/* Desktop: the navigation is a permanent control spine. */
@media (min-width:1081px){
    .sidebar{
        inset:var(--amz-sidebar-gap) auto var(--amz-sidebar-gap) var(--amz-sidebar-gap);
        width:var(--amz-sidebar-expanded);
        height:calc(100vh - (var(--amz-sidebar-gap) * 2));
        transform:none;
        opacity:1;
        visibility:visible;
        transition:
            width 360ms var(--amz-ease-mechanical),
            box-shadow 240ms ease;
    }

    .sidebar.is-open{
        transform:none;
    }

    .sidebar-scrim{
        display:none!important;
    }

    .main-frame{
        margin-left:calc(var(--amz-sidebar-expanded) + (var(--amz-sidebar-gap) * 2));
    }

    .menu-toggle,
    .module-drawer-close{
        display:none!important;
    }

    .module-drawer-shell{
        padding:16px 14px 14px;
        grid-template-rows:auto auto minmax(0,1fr) auto;
        gap:14px;
    }

    .module-drawer-head{
        min-height:50px;
        gap:10px;
    }

    .brand-mark{
        grid-template-columns:42px minmax(0,1fr);
        column-gap:11px;
    }

    .brand-mark span{
        width:42px;
        height:42px;
    }

    .brand-mark strong{
        font-size:15px;
    }

    .brand-mark small{
        font-size:9px;
    }

    .side-nav{
        padding-right:3px;
        gap:16px;
        scroll-padding-block:16px;
    }

    .module-group{
        gap:7px;
    }

    .sidebar-footer{
        padding:11px 12px;
        grid-template-columns:minmax(0,1fr);
    }

    .sidebar-footer small{
        grid-row:auto;
        grid-column:auto;
    }

    body.sidebar-collapsed .sidebar{
        width:var(--amz-sidebar-collapsed);
    }

    body.sidebar-collapsed .main-frame{
        margin-left:calc(var(--amz-sidebar-collapsed) + (var(--amz-sidebar-gap) * 2));
    }

    body.sidebar-collapsed .module-drawer-shell{
        padding:14px 10px;
        grid-template-rows:auto minmax(0,1fr);
        gap:14px;
    }

    body.sidebar-collapsed .module-drawer-head{
        display:grid;
        justify-items:center;
    }

    body.sidebar-collapsed .brand-mark{
        display:block;
    }

    body.sidebar-collapsed .brand-mark span{
        display:grid;
        margin:0 auto;
    }

    body.sidebar-collapsed .brand-mark strong,
    body.sidebar-collapsed .brand-mark small,
    body.sidebar-collapsed .module-drawer-intro,
    body.sidebar-collapsed .module-group h2,
    body.sidebar-collapsed .module-link-copy,
    body.sidebar-collapsed .module-link-arrow,
    body.sidebar-collapsed .sidebar-footer{
        display:none!important;
    }

    body.sidebar-collapsed .sidebar-head-actions{
        width:100%;
        justify-content:center;
    }

    body.sidebar-collapsed .sidebar-collapse-toggle{
        width:48px;
        height:38px;
    }

    body.sidebar-collapsed .sidebar-collapse-glyph{
        transform:rotate(180deg);
    }

    body.sidebar-collapsed .side-nav{
        padding:0;
        gap:10px;
        overflow-x:hidden;
    }

    body.sidebar-collapsed .module-groups{
        align-content:start;
    }

    body.sidebar-collapsed .module-group{
        gap:6px;
    }

    body.sidebar-collapsed .module-group + .module-group{
        padding-top:9px;
        border-top:1px solid rgba(255,255,255,.085);
    }

    body.sidebar-collapsed .side-nav a.module-link{
        width:52px;
        min-height:52px;
        margin-inline:auto;
        padding:6px;
        display:grid;
        grid-template-columns:1fr;
        place-items:center;
        border-radius:8px;
    }

    body.sidebar-collapsed .module-link-icon{
        width:38px;
        height:38px;
    }

    body.sidebar-collapsed .side-nav a.module-link.is-active,
    body.sidebar-collapsed .side-nav a.module-link[aria-current="page"]{
        box-shadow:
            inset 3px 0 0 var(--accent),
            0 0 0 1px color-mix(in srgb,var(--accent) 24%,transparent),
            0 12px 26px rgba(0,0,0,.24);
    }

    body:not(.sidebar-ready) .sidebar,
    body:not(.sidebar-ready) .main-frame{
        transition:none!important;
    }
}

/* Tablet and mobile: accessible off-canvas navigation with full touch targets. */
@media (max-width:1080px){
    .main-frame{
        margin-left:0!important;
    }

    .sidebar{
        inset:var(--amz-mobile-gutter) auto var(--amz-mobile-gutter) var(--amz-mobile-gutter);
        width:min(360px,calc(100vw - (var(--amz-mobile-gutter) * 2)));
        height:calc(100dvh - (var(--amz-mobile-gutter) * 2));
        border-radius:12px;
        transform:translate3d(calc(-100% - 32px),0,0);
    }

    .sidebar.is-open{
        transform:translate3d(0,0,0);
    }

    .sidebar-collapse-toggle{
        display:none;
    }

    .module-drawer-close{
        display:grid;
    }

    .module-drawer-shell{
        padding:
            max(16px,env(safe-area-inset-top))
            16px
            max(16px,env(safe-area-inset-bottom));
        grid-template-rows:auto auto minmax(0,1fr) auto;
        gap:14px;
    }

    .module-drawer-intro strong{
        font-size:17px;
    }

    .side-nav a.module-link{
        min-height:62px;
    }

    .menu-toggle{
        display:flex;
    }

    .topbar-title-group{
        display:grid;
    }
}

@media (max-width:720px){
    :root{
        --amz-topbar-height:66px;
        --amz-mobile-gutter:8px;
    }

    .workspace-shell{
        padding:14px 10px 48px;
    }

    .topbar{
        min-height:var(--amz-topbar-height);
        padding:8px 10px;
        gap:8px;
    }

    .topbar-command{
        gap:9px;
        min-width:0;
    }

    .menu-toggle{
        width:44px;
        min-width:44px;
        height:44px;
        padding:0;
        justify-content:center;
    }

    .topbar-title-group{
        min-width:0;
    }

    .topbar-title-group strong{
        font-size:13px;
    }

    .topbar-kicker{
        display:none;
    }

    .topbar-actions{
        gap:6px;
    }

    .module-drawer-shell{
        padding:
            max(14px,env(safe-area-inset-top))
            12px
            max(14px,env(safe-area-inset-bottom));
    }

    .module-drawer-intro{
        display:none;
    }

    .side-nav{
        gap:15px;
    }

    .side-nav a.module-link{
        min-height:64px;
        padding:10px;
    }

    .module-link-copy strong{
        font-size:14px;
    }

    .module-link-copy small{
        font-size:11.5px;
        white-space:normal;
    }

    .page-hero{
        min-height:0;
        padding:26px 20px 38px;
    }

    .page-hero h1{
        font-size:clamp(31px,9.5vw,43px);
        letter-spacing:-.035em;
    }

    .page-hero p{
        font-size:14.5px;
        line-height:1.62;
    }

    .glass-panel,
    .stat-card,
    .site-card,
    .plan-card,
    .preview-card,
    .settings-shortcut,
    .dept2-panel,
    .dept2-card,
    .scan-live-feed-card,
    .scan2-card,
    .ticket-card,
    .owner-email-card,
    .tpr-card{
        border-radius:min(var(--amz-panel-radius),16px);
    }

    .panel-head{
        align-items:flex-start;
        gap:12px;
    }

    .panel-head,
    .toolbar,
    .filter-row,
    .page-actions,
    .panel-actions,
    .button-row,
    .form-actions{
        flex-wrap:wrap;
    }

    .panel-head > *,
    .toolbar > *,
    .filter-row > *{
        min-width:0;
    }

    .form-grid,
    .form-grid-2,
    .form-grid-3,
    .settings-grid,
    .dashboard-grid,
    .dashboard-grid-3,
    .dashboard-grid-4,
    .panel-grid,
    .details-grid{
        grid-template-columns:minmax(0,1fr)!important;
    }

    input,
    select,
    textarea,
    .primary-btn,
    .soft-btn{
        max-width:100%;
    }

    .table-wrap,
    .table-scroll,
    .data-table-wrap{
        overflow:visible;
    }

    .data-table.amz-responsive-table{
        min-width:0!important;
        width:100%;
        display:block;
    }

    .data-table.amz-responsive-table thead{
        position:absolute;
        width:1px;
        height:1px;
        padding:0;
        margin:-1px;
        overflow:hidden;
        clip:rect(0,0,0,0);
        white-space:nowrap;
        border:0;
    }

    .data-table.amz-responsive-table tbody{
        display:grid;
        gap:12px;
    }

    .data-table.amz-responsive-table tr{
        display:block;
        padding:8px 13px;
        border:1px solid var(--amz-line);
        border-radius:10px;
        background:
            linear-gradient(145deg,var(--amz-highlight),transparent 46%),
            var(--amz-surface);
        box-shadow:var(--amz-shadow-soft);
    }

    .data-table.amz-responsive-table td{
        width:100%;
        min-height:42px;
        padding:10px 0;
        display:grid;
        grid-template-columns:minmax(104px,34%) minmax(0,1fr);
        align-items:center;
        gap:12px;
        border:0;
        border-bottom:1px solid var(--amz-line);
        text-align:left!important;
        white-space:normal;
        overflow-wrap:anywhere;
    }

    .data-table.amz-responsive-table td:last-child{
        border-bottom:0;
    }

    .data-table.amz-responsive-table td[data-label]::before{
        content:attr(data-label);
        color:var(--amz-muted);
        font-size:10.5px;
        font-weight:800;
        letter-spacing:.07em;
        text-transform:uppercase;
    }

    .data-table.amz-responsive-table td[colspan]{
        display:block;
        min-height:auto;
        text-align:center!important;
    }

    .data-table.amz-responsive-table td[colspan]::before{
        display:none;
    }

    .data-table.amz-responsive-table td:not([data-label]):not([colspan]){
        display:flex;
        justify-content:flex-end;
        gap:8px;
    }

    .pagination{
        flex-wrap:wrap;
        justify-content:center;
        gap:8px;
    }

    .modal,
    .dialog,
    .drawer-panel{
        padding:10px;
    }

    .modal-card,
    .dialog-card{
        width:min(100%,calc(100vw - 20px));
        max-height:calc(100dvh - 20px);
        overflow:auto;
    }
}

@media (max-width:420px){
    .topbar-title-group{
        max-width:112px;
    }

    .topbar-title-group strong{
        font-size:12px;
    }

    .sidebar{
        width:calc(100vw - 16px);
    }

    .brand-mark{
        grid-template-columns:42px minmax(0,1fr);
    }

    .brand-mark span{
        width:42px;
        height:42px;
    }

    .module-group h2{
        font-size:9.5px;
    }

    .data-table.amz-responsive-table td{
        grid-template-columns:1fr;
        gap:4px;
    }

    .data-table.amz-responsive-table td:not([data-label]):not([colspan]){
        justify-content:flex-start;
    }
}

@media (prefers-reduced-motion:reduce){
    .main-frame,
    .sidebar,
    .sidebar-collapse-glyph,
    .amz-action-activated::after,
    .amz-nav-activated,
    .amz-form-committing{
        animation:none!important;
        transition:none!important;
    }
}


/* ───────────────────── Performance-safe spatial rendering ─────────────────
   The spatial scene is intentionally static between user actions. This keeps
   the dimensional identity without a continuous full-viewport render loop. */
.amz-spatial-backdrop,
.auth-spatial-stage{
    contain:layout paint style;
}

.amz-spatial-backdrop::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    pointer-events:none;
    opacity:.34;
    background:
        linear-gradient(color-mix(in srgb,var(--primary) 7%,transparent) 1px,transparent 1px),
        linear-gradient(90deg,color-mix(in srgb,var(--accent) 6%,transparent) 1px,transparent 1px),
        radial-gradient(circle at 72% 28%,color-mix(in srgb,var(--primary) 12%,transparent),transparent 36%);
    background-size:72px 72px,72px 72px,auto;
    mask-image:linear-gradient(90deg,transparent 0,black 36%,black 88%,transparent 100%);
}

.amz-spatial-static canvas{
    opacity:.48;
    transition:opacity 240ms ease;
}

.amz-spatial-static.amz-spatial-action canvas{
    animation:amz-spatial-action-flash 520ms cubic-bezier(.22,1,.36,1) 1;
}

@keyframes amz-spatial-action-flash{
    0%{opacity:.48}
    32%{opacity:.78}
    100%{opacity:.48}
}

/* Persistent chrome uses solid translucent surfaces rather than expensive
   live backdrop sampling. */
.sidebar,
.topbar,
.auth-card,
.module-drawer-shell{
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
}

.health-pill i::after,
.hero-orb::after{
    animation:none !important;
}

/* Paint isolation prevents large dashboard sections from invalidating the
   entire viewport when counters, charts, or status labels update. */
.stat-card,
.glass-panel,
.page-hero,
.dashboard-panel,
.data-table-wrap{
    contain:paint;
}

@media (max-width:767px), (prefers-reduced-motion:reduce), (update:slow){
    .amz-spatial-backdrop canvas,
    .auth-spatial-stage canvas{
        display:none;
    }

    .amz-spatial-backdrop{
        opacity:.58;
    }

    .amz-spatial-backdrop::before{
        opacity:.42;
        background-size:48px 48px,48px 48px,auto;
    }

    .amz-spatial-static.amz-spatial-action canvas{
        animation:none;
    }
}


/* ───────────────── Permanent stability mode (2026-07) ─────────────────
   The application shell uses static CSS depth only. No canvas, WebGL,
   full-screen animation loop, backdrop sampling, or fixed background repaint. */
html,
body{
    background-attachment:scroll !important;
}

.amz-spatial-backdrop,
[data-spatial-scene],
canvas[data-spatial-canvas]{
    display:none !important;
}

.amz-static-spatial-backdrop{
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
    overflow:hidden;
    contain:strict;
    opacity:.38;
    background:
        linear-gradient(color-mix(in srgb,var(--primary) 6%,transparent) 1px,transparent 1px),
        linear-gradient(90deg,color-mix(in srgb,var(--accent) 5%,transparent) 1px,transparent 1px),
        radial-gradient(ellipse at 82% 12%,color-mix(in srgb,var(--primary) 12%,transparent),transparent 38%),
        radial-gradient(ellipse at 18% 88%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 34%);
    background-size:64px 64px,64px 64px,auto,auto;
}

.auth-spatial-stage-static{
    pointer-events:none;
    contain:strict;
}

.app-frame,
.auth-layout,
.auth-theme-toggle{
    position:relative;
    z-index:1;
}

.topbar,
.sidebar,
.sidebar-scrim,
.auth-card,
.module-drawer-shell{
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
}

.sidebar-scrim{
    background:rgba(1,4,6,.68) !important;
}

.health-pill i::after,
.hero-orb::before,
.hero-orb::after,
.scan2-progress-bar > span::after,
.scan-live-progress > span::after,
.scan-live-scanline{
    animation:none !important;
}

.amz-enter,
.amz-action-activated,
.amz-nav-activated,
.amz-form-committing,
.amz-spatial-action{
    animation:none !important;
}

.stat-card,
.glass-panel,
.page-hero,
.dashboard-panel,
.data-table-wrap,
.module-drawer-shell{
    contain:paint;
}

@media (max-width:1080px){
    .amz-static-spatial-backdrop{
        opacity:.24;
        background-size:52px 52px,52px 52px,auto,auto;
    }
}

@media (max-width:767px), (prefers-reduced-motion:reduce), (update:slow){
    .amz-static-spatial-backdrop{
        opacity:.16;
        background:
            linear-gradient(color-mix(in srgb,var(--primary) 5%,transparent) 1px,transparent 1px),
            linear-gradient(90deg,color-mix(in srgb,var(--accent) 4%,transparent) 1px,transparent 1px);
        background-size:48px 48px,48px 48px;
    }
}

@media (prefers-reduced-motion:reduce){
    *,
    *::before,
    *::after{
        scroll-behavior:auto !important;
    }
}
