.shgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.sht{position:relative;display:block;padding:0;border:1px solid var(--line-2);background:var(--bg-2);
  cursor:pointer;aspect-ratio:16/10;overflow:hidden}
.sht img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.sht.on{border-color:var(--per,#bf4d28);box-shadow:0 0 0 1px var(--per,#bf4d28)}
.sht .st{position:absolute;left:6px;bottom:6px;font-family:var(--ff-mono);font-size:12px;
  letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;background:rgba(13,14,15,.82);
  border:1px solid var(--line-2);color:var(--dim)}
.sht .st.good{color:var(--good,#7fbf8f);border-color:color-mix(in oklab,var(--good,#7fbf8f) 40%,transparent)}
.sht .st.warn{color:var(--gold);border-color:color-mix(in oklab,var(--gold) 40%,transparent)}
.sht .st.bad{color:var(--bad,#c96a5c);border-color:color-mix(in oklab,var(--bad,#c96a5c) 40%,transparent)}
.shed{margin-top:14px;padding:16px;border:1px solid var(--line-2);background:var(--bg-2);
  display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}

@media (max-width:700px){
  .shgrid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}
  .shgrid::-webkit-scrollbar{display:none}
  .shgrid .sht{flex:0 0 76%;scroll-snap-align:center}
  .shed{position:fixed;left:0;right:0;bottom:0;z-index:80;margin:0;max-height:72vh;overflow:auto;
    background:var(--ink);border:0;border-top:2px solid var(--per,#bf4d28);
    padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
  .shed img{width:100%;height:auto;max-height:200px}
}
.shed img{width:260px;height:162px;object-fit:cover;border:1px solid var(--line-2);flex:none;max-width:100%}
.shed .mid{flex:1 1 260px;min-width:0}

.input.bad{border-color:var(--bad,#c96a5c)}
.gname-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:14px}
.gname{flex:1 1 300px;min-width:0;background:transparent;border:0;border-bottom:1px solid var(--line-2);
  color:var(--text);font-family:var(--ff-head);font-weight:800;font-size:2rem;letter-spacing:.01em;
  padding:2px 0 8px;text-transform:uppercase}
.gname:focus{outline:none;border-bottom-color:var(--per,#bf4d28)}
.gname::placeholder{color:var(--faint);text-transform:none;font-weight:400;font-size:1.2rem;letter-spacing:0}

#privConsole .priv-state{flex-wrap:wrap}
#privConsole .priv-state > div{flex:1 1 180px;min-width:0}
#privConsole .priv-state .btn{flex:0 0 auto}

.pgrid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:8px 44px;align-items:start}


#notify .ntrow{display:grid;grid-template-columns:1fr auto;gap:10px 16px;align-items:center;
               padding:11px 0;border-bottom:1px solid var(--line)}
#notify .ntrow:last-child{border-bottom:none}
#notify .ntlab{min-width:0;overflow-wrap:anywhere}
#notify .ntsw{display:flex;gap:8px;flex:0 0 auto}
#notify .ntg{font:inherit;font-size:.82rem;letter-spacing:.04em;text-transform:uppercase;
             padding:5px 12px;border-radius:3px;cursor:pointer;
             border:1px solid var(--line-2);background:transparent;color:var(--dim)}
#notify .ntg:hover{border-color:var(--line);color:var(--text)}
#notify .ntg.on{border-color:var(--per,#bf4d28);color:var(--per,#bf4d28);
                background:color-mix(in srgb,var(--per,#bf4d28) 12%,transparent)}
#notify .ntg[disabled]{opacity:.5;cursor:default}
#notify .ntg:focus-visible{outline:2px solid var(--per,#bf4d28);outline-offset:2px}
@media (max-width:420px){
  
  #notify .ntrow{grid-template-columns:1fr}
}

.idgrid{display:grid;gap:6px 48px;align-items:start}
@media(min-width:920px){
  .idgrid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
  .idg-name{order:-1}
}

.fchip[data-cls].onc{color:var(--text);border-color:var(--per,#bf4d28)}

.delstrip{border:1px solid color-mix(in oklab,var(--bad,#c96a5c) 55%,transparent);padding:14px 16px;margin-top:4px}


.account-page{
  --pane:oklch(0.255 0.006 250);--sunk:oklch(0.122 0.004 250);
  --m-hi:oklch(0.54 0.008 250);--hair:oklch(0.28 0.008 250);
  --ink-1:oklch(0.96 0.004 245);--mid:oklch(0.815 0.008 245);
  --ghost:oklch(0.645 0.01 245);
  --metal-50:#eef1f3;--metal-200:#bcc3c7;--metal-600:#363b40;
  --green-500:#25d07a;--amber-500:#ffab2e;--red-signal:#ff453a;
  --cyan-500:#29c2ff;--purple-500:#a970ff;
  --a1:oklch(0.315 0.155 27);--a2:oklch(0.375 0.145 45);--a3:oklch(0.445 0.125 74);
  --aur-glow:color-mix(in oklab,var(--a2) 62%,transparent);
  --aur-ink:color-mix(in oklab,var(--a1) 70%,black);
  --brush:linear-gradient(104deg,transparent 0 16%,oklch(1 0 0/0.055) 33%,oklch(1 0 0/0.016) 47%,transparent 60%),
    radial-gradient(150% 190% at 10% -40%,oklch(0.66 0.14 32/0.10),transparent 55%),
    radial-gradient(130% 170% at 94% 140%,oklch(0.74 0.13 72/0.08),transparent 55%);
  --etch:0 -1px 0 oklch(0 0 0/0.8),0 1px 0 oklch(1 0 0/0.13);
  --account-border:oklch(1 0 0/0.13);
  background:radial-gradient(110% 52% at 50% -14%,oklch(0.39 0.085 37/0.26),transparent 72%),#101112
}
.account-page #aurora{display:none}
.account-page [hidden]{display:none!important}

.account-page :is(.page-head--id,#main,#accountDesk){
  --text:var(--ink-1);--dim:oklch(0.70 0.008 245);--faint:var(--ghost);
  --line:var(--hair);--line-2:oklch(0.36 0.008 250);--bg-2:var(--sunk);
  --account-muted:var(--dim);color:var(--ink-1);line-height:normal
}
.account-page [data-account-section="identity"],.acct-rail a[href="#identity"]{--section-color:var(--cyan-500)}
.account-page [data-account-section="community"],.acct-rail a[href="#community"]{--section-color:var(--purple-500)}
.account-page [data-account-section="shots"],.acct-rail a[href="#shots"]{--section-color:var(--amber-500)}
.account-page [data-account-section="notify"],.acct-rail a[href="#notify"]{--section-color:var(--cyan-500)}
.account-page [data-account-section="devices"],.acct-rail a[href="#devices"]{--section-color:var(--green-500)}
.account-page [data-account-section="data"],.acct-rail a[href="#data"]{--section-color:var(--red-signal)}
.account-page .container{width:min(1280px,calc(100% - 64px));max-width:1280px}
.account-page #accountDesk{position:relative;z-index:1}
.account-page .page-head--id{padding:0;background:none;border-bottom:1px solid var(--hair)}
.account-hero{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,5vw,72px);align-items:center;padding-block:46px}
.account-intro{min-width:0}
.account-page .account-eyebrow{font:600 11px/1.4 var(--ff-mono);letter-spacing:.17em;text-transform:uppercase;color:var(--amber-500);margin:0 0 16px}
.account-page .account-eyebrow span{color:var(--ghost);margin:0 6px}
.account-page .page-head h1{font:700 clamp(46px,5vw,72px)/.96 'Saira Condensed',var(--ff-head);text-transform:uppercase;letter-spacing:.02em;margin:0;max-width:12ch;overflow-wrap:anywhere;
  background:linear-gradient(178deg,oklch(1 0 0),oklch(0.78 0.006 265) 62%,oklch(0.62 0.008 265));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 2px 0 oklch(0 0 0/0.5)) drop-shadow(0 0 34px oklch(0.7 0.16 38/0.16))}
.account-page .account-lead{font:400 clamp(18px,1.7vw,22px)/1.42 var(--ff-body);color:var(--mid);max-width:34ch;margin:20px 0 0}
.account-page .hlic{font:500 12px/1.5 var(--ff-mono);letter-spacing:.08em;color:var(--dim);text-transform:uppercase;margin:18px 0 0}
.account-page .account-quick{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:28px}
.account-text-link{font:600 14px/1.3 'Saira Condensed',var(--ff-head);letter-spacing:.07em;text-transform:uppercase;color:var(--mid);text-decoration:none;border-bottom:1px solid var(--m-hi);padding:8px 0}
.account-text-link:hover{color:var(--ink-1);border-color:var(--amber-500)}
.account-text-link span{color:var(--amber-500);margin-left:4px}
.account-card-stage,.account-page #cardPanel,.account-page #acct .panel,.acct-rail,.account-page #recordsTicker.ggtk{
  background-color:oklch(0.22 0.005 250);
  background-image:var(--brush),linear-gradient(177deg,oklch(0.255 0.006 250),oklch(0.215 0.005 250) 44%,oklch(0.185 0.005 250));
  border:1px solid var(--account-border);box-shadow:inset 0 1px 0 oklch(1 0 0/0.18),0 4px 10px oklch(0 0 0/0.45),0 16px 40px oklch(0 0 0/0.28);
  clip-path:none;transform:none
}
.account-card-stage{min-width:0;padding:16px;border-radius:8px}
.account-card-label{display:flex;justify-content:space-between;gap:12px;margin:2px 4px 13px;color:var(--dim);font:600 10px/1.4 var(--ff-mono);letter-spacing:.13em;text-transform:uppercase}
.account-card-label span:last-child{font:400 12px/1.3 var(--ff-body);letter-spacing:0;text-transform:none}
.hero-card{width:100%;max-width:680px;perspective:900px;filter:drop-shadow(0 12px 16px oklch(0 0 0/0.55))}
.account-page #heroCard{--text:#f0f5fc;--dim:#bdcbd5;--faint:#9daebd}
.account-page #heroLinks{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:14px 0 0;max-width:none}
.account-page #heroLinks .btn{min-height:34px;padding:7px 11px;font-size:14px}
.account-page #heroLinks #cardEditToggle{color:var(--amber-500)}
.account-page #cardPanel{padding:28px;margin:0 0 30px;border-radius:8px}
.account-page #main{padding:0 0 72px;scroll-margin-top:84px}
.account-page #recordsTicker.ggtk{margin:20px 0 0!important;border-radius:6px}
.account-page #recordsTicker.ggtk:has(.ggtk-msg){display:inline-flex;width:auto;max-width:100%;min-height:36px;padding:0}
.account-page #recordsTicker.ggtk .ggtk-msg{padding:8px 13px;font:600 11px/1.35 var(--ff-mono);letter-spacing:.06em;color:var(--dim)}
.acct-shell{display:block;padding-top:30px}
.acct-shell.account-ready{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:start}
.acct-main{min-width:0}
.acct-rail{position:sticky;top:88px;display:flex;flex-direction:column;gap:5px;padding:18px 10px;border-radius:7px}
.account-nav-label{font:600 10px/1.4 var(--ff-mono);letter-spacing:.13em;text-transform:uppercase;color:var(--ghost);padding:2px 12px 10px}
.account-nav-label--second{padding-top:21px}
.acct-rail a{display:flex;align-items:center;gap:11px;padding:9px 10px;border:1px solid transparent;border-radius:4px;color:var(--mid);font:600 15px/1.2 'Saira Condensed',var(--ff-head);letter-spacing:.02em;text-decoration:none;transition:background .15s,color .15s}
.acct-rail a:hover{color:var(--ink-1);background:oklch(1 0 0/0.07)}
.acct-rail a.on{color:#fff;text-shadow:0 1px 2px var(--aur-ink);background:linear-gradient(180deg,var(--aur-glow),var(--aur-ink));border-color:oklch(0.65 0.13 45/0.55);box-shadow:inset 0 1px 0 oklch(1 0 0/0.25),0 2px 6px oklch(0 0 0/0.4)}
.account-nav-icon{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:3px;font:600 10px var(--ff-num);color:var(--section-color);background:linear-gradient(180deg,oklch(1 0 0/0.12),oklch(1 0 0/0.035));border:1px solid color-mix(in oklab,var(--section-color) 37%,transparent);box-shadow:inset 0 1px 0 oklch(1 0 0/0.17),0 1px 2px oklch(0 0 0/0.4)}
.acct-rail a.on .account-nav-icon{color:#111;background:var(--section-color);border-color:var(--section-color);text-shadow:none;box-shadow:inset 0 1px 0 oklch(1 0 0/0.5),0 0 9px color-mix(in oklab,var(--section-color) 45%,transparent)}
.acct-rail .account-all{margin-top:16px;padding-top:17px;border-top:1px solid var(--hair);border-radius:0;justify-content:space-between;color:var(--mid)}
.account-section + .account-section{margin-top:38px}
.account-section[hidden] + .account-section{margin-top:0}
.account-section-head{margin:0 0 18px;padding:4px 0 18px;border-bottom:1px solid var(--hair)}
.account-section-head .account-eyebrow{color:var(--section-color);margin:0 0 7px}
.account-section-head h2{font:700 clamp(30px,3vw,40px)/1.05 'Saira Condensed',var(--ff-head);letter-spacing:.02em;text-transform:uppercase;color:var(--metal-50);margin:0;text-shadow:var(--etch)}
.account-section-head > p:last-child{font-size:15px;color:var(--dim);margin:9px 0 0}
.account-page #acct .panel{border-radius:7px;border-top:2px solid color-mix(in oklab,var(--section-color,var(--amber-500)) 70%,transparent);overflow:visible}
.account-page #acct .panel-pad{padding:26px}
.account-page #acct .panel + .panel{margin-top:15px}
.account-page #acct .panel:first-of-type{margin-top:0}
.account-page #acct .phead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-bottom:15px;margin-bottom:17px;border-bottom:1px solid var(--hair)}
.account-page #acct .phead h3{font:700 23px/1.1 'Saira Condensed',var(--ff-head);letter-spacing:.02em;text-transform:uppercase;color:var(--metal-50);text-shadow:var(--etch)}
.account-page #acct .phead .pm,.account-page #acct .dim,.account-page #acct .faint{color:var(--dim)}
.account-page #acct p{line-height:1.55;overflow-wrap:anywhere}
.account-page .btn{min-height:37px;padding:7px 14px;border-radius:5px;clip-path:none;align-self:center;text-decoration:none;text-align:center;white-space:normal;
  font:600 15px/1.25 'Saira Condensed',var(--ff-head);letter-spacing:.08em;text-transform:uppercase;color:var(--mid);
  text-shadow:0 1px 2px oklch(0 0 0/0.5);background:linear-gradient(180deg,oklch(1 0 0/0.13),oklch(1 0 0/0.045));
  border:1px solid oklch(1 0 0/0.14);box-shadow:inset 0 1px 0 oklch(1 0 0/0.3),inset 0 0 0 1px oklch(1 0 0/0.1),0 2px 6px oklch(0 0 0/0.4);
  transition:background .15s,box-shadow .15s}
.account-page .btn:hover{color:var(--ink-1);background:linear-gradient(180deg,oklch(1 0 0/0.2),oklch(1 0 0/0.08))}
.account-page .btn:active{box-shadow:inset 0 2px 6px oklch(0 0 0/0.7),inset 0 0 0 1px oklch(1 0 0/0.13)}
.account-page .btn--primary{color:#fff;border-color:oklch(0.65 0.13 45/0.56);background:linear-gradient(180deg,var(--aur-glow),var(--aur-ink));box-shadow:inset 0 1px 0 oklch(1 0 0/0.26),0 3px 9px oklch(0 0 0/0.4)}
.account-page .btn--primary:hover{color:#fff;background:linear-gradient(180deg,var(--a3),var(--a1))}
.account-page #accountQuickLinks .btn--primary{color:#211409;text-shadow:0 1px 0 oklch(1 0 0/0.52);
  border-color:#ffd34e;background:linear-gradient(180deg,#ffe080 0%,#ffab2e 53%,#df7d1c 100%);
  box-shadow:inset 0 1px 0 oklch(1 0 0/0.72),inset 0 -1px 0 oklch(0.42 0.13 45/0.65),0 3px 9px oklch(0 0 0/0.45),0 0 18px oklch(0.72 0.17 68/0.22)}
.account-page #accountQuickLinks .btn--primary:hover{color:#211409;background:linear-gradient(180deg,#ffedaa 0%,#ffc34f 56%,#ec8b25 100%);
  box-shadow:inset 0 1px 0 oklch(1 0 0/0.8),0 4px 12px oklch(0 0 0/0.5),0 0 22px oklch(0.72 0.17 68/0.38)}
.account-page .btn-danger{color:#ffb8b1;border-color:oklch(0.63 0.19 25/0.5)}
.account-page :is(button,a,input,select,textarea):focus-visible{outline:2px solid var(--section-color,var(--amber-500));outline-offset:3px}
.account-page #acct .badge{font:600 10px/1.3 var(--ff-mono);letter-spacing:.04em;padding:5px 7px;border-radius:3px}
.account-page #acct .idgrid{grid-template-columns:1fr;gap:16px}
.account-page #acct .idg-name{order:0}
.account-page #acct .idg-guard{max-width:68ch;padding-left:14px;border-left:2px solid var(--section-color);color:var(--mid)}
.account-page #acct .gname-row{margin-top:0;gap:12px}
.account-page #acct .gname{flex-basis:260px;min-width:0;padding:10px 12px;background:var(--sunk);border:1px solid var(--hair);border-radius:4px;box-shadow:inset 0 2px 6px oklch(0 0 0/0.55);color:var(--ink-1);font-size:27px;text-transform:none}
.account-page #acct .gname[readonly]{padding-left:0;background:transparent;border-color:transparent;box-shadow:none}
.account-page #acct .input{min-height:42px;background:var(--sunk);border:1px solid var(--hair);border-radius:4px;box-shadow:inset 0 2px 6px oklch(0 0 0/0.55);clip-path:none;color:var(--ink-1);font-size:15px}
.account-page #acct input[type=file]{max-width:100%!important;color:var(--dim);font:400 13px var(--ff-body)}
.account-page #acct input::file-selector-button{padding:8px 11px;margin-right:11px;background:linear-gradient(180deg,oklch(1 0 0/0.13),oklch(1 0 0/0.045));border:1px solid var(--hair);border-radius:4px;color:var(--mid);cursor:pointer}
.account-page #acct .mrow{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding-block:15px}
.account-page #acct .mrow .who{flex:1 1 180px;min-width:0;overflow-wrap:anywhere}
.account-page #acct .mrow .acts{display:flex;flex-wrap:wrap;gap:8px;min-width:0;max-width:100%}
.account-page #acct .pgrid2{grid-template-columns:1fr;gap:26px}
.account-delete{padding-top:22px;border-top:1px solid var(--hair)}
.account-delete h4{color:#ffb8b1}
.account-delete p{max-width:72ch}
.account-page #acct .priv-state{padding:16px;background:var(--sunk);border:1px solid var(--hair);border-radius:4px;box-shadow:inset 0 2px 6px oklch(0 0 0/0.55);clip-path:none}
.account-page #notify .ntrow{padding:16px 0}
.account-page #notify .ntg{min-height:39px;padding:7px 11px;border-radius:4px;background:linear-gradient(180deg,oklch(1 0 0/0.12),oklch(1 0 0/0.035));box-shadow:inset 0 1px 0 oklch(1 0 0/0.22),0 2px 5px oklch(0 0 0/0.35);color:var(--mid)}
.account-page #notify .ntg.on{color:var(--ink-1);border-color:var(--green-500);background:linear-gradient(180deg,oklch(0.45 0.15 155/0.5),oklch(0.24 0.1 155/0.35))}
.account-page #notify .ntg.on::before{content:"●";margin-right:7px;color:var(--green-500)}
.account-page .sht{border-radius:4px;box-shadow:0 3px 8px oklch(0 0 0/0.4)}
.account-page .shed{background:var(--pane);border-color:var(--hair);border-radius:5px}
.account-page .shed input,.account-page .shed textarea{max-width:100%}
.account-page .account-section :is(h2,h3):focus{outline:none}
@media(max-width:1099px){
  .account-page .container{width:calc(100% - 48px)}
  .account-hero{gap:30px}
  .acct-shell.account-ready{grid-template-columns:1fr;gap:24px}
  .acct-rail{position:sticky;top:68px;z-index:40;flex-direction:row;overflow-x:auto;gap:5px;padding:8px;scrollbar-width:thin}
  .account-nav-label{display:none}
  .acct-rail a{flex:0 0 auto}
  .acct-rail .account-all{margin:0;padding:9px 12px;border:1px solid transparent}
  .acct-shell{padding-top:14px}
}
@media(max-width:700px){
  .account-page .container{width:calc(100% - 32px)}
  .account-hero{grid-template-columns:1fr;gap:22px;padding-block:26px}
  .account-page .page-head h1{font-size:52px}
  .account-page .account-lead{font-size:17px;margin-top:12px}
  .account-page .account-quick{margin-top:20px}
  .account-card-stage{padding:10px}
  .account-card-label{margin:2px 3px 9px}
  .account-page #heroLinks{gap:6px}
  .account-page #heroLinks .btn{flex:1 1 auto;min-height:40px;font-size:12px;padding:8px}
  .account-page #cardPanel,.account-page #acct .panel-pad{padding:19px}
  .account-section-head h2{font-size:32px}
  .account-page #acct .phead h3{font-size:21px}
  .account-page #acct .gname{font-size:25px;width:100%}
  .account-page #acct .btn{min-height:43px}
  .account-page .shed{padding:20px 16px calc(20px + env(safe-area-inset-bottom))}
  .account-page .shed img{width:100%;height:auto;max-height:180px;object-fit:contain}
  .account-page #heroCard .idcard .main{padding:14px 32px 8px 16px;gap:8px}
  .account-page #heroCard .idcard .helm{width:64px;height:64px}
  .account-page #heroCard .idcard .hanko{width:32px;height:32px;right:-10px;bottom:-8px}
  .account-page #heroCard .idcard .who .name{font-size:30px}
  .account-page #heroCard .idcard .who .since{font-size:10px;letter-spacing:.07em}
  .account-page #heroCard .idcard .classes,.account-page #heroCard .idcard .stat{padding-left:16px}
  .account-page .gbeta{display:none}
}
@media(prefers-reduced-motion:reduce){.account-page *{scroll-behavior:auto!important;transition:none!important}}


.account-page:not(.card-studio-open) #heroCard .idcard.is-editable>.idcard-render{display:block}
.account-page:not(.card-studio-open) #heroCard .idcard.is-editable>.in{display:none}
.account-page.card-studio-open{overflow:hidden}
.account-page.card-studio-open::before{content:"";position:fixed;inset:0;z-index:99;background:rgba(3,5,8,.82);backdrop-filter:blur(9px)}
.account-page #cardPanel.card-studio{position:fixed;inset:clamp(8px,2vw,28px);z-index:100;width:auto;max-width:none;margin:0;padding:0;overflow:auto;overscroll-behavior:contain;border:1px solid rgba(255,255,255,.24);border-radius:12px;background:#19232b;box-shadow:0 36px 100px rgba(0,0,0,.7)}
.card-studio-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:25px 30px 22px;border-bottom:1px solid rgba(255,255,255,.13);background:linear-gradient(125deg,#2b4251,#1c2932 64%,#20242b)}
.card-studio-kicker,.card-studio-preview-head{font:700 11px/1.4 var(--ff-mono);letter-spacing:.14em;color:var(--cyan-500)}
.card-studio-head h3{font:700 clamp(31px,3.2vw,46px)/1 'Saira Condensed',var(--ff-head);text-transform:uppercase;margin:6px 0 5px;color:#f5f7f9}
.card-studio-head p,.card-studio-preview>p{font-size:14px;line-height:1.5;color:#bac7d0;margin:0}
.card-studio-close{display:flex;align-items:center;gap:16px;flex:none;min-height:42px;padding:8px 13px;border:1px solid rgba(255,255,255,.24);border-radius:5px;background:rgba(255,255,255,.08);color:#f5f7f9;font:700 13px/1 var(--ff-mono);cursor:pointer}
.card-studio-close span{font:300 28px/1 var(--ff-body)}
.card-studio-close:hover,.card-studio-close:focus-visible{background:rgba(255,255,255,.17);outline:2px solid var(--cyan-500);outline-offset:2px}
.card-studio-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(350px,.9fr);align-items:start;min-height:600px}
.card-studio-preview{position:sticky;top:0;min-width:0;padding:28px;display:flex;flex-direction:column;gap:15px;background:radial-gradient(100% 70% at 50% 0%,rgba(42,117,154,.28),transparent),#10191f;border-right:1px solid rgba(255,255,255,.12)}
.card-studio-preview-head{display:flex;justify-content:space-between;color:#e5f5ff}
.card-studio-preview-head span:last-child{color:#93a6b2;font-weight:500}
.card-studio-preview #heroCard{width:100%;max-width:none;filter:none}
.card-studio-preview #heroCard .idcard{width:100%;max-width:100%;filter:none!important;transform:none!important;will-change:auto}
.card-studio-preview #heroCard .idcard .who .name{overflow-wrap:anywhere}
.card-studio-preview #heroCard .idcard .who .since{overflow-wrap:anywhere}
.card-studio-preview #heroCard .idcard .stat .k,.card-studio-preview #heroCard .idcard .stat .v{overflow-wrap:anywhere}
.card-studio-grid #cardEditor{min-width:0;padding:0 27px 28px}
.card-studio-grid #cardEditor .ce{margin:0}
.card-studio-grid #cardEditor .ce-bar{position:sticky;bottom:-28px;z-index:2;margin:24px -27px -28px;padding:16px 27px;background:#24343e;border-top:1px solid rgba(255,255,255,.18);box-shadow:0 -10px 30px rgba(0,0,0,.2)}
@media(max-width:900px){
  .card-studio-grid{grid-template-columns:1fr}
  .card-studio-preview{position:relative;padding:18px;border-right:0;border-bottom:1px solid rgba(255,255,255,.13)}
  .card-studio-grid #cardEditor{padding:0 18px 22px}
  .card-studio-grid #cardEditor .ce-bar{margin:20px -18px -22px;padding:14px 18px}
}
@media(max-width:600px){
  .account-page #cardPanel.card-studio{inset:0;border:0;border-radius:0}
  .card-studio-head{padding:17px;gap:10px}
  .card-studio-head p{display:none}
  .card-studio-close{font-size:0;min-width:44px;justify-content:center;padding:6px}
  .card-studio-close span{font-size:29px}
  .card-studio-preview{padding:14px}
  .card-studio-preview>p{display:none}
}