.sup,#supreme-admin-root{
    --sup-gold:#ffd34d;
    --sup-gold-2:#f5b04f;
    --sup-gold-glow:rgba(255,211,77,.28);
    --sup-gold-wash:rgba(255,211,77,.08);
    --sup-well:#0b0806;
    --sup-line:var(--border-2,#3b2519);
}
.sup *,#supreme-admin-root *{
    box-sizing:border-box;
}
.sup[hidden],.sup [hidden],#supreme-admin-root [hidden]{
    display:none!important;
}
.sup-crown{
    width:22px;
    height:22px;
    flex:none;
    fill:var(--sup-gold);
    filter:drop-shadow(0 0 6px var(--sup-gold-glow));
}
.sup-head{
    align-items:center;
    flex-wrap:wrap;
}
.sup-title{
    display:inline-flex;
    align-items:center;
    gap:10px;
}
.sup-tag{
    display:inline-flex;
    align-items:center;
    height:22px;
    padding:0 9px;
    border:1px solid rgba(255,211,77,.45);
    border-radius:999px;
    background:var(--sup-gold-wash);
    color:var(--sup-gold);
    font:700 10.5px/1 var(--font-ui,system-ui);
    letter-spacing:.14em;
    text-transform:uppercase;
}
.sup-now{
    display:flex;
    align-items:center;
    gap:12px;
    margin:0 0 16px;
    padding:12px 14px;
    border:1px solid var(--border,#2a1a12);
    border-radius:var(--r-s,10px);
    background:var(--surface-2,#221e1c);
}
.sup-now-text{
    flex:1;
    min-width:0;
}
.sup-status{
    margin:0;
    color:var(--fg,#f0e7df);
    font:600 15px/1.35 var(--font-ui,system-ui);
}
.sup-wearing{
    margin:2px 0 0;
    color:var(--fg-dim,#b9aca3);
    font-size:13px;
}
.sup-dot{
    width:10px;
    height:10px;
    flex:none;
    border-radius:50%;
    background:var(--fg-mute,#8f837b);
}
.sup-now[data-tone=ok] .sup-dot{
    background:var(--ok,#62c37a);
    box-shadow:0 0 0 4px var(--ok-halo,rgba(98,195,122,.15)),0 0 12px var(--ok-glow,rgba(98,195,122,.75));
}
.sup-now[data-tone=busy] .sup-dot{
    background:var(--sup-gold-2);
    animation:sup-beat 1.4s ease-in-out infinite;
}
.sup-now[data-tone=warn] .sup-dot{
    background:var(--bad,#e5483b);
}
@keyframes sup-beat{
    50%{
        opacity:.35;
        transform:scale(.8);
    }
}
.sup-off{
    flex:none;
    padding:9px 14px;
    font-size:13.5px;
}
.sup-stage{
    position:relative;
    aspect-ratio:16/7;
    margin:0 0 16px;
    overflow:hidden;
    border:1px solid var(--border,#2a1a12);
    border-radius:var(--r,14px);
    background:var(--stage-floor,linear-gradient(180deg,#14110f,#050302));
}
.sup-stage::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    border-radius:inherit;
    box-shadow:inset 0 0 0 1px rgba(255,211,77,.06),inset 0 -40px 60px -30px rgba(0,0,0,.6);
}
.sup-stage-host,.sup-stage-flat{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
}
.sup-stage-canvas{
    width:100%;
    height:100%;
    display:block;
}
.sup-stage-flat{
    padding:18px 8%;
}
.sup-stage-flat .sup-specimen{
    width:min(560px,100%);
    max-height:100%;
}
.sup-stage[data-state=live] .sup-stage-flat{
    display:none;
}
.sup-stage[data-state=flat] .sup-stage-host{
    visibility:hidden;
}
.sup-stage[data-state=loading] .sup-stage-flat{
    opacity:.55;
}
.sup-stage-cap{
    position:absolute;
    left:14px;
    bottom:10px;
    margin:0;
    color:var(--fg-dim,#b9aca3);
    font:500 12px/1.3 var(--font-ui,system-ui);
    letter-spacing:.02em;
    text-shadow:0 1px 2px #000;
}
.sup-stage-cap:empty{
    display:none;
}
.sup-note{
    margin:0 0 14px;
    color:var(--warn,#f5b04f);
    font-size:13.5px;
}
.sup-note:empty{
    display:none;
}
.sup-link .sup-note{
    color:var(--fg-dim,#b9aca3);
}
.sup-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
    gap:14px;
}
.sup-card{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:8px;
    padding:12px 12px 14px;
    border:1px solid var(--border,#2a1a12);
    border-radius:var(--r,14px);
    background-color:var(--surface,#150e0a);
    background-image:var(--grad-card,none);
    cursor:pointer;
    transition:border-color .18s,box-shadow .18s,transform .18s;
    outline:none;
}
.sup-card:hover{
    border-color:rgba(255,211,77,.35);
}
.sup-card:focus-visible{
    border-color:var(--sup-gold);
    box-shadow:0 0 0 3px var(--sup-gold-glow);
}
.sup-card.is-selected{
    border-color:rgba(255,211,77,.7);
    box-shadow:0 0 0 1px rgba(255,211,77,.35),0 10px 28px -14px var(--sup-gold-glow);
}
.sup-card.is-worn::before{
    content:"\2713";
    position:absolute;
    top:10px;
    right:10px;
    z-index:1;
    display:grid;
    place-items:center;
    width:24px;
    height:24px;
    border-radius:50%;
    background:var(--sup-gold);
    color:#1a1205;
    font:800 13px/1 var(--font-ui,system-ui);
}
.sup-card.is-off{
    opacity:.62;
}
.sup-card-art{
    aspect-ratio:320/166;
    overflow:hidden;
    border-radius:calc(var(--r,14px) - 4px);
    background:radial-gradient(90% 80% at 50% 100%,rgba(112,52,23,.28),transparent 70%),linear-gradient(180deg,#14110f,#070504);
}
.sup-specimen{
    display:block;
    width:100%;
    height:auto;
}
.sup-specimen path,.sup-specimen circle{
    transition:fill .05s linear;
}
.sup-ground{
    fill:rgba(0,0,0,.42);
}
.sup-edge{
    fill:none;
    stroke:rgba(0,0,0,.55);
    stroke-width:1.3;
    stroke-linejoin:round;
}
.sup-sheen{
    pointer-events:none;
}
.sup-card-name{
    margin:2px 0 0;
    color:var(--fg,#f0e7df);
    font:700 16px/1.25 var(--font-ui,system-ui);
    letter-spacing:.01em;
    overflow-wrap:anywhere;
}
.sup-card-meta{
    margin:0;
    color:var(--fg-dim,#b9aca3);
    font-size:12.5px;
}
.sup-chips{
    display:flex;
    flex-wrap:wrap;
    gap:4px;
}
.sup-chip{
    width:20px;
    height:10px;
    border-radius:3px;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
}
.sup-apply{
    width:100%;
    margin-top:auto;
    padding:10px 12px;
    font-size:13.5px;
}
.sup-apply:disabled{
    opacity:.75;
}
.sup-card.is-worn .sup-apply{
    border-color:rgba(255,211,77,.45);
    background:var(--sup-gold-wash);
    color:var(--sup-gold);
}
.sup[aria-busy=true] .sup-apply,.sup[aria-busy=true] .sup-off{
    cursor:progress;
}
@media (max-width:720px){
    .sup-stage{
        aspect-ratio:4/3;
    }
    .sup-grid{
        grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
        gap:10px;
    }
}
@media (max-width:420px){
    .sup-grid{
        grid-template-columns:1fr;
    }
    .sup-now{
        flex-wrap:wrap;
    }
    .sup-off{
        width:100%;
    }
}
@media (prefers-reduced-motion:reduce){
    .sup-now[data-tone=busy] .sup-dot{
        animation:none;
    }
    .sup-card{
        transition:none;
    }
}
#supreme-admin-root{
    color:var(--fg,#f0e7df);
    font:400 14.5px/1.5 var(--font-ui,system-ui);
}
#supreme-admin-root button,#supreme-admin-root input,#supreme-admin-root select{
    font:inherit;
}
#supreme-admin-root input,#supreme-admin-root select{
    color:var(--fg,#f0e7df);
}
#supreme-admin-root :focus-visible{
    outline:2px solid var(--sup-gold);
    outline-offset:2px;
}
.sup-admin{
    max-width:1180px;
}
.sup-a-title{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 0 14px;
    font:800 20px/1.2 var(--font-display,var(--font-ui,system-ui));
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--fg,#f0e7df);
}
.sup-a-note{
    margin:0 0 14px;
    color:var(--fg-dim,#b9aca3);
    font-size:13.5px;
}
.sup-a-card{
    margin:0 0 18px;
    padding:18px;
    border:1px solid var(--border,#2a1a12);
    border-radius:var(--r,14px);
    background:var(--surface,#150e0a);
}
.sup-a-head{
    display:flex;
    align-items:center;
    gap:12px;
    margin:0 0 14px;
    flex-wrap:wrap;
}
.sup-a-h3{
    margin:0;
    font:700 15px/1.3 var(--font-ui,system-ui);
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--fg,#f0e7df);
}
.sup-a-head .btn{
    margin-left:auto;
}
.sup-a-count{
    color:var(--fg-mute,#8f837b);
    font:500 12px/1 var(--font-mono,monospace);
}
.sup-a-row{
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    padding:10px 0;
    border-bottom:1px solid rgba(255,255,255,.04);
}
.sup-a-stack{
    flex-direction:column;
    align-items:stretch;
}
.sup-a-lab{
    display:block;
    margin:0 0 6px;
    color:var(--fg,#f0e7df);
    font:600 13.5px/1.3 var(--font-ui,system-ui);
}
.sup-a-row>.sup-a-lab{
    margin:0;
    flex:1;
}
.sup-a-help{
    margin:4px 0 0;
    color:var(--fg-dim,#b9aca3);
    font-size:12.5px;
}
.sup-a-err{
    margin:6px 0 0;
    color:var(--bad,#e5483b);
    font-size:13px;
}
.sup-a-err:empty{
    display:none;
}
.sup-warn{
    color:var(--warn,#f5b04f);
}
.sup-a-foot{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    padding-top:14px;
}
.sup-a-empty{
    margin:0;
    color:var(--fg-mute,#8f837b);
}
.sup-small{
    padding:8px 13px;
    font-size:13px;
}
.sup-danger{
    color:var(--bad,#e5483b);
}
.sup-sw{
    position:relative;
    flex:none;
    width:46px;
    height:26px;
    padding:0;
    border:1px solid var(--sup-line);
    border-radius:999px;
    background:var(--sup-well);
    cursor:pointer;
    transition:background .15s,border-color .15s;
}
.sup-sw::after{
    content:"";
    position:absolute;
    top:3px;
    left:3px;
    width:18px;
    height:18px;
    border-radius:50%;
    background:#8f837b;
    transition:transform .15s,background .15s;
}
.sup-sw[aria-checked=true]{
    border-color:transparent;
    background:linear-gradient(135deg,#ffd34d,#f5a524);
    box-shadow:0 0 14px -4px var(--sup-gold-glow);
}
.sup-sw[aria-checked=true]::after{
    transform:translateX(20px);
    background:#1a1205;
}
.sup-sw:disabled{
    opacity:.5;
    cursor:not-allowed;
}
.sup-tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:0;
    padding:0;
    list-style:none;
}
.sup-tags li{
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:32px;
    padding:0 6px 0 12px;
    border:1px solid var(--sup-line);
    border-radius:999px;
    font:500 13px/1 var(--font-mono,monospace);
}
.sup-tags li.sup-tag-none{
    padding:0 12px;
    border-style:dashed;
    color:var(--fg-mute,#8f837b);
    font-family:var(--font-ui,system-ui);
}
.sup-tag-x{
    display:grid;
    place-items:center;
    width:24px;
    height:24px;
    padding:0;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.06);
    cursor:pointer;
    color:var(--fg-dim,#b9aca3);
    font-size:15px;
    line-height:1;
}
.sup-tag-x:disabled{
    opacity:.35;
    cursor:not-allowed;
}
.sup-a-add{
    display:flex;
    gap:8px;
    max-width:420px;
    margin-top:10px;
}
.sup-input{
    width:100%;
    min-width:0;
    min-height:40px;
    padding:0 12px;
    border:1px solid var(--sup-line);
    border-radius:var(--r-s,10px);
    background:var(--sup-well);
    font-size:14.5px;
}
.sup-input:focus{
    border-color:var(--sup-gold);
    box-shadow:0 0 0 3px var(--sup-gold-glow);
    outline:none;
}
.sup-input[aria-invalid=true]{
    border-color:var(--bad,#e5483b);
}
select.sup-input{
    padding-right:28px;
}
.sup-num{
    width:90px;
    min-height:34px;
}
.sup-hex{
    width:110px;
    font-family:var(--font-mono,monospace);
    text-transform:lowercase;
}
.sup-pick{
    width:40px;
    height:34px;
    padding:2px;
    border:1px solid var(--sup-line);
    border-radius:8px;
    background:var(--sup-well);
    cursor:pointer;
}
.sup-pick:disabled{
    opacity:.35;
}
.sup-a-grid{
    grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
}
.sup-a-grid .sup-card{
    cursor:default;
}
.sup-card-foot{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin-top:auto;
    padding-top:6px;
}
.sup-card-wear{
    flex:1;
    color:var(--fg-dim,#b9aca3);
    font-size:12.5px;
}
.sup-d-cols{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
    gap:22px;
    align-items:start;
}
.sup-d-preview{
    position:sticky;
    top:84px;
    display:flex;
    flex-direction:column;
    gap:10px;
}
.sup-d-stage{
    aspect-ratio:4/3;
    margin:0;
}
.sup-d-species{
    display:flex;
    align-items:center;
    gap:10px;
}
.sup-d-species .sup-a-lab{
    margin:0;
    white-space:nowrap;
}
.sup-d-field{
    margin:0 0 16px;
}
.sup-d-colors{
    display:flex;
    flex-direction:column;
    gap:8px;
}
.sup-d-color{
    display:flex;
    align-items:center;
    gap:8px;
}
.sup-seg{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}
.sup-seg-b,.sup-zone{
    min-height:36px;
    padding:0 14px;
    border:1px solid var(--sup-line);
    border-radius:999px;
    background:transparent;
    cursor:pointer;
    color:var(--fg-dim,#b9aca3);
    font:600 13px/1 var(--font-ui,system-ui);
    transition:background .15s,border-color .15s,color .15s;
}
.sup-seg-b[aria-checked=true],.sup-zone[aria-pressed=true]{
    border-color:transparent;
    background:linear-gradient(135deg,#ffd34d,#f5a524);
    color:#1a1205;
}
.sup-seg-b:hover:not([aria-checked=true]),.sup-zone:hover:not([aria-pressed=true]){
    border-color:rgba(255,211,77,.5);
    color:var(--fg,#f0e7df);
}
.sup-zones{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}
.sup-range{
    display:flex;
    align-items:center;
    gap:12px;
}
.sup-slider{
    flex:1;
    accent-color:var(--sup-gold);
}
.sup-range-out{
    min-width:110px;
    color:var(--sup-gold);
    font:600 13px/1 var(--font-mono,monospace);
    text-align:right;
}
.sup-more{
    margin:0 0 14px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:var(--r-s,10px);
    background:rgba(0,0,0,.18);
}
.sup-more>summary{
    padding:10px 12px;
    cursor:pointer;
    color:var(--fg,#f0e7df);
    font:600 13.5px/1.3 var(--font-ui,system-ui);
}
.sup-more[open]>summary{
    border-bottom:1px solid rgba(255,255,255,.05);
}
.sup-more-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
    gap:8px 14px;
    padding:10px 12px 4px;
}
.sup-more-row{
    display:flex;
    align-items:center;
    gap:8px;
    justify-content:space-between;
    font-size:13.5px;
}
.sup-more .sup-a-help{
    padding:0 12px 10px;
}
.sup-d-pair{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin:0 0 6px;
}
.sup-table-wrap{
    overflow-x:auto;
}
.sup-table{
    width:100%;
    border-collapse:collapse;
    font-size:13.5px;
}
.sup-table th{
    padding:8px 10px;
    border-bottom:1px solid var(--sup-line);
    color:var(--fg-mute,#8f837b);
    font:600 11.5px/1.2 var(--font-ui,system-ui);
    letter-spacing:.08em;
    text-align:left;
    text-transform:uppercase;
    white-space:nowrap;
}
.sup-table td{
    padding:9px 10px;
    border-bottom:1px solid rgba(255,255,255,.04);
    vertical-align:middle;
}
.sup-who{
    display:block;
    font-weight:600;
}
.sup-sid{
    display:block;
    color:var(--fg-mute,#8f837b);
    font:500 11.5px/1.3 var(--font-mono,monospace);
}
.sup-when{
    color:var(--fg-dim,#b9aca3);
    white-space:nowrap;
}
.sup-pill{
    display:inline-flex;
    align-items:center;
    height:22px;
    padding:0 9px;
    border-radius:999px;
    background:rgba(255,255,255,.06);
    color:var(--fg-dim,#b9aca3);
    font:600 11.5px/1 var(--font-ui,system-ui);
    white-space:nowrap;
}
.sup-pill-active{
    background:var(--ok-halo,rgba(98,195,122,.15));
    color:var(--ok,#62c37a);
}
.sup-pill-failed,.sup-pill-full{
    background:var(--bad-halo,rgba(229,72,59,.13));
    color:var(--bad,#e5483b);
}
.sup-pill-queued,.sup-pill-waiting,.sup-pill-restored,.sup-pill-paused,.sup-pill-handoff{
    background:var(--warn-halo,rgba(245,176,79,.13));
    color:var(--warn,#f5b04f);
}
.sup-history>summary{
    cursor:pointer;
}
.sup-log{
    margin:12px 0 0;
    padding:0;
    list-style:none;
}
.sup-log li{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    padding:7px 0;
    border-bottom:1px solid rgba(255,255,255,.04);
    font-size:13.5px;
}
.sup-log-act{
    font-weight:600;
}
@media (max-width:900px){
    .sup-d-cols{
        grid-template-columns:1fr;
    }
    .sup-d-preview{
        position:static;
        order:-1;
    }
}
@media (max-width:560px){
    .sup-a-card{
        padding:14px;
    }
    .sup-a-head .btn{
        margin-left:0;
    }
    .sup-range-out{
        min-width:84px;
    }
    .sup-d-pair{
        grid-template-columns:1fr;
    }
    .sup-a-add{
        max-width:none;
    }
}