/* ============================================================================
   MYCELIA / mycelia.css
   One stylesheet. It replaces eight that were layered over each other across
   successive passes, where 186 selectors were defined in three or more files
   and hundreds of declarations were dead because a later sheet always won.
   That is why the app stopped feeling cohesive: it was not one design, it was
   eight generations of patches arguing with each other.

   Every declaration below is one that actually wins. Nothing here is overridden
   by anything else in the project.
   ============================================================================ */


/* ------------------------------------------------------------------ style.css */
:root{--fs:16.5px;--teal:#12b98a;--teal-b:#2fd6a6;--violet:#7b6cff;--violet-b:#9a8cff;--grad:linear-gradient(135deg,#2fd6a6 0%,#3fb6f0 46%,#7b6cff 100%);--grad-warm:linear-gradient(135deg,#ffd27a,#ff8f6b);--on-amb:#eef0fb;--on-amb-mut:rgba(238,240,251,.66);--glass:rgba(255,255,255,.68);--glass-2:rgba(255,255,255,.52);--glass-strong:rgba(255,255,255,.82);--glass-brd:rgba(255,255,255,.7);--glass-brd-2:rgba(255,255,255,.4);--hair:rgba(20,22,40,.08);--chip:rgba(255,255,255,.55);--field:rgba(255,255,255,.6);--blur:22px;--r-lg:28px;--r-md:20px;--r-sm:14px;--ease:cubic-bezier(.32,.72,0,1);--spring:cubic-bezier(.34,1.56,.64,1);--nav-w:236px;--maxw:760px}
body[data-text="s"]{--fs:15px}
body[data-text="m"]{--fs:16.5px}
body[data-text="l"]{--fs:18.5px}
body[data-text="xl"]{--fs:20.5px}
body[data-mode="day"]{--glass:rgba(255,255,255,.74);--glass-2:rgba(255,255,255,.6);--glass-strong:rgba(255,255,255,.9);--hair:rgba(30,32,60,.08);--on-amb:#23253f;--on-amb-mut:#5c5f7e}
body[data-mode="night"]{--glass:rgba(38,40,68,.52);--glass-2:rgba(38,40,68,.4);--glass-strong:rgba(46,48,80,.66);--glass-brd:rgba(255,255,255,.14);--glass-brd-2:rgba(255,255,255,.08);--hair:rgba(255,255,255,.09);--chip:rgba(255,255,255,.08);--field:rgba(255,255,255,.07);--on-amb:#eef0ff;--on-amb-mut:rgba(238,240,255,.6)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{color:var(--ink);background:#0f1017;overflow:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;transition:color .4s var(--ease)}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
input,textarea{font:inherit;color:inherit}
img{display:block;max-width:100%}
.scroll{scrollbar-width:thin;scrollbar-color:rgba(140,140,160,.4) transparent}
#ambient{position:fixed;inset:0;z-index:-2;overflow:hidden;background:radial-gradient(120% 120% at 8% 0%, #1a1830 0%, transparent 55%),
    radial-gradient(120% 120% at 100% 10%, #141b2e 0%, transparent 50%),
    linear-gradient(160deg,#101120 0%,#0c0d16 100%);transition:background .5s var(--ease)}
body[data-mode="night"] #ambient{background:radial-gradient(120% 120% at 12% -8%, #16142a 0%, transparent 55%),
    radial-gradient(120% 120% at 100% 6%, #0f1626 0%, transparent 50%),
    linear-gradient(160deg,#0a0a14 0%,#07070d 100%)}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;mix-blend-mode:screen;animation:drift 26s var(--ease) infinite alternate}
body[data-mode="day"] .blob{mix-blend-mode:multiply}
.b1{width:52vw;height:52vw;left:-8vw;top:-10vw;background:radial-gradient(circle,#2fd6a6,transparent 68%)}
.b2{width:46vw;height:46vw;right:-6vw;top:2vw;background:radial-gradient(circle,#7b6cff,transparent 68%);animation-delay:-6s}
.b3{width:44vw;height:44vw;left:22vw;bottom:-16vw;background:radial-gradient(circle,#3fb6f0,transparent 68%);animation-delay:-12s}
.b4{width:30vw;height:30vw;right:14vw;bottom:-8vw;background:radial-gradient(circle,#ff8f6b,transparent 70%);opacity:.4;animation-delay:-18s}
@keyframes drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(4vw,3vw) scale(1.12)}100%{transform:translate(-3vw,-2vw) scale(1.04)}}
@media (prefers-reduced-motion:reduce){
  .blob{animation:none}
}
#grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");mix-blend-mode:overlay}
#boot{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;transition:opacity .55s var(--ease)}
#boot.gone{opacity:0;pointer-events:none}
.boot-orb{width:74px;height:74px;border-radius:50%;background:var(--grad);box-shadow:0 0 60px 6px rgba(47,214,166,.55),0 0 30px rgba(123,108,255,.5) inset;animation:pulse 1.7s var(--ease) infinite}
@keyframes pulse{0%,100%{transform:scale(1);box-shadow:0 0 50px 4px rgba(47,214,166,.45)}50%{transform:scale(1.12);box-shadow:0 0 80px 12px rgba(123,108,255,.6)}}
.boot-word{font-size:24px;color:#fff;opacity:.94}
#app{height:100dvh;display:flex}
.glass{border:1px solid var(--glass-brd);box-shadow:var(--sh-card)}
#nav{position:fixed;left:18px;top:18px;bottom:18px;width:var(--nav-w);z-index:20;border-radius:var(--r-lg);padding:20px 14px;display:flex;flex-direction:column;gap:5px;background:var(--glass);border:1px solid var(--glass-brd)}
.brand{display:flex;align-items:center;gap:11px;padding:6px 10px 18px}
.brand .mark{width:38px;height:38px;border-radius:12px;background:var(--grad);box-shadow:var(--glow-teal);flex:0 0 auto;position:relative}
.brand .mark::after{content:"";position:absolute;inset:0;border-radius:12px;background:radial-gradient(120% 120% at 30% 20%,rgba(255,255,255,.6),transparent 55%)}
.brand .wm{font-size:21px;color:var(--ink)}
.nav-item{display:flex;align-items:center;border-radius:16px;color:var(--ink-soft);font-weight:600;font-size:1rem;position:relative}
.nav-item:hover{color:var(--ink)}
.nav-item .ic{display:grid;place-items:center;color:var(--ink-mut)}
.nav-item:hover .ic{color:var(--ink)}
.nav-item.on{background:linear-gradient(120deg,rgba(47,214,166,.16),rgba(123,108,255,.16));color:var(--ink);box-shadow:inset 0 0 0 1px var(--glass-brd-2)}
.nav-item .badge{margin-left:auto;background:var(--grad);color:#fff;display:grid;place-items:center}
.nav-sp{flex:1}
.nav-me{display:flex;align-items:center;padding:9px 10px;border-radius:16px;cursor:pointer}
.nav-me:hover{background:var(--chip)}
.nav-me .meta{min-width:0}
.nav-me .nm{font-weight:700;font-size:.95rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-me .sub{font-size:.78rem;color:var(--ink-mut)}
#screen{flex:1;margin-left:var(--nav-w);height:100dvh;overflow-y:auto;overflow-x:hidden;padding:34px 30px 60px;scroll-behavior:smooth}
.wrap{max-width:var(--maxw);margin:0 auto}
.wrap.wide{max-width:960px}
@keyframes screenin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.h-top{display:flex;gap:14px;margin-bottom:22px}
.htitle{color:var(--on-amb)}
.h-top .hsub{color:var(--on-amb-mut);font-size:1rem;margin-top:4px}
.h-top .spacer{flex:1}
.greet{margin-bottom:4px;color:var(--on-amb)}
.greet .wave{display:inline-block;animation:wave 2.4s var(--ease) infinite;transform-origin:70% 70%}
@keyframes wave{0%,60%,100%{transform:rotate(0)}10%{transform:rotate(16deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}}
.day-line{color:var(--on-amb-mut);font-size:1.02rem;margin-bottom:26px}
.sub-head .hsub{color:var(--on-amb-mut)}
.sub-head{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.back-btn{display:grid;place-items:center;color:var(--ink);flex:0 0 auto;border:1px solid var(--glass-brd)}
.back-btn:hover{transform:translateX(-2px)}
.back-btn:active{transform:scale(.94)}
.card{border-radius:var(--r-lg);margin-bottom:18px;border:1px solid var(--glass-brd);position:relative;overflow:hidden}
.card-glow-teal{box-shadow:var(--sh-card),0 0 0 1px rgba(47,214,166,.25),0 24px 60px -24px rgba(47,214,166,.5)}
.card-title{color:var(--ink);display:flex;align-items:center;gap:9px;margin-bottom:3px}
.card-sub{color:var(--ink-mut);font-size:.94rem}
.section-label{color:var(--on-amb-mut);display:flex;align-items:center;gap:8px}
.av{border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;flex:0 0 auto;position:relative;background-size:cover}
.av .on{position:absolute;right:-1px;bottom:-1px;width:32%;height:32%;min-width:11px;min-height:11px;border-radius:50%;border:2.5px solid var(--glass)}
.av .on.off{background:#9aa;box-shadow:none}
.btn{display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;white-space:nowrap;line-height:1}
.btn-primary{background:var(--grad);color:#fff;box-shadow:var(--glow-teal),inset 0 1px 0 rgba(255,255,255,.4)}
.btn-primary:hover{filter:brightness(1.05);box-shadow:var(--glow-violet),inset 0 1px 0 rgba(255,255,255,.45)}
.btn-glass{color:var(--ink);border:1px solid var(--glass-brd)}
.btn-lg{font-size:1.06rem}
.btn-block{display:flex;width:100%}
.btn-ghost{color:var(--ink-soft)}
.btn-ghost:hover{color:var(--ink);background:var(--chip)}
.tiles{display:grid;margin-bottom:8px}
.tile{border-radius:var(--r-md);text-align:left;border:1px solid var(--glass-brd)}
.tile .tic{display:grid;place-items:center;color:#fff}
.tile .tt{color:var(--ink)}
.tg-teal{background:linear-gradient(135deg,#2fd6a6,#12b98a)}
.tg-violet{background:linear-gradient(135deg,#9a8cff,#7b6cff)}
.tg-blue{background:linear-gradient(135deg,#5cc6f5,#3fb6f0)}
.tg-warm{background:linear-gradient(135deg,#ffcf7a,#ff8f6b)}
.chips{display:flex;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--chip);border:1px solid var(--glass-brd-2);border-radius:999px;padding:7px 13px;font-size:.86rem;font-weight:600;color:var(--ink-soft)}
.chip.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:var(--glow-teal)}
.grow{border-radius:var(--r-lg);overflow:hidden;margin-bottom:18px;border:1px solid var(--glass-brd)}
.grow.tap{cursor:pointer}
.grow .photo{height:150px;background-size:cover;background-position:center;display:grid;place-items:center;font-size:60px;position:relative}
.grow .photo::after{content:"";position:absolute;inset:0}
.grow .photo .who{position:absolute;left:14px;top:14px;display:flex;align-items:center;gap:8px;z-index:2;padding:5px 11px 5px 5px;border-radius:999px}
.grow .photo .who .av{width:26px;height:26px;font-size:.75rem}
.grow .photo .who span{color:#fff;font-weight:600;font-size:.84rem}
.grow .photo .day{position:absolute;right:14px;bottom:12px;z-index:2;color:#fff;font-weight:800;font-size:.9rem;letter-spacing:.02em}
.grow .body{padding:18px 20px 20px}
.grow .g-name{font-family:"Space Grotesk";font-weight:600;font-size:1.3rem;color:var(--ink)}
.grow .g-stage{display:inline-flex;align-items:center;gap:7px;margin-top:6px;font-size:.92rem;font-weight:700;color:var(--teal)}
.grow .g-stage .dot{width:9px;height:9px;border-radius:50%;background:var(--teal-b);box-shadow:0 0 10px var(--teal-b)}
.gbar{height:12px;border-radius:8px;background:var(--field);margin:14px 0 8px;overflow:hidden;box-shadow:inset 0 1px 3px rgba(0,0,0,.12)}
.gbar i{display:block;height:100%;border-radius:8px;background:var(--grad);box-shadow:var(--glow-teal)}
.gsteps{display:flex;justify-content:space-between;font-size:.72rem;font-weight:700;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.02em}
.g-next{margin-top:14px;display:flex;gap:11px;align-items:flex-start;background:var(--chip);border:1px solid var(--glass-brd-2);padding:13px 15px}
.g-next .nic{width:34px;height:34px;background:var(--grad-warm);display:grid;place-items:center;flex:0 0 auto;box-shadow:var(--sh-soft)}
.g-next .ntxt{font-size:.94rem;color:var(--ink-soft);line-height:1.4}
.g-next .ntxt b{color:var(--ink);font-weight:700}
.g-actions{display:flex;margin-top:16px}
.g-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.g-meta .m{background:var(--chip);border:1px solid var(--glass-brd-2);padding:9px 13px;flex:1;min-width:90px}
.g-meta .m .l{font-size:.72rem;color:var(--ink-mut);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.g-meta .m .v{font-size:1rem;color:var(--ink);font-weight:700;margin-top:2px}
.gcard{display:flex;align-items:center;gap:15px;border-radius:var(--r-md);padding:15px;margin-bottom:13px;cursor:pointer;border:1px solid var(--glass-brd)}
.gcard .ge{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:28px;flex:0 0 auto;box-shadow:var(--sh-soft),inset 0 0 0 1px rgba(255,255,255,.25)}
.gcard .gi{flex:1;min-width:0}
.gcard .gn{font-weight:700;font-size:1.1rem;color:var(--ink);display:flex;align-items:center;gap:6px}
.gcard .gd{font-size:.9rem;color:var(--ink-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.gcard .gmeta{font-size:.8rem;color:var(--teal);font-weight:700;margin-top:4px;display:flex;align-items:center;gap:5px}
.gcard .gmeta .liveDot{width:7px;height:7px;border-radius:50%;background:var(--teal-b);box-shadow:0 0 8px var(--teal-b)}
.gcard .chev{color:var(--ink-dim);flex:0 0 auto}
.ghero{border-radius:var(--r-lg);overflow:hidden;margin-bottom:18px;box-shadow:var(--sh-card);position:relative}
.ghero .cover{height:130px;background-size:cover;position:relative}
.ghero .cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.25))}
.ghero .gbody{padding:18px 20px;border:1px solid var(--glass-brd);border-top:0;position:relative}
.ghero .gge{position:absolute;left:20px;top:-40px;width:80px;height:80px;border-radius:24px;display:grid;place-items:center;font-size:38px;box-shadow:var(--sh-card),inset 0 0 0 1px rgba(255,255,255,.3);border:4px solid var(--glass)}
.ghero h2{font-family:"Space Grotesk";font-weight:600;font-size:1.5rem;color:var(--ink);margin-top:44px}
.ghero p{color:var(--ink-mut);font-size:.96rem;margin-top:3px}
.seg{display:flex;gap:4px;background:var(--field);border:1px solid var(--glass-brd-2);padding:5px;margin:16px 0 4px}
.seg button{flex:1;font-weight:700;font-size:.95rem}
.seg button.on{background:var(--glass-strong);color:var(--ink);box-shadow:var(--sh-soft)}
.chat-scroll{display:flex;flex-direction:column;gap:3px;padding-bottom:8px}
.bub-row{display:flex;gap:10px;align-items:flex-end;margin-top:10px}
.bub-row.me{flex-direction:row-reverse}
.bub-row .av{width:34px;height:34px;font-size:.85rem;margin-bottom:2px}
.bub-row.cont .av{visibility:hidden}
.bub-wrap{display:flex;flex-direction:column}
.bub-row.me .bub-wrap{align-items:flex-end}
.bub-name{font-size:.8rem;font-weight:700}
.bub{padding:12px 16px;border-radius:20px;box-shadow:var(--sh-soft);word-wrap:break-word;white-space:pre-wrap}
.bub.them{color:var(--ink);border:1px solid var(--glass-brd);border-bottom-left-radius:7px}
.bub.me{background:var(--grad);color:#fff;border-bottom-right-radius:7px;box-shadow:var(--glow-teal)}
.bub-time{margin:4px 8px 0}
.typing-row{display:flex;gap:10px;align-items:center;margin-top:10px}
.typing-b{background:var(--glass-strong);border:1px solid var(--glass-brd);border-radius:20px;border-bottom-left-radius:7px;padding:14px 16px;display:flex;gap:5px}
.typing-b i{width:7px;height:7px;border-radius:50%;background:var(--ink-mut);animation:tb 1.3s infinite}
.typing-b i:nth-child(2){animation-delay:.18s}
.typing-b i:nth-child(3){animation-delay:.36s}
@keyframes tb{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-6px);opacity:1}}
.composer{position:sticky;bottom:0;padding-top:12px;margin-top:6px}
.comp-inner{display:flex;align-items:flex-end;gap:10px;padding:8px 8px 8px 8px;background:var(--glass-strong);border:1px solid var(--glass-brd)}
.comp-inner .add{border-radius:16px;display:grid;place-items:center;color:var(--ink-soft);background:var(--chip)}
.comp-inner .add:hover{color:var(--ink);background:var(--field)}
.comp-inner textarea{flex:1;border:0;background:none;outline:none;resize:none;max-height:150px;color:var(--ink)}
.comp-send{border-radius:16px;display:grid;place-items:center;color:#fff;background:var(--grad);box-shadow:var(--glow-teal)}
.comp-send:hover{filter:brightness(1.06)}
.comp-send:active{transform:scale(.9)}
.feed{display:flex;gap:13px;align-items:flex-start;border-radius:var(--r-md);padding:16px;margin-bottom:13px;cursor:pointer;border:1px solid var(--glass-brd)}
.feed .av{width:44px;height:44px}
.feed .fi{flex:1;min-width:0}
.feed .fw{font-size:.98rem;color:var(--ink-soft);line-height:1.45}
.feed .fw b{color:var(--ink);font-weight:700}
.feed .ft{font-size:.8rem;color:var(--ink-dim);margin-top:4px}
.feed .fthumb{width:56px;height:56px;border-radius:14px;flex:0 0 auto;display:grid;place-items:center;font-size:26px;box-shadow:var(--sh-soft)}
.verdicts{display:flex;gap:10px;margin-top:14px}
.vd{flex:1;border-radius:16px;padding:14px 10px;text-align:center;cursor:pointer;background:var(--chip);border:1px solid var(--glass-brd-2)}
.vd:hover{transform:translateY(-2px);box-shadow:var(--sh-soft)}
.vd:active{transform:scale(.97)}
.vd .ve{font-size:24px}
.vd .vl{font-weight:700;font-size:.92rem;color:var(--ink);margin-top:4px}
.vd .vp{font-size:1.3rem;font-weight:800;margin-top:2px}
.vd.picked{border-color:var(--violet);box-shadow:0 0 0 2px rgba(123,108,255,.4)}
.prof{border-radius:var(--r-lg);overflow:hidden;margin-bottom:18px}
.prof .pcover{background-size:cover}
.prof .pbody{border:1px solid var(--glass-brd);border-top:0;padding:0 22px 22px;position:relative}
.prof .pav{position:absolute;left:22px;top:-46px;width:92px;height:92px;font-size:40px;border:5px solid var(--glass)}
.prof .pname{color:var(--ink);padding-top:52px}
.prof .ptag{color:var(--ink-mut);font-size:.98rem}
.pstats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin:18px 0}
.pstat{background:var(--chip);border:1px solid var(--glass-brd-2);padding:16px;text-align:center}
.pstat .v{color:var(--ink)}
.pstat .v.grad{-webkit-background-clip:text;background-clip:text}
.pstat .l{color:var(--ink-mut);margin-top:3px}
.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.badge-b{width:52px;height:52px;display:grid;place-items:center;font-size:24px;background:var(--chip);border:1px solid var(--glass-brd-2);box-shadow:var(--sh-soft)}
.set{border-radius:var(--r-md);overflow:hidden;border:1px solid var(--glass-brd);margin-bottom:16px}
.set-row{display:flex;align-items:center;border-bottom:1px solid var(--hair)}
.set-row:last-child{border-bottom:0}
.set-row .sic{display:grid;place-items:center;color:#fff;box-shadow:var(--sh-soft)}
.set-row .sl{flex:1;min-width:0}
.set-row .st{font-weight:700;font-size:1rem;color:var(--ink)}
.set-row .ss{color:var(--ink-mut);margin-top:1px}
.segc{display:flex;gap:3px;background:var(--field);border:1px solid var(--glass-brd-2);padding:4px}
.segc button{font-weight:700;font-size:.9rem;color:var(--ink-mut)}
.segc button.on{background:var(--glass-strong);color:var(--ink);box-shadow:var(--sh-soft)}
.tog{border-radius:999px;background:var(--field);border:1px solid var(--glass-brd-2);position:relative;flex:0 0 auto}
.tog::after{content:"";position:absolute;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.tog.on{background:var(--grad)}
.plus{border-radius:var(--r-lg);padding:24px;margin-bottom:18px;position:relative;overflow:hidden;color:#fff;background:linear-gradient(135deg,#7b6cff,#3fb6f0 60%,#2fd6a6)}
.plus::after{content:"";position:absolute;right:-30px;top:-30px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.35),transparent 65%)}
.plus h3{font-family:"Space Grotesk";font-weight:600;font-size:1.4rem;position:relative}
.plus p{opacity:.92;margin:6px 0 16px;position:relative;font-size:.98rem}
.plus .btn{background:#fff;color:#3a2fb0;position:relative}
.sheet-wrap{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-end;justify-content:center;padding:0;animation:fade .25s var(--ease)}
@media (min-width:640px){
  .sheet-wrap{align-items:center;padding:24px}
}
@keyframes fade{from{opacity:0}to{opacity:1}}
.sheet{width:100%;max-width:540px;max-height:90vh;overflow-y:auto;border-radius:28px 28px 0 0;background:var(--glass-strong);border:1px solid var(--glass-brd);animation:sheetup .34s var(--spring)}
@media (min-width:640px){
  .sheet{border-radius:28px}
}
@keyframes sheetup{from{transform:translateY(40px);opacity:.6}to{transform:none;opacity:1}}
.sheet-h{padding:12px 24px 8px}
.sheet-h h3{color:var(--ink)}
.sheet-h p{color:var(--ink-mut);font-size:.95rem;margin-top:3px}
.sheet-x{position:absolute;right:18px;top:10px;display:grid;place-items:center;color:var(--ink-soft);background:var(--chip)}
.sheet-x:hover{background:var(--field);color:var(--ink)}
.field{margin-bottom:16px}
.field input,.field select{width:100%;background:var(--field);border:1px solid var(--glass-brd-2);font-size:1rem;color:var(--ink);outline:none;transition:.15s}
.field input:focus,.field select:focus{border-color:var(--violet);box-shadow:0 0 0 3px rgba(123,108,255,.18)}
.pick{display:flex;gap:8px;flex-wrap:wrap}
.pick button{font-weight:600;font-size:.92rem;background:var(--chip);border:1px solid var(--glass-brd-2);color:var(--ink-soft)}
.pick button.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:var(--glow-teal)}
.vault{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.strain{overflow:hidden;background:var(--glass);border:1px solid var(--glass-brd);cursor:pointer}
.strain .si{height:92px;background-size:cover;display:grid;place-items:center;font-size:36px;position:relative}
.strain .sd{position:absolute;top:8px;right:8px;font-size:.66rem;font-weight:800;text-transform:uppercase;padding:3px 8px;border-radius:999px;color:#fff}
.strain .sb{padding:12px 14px}
.strain .sn{font-weight:700;font-size:1rem;color:var(--ink)}
.strain .sl{font-size:.8rem;color:var(--ink-mut);font-style:italic}
#toasts{position:fixed;bottom:calc(env(safe-area-inset-bottom,0px) + 24px);left:50%;transform:translateX(-50%);z-index:80;display:flex;flex-direction:column;gap:10px;align-items:center;pointer-events:none}
.toast{display:flex;align-items:center;gap:11px;padding:14px 20px;font-weight:600;font-size:.98rem;color:var(--ink);background:var(--glass-strong);border:1px solid var(--glass-brd);animation:toastin .34s var(--spring)}
.toast .te{color:#fff}
@keyframes toastin{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}
@media (max-width:820px){
  :root{--maxw:640px}
  #nav{left:0;right:0;bottom:0;top:auto;width:auto;flex-direction:row;border-radius:26px 26px 0 0;gap:2px;box-shadow:0 -18px 50px -20px rgba(0,0,0,.5)}
  .brand,.nav-sp,.nav-me{display:none}
  .nav-item{flex-direction:column;flex:1;font-size:.7rem;border-radius:14px;text-align:center;justify-content:center}
  .nav-item.on::before{display:none}
  .nav-item.on{background:none}
  .nav-item.on .ic{color:var(--teal);transform:translateY(-1px)}
  .nav-item.on .lbl{color:var(--teal)}
  .nav-item .badge{position:absolute;margin:0}
  #screen{margin-left:0;padding:26px 18px calc(96px + env(safe-area-inset-bottom,0px))}
  .h-top .htitle,.greet{font-size:1.7rem}
  .tiles{grid-template-columns:1fr 1fr}
  .vault{grid-template-columns:1fr 1fr}
}
@media (max-width:420px){
  .tiles{grid-template-columns:1fr}
  .pstats{gap:8px}
}
#app.server-mode #screen{margin-left:0;padding:0;overflow:hidden;height:100dvh}
.srv{display:flex}
.srv-rail,.srv-side,.srv-main,.srv-members{background:var(--glass);border:1px solid var(--glass-brd)}
.srv-scrim{display:none}
.srv-rail{width:72px;flex:0 0 72px;padding:12px 0;display:flex;flex-direction:column;align-items:center;gap:8px;overflow-y:auto;scrollbar-width:none}
.srv-rail::-webkit-scrollbar{display:none}
.srail-home{width:50px;height:50px;border-radius:16px;background:var(--grad);color:#fff;display:grid;place-items:center;box-shadow:var(--glow-teal);flex:0 0 auto}
.srail-home:hover{transform:translateY(-2px)}
.srail-home:active{transform:scale(.94)}
.srail-sep{width:30px;height:2px;background:var(--hair);border-radius:2px;flex:0 0 auto}
.srail-item{position:relative;width:50px;height:50px;flex:0 0 auto}
.srail-ic{width:50px;height:50px;border-radius:26px;display:grid;place-items:center;font-size:23px;color:#fff;transition:border-radius .18s var(--spring),transform .16s;box-shadow:var(--sh-soft),inset 0 0 0 1px rgba(255,255,255,.25)}
.srail-ic:hover{border-radius:16px}
.srail-item.on .srail-ic{border-radius:16px}
.srail-item .pip{position:absolute;top:50%;transform:translateY(-50%);height:0;transition:height .2s var(--spring)}
.srail-item:hover .pip{height:20px}
.srail-add{width:50px;height:50px;border-radius:26px;display:grid;place-items:center;color:var(--teal);background:var(--chip);border:1px dashed var(--glass-brd-2);transition:.16s var(--spring);flex:0 0 auto}
.srail-add:hover{border-radius:16px;background:var(--grad);color:#fff;border-color:transparent}
.srv-side{width:250px;flex:0 0 250px;display:flex;flex-direction:column;overflow:hidden}
.srv-shead{display:flex;align-items:center;gap:8px;padding:16px 18px;color:var(--ink);border-bottom:1px solid var(--hair);cursor:pointer}
.srv-shead span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srv-shead:hover{background:var(--chip)}
.srv-chans{flex:1;overflow-y:auto;padding:10px 10px 14px}
.srv-cat{margin-top:14px}
.cat-h{display:flex;align-items:center;gap:5px;width:100%;padding:2px 6px 5px;color:var(--ink-mut);cursor:pointer}
.cat-h svg{transition:transform .16s}
.srv-cat.closed .cat-h svg{transform:rotate(-90deg)}
.cat-h span{flex:1;text-align:left}
.cat-h .cadd{opacity:0}
.cat-h:hover .cadd{opacity:.6}
.srv-cat.closed .chn:not(.on),.srv-cat.closed .vroom{display:none}
.chn{display:flex;align-items:center;gap:8px;width:100%;color:var(--ink-mut);position:relative}
.chn:hover{color:var(--ink)}
.chn.on{background:linear-gradient(110deg,rgba(47,214,166,.18),rgba(123,108,255,.18));color:var(--ink);box-shadow:inset 0 0 0 1px var(--glass-brd-2)}
.chn .ci{color:var(--ink-dim);flex:0 0 auto;display:grid;place-items:center}
.chn.on .ci{color:var(--teal)}
.chn .cnm{flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chn .cdot{width:8px;height:8px;border-radius:50%;background:var(--grad);box-shadow:var(--glow-teal)}
.chn .cnum{font-size:.72rem;font-weight:800;background:var(--chip);border-radius:8px;padding:2px 7px;color:var(--ink-mut)}
.vroom{padding:2px 0 6px 30px}
.vu{display:flex;align-items:center;gap:8px;padding:5px 8px;color:var(--ink-mut);font-size:.88rem;font-weight:500}
.srv-me{display:flex;align-items:center;padding:8px 8px;border-top:1px solid var(--hair)}
.srv-me .me{display:flex;align-items:center;gap:9px;flex:1;padding:5px 6px;border-radius:12px;cursor:pointer}
.srv-me .me:hover{background:var(--chip)}
.srv-me .nm{font-weight:700;font-size:.9rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srv-me .sub{font-size:.74rem;color:var(--ink-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srv-me .ub{color:var(--ink-mut);flex:0 0 auto}
.srv-me .ub:hover{background:var(--chip);color:var(--ink)}
.srv-main{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}
.chan-head{display:flex;align-items:center;gap:9px;padding:14px 18px;border-bottom:1px solid var(--hair);flex:0 0 auto}
.ch-ham{display:none;place-items:center;color:var(--ink-soft)}
.ch-ic{color:var(--ink-dim);display:grid;place-items:center}
.ch-name{font-weight:700;font-size:1.08rem;color:var(--ink)}
.ch-topic{color:var(--ink-mut);font-size:.86rem;padding-left:12px;margin-left:4px;border-left:1px solid var(--hair);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
.ch-actions{display:flex;gap:2px;margin-left:auto;flex:0 0 auto}
.cha{display:grid;place-items:center;color:var(--ink-mut)}
.cha:hover{background:var(--chip);color:var(--ink)}
.cha.on{color:var(--teal);background:var(--chip)}
.chan-body{flex:1;overflow-y:auto;padding:16px 6px 6px}
.c-hero-ic{width:60px;height:60px;border-radius:20px;border:1px solid var(--glass-brd-2);display:grid;place-items:center;margin-bottom:10px}
.c-hero h3{color:var(--ink)}
.c-hero p{color:var(--ink-mut);font-size:.95rem;margin-top:3px}
.c-div{position:sticky;top:8px;z-index:5;display:flex;justify-content:center;pointer-events:none}
.day-pill{pointer-events:auto;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--glass-brd);padding:6px 12px;border-radius:999px;cursor:pointer;transition:.15s var(--spring)}
.day-pill:hover{transform:translateY(-1px)}
.day-pill svg{opacity:.65}
.c-msg{display:flex;gap:14px;padding:3px 18px;position:relative}
.c-msg:hover{background:var(--hover)}
.c-msg.cont{padding-top:1px;padding-bottom:1px}
.c-gut{width:40px;flex:0 0 40px;display:flex;justify-content:center}
.c-gut .c-hstamp{font-size:.66rem;color:var(--ink-dim);opacity:0;align-self:center}
.c-msg.cont:hover .c-hstamp{opacity:1}
.c-content{flex:1;min-width:0}
.c-head{display:flex;align-items:baseline;gap:8px}
.c-name{font-weight:700;font-size:1rem;color:var(--ink);cursor:pointer}
.c-name:hover{text-decoration:underline}
.rk{font-size:.8rem}
.c-time{color:var(--ink-dim)}
.c-txt{color:var(--ink);word-wrap:break-word;white-space:pre-wrap}
.men{background:rgba(123,108,255,.18);color:var(--violet);border-radius:5px;padding:0 4px;font-weight:600;cursor:pointer}
.c-reply{display:flex;align-items:center;gap:6px;margin-left:54px;color:var(--ink-mut)}
.c-reply svg{color:var(--ink-dim)}
.c-reply b{color:var(--ink-soft)}
.c-embed{margin-top:6px;max-width:460px;background:var(--chip);border-left:3px solid var(--violet);padding:12px 14px}
.c-embed h5{color:var(--ink);font-size:.98rem;margin-bottom:6px}
.c-embed ul{margin:0;padding-left:18px;color:var(--ink-soft);font-size:.9rem}
.c-embed li{margin:3px 0}
.c-msg .grow{max-width:440px;margin-top:8px}
.c-reacts{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.c-react{display:flex;align-items:center;gap:5px;background:var(--chip);border:1px solid var(--glass-brd-2);padding:3px 9px;font-size:.86rem;color:var(--ink-soft)}
.c-react:hover{border-color:var(--glass-brd)}
.c-react.mine{background:rgba(47,214,166,.16);border-color:rgba(47,214,166,.5);color:var(--teal)}
.c-react b{font-size:.8rem}
.c-react.add{color:var(--ink-dim)}
.c-tools{position:absolute;top:-13px;right:16px;display:flex;border:1px solid var(--glass-brd);box-shadow:var(--sh-soft);opacity:0;transition:.12s}
.c-msg:hover .c-tools{opacity:1}
.c-tools button{width:34px;height:34px;display:grid;place-items:center;color:var(--ink-mut)}
.c-tools button:hover{color:var(--ink)}
.c-typing{display:flex;align-items:center;gap:9px;padding:6px 18px 10px;color:var(--ink-mut);font-size:.86rem}
.c-typing .tp{display:flex;gap:4px;background:var(--chip);padding:9px 12px}
.c-typing .tp i{width:6px;height:6px;border-radius:50%;background:var(--ink-mut);animation:tb 1.3s infinite}
.c-typing .tp i:nth-child(2){animation-delay:.18s}
.c-typing .tp i:nth-child(3){animation-delay:.36s}
.contam{margin-top:8px;max-width:440px;overflow:hidden;border:1px solid var(--glass-brd-2)}
.contam .c-img{height:130px;background-size:cover;display:grid;place-items:center;font-size:48px}
.contam .verdicts{display:flex;gap:8px;padding:12px;background:var(--chip)}
.contam .vhint{text-align:center;font-size:.76rem;color:var(--ink-mut);padding:0 0 12px;background:var(--chip)}
.chan-comp{flex:0 0 auto;padding:10px 16px 16px}
.chan-comp .comp-inner{box-shadow:var(--sh-card)}
.cbtn{display:grid;place-items:center;color:var(--ink-mut)}
.cbtn:hover{color:var(--ink);background:var(--chip)}
.voice-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:30px}
.vhead{text-align:center}
.vhead .vic{width:64px;height:64px;border-radius:20px;background:var(--grad-soft);display:grid;place-items:center;color:var(--teal);margin:0 auto 10px}
.vhead h3{font-family:"Space Grotesk";font-weight:600;font-size:1.5rem;color:var(--ink)}
.vhead p{color:var(--ink-mut);margin-top:2px}
.vgrid{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;max-width:600px}
.vtile{width:170px;height:120px;border-radius:18px;display:grid;place-items:center;position:relative;box-shadow:var(--sh-card)}
.vtile .vg{font-size:38px}
.vtile .vname{position:absolute;bottom:8px;left:10px;background:rgba(0,0,0,.4);color:#fff;font-size:.82rem;font-weight:600;padding:3px 9px;border-radius:20px}
.vempty{font-size:1rem}
.srv-members{width:250px;flex:0 0 250px;overflow:hidden}
.mem-scroll{height:100%;overflow-y:auto;padding:14px 10px 20px}
.boost{margin:0 4px 12px;padding:13px;background:var(--grad-soft);border:1px solid var(--glass-brd-2)}
.boost-h{font-size:.82rem;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:6px}
.boost-bar{height:6px;border-radius:4px;background:var(--field);margin:9px 0 6px;overflow:hidden}
.boost-bar i{display:block;height:100%;background:var(--grad);border-radius:4px}
.boost-sub{font-size:.74rem;color:var(--ink-mut);font-weight:600}
.mem-grp{color:var(--ink-mut);padding:14px 10px 6px}
.mem{display:flex;align-items:center;gap:11px;width:100%}
.mem.off{opacity:.45}
.mem .mi{min-width:0;text-align:left}
.mem .mn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:5px}
.mrk{font-size:.78rem}
.mem .ms{font-size:.76rem;color:var(--ink-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#app.mem-hidden .srv-members{display:none}
.cs-preview{display:flex;align-items:center;gap:13px;padding:14px;background:var(--chip);border:1px solid var(--glass-brd-2);margin-bottom:16px}
.cs-ic{place-items:center;font-size:26px}
.cs-nm{font-family:"Space Grotesk";font-weight:600;font-size:1.15rem;color:var(--ink)}
@media (max-width:1000px){
  #app.server-mode .srv-members{position:fixed;right:12px;top:12px;bottom:12px;z-index:30;transform:translateX(calc(100% + 24px));transition:transform .28s var(--ease)}
  body.drawer-mem #app.server-mode .srv-members{transform:none}
}
@media (max-width:820px){
  .srv{padding:0;gap:0}
  .srv-rail{display:none}
  .srv-side{position:fixed;left:0;top:0;bottom:0;z-index:35;width:280px;border-radius:0 24px 24px 0;transform:translateX(-105%);transition:transform .28s var(--ease)}
  body.drawer-side .srv-side{transform:none}
  .srv-main{border-radius:0}
  .ch-ham{display:grid}
  .ch-topic{display:none}
  .srv-members{right:0;top:0;bottom:0;border-radius:24px 0 0 24px;width:280px}
  .c-tools{display:none}
  #app.server-mode .srv-scrim{display:block;position:fixed;inset:0;z-index:25;background:rgba(8,8,14,.45);opacity:0;pointer-events:none;transition:.25s}
  body.drawer-side #app.server-mode .srv-scrim,body.drawer-mem #app.server-mode .srv-scrim{opacity:1;pointer-events:auto}
}
#app.server-mode{--ink:#eaebf4;--ink-soft:#c4c6d7;--ink-mut:#9799ae;--ink-dim:#74768c;--glass:rgba(40,41,55,.58);--glass-2:rgba(40,41,55,.42);--glass-strong:rgba(48,49,66,.94);--glass-brd:rgba(255,255,255,.09);--glass-brd-2:rgba(255,255,255,.06);--chip:rgba(255,255,255,.06);--field:rgba(255,255,255,.05);--hair:rgba(255,255,255,.07);--hover:rgba(255,255,255,.045);--grad-soft:linear-gradient(135deg,rgba(47,214,166,.2),rgba(123,108,255,.2));--sh-card:0 22px 55px -26px rgba(0,0,0,.75);--sh-soft:0 10px 26px -16px rgba(0,0,0,.6);--sh-lift:0 34px 80px -28px rgba(0,0,0,.85)}
#app.server-mode #screen{background:rgba(9,9,14,.6)}
#app.server-mode .srv-rail{background:rgba(13,13,19,.9)}
#app.server-mode .srv-side{background:rgba(19,19,27,.87)}
#app.server-mode .srv-members{background:rgba(19,19,27,.87)}
#app.server-mode .c-msg{padding:3px 20px 4px}
#app.server-mode .c-msg:hover{background:rgba(255,255,255,.032)}
#app.server-mode .c-txt{color:#dfe1ef;font-size:1rem;line-height:1.5}
#app.server-mode .c-gut{flex:0 0 44px;width:44px}
#app.server-mode .c-time{color:#72748a}
#app.server-mode .chn.on{background:linear-gradient(110deg,rgba(47,214,166,.22),rgba(123,108,255,.22))}
#app.server-mode .c-embed{background:rgba(255,255,255,.04)}
#app.server-mode .comp-inner{box-shadow:0 -2px 30px -18px rgba(0,0,0,.8),var(--sh-card)}
.chan-wrap{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}
.chan-wrap .chan-body{flex:1}
.jump-new{position:absolute;right:22px;bottom:16px;z-index:7;display:inline-flex;align-items:center;gap:7px;padding:10px 16px;border-radius:14px;background:var(--grad);color:#fff;font-weight:700;font-size:.84rem;box-shadow:var(--glow-teal);opacity:0;transform:translateY(10px);pointer-events:none}
.jump-new.show{opacity:1;transform:none;pointer-events:auto}
.jump-new:hover{filter:brightness(1.06)}
.jump-new:active{transform:scale(.95)}
.day-pop{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:9;width:252px;max-height:60vh;overflow-y:auto;padding:8px;background:rgba(20,20,30,.94);border:1px solid var(--glass-brd);box-shadow:var(--sh-lift);animation:daypin .18s var(--spring)}
@keyframes daypin{from{opacity:0;transform:translateX(-50%) translateY(-8px)}to{opacity:1;transform:translateX(-50%)}}
.day-pop .dp-h{font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-mut);padding:9px 12px 8px}
.day-pop button{display:flex;align-items:center;gap:11px;width:100%;padding:11px 12px;color:var(--ink-soft);font-weight:600;font-size:.96rem}
.day-pop button:hover{background:var(--chip);color:var(--ink)}
.day-pop button svg{opacity:.7;flex:0 0 auto}
.day-pop .dp-now{color:var(--teal-b);border-top:1px solid var(--hair);border-radius:0;margin-top:5px;padding-top:13px}
.pop{position:fixed;z-index:200;border:1px solid rgba(255,255,255,.1);color:#eaebf4;overflow:hidden;animation:popfade .16s var(--ease)}
@keyframes popfade{from{opacity:0;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:none}}
.pop kbd,.cmdk-foot kbd,.srv-jump kbd{font-family:inherit;font-size:.68rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);border-radius:5px;padding:1px 6px;color:#c4c6d7}
.menu{min-width:212px;padding:7px}
.menu-h{padding:8px 12px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.menu-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;color:#d6d8e6;font-weight:600;font-size:.94rem}
.menu-item:hover{background:rgba(255,255,255,.07);color:#fff}
.menu-item svg{opacity:.8;flex:0 0 auto}
.menu-sep{height:1px;background:rgba(255,255,255,.08);margin:6px 8px}
.menu-me{display:flex;align-items:center;gap:11px;padding:8px 12px}
.menu-me-n{font-weight:700;color:#fff}
.menu-me-s{font-size:.78rem;color:#9799ae}
.stdot{width:11px;height:11px;border-radius:50%;flex:0 0 auto}
.stdot.off{background:#8b8da2}
.emoji-body{max-height:280px;overflow-y:auto;padding:10px}
.emoji-cat{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:8px 4px 6px}
.emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:2px}
.emoji-btn{font-size:20px;padding:6px 0;transition:.1s}
.emoji-btn:hover{background:rgba(255,255,255,.1);transform:scale(1.18)}
.ppop-wrap{width:300px}
.ppop-ban{height:78px;position:relative}
.pp-badges{position:absolute;right:10px;bottom:8px;display:flex;gap:4px;padding:4px 8px;border-radius:20px}
.pp-badge{font-size:14px}
.ppop-av{width:74px;height:74px;border-radius:50%;margin:-38px 0 0 16px;border:5px solid rgba(23,23,33,.98);display:grid;place-items:center;font-size:32px;position:relative;box-shadow:0 6px 16px rgba(0,0,0,.4)}
.ppop-av .on{position:absolute;right:1px;bottom:1px;width:18px;height:18px;border-radius:50%;border:4px solid rgba(23,23,33,.98);background:#37d39a}
.ppop-av .on.idle{background:#f5b74e}
.ppop-av .on.dnd{background:#f0506e}
.ppop-av .on.off,.ppop-av .on.offline{background:#8b8da2}
.ppop-b{padding:10px 16px 16px}
.ppop-nm{font-family:"Space Grotesk";font-weight:600;font-size:1.3rem;color:#fff}
.ppop-tt{font-size:.86rem}
.ppop-note{margin-top:9px;font-size:.85rem;background:rgba(255,255,255,.05);padding:8px 11px}
.ppop-line{height:1px;background:rgba(255,255,255,.08);margin:12px 0}
.ppop-h{margin:10px 0 6px}
.rchips{display:flex;flex-wrap:wrap;gap:6px}
.rchip{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:600;color:var(--rc);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:4px 10px}
.ppop-about{font-size:.87rem;line-height:1.5}
.ppop-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:12px}
.ppop-stats>div{background:rgba(255,255,255,.05);border-radius:12px;padding:10px;text-align:center}
.ppop-stats b{display:block;font-family:"Space Grotesk";font-weight:600;font-size:1.2rem;color:#fff}
.ppop-stats span{font-size:.66rem;text-transform:uppercase;font-weight:700}
.pins-wrap,.srch-wrap{width:304px}
.pins-h{display:flex;align-items:center;gap:8px;padding:13px 15px;font-weight:700;color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.pins-body,.srch-res{max-height:340px;overflow-y:auto;padding:8px}
.pin-row{display:block;width:100%;text-align:left;padding:10px 11px}
.pin-row:hover{background:rgba(255,255,255,.06)}
.pin-top{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.pin-top b{font-size:.85rem;color:#eaebf4}
.pin-top span{font-size:.7rem;margin-left:auto}
.pin-tx{font-size:.85rem;color:#b9bbcc;line-height:1.4}
.pins-empty{text-align:center;padding:28px 16px;display:flex;flex-direction:column;align-items:center;gap:8px}
.pins-empty svg{opacity:.4}
.srch-in{display:flex;align-items:center;gap:9px;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.08);color:#9799ae}
.srch-in input{flex:1;background:none;border:0;outline:none;color:#fff;font-size:.95rem}
.cmdk-wrap{position:fixed;inset:0;z-index:210;display:flex;justify-content:center;align-items:flex-start;padding-top:12vh;animation:popfade .18s var(--ease)}
.cmdk{width:min(600px,92vw);border:1px solid rgba(255,255,255,.1);border-radius:20px;overflow:hidden;animation:cmdkin .22s var(--spring)}
@keyframes cmdkin{from{opacity:0;transform:translateY(-14px) scale(.98)}to{opacity:1;transform:none}}
.cmdk-in{display:flex;align-items:center;gap:12px;padding:17px 20px;border-bottom:1px solid rgba(255,255,255,.08)}
.cmdk-in input{flex:1;background:none;border:0;outline:none;color:#fff;font-size:1.12rem}
.cmdk-res{max-height:44vh;overflow-y:auto;padding:8px}
.cmdk-row{display:flex;align-items:center;gap:12px;padding:10px 12px;cursor:pointer;color:#c4c6d7}
.cmdk-row.sel{background:linear-gradient(100deg,rgba(47,214,166,.18),rgba(123,108,255,.18));color:#fff}
.cmk-ic{width:34px;height:34px;display:grid;place-items:center;font-size:16px;color:#fff;flex:0 0 auto}
.cmk-ic.mono{background:rgba(255,255,255,.08);font-weight:700}
.cmk-ic.act{background:rgba(255,255,255,.08);color:#2fd6a6}
.cmk-l{flex:1;min-width:0}
.cmk-n{font-weight:600;font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmk-s{font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmk-t{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;flex:0 0 auto}
.cmdk-empty{padding:30px;text-align:center}
.cmdk-foot{display:flex;gap:16px;padding:11px 18px;border-top:1px solid rgba(255,255,255,.08);font-size:.72rem}
.cmdk-foot span{display:flex;align-items:center;gap:5px}
.chan-comp{position:relative}
.reply-banner{display:flex;align-items:center;justify-content:space-between;background:var(--chip);border:1px solid var(--glass-brd-2);padding:9px 14px;margin-bottom:8px;font-size:.85rem;color:var(--ink-mut)}
.rb-l{display:flex;align-items:center;gap:7px}
.rb-l svg{opacity:.7}
.rb-x{width:26px;height:26px;display:grid;place-items:center;color:var(--ink-mut)}
.rb-x:hover{background:rgba(255,255,255,.08);color:var(--ink)}
.mention-box{position:absolute;left:0;right:0;bottom:calc(100% + 8px);background:rgba(23,23,33,.97);border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 50px -16px rgba(0,0,0,.8);padding:7px;z-index:20;animation:popfade .14s var(--ease)}
.mb-h{padding:6px 10px 5px}
.mb-row{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;color:#d6d8e6;font-weight:600;font-size:.92rem}
.mb-row:hover,.mb-row.sel{background:linear-gradient(100deg,rgba(47,214,166,.16),rgba(123,108,255,.16));color:#fff}
.srv-jump{display:flex;align-items:center;gap:9px;width:calc(100% - 20px);margin:0 10px 4px;padding:9px 12px;border-radius:12px;font-weight:600;font-size:.85rem}
.srv-jump span{flex:1;text-align:left}
.srv-jump svg{opacity:.7}
.edited{font-size:.66rem;color:var(--ink-dim);margin-left:6px}
.edit-box{margin-top:2px}
.edit-ta{width:100%;background:var(--field);border:1px solid var(--glass-brd);padding:10px 12px;color:var(--ink);font-size:1rem;font-family:inherit;line-height:1.45;resize:none;outline:none}
.edit-hint{font-size:.72rem;color:var(--ink-mut);margin-top:5px}
.lnk{color:var(--teal-b);font-weight:600}
.c-msg.flash{animation:flashmsg 1.5s var(--ease)}
@keyframes flashmsg{0%,100%{background:transparent}18%{background:rgba(47,214,166,.15)}}
.xp-card{display:flex;align-items:center;gap:15px;border-radius:var(--r-md);padding:15px 17px;margin:16px 0 6px;cursor:pointer;border:1px solid var(--glass-brd)}
.xp-card2{display:flex;align-items:center;gap:16px}
.xp-ring{flex:0 0 auto;border-radius:50%;display:grid;place-items:center}
.xp-ring::before{content:"";position:absolute;border-radius:50%}
.xp-ring span{font-weight:800;font-size:.82rem;color:var(--ink)}
.xp-i{flex:1;min-width:0}
.xp-top{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.xp-top b{font-weight:700;color:var(--ink);font-size:1rem}
.xp-top span{font-size:.82rem;color:var(--ink-mut);font-weight:600;white-space:nowrap}
.xp-bar{height:9px;border-radius:6px;background:var(--field);margin:8px 0 6px;overflow:hidden}
.xp-bar i{display:block;height:100%;border-radius:6px;background:var(--grad);box-shadow:var(--glow-teal)}
.xp-sub{font-size:.8rem;color:var(--ink-mut)}
.ev-row{display:flex;gap:14px;overflow-x:auto;padding-bottom:6px;margin:0 -4px;scrollbar-width:none}
.ev-row::-webkit-scrollbar{display:none}
.ev-card{flex:0 0 240px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--glass-brd);cursor:pointer}
.ev-card:first-child{margin-left:4px}
.ev-top{height:74px;display:grid;place-items:center;font-size:32px;position:relative}
.ev-live{position:absolute;top:8px;right:8px;color:#fff;font-size:.64rem;font-weight:800;padding:3px 8px;border-radius:20px;letter-spacing:.04em}
.ev-b{padding:12px 14px}
.ev-type{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--teal)}
.ev-t{font-weight:700;color:var(--ink);font-size:1rem;margin:3px 0 2px;line-height:1.25}
.ev-m{font-size:.8rem;color:var(--ink-mut)}
.ev-going{font-size:.76rem;color:var(--ink-dim);margin-top:7px;font-weight:600}
.ach-grid{display:grid;gap:12px}
.ach{padding:15px 13px;text-align:center;background:var(--glass);border:1px solid var(--glass-brd)}
.ach-ic{width:48px;height:48px;margin:0 auto 8px;border-radius:14px;display:grid;place-items:center;font-size:24px;background:var(--chip)}
.ach.got .ach-ic{background:var(--grad-soft);box-shadow:0 0 20px -6px rgba(47,214,166,.5)}
.ach-n{color:var(--ink)}
.ach-d{color:var(--ink-mut);margin-top:3px}
.remind-banner{display:flex;align-items:center;gap:13px;padding:13px 16px;margin-bottom:16px;background:var(--grad-soft);border:1px solid rgba(47,214,166,.3);color:var(--ink)}
.remind-banner.amber{background:linear-gradient(120deg,rgba(245,183,78,.16),rgba(255,143,107,.16))}
.remind-banner svg{color:var(--teal)}
.remind-banner .rbi b{display:block;font-weight:700}
.remind-banner .rbi span{font-size:.84rem;color:var(--ink-mut)}
.auto-day{font-size:.72rem;color:var(--ink-dim);font-weight:600}
.g-timeline{display:flex;gap:10px;overflow-x:auto;padding:14px 0 4px;scrollbar-width:none}
.g-timeline::-webkit-scrollbar{display:none}
.tl-item{flex:0 0 auto;text-align:center;cursor:pointer}
.tl-dot{width:44px;height:44px;display:grid;place-items:center;font-size:20px;box-shadow:var(--sh-soft)}
.tl-dot.addd{background:var(--chip);color:var(--teal);border:1px dashed var(--glass-brd-2)}
.tl-day{font-size:.68rem;color:var(--ink-mut);margin-top:4px;font-weight:600}
.stat3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:16px}
.st3{background:var(--glass);border:1px solid var(--glass-brd);text-align:center}
.st3 .v{color:var(--ink)}
.st3 .v.grad{-webkit-background-clip:text;background-clip:text}
.st3 .l{color:var(--ink-mut);margin-top:2px}
.ygraph{display:flex;align-items:flex-end;gap:12px;padding:12px 4px 0}
.yb{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;height:100%}
.yb-track{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center}
.yb-bar{min-height:8px;position:relative;box-shadow:var(--sh-soft)}
.yb-bar span{position:absolute;left:0;right:0;text-align:center;font-size:.72rem;font-weight:700;color:var(--ink)}
.genpill{font-size:.7rem;font-weight:800;background:var(--grad);color:#fff;padding:2px 8px;border-radius:20px;vertical-align:middle}
.lineage{margin-top:14px;display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.ln-node{background:var(--chip);border:1px solid var(--glass-brd-2);padding:8px 13px;font-size:.88rem;font-weight:600;color:var(--ink)}
.ln-node.muted{color:var(--ink-mut);font-style:italic}
.ln-arrow{color:var(--ink-dim);margin-left:22px;line-height:.6}
.labtabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.labtabs::-webkit-scrollbar{display:none}
.labtab{flex:0 0 auto;padding:10px 16px;font-weight:700;font-size:.92rem;color:var(--ink-mut);background:var(--glass);border:1px solid var(--glass-brd-2)}
.labtab:hover{color:var(--ink)}
.labtab.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:var(--glow-teal)}
.lab-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.lab-h-t{font-family:"Space Grotesk";font-weight:600;font-size:1.2rem;color:var(--ink)}
.lab-h-s{font-size:.86rem;color:var(--ink-mut)}
.lab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.lab-search{display:flex;align-items:center;gap:10px;background:var(--field);border:1px solid var(--glass-brd-2);margin-bottom:14px;color:var(--ink-mut)}
.lab-search input{flex:1;background:none;border:0;outline:none;color:var(--ink);font-size:1rem}
.tek-card{display:flex;align-items:center;gap:13px;background:var(--glass);border:1px solid var(--glass-brd);padding:14px;margin-bottom:11px;cursor:pointer}
.tek-ic{width:44px;height:44px;background:var(--grad-soft);display:grid;place-items:center;color:var(--teal);flex:0 0 auto}
.tek-info{flex:1;min-width:0}
.tek-title{font-weight:700;color:var(--ink);font-size:1rem}
.tek-meta{font-size:.8rem;color:var(--ink-mut);margin-top:2px}
.tek-cat{font-weight:700;color:var(--violet)}
.tek-rate{text-align:right;flex:0 0 auto}
.tek-rate .stars{display:block;position:relative;font-size:.8rem;color:var(--glass-brd);line-height:1}
.tek-rate .stars i{position:absolute;left:0;top:0;overflow:hidden;white-space:nowrap}
.tek-rate b{color:var(--ink);font-size:.9rem}
.tek-rate .tv{font-size:.72rem;color:var(--ink-dim);display:block}
.tek-steps{margin:0 0 16px;padding-left:20px;color:var(--ink-soft)}
.tek-steps li{margin:7px 0;line-height:1.45}
.tek-rate-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-top:1px solid var(--hair)}
.rate-stars button{font-size:24px;color:var(--glass-brd);transition:.1s}
.rate-stars{direction:rtl}
.contam-drop{display:flex;align-items:center;gap:16px;width:100%;text-align:left;padding:22px;border-radius:18px;border:2px dashed var(--glass-brd);background:var(--glass);color:var(--teal);transition:.15s;margin-bottom:16px}
.contam-drop:hover{background:var(--grad-soft);border-color:var(--teal)}
.contam-drop .cd-t b{display:block;color:var(--ink);font-size:1.05rem}
.contam-drop .cd-t span{font-size:.86rem;color:var(--ink-mut)}
.ai-card{overflow:hidden;background:var(--glass);border:1px solid var(--glass-brd)}
.ai-photo{height:150px;background-size:cover;display:grid;place-items:center;font-size:52px;position:relative}
.ai-tag{position:absolute;top:12px;left:12px;color:#fff;font-size:.76rem;font-weight:700;padding:5px 11px;border-radius:20px}
.ai-body{padding:16px 18px}
.ai-h{font-weight:700;color:var(--ink);margin-bottom:12px}
.ai-row{margin-bottom:14px}
.ai-row-h{display:flex;justify-content:space-between;font-size:.92rem}
.ai-row-h b{font-weight:700}
.ai-bar{height:8px;border-radius:5px;background:var(--field);margin:6px 0 5px;overflow:hidden}
.ai-bar i{display:block;height:100%;border-radius:5px}
.ai-tip{font-size:.82rem;color:var(--ink-mut);line-height:1.4}
.ai-verify{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--hair);margin-top:6px}
.ai-verify>span{font-weight:700;color:var(--ink);font-size:.9rem}
.vbtns{display:flex;gap:8px}
.ai-note{font-size:.78rem;color:var(--ink-mut);background:var(--chip);padding:9px 12px}
.scope-card{overflow:hidden;background:var(--glass);border:1px solid var(--glass-brd)}
.scope-img{height:120px;background-size:cover;display:grid;place-items:center;font-size:40px}
.scope-b{padding:11px 13px}
.scope-l{font-weight:700;color:var(--ink);font-size:.92rem}
.scope-by{font-size:.76rem;color:var(--ink-mut);margin-top:2px}
.inv-list{display:flex;flex-direction:column;gap:10px}
.inv-ic{width:42px;height:42px;background:var(--chip);display:grid;place-items:center;font-size:20px;flex:0 0 auto}
.inv-i{flex:1;min-width:0}
.inv-n{color:var(--ink)}
.inv-c{font-size:.78rem;color:var(--ink-mut)}
.inv-qty{display:flex;align-items:center;gap:10px}
.qbtn{display:grid;place-items:center;background:var(--chip);color:var(--ink)}
.qbtn:hover{background:var(--field)}
.inv-qty .qn{font-weight:800;color:var(--ink);min-width:38px;text-align:center}
.inv-qty .qn small{display:block;font-size:.64rem;color:var(--ink-mut);font-weight:600}
.mk-card{overflow:hidden;background:var(--glass);border:1px solid var(--glass-brd);cursor:pointer}
.mk-img{height:120px;background-size:cover;display:grid;place-items:center;font-size:42px;position:relative}
.mk-verif{position:absolute;top:8px;right:8px;display:inline-flex;align-items:center;gap:4px;background:rgba(47,214,166,.92);color:#04140d;font-size:.66rem;font-weight:800;padding:3px 8px;border-radius:20px}
.mk-verif.pt{background:rgba(154,123,255,.95);color:#fff}
.mk-b{padding:12px 14px}
.mk-name{font-weight:700;color:var(--ink);font-size:.98rem}
.mk-vendor{display:flex;align-items:center;gap:7px;font-size:.82rem;color:var(--ink-mut);margin-top:6px}
.mk-foot{display:flex;align-items:center;justify-content:space-between;margin-top:9px}
.mk-price{font-weight:800;color:var(--ink);font-size:1.05rem}
.mk-rate{font-size:.82rem;color:var(--ink-mut);display:flex;align-items:center;gap:4px}
.mk-rep{margin-top:9px}
.mk-rep-bar{height:5px;border-radius:4px;background:var(--field);overflow:hidden}
.mk-rep-bar i{display:block;height:100%;background:var(--grad);border-radius:4px}
.mk-rep>span{font-size:.72rem;color:var(--ink-mut);margin-top:4px;display:block}
.chn.special .ci{color:var(--violet-b)}
.chn.on.special .ci{color:var(--teal)}
.chn .clock{margin-left:auto;color:var(--ink-dim);display:grid}
.ptverif{font-size:.8rem}
.modbadge{font-size:.66rem;font-weight:800;color:#fff;padding:1px 7px;border-radius:20px;vertical-align:middle}
.pt-panel{max-width:680px}
.pt-hero{display:flex;align-items:center;gap:15px;padding:20px;border-radius:18px;margin-bottom:18px;background:var(--g);color:#fff;box-shadow:var(--sh-card);position:relative;overflow:hidden}
.pt-hero::after{content:"";position:absolute;right:-20px;top:-20px;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.28),transparent 65%)}
.pt-hero>svg{position:relative;flex:0 0 auto}
.pt-hero-t{font-family:"Space Grotesk";font-weight:600;font-size:1.35rem;position:relative}
.pt-hero-s{opacity:.92;font-size:.9rem;position:relative}
.pt-lock-note,.pt-unlocked{display:flex;align-items:center;gap:9px;padding:12px 15px;border-radius:13px;font-weight:600;font-size:.92rem;margin-bottom:16px}
.pt-lock-note{background:var(--chip);color:var(--ink-mut)}
.pt-unlocked{background:var(--grad-soft);color:var(--ink)}
.pt-perks{display:flex;flex-direction:column;gap:9px;margin-bottom:16px}
.pt-perk{display:flex;align-items:center;gap:11px;color:var(--ink-soft);font-size:.95rem}
.pt-perk svg{color:var(--teal);flex:0 0 auto}
.pt-locked-chans{background:var(--chip);padding:8px;margin-bottom:16px}
.lc-row{display:flex;align-items:center;gap:9px;padding:9px 11px;color:var(--ink-mut);font-weight:600}
.lc-row.open{color:var(--ink)}
.lc-row .ci{display:grid}
.raffle{display:flex;align-items:center;gap:14px;background:var(--glass);border:1px solid var(--glass-brd);padding:14px;margin-bottom:12px}
.raffle.done{opacity:.65}
.raffle-ic{width:52px;height:52px;display:grid;place-items:center;font-size:26px;flex:0 0 auto;box-shadow:var(--sh-soft)}
.raffle-b{flex:1;min-width:0}
.raffle-t{font-weight:700;color:var(--ink)}
.raffle-m{font-size:.82rem;color:var(--ink-mut);margin-top:2px}
.raffle-mine{font-size:.8rem;color:var(--teal);font-weight:700;margin-top:4px}
.raffle-badge{font-size:.72rem;font-weight:800;color:var(--ink-mut);background:var(--chip);padding:6px 12px;border-radius:20px}
.mag-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.mag-card{overflow:hidden;background:var(--glass);border:1px solid var(--glass-brd);cursor:pointer}
.mag-cover{height:150px;background-size:cover;display:grid;place-items:center;font-size:52px;position:relative}
.mag-issue{position:absolute;bottom:10px;left:12px;color:#fff;font-weight:800;font-size:.82rem;padding:4px 10px;border-radius:20px}
.mag-b{padding:13px 15px}
.mag-tag{font-weight:700;color:var(--ink);margin-bottom:8px}
.mag-b ul{margin:0;padding-left:17px;color:var(--ink-mut);font-size:.84rem}
.mag-b li{margin:4px 0}
.ep-row{display:flex;align-items:center;gap:14px;background:var(--glass);border:1px solid var(--glass-brd);padding:13px 15px;margin-bottom:11px}
.ep-ic{width:46px;height:46px;background:var(--grad-soft);display:grid;place-items:center;font-size:22px;flex:0 0 auto}
.ep-b{flex:1;min-width:0}
.ep-t{font-weight:700;color:var(--ink)}
.ep-m{font-size:.82rem;color:var(--ink-mut);margin-top:2px}
@media (max-width:820px){
  .stat3{gap:8px}
  .lab-grid,.mag-grid{grid-template-columns:1fr 1fr}
  .ach-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:480px){
  .lab-grid,.mag-grid,.ach-grid{grid-template-columns:1fr}
}
.theme-fab{position:fixed;top:16px;right:18px;z-index:55;display:grid;place-items:center;color:#fff;background:var(--grad);border:1px solid rgba(255,255,255,.35)}
.theme-fab:hover{transform:rotate(-15deg) scale(1.08);filter:brightness(1.06);box-shadow:var(--glow-violet)}
.theme-fab svg{filter:drop-shadow(0 1px 2px rgba(0,0,0,.25))}
.theme-fab:active{transform:scale(.9)}
.ch-back{display:none;place-items:center;color:var(--ink-soft)}
.ch-back:hover{background:var(--chip);color:var(--ink)}
@media (max-width:720px){
  .theme-fab{top:12px;right:12px}
}
.mono{font-family:"Space Grotesk",Inter,sans-serif;font-weight:700;letter-spacing:-.02em;color:#fff;line-height:1;position:relative;z-index:1}
.av .mono{text-shadow:0 1px 2px rgba(0,0,0,.28)}
.ge .mono{font-size:1.35rem;text-shadow:0 1px 2px rgba(0,0,0,.22)}
.srail-ic .mono{font-size:1.08rem;text-shadow:0 1px 2px rgba(0,0,0,.24)}
.ppop-av .mono{font-size:2rem;text-shadow:0 2px 4px rgba(0,0,0,.26)}
.cmk-ic .mono{font-size:.86rem;text-shadow:0 1px 2px rgba(0,0,0,.2)}
.vg .mono{text-shadow:0 2px 4px rgba(0,0,0,.25)}
.ph-ic{display:grid;place-items:center;color:rgba(255,255,255,.95)}
.ph-ic svg{filter:drop-shadow(0 2px 6px rgba(0,0,0,.22));stroke-width:1.7}
.ev-top{color:#fff}
.ev-top svg{filter:drop-shadow(0 2px 5px rgba(0,0,0,.22))}
.ach-ic{color:var(--teal)}
.ep-ic{color:var(--teal)}
.inv-ic{color:var(--ink-soft)}
.vd .ve{color:var(--ink-soft)}
.wrap{animation:none}
.wrap>*{animation:rise .5s var(--ease) both}
@keyframes rise{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:none}}
#screen,.scroll,.chan-body,.mem-scroll,.emoji-body,.cmdk-res{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.scroll::-webkit-scrollbar-thumb:hover{background:rgba(150,150,175,.42)}
#app.server-mode .inv-ic{color:var(--ink-soft)}
@media (prefers-reduced-motion:reduce){
  .wrap>*{animation:none}
  *{scroll-behavior:auto !important}
}
.msg-title-row{margin-bottom:15px}
.msg-title{color:var(--on-amb)}
.msg-actions{display:flex;align-items:stretch;margin-bottom:20px}
.msg-ibtn{display:grid;place-items:center;color:var(--ink);border:1px solid var(--glass-brd)}
.msg-ibtn:active{transform:scale(.92)}
.msg-ibtn.accent{border-color:transparent}
.msg-ibtn.accent:hover{box-shadow:var(--glow-violet)}
.msg-add{display:flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:.98rem;border:1px solid var(--glass-brd)}
.msg-add:active{transform:scale(.98)}
.dm-list{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--glass-brd);box-shadow:var(--sh-card)}
.dm-row{display:flex;align-items:center;gap:13px;width:100%;text-align:left;position:relative;border-bottom:1px solid var(--hair)}
.dm-row:last-child{border-bottom:0}
.dm-row:hover{background:var(--hover)}
.dm-row:active{background:var(--active)}
.dm-av{flex:0 0 auto}
.dm-main{flex:1;min-width:0}
.dm-l1{display:flex;align-items:center;gap:7px}
.dm-name{color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60%}
.dm-badge{display:inline-flex;align-items:center;justify-content:center;width:19px;height:19px;border-radius:6px;border:1px solid;flex:0 0 auto}
.dm-time{margin-left:auto;color:var(--ink-dim);flex:0 0 auto;white-space:nowrap}
.dm-prev{color:var(--ink-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
.dm-unread{width:9px;height:9px;border-radius:50%;background:var(--grad);flex:0 0 auto;margin-left:2px}
.dm-row.unread::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:24px;border-radius:0 4px 4px 0;background:var(--grad);box-shadow:var(--glow-teal)}
.dm-row.unread .dm-name{color:var(--ink)}
.dm-row.unread .dm-prev{color:var(--ink);font-weight:600}
.nm-list{border-radius:var(--r-md);overflow:hidden;background:var(--field);border:1px solid var(--glass-brd-2);max-height:52vh;overflow-y:auto}
.nm-list .dm-row{border-color:var(--hair)}
.dm-add-chip{width:34px;height:34px;display:grid;place-items:center;color:var(--teal);background:var(--chip);flex:0 0 auto}

/* ------------------------------------------------------------------ design.css */
:root{--d-instant:90ms;--d-quick:140ms;--d-pop:220ms;--d-move:320ms;--d-tell:480ms;--e-out:cubic-bezier(.22,1,.36,1);--e-in:cubic-bezier(.5,0,.9,.3);--e-sheet:var(--ease);--e-spring:var(--spring);--blur-hi:22px;--blur-mid:12px;--blur-none:0px;--fx:saturate(1.55) brightness(1.02);--scale:1;--hit-min:max(44px, calc(44px * var(--scale)));--ctl-md:max(var(--hit-min), calc(46px * var(--scale)));--ctl-lg:max(var(--hit-min), calc(48px * var(--scale)));--ic-sm:calc(16px * var(--scale));--ic-md:calc(20px * var(--scale));--ic-lg:calc(24px * var(--scale));--ic-xl:calc(28px * var(--scale));--gap-1:calc(4px * var(--scale));--gap-2:calc(8px * var(--scale));--gap-3:calc(12px * var(--scale));--gap-4:calc(16px * var(--scale));--gap-5:calc(20px * var(--scale));--ring-w:2px;--ring-off:-3px;--ring:#085f49;--ring-grad:#141628;--glass-flat:rgba(255,255,255,.82);--glass-strong-flat:rgba(255,255,255,.92);--surf-solid:rgba(255,255,255,.92);--surf-inset:rgba(24,26,48,.055);--hover:rgba(24,26,50,.05);--active:rgba(24,26,50,.09);--grad-soft:linear-gradient(135deg,rgba(47,214,166,.18),rgba(123,108,255,.18));--ok-fg:#0d9a74;--ok-bg:rgba(18,185,138,.12);--ok-line:rgba(18,185,138,.34);--warn-fg:#c9821f;--warn-bg:rgba(240,166,62,.13);--warn-line:rgba(240,166,62,.36);--danger-fg:#cf3752;--danger-bg:rgba(240,80,110,.12);--danger-line:rgba(240,80,110,.36);--info-fg:#2f93c6;--info-bg:rgba(63,182,240,.12);--info-line:rgba(63,182,240,.34);--ok-solid:#37d39a;--warn-solid:#f5b74e;--danger-solid:#cf3752;--info-solid:#3fb6f0}
body[data-mode="day"]{--hover:rgba(24,26,50,.045);--active:rgba(24,26,50,.085);--grad-soft:linear-gradient(135deg,rgba(47,214,166,.2),rgba(123,108,255,.2));--glass-flat:rgba(255,255,255,.88);--glass-strong-flat:rgba(255,255,255,.96);--surf-solid:#ffffff;--surf-inset:rgba(24,26,48,.05);--ring:#0a7a5d}
body[data-mode="night"]{--hover:rgba(255,255,255,.055);--active:rgba(255,255,255,.09);--grad-soft:linear-gradient(135deg,rgba(47,214,166,.24),rgba(123,108,255,.24));--glass-flat:rgba(38,40,68,.74);--glass-strong-flat:rgba(46,48,80,.86);--surf-solid:#1c1e34;--surf-inset:rgba(255,255,255,.055);--ring:#3fe0af;--fx:saturate(1.55);--ok-fg:#3fe0af;--warn-fg:#ffc470;--danger-fg:#ff8497;--info-fg:#7fd3f7}
.pop,
.cmdk,
.day-pop,
.mention-box,
.day-pill,
body[data-mode="night"] #app.server-mode{--hover:rgba(255,255,255,.055);--active:rgba(255,255,255,.09);--surf-solid:#1c1e34;--surf-inset:rgba(255,255,255,.055);--glass-flat:rgba(38,40,68,.74);--glass-strong-flat:rgba(46,48,80,.86);--ring:#3fe0af;--ok-fg:#3fe0af;--warn-fg:#ffc470;--danger-fg:#ff8497;--info-fg:#7fd3f7}
body[data-mode="night"] #app.server-mode{--hover:rgba(255,255,255,.055);--active:rgba(255,255,255,.09)}
body[data-text="s"]{--scale:.91}
body[data-text="m"]{--scale:1}
body[data-text="l"]{--scale:1.12}
body[data-text="xl"]{--scale:1.24}
.nav-item{min-height:var(--hit-min);gap:var(--gap-3);padding:calc(13px * var(--scale)) calc(14px * var(--scale))}
.nav-item .ic{width:calc(26px * var(--scale));height:calc(26px * var(--scale));flex:0 0 calc(26px * var(--scale))}
.nav-item .ic svg{width:calc(25px * var(--scale));height:calc(25px * var(--scale))}
.nav-item .badge{border-radius:999px}
.nav-me{min-height:var(--hit-min);gap:var(--gap-3)}
.btn{min-height:var(--hit-min);gap:calc(9px * var(--scale));padding:calc(14px * var(--scale)) calc(20px * var(--scale))}
.btn-lg{padding:calc(17px * var(--scale)) calc(26px * var(--scale))}
.btn-ghost{padding:calc(10px * var(--scale)) calc(14px * var(--scale))}
.back-btn{width:var(--ctl-md);height:var(--ctl-md)}
.theme-fab{width:var(--ctl-md);height:var(--ctl-md)}
.msg-ibtn{width:var(--ctl-md);height:var(--ctl-md);flex:0 0 var(--ctl-md)}
.msg-add{min-height:var(--ctl-md)}
.msg-actions{gap:var(--gap-3)}
.tiles{gap:calc(14px * var(--scale))}
.tile{min-height:calc(120px * var(--scale));gap:calc(11px * var(--scale))}
.tile .tic{width:calc(50px * var(--scale));height:calc(50px * var(--scale))}
.tile .tic svg{width:calc(26px * var(--scale));height:calc(26px * var(--scale))}
.dm-row{min-height:var(--hit-min)}
.set-row{min-height:var(--hit-min);gap:var(--gap-4)}
.set-row .sic{width:calc(40px * var(--scale));height:calc(40px * var(--scale));flex:0 0 calc(40px * var(--scale))}
.set-row .sic svg{width:var(--ic-md);height:var(--ic-md)}
.chn{min-height:var(--hit-min)}
.mem{min-height:var(--hit-min)}
.vu{min-height:calc(34px * var(--scale))}
.g-actions{gap:calc(10px * var(--scale))}
.chips{gap:var(--gap-2)}
.seg button{min-height:var(--hit-min);padding:calc(11px * var(--scale))}
.segc button{min-height:var(--hit-min);min-width:var(--hit-min);padding:calc(9px * var(--scale)) calc(14px * var(--scale))}
.pick button{min-height:var(--hit-min);padding:calc(11px * var(--scale)) calc(15px * var(--scale))}
.tog{--tog-h:max(32px, calc(32px * var(--scale)));width:calc(54px * var(--scale));height:var(--tog-h)}
.tog::after{width:calc(24px * var(--scale));height:calc(24px * var(--scale));top:calc(3px * var(--scale));left:calc(3px * var(--scale))}
.tog.on::after{left:calc(27px * var(--scale))}
.tog::before{content:"";position:absolute;inset:calc((var(--tog-h) - var(--hit-min)) / 2) 0}
.field input,.field select{min-height:var(--hit-min);padding:calc(14px * var(--scale)) calc(16px * var(--scale))}
.lab-search{min-height:var(--hit-min);padding:calc(12px * var(--scale)) calc(15px * var(--scale))}
.comp-inner .add,.comp-send{width:var(--ctl-lg);height:var(--ctl-lg);flex:0 0 var(--ctl-lg)}
.comp-inner textarea{padding:calc(14px * var(--scale)) calc(4px * var(--scale))}
.edit-ta{min-height:var(--hit-min)}
.sheet-x{width:var(--hit-min);height:var(--hit-min)}
.cha,.cbtn,.ch-ham,.ch-back{width:var(--hit-min);height:var(--hit-min)}
.cbtn{flex:0 0 var(--hit-min)}
.ch-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qbtn{width:var(--hit-min);height:var(--hit-min)}
.rb-x{position:relative}
.rb-x::after{content:"";position:absolute;inset:calc((26px - 44px) / 2)}
.emoji-pop{width:min(92vw, calc(372px * var(--scale)))}
.emoji-btn{min-height:var(--hit-min)}
.menu-item,.cmdk-row,.mb-row,.pin-row,.day-pop button{min-height:var(--hit-min)}
@media (pointer:coarse){
  .c-tools button{width:var(--hit-min);height:var(--hit-min)}
}
@media (max-width:820px){
  .nav-item{min-height:var(--hit-min)}
  .nav-item .ic{width:calc(28px * var(--scale));height:calc(28px * var(--scale));flex:0 0 calc(28px * var(--scale))}
  #screen{padding-bottom:calc(96px * var(--scale) + env(safe-area-inset-bottom,0px))}
  .tiles{gap:calc(11px * var(--scale))}
}
@media (max-width:720px){
  .theme-fab{width:var(--hit-min);height:var(--hit-min)}
}
.sheet,
.pop,
.cmdk,
.day-pop,
.mention-box,
.toast{backdrop-filter:blur(var(--blur-hi)) var(--fx);-webkit-backdrop-filter:blur(var(--blur-hi)) var(--fx)}
#nav,
.comp-inner,
.srv-rail,
.srv-side,
.srv-main,
.srv-members{backdrop-filter:blur(var(--blur-mid)) var(--fx);-webkit-backdrop-filter:blur(var(--blur-mid)) var(--fx)}
.glass,.card,.tile,.grow,.gcard,.feed,.set,.dm-list,.xp-card,.ev-card,
.back-btn,.msg-ibtn,.msg-add,.prof .pbody,.ghero .gbody{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--glass-flat)}
.btn-glass,.bub.them,.c-tools{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--glass-strong-flat)}
.grow .photo .who,.strain .sd,.pp-badges,.ai-tag,.mag-issue{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(0,0,0,.42)}
.day-pill{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(15,15,23,.9)}
.sheet-wrap{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(10,10,18,.62)}
.cmdk-wrap{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(6,6,10,.66)}
:is(#nav,.comp-inner,.srv-rail,.srv-side,.srv-main,.srv-members,.sheet,.pop,
    .cmdk,.day-pop,.mention-box,.toast,.card,.tile,.grow,.gcard,.feed,.set,
    .dm-list,.xp-card,.ev-card,.ai-card,.mk-card,.mag-card,.scope-card,.strain,
    .prof .pbody,.ghero .gbody)
:is(.glass,.card,.tile,.grow,.gcard,.feed,.set,.dm-list,.xp-card,.ev-card,
    .btn-glass,.strain,.ach,.st3,.tek-card,.inv-row,.mk-card,.scope-card,
    .raffle,.ep-row,.mag-card,.ai-card,.bub.them,.msg-ibtn,.msg-add,.c-tools){backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--surf-solid)}
:is(.card,.sheet,.pop,.srv-main) :is(.msg-ibtn.accent){background:var(--grad)}
#grain{display:none}
#ambient{contain:layout paint style}
#ambient::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none}
.nav-item,.nav-item .ic,.nav-me,.chn,.mem,.vu,.cha,.cbtn,.qbtn,.sheet-x,
.menu-item,.cmdk-row,.mb-row,.pin-row,.day-pop button,.dm-row,.srv-jump,
.c-react,.seg button,.segc button,.pick button,.labtab,.comp-inner .add{transition:background var(--d-instant) var(--e-out),
             color var(--d-instant) var(--e-out),
             border-color var(--d-instant) var(--e-out)}
.tog{transition:background var(--d-quick) var(--e-out)}
.tog::after{transition:left var(--d-pop) var(--e-spring)}
.gbar i,.xp-bar i,.yb-bar{transition:width var(--d-tell) var(--e-out),height var(--d-tell) var(--e-out)}
.sheet{animation-duration:var(--d-move);animation-timing-function:var(--e-sheet)}
.sheet-wrap,.cmdk-wrap,.pop,.day-pop,.mention-box{animation-duration:var(--d-pop);animation-timing-function:var(--e-out)}
.toast{animation-duration:var(--d-pop);animation-timing-function:var(--e-spring)}
.wrap>*{animation-duration:var(--d-move);animation-timing-function:var(--e-out)}
.wrap>*:nth-child(1){animation-delay:0s}
.wrap>*:nth-child(2){animation-delay:.022s}
.wrap>*:nth-child(3){animation-delay:.044s}
.wrap>*:nth-child(4){animation-delay:.066s}
.wrap>*:nth-child(5){animation-delay:.088s}
.wrap>*:nth-child(6){animation-delay:.11s}
.wrap>*:nth-child(7){animation-delay:.132s}
.wrap>*:nth-child(8){animation-delay:.154s}
.wrap>*:nth-child(n/**/+9){animation-delay:.176s}
body:has(.comp-inner:focus-within) .blob{animation-play-state:paused}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
[contenteditable]:focus-visible{outline:var(--ring-w) solid var(--ring);outline-offset:var(--ring-off)}
.field input:focus-visible,
.field select:focus-visible,
.comp-inner textarea:focus-visible,
.lab-search input:focus-visible,
.srch-in input:focus-visible,
.cmdk-in input:focus-visible,
.edit-ta:focus-visible{outline:var(--ring-w) solid var(--ring);outline-offset:var(--ring-off)}
.gcard:focus-visible,.feed:focus-visible,.vd:focus-visible,.tek-card:focus-visible,
.mk-card:focus-visible,.scope-card:focus-visible,.strain:focus-visible,
.ev-card:focus-visible,.xp-card:focus-visible,.cmdk-row:focus-visible,
.tl-item:focus-visible,.set-row:focus-visible,.c-msg:focus-visible,
.inv-row:focus-visible,.raffle:focus-visible,.ep-row:focus-visible,
.mag-card:focus-visible,.ach:focus-visible{outline:var(--ring-w) solid var(--ring);outline-offset:var(--ring-off)}
.btn-primary:focus-visible,
.comp-send:focus-visible,
.msg-ibtn.accent:focus-visible,
.theme-fab:focus-visible,
.pick button.on:focus-visible,
.chip.on:focus-visible,
.jump-new:focus-visible,
.srail-home:focus-visible,
.tog.on:focus-visible{--ring:var(--ring-grad)}
.flag{display:inline-flex;align-items:center;gap:calc(6px * var(--scale));font-size:.79rem;font-weight:700;line-height:1;padding:calc(4px * var(--scale)) calc(9px * var(--scale));border-radius:999px;border:1px solid transparent;white-space:nowrap}
.flag svg{width:var(--ic-sm);height:var(--ic-sm);flex:0 0 auto}
.flag-ok{color:var(--ok-fg);background:var(--ok-bg);border-color:var(--ok-line)}
.flag-warn{color:var(--warn-fg);background:var(--warn-bg);border-color:var(--warn-line)}
.flag-danger{color:var(--danger-fg);background:var(--danger-bg);border-color:var(--danger-line)}
.flag-info{color:var(--info-fg);background:var(--info-bg);border-color:var(--info-line)}
.vd.safe .vp,.vd.safe .ve{color:var(--ok-fg)}
.vd.watch .vp,.vd.watch .ve{color:var(--warn-fg)}
.vd.toss .vp,.vd.toss .ve{color:var(--danger-fg)}
.ai-row-h b.good{color:var(--ok-fg)}
.ai-row-h b.bad{color:var(--danger-fg)}
.ai-bar i.good{background:var(--ok-fg)}
.ai-bar i.bad{background:var(--danger-fg)}
.live-txt{color:var(--danger-fg)}
.ev-live,.modbadge{background:var(--danger-solid)}
.ep-row.live{border-color:var(--danger-line);box-shadow:0 0 24px -10px var(--danger-line)}
.menu-item.danger{color:var(--danger-fg)}
.menu-item.danger:hover{background:var(--danger-bg)}
.stdot.online{background:var(--ok-solid)}
.stdot.idle{background:var(--warn-solid)}
.stdot.dnd{background:var(--danger-solid)}
.av .on{background:var(--ok-solid)}
.av .on.idle{background:var(--warn-solid)}
.av .on.dnd{background:var(--danger-solid)}
.tek-rate .stars i,.rate-stars button:hover,.rate-stars button:hover~button,.mk-rate svg{color:var(--warn-solid)}
.inv-row.low{border-color:var(--warn-line);box-shadow:inset 3px 0 0 var(--warn-fg)}
.toast .tt{font-weight:600}
.skel{position:relative;overflow:hidden;border-radius:var(--r-sm);background-color:var(--surf-inset);background-image:linear-gradient(90deg,transparent 0,var(--glass-brd-2) 42%,transparent 84%);background-size:220% 100%;background-repeat:no-repeat;animation:skel-in 1ms linear .3s both, skel-shim 1.4s linear .3s infinite}
.skel-line{height:calc(12px * var(--scale));border-radius:999px;margin-bottom:calc(9px * var(--scale))}
.skel-line.wide{width:100%}
.skel-line.half{width:52%}
.skel-line.short{width:28%}
.skel-av{border-radius:50%;width:calc(44px * var(--scale));height:calc(44px * var(--scale));flex:0 0 auto}
.skel-row{display:flex;align-items:center;gap:calc(13px * var(--scale));padding:calc(12px * var(--scale)) calc(15px * var(--scale))}
.skel-row .skel-main{flex:1;min-width:0}
.skel-card{height:calc(120px * var(--scale));border-radius:var(--r-lg)}
@keyframes skel-in{from{opacity:0}to{opacity:1}}
@keyframes skel-shim{from{background-position:-140% 0}to{background-position:240% 0}}
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:calc(10px * var(--scale));padding:calc(34px * var(--scale)) calc(20px * var(--scale))}
.empty-ic{width:calc(64px * var(--scale));height:calc(64px * var(--scale));border-radius:var(--r-md);display:grid;place-items:center;color:var(--teal);background:var(--grad-soft);border:1px solid var(--glass-brd-2);margin-bottom:calc(4px * var(--scale))}
.empty-t{color:var(--ink)}
.empty-s{color:var(--ink-mut);font-size:.95rem;line-height:1.5;max-width:34ch;text-wrap:pretty}
.empty .btn{margin-top:calc(6px * var(--scale))}
.empty-alt{color:var(--ink-soft);font-weight:600;font-size:.9rem;text-decoration:underline;text-underline-offset:3px;min-height:var(--hit-min);display:inline-flex;align-items:center}
.pins-empty,.cmdk-empty,.vempty{color:var(--ink-mut)}
.pins-empty p,.cmdk-empty{text-wrap:pretty}
.field.bad input,.field.bad select{border-color:var(--danger-line)}
.field .err-in{display:block;margin-top:calc(6px * var(--scale));font-size:.79rem;font-weight:600;color:var(--danger-fg);text-wrap:pretty}
.err{display:flex;flex-direction:column;align-items:flex-start;gap:calc(8px * var(--scale));padding:calc(16px * var(--scale)) calc(18px * var(--scale));border-radius:inherit;background:var(--danger-bg);border:1px solid var(--danger-line)}
.err-t{font-weight:700;font-size:1rem;color:var(--ink);text-wrap:balance}
.err-s{font-size:.92rem;line-height:1.5;color:var(--ink-soft);max-width:46ch;text-wrap:pretty}
.err .btn{margin-top:calc(4px * var(--scale))}
.nav-item:active,.chn:active,.mem:active,.vu:active,.menu-item:active,.pin-row:active,
.cmdk-row:active,.mb-row:active,.day-pop button:active,.set-row:active,.srv-jump:active,
.seg button:active,.segc button:active,.pick button:active,.c-react:active,
.sheet-x:active,.cha:active,.cbtn:active,.qbtn:active,.emoji-btn:active{background:var(--active)}
.gcard:active,.feed:active,.grow.tap:active,.xp-card:active,.ev-card:active,.mk-card:active,
.scope-card:active,.strain:active,.tek-card:active,.mag-card:active{transform:scale(.985)}
.nav-item:hover,.chn:hover,.mem:hover,.vu:hover{background:var(--hover)}
[disabled],[aria-disabled="true"]{opacity:.45;cursor:not-allowed;filter:saturate(.45)}
.btn[disabled],.btn[aria-disabled="true"]{box-shadow:none;filter:grayscale(.3) saturate(.45)}
[disabled]:hover,[aria-disabled="true"]:hover{filter:saturate(.45);transform:none;box-shadow:none}
[disabled]:active,[aria-disabled="true"]:active{transform:none;background:none}
.btn[disabled]:active,.btn[aria-disabled="true"]:active{transform:none}
.c-msg:hover{content-visibility:visible}
.mem{content-visibility:auto;contain-intrinsic-size:auto 46px}
.feed{content-visibility:auto;contain-intrinsic-size:auto 88px}
.gcard{content-visibility:auto;contain-intrinsic-size:auto 96px}
.inv-row{content-visibility:auto;contain-intrinsic-size:auto 68px}
.pin-row{content-visibility:auto;contain-intrinsic-size:auto 62px}
.tek-card{content-visibility:auto;contain-intrinsic-size:auto 76px}
.ep-row{content-visibility:auto;contain-intrinsic-size:auto 74px}
.raffle{content-visibility:auto;contain-intrinsic-size:auto 82px}
.mk-card{content-visibility:auto;contain-intrinsic-size:auto 240px}
.mag-card{content-visibility:auto;contain-intrinsic-size:auto 250px}
.strain{content-visibility:auto;contain-intrinsic-size:auto 168px}
.ach{content-visibility:auto;contain-intrinsic-size:auto 132px}
@media (max-width:1000px){
  .srv-side,.srv-members{will-change:transform}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:120ms !important;animation-duration:120ms !important}
  .toast{animation-duration:220ms !important}
  .c-msg.flash{animation-duration:1.5s !important}
  .sheet,.pop,.day-pop,.mention-box,.cmdk,.jump-new,.wrap>*{animation-name:fade}
  .greet .wave,.boot-orb,.typing-b i,.c-typing .tp i{animation:none}
  .btn:active,.tile:active,.back-btn:active,.comp-send:active,.theme-fab:active,
  .msg-ibtn:active,.vd:active,.jump-new:active,.srail-home:active{transform:none}
  .tile:hover,.gcard:hover,.feed:hover,.grow.tap:hover,.xp-card:hover,.ev-card:hover,
  .mk-card:hover,.scope-card:hover,.strain:hover,.tek-card:hover,.mag-card:hover,
  .back-btn:hover,.theme-fab:hover{transform:none}
  .gbar i,.xp-bar i,.yb-bar{transition:none}
}
@media (prefers-contrast:more){
  :root{--ring-w:3px;--ink-mut:#5b5d78;--ink-dim:#6f7290;--hair:rgba(20,22,40,.2);--glass-brd-2:rgba(24,26,50,.22);--glass-flat:rgba(255,255,255,.95);--glass-strong-flat:#ffffff;--surf-solid:#ffffff;--hover:rgba(24,26,50,.09);--active:rgba(24,26,50,.15)}
  body[data-mode="day"]{--ink-mut:#585b78;--ink-dim:#6a6d8a;--hair:rgba(30,32,60,.22)}
  body[data-mode="night"]{--ink-mut:#c3c6e6;--ink-dim:#a6a9cf;--hair:rgba(255,255,255,.24);--glass-brd-2:rgba(255,255,255,.24);--glass-flat:rgba(28,30,52,.96);--glass-strong-flat:#1c1e34;--surf-solid:#161828;--hover:rgba(255,255,255,.12);--active:rgba(255,255,255,.2)}
  .pop,.cmdk,.day-pop,.mention-box,body[data-mode="night"] #app.server-mode{--ink-mut:#c3c6e6;--surf-solid:#161828;--hover:rgba(255,255,255,.12);--active:rgba(255,255,255,.2)}
  #ambient::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(10,10,20,.22),rgba(10,10,20,.06) 30%,rgba(10,10,20,.26));-webkit-mask-image:radial-gradient(120% 90% at 50% 40%,#000 30%,transparent 78%);mask-image:radial-gradient(120% 90% at 50% 40%,#000 30%,transparent 78%)}
  body[data-mode="day"] #ambient::after{background:linear-gradient(180deg,rgba(255,255,255,.34),transparent 35%,rgba(255,255,255,.28))}
  .lnk,.empty-alt{text-decoration:underline;text-underline-offset:3px}
  .card,.tile,.grow,.gcard,.feed,.set,.dm-list,.xp-card,.ev-card,.sheet,.toast{border-width:1.5px}
  .blob{opacity:.3}
}

/* ------------------------------------------------------------------ shell.css */
body[data-mode="day"] #app.server-mode,
body[data-mode="dusk"] #app.server-mode{--glass:rgba(255,255,255,.76);--glass-2:rgba(255,255,255,.6);--glass-strong:rgba(255,255,255,.94);--glass-brd:rgba(24,26,50,.10);--glass-brd-2:rgba(24,26,50,.07);--chip:rgba(24,26,48,.05);--field:rgba(24,26,48,.05);--hair:rgba(24,26,50,.09);--hover:rgba(24,26,50,.05);--active:rgba(24,26,50,.09);--grad-soft:linear-gradient(135deg,rgba(47,214,166,.16),rgba(123,108,255,.16))}
body[data-mode="day"] #app.server-mode #screen,
body[data-mode="dusk"] #app.server-mode #screen{background:transparent}
body[data-mode="day"] #app.server-mode .c-txt,
body[data-mode="dusk"] #app.server-mode .c-txt{color:#25283f}
body[data-mode="day"] #app.server-mode .c-time,
body[data-mode="dusk"] #app.server-mode .c-time{color:#8b8da6}
body[data-mode="day"] #app.server-mode .c-msg:hover,
body[data-mode="dusk"] #app.server-mode .c-msg:hover{background:rgba(24,26,50,.035)}
body[data-mode="day"] #app.server-mode .c-embed,
body[data-mode="dusk"] #app.server-mode .c-embed{background:rgba(24,26,50,.04)}
body[data-mode="day"] #app.server-mode .inv-ic,
body[data-mode="dusk"] #app.server-mode .inv-ic{color:var(--ink-mut)}
#app.server-mode #nav{display:flex}
@media (max-width:1179px){
  #app.server-mode .srv-rail{display:none}
  #app.server-mode .srv-side{display:none}
  #app.server-mode .srv-members{display:none}
  #app.server-mode .srv-scrim{display:none !important}
  #app.server-mode .srv-shell{grid-template-columns:1fr}
  #app.server-mode .ch-ham{display:none}
  .topic-chips{display:flex}
}
@media (min-width:1180px){
  .topic-chips{display:none}
}
@media (min-width:821px){
  #app.server-mode #screen{height:100dvh}
  #app.server-mode .srv-shell{width:100%;max-width:100%}
}
:root{--navbar-h:84px}
@media (min-width:1180px){
  body.in-room #themefab{display:none}
}
@media (min-width:821px) and (max-width:1179px){
  body.in-room #themefab{left:calc(var(--nav-w) + 44px);top:auto;right:auto;bottom:32px}
}
body[data-mode="day"] #app.server-mode .c-name,
body[data-mode="dusk"] #app.server-mode .c-name,
body[data-mode="day"] #app.server-mode .mem .mn,
body[data-mode="dusk"] #app.server-mode .mem .mn{filter:brightness(.58) saturate(1.5)}
.topic-chips{gap:8px;padding:10px 14px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;border-bottom:1px solid var(--hair);flex:0 0 auto}
.topic-chips::-webkit-scrollbar{display:none}
.tchip{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;padding:0 14px;border-radius:999px;background:var(--chip);border:1px solid transparent;color:var(--ink-mut);white-space:nowrap}
.tchip.on{background:var(--grad-soft);border-color:var(--glass-brd);color:var(--ink)}
.tchip.voice{opacity:.85}
.home-top{display:flex;justify-content:space-between;gap:14px}
.today-card{background:var(--glass);border:1px solid var(--glass-brd);border-radius:var(--r-lg);overflow:hidden;margin:6px 0 22px}
.today-h{display:flex;align-items:center;gap:9px}
.today-h svg{color:var(--teal)}
.today-row{display:flex;gap:13px;width:100%;text-align:left;min-height:56px;background:transparent;color:var(--ink)}
.today-row:hover{background:var(--hover)}
.today-row:active{background:var(--active)}
.tr-ic{flex:0 0 40px;width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:var(--grad-soft);color:var(--teal)}
.tr-i{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.tr-i b{font-size:.98rem;font-weight:650}
.tr-i span{font-size:.86rem;color:var(--ink-mut);text-overflow:ellipsis}
.tr-go{color:var(--ink-dim);flex:0 0 auto}
.today-end{border-top:1px solid var(--hair);font-size:.88rem;color:var(--ink-mut)}
.find-btn{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;min-height:44px;padding:0 16px;border-radius:999px;background:var(--glass-2);border:1px solid var(--glass-brd);color:var(--ink-soft);font-weight:600;font-size:.92rem}
.find-btn:hover{background:var(--glass-strong);transform:translateY(-1px)}
.find-btn:active{transform:translateY(0)}
@media (max-width:520px){
  .find-btn span{display:none}
  .find-btn{padding:0;width:44px;justify-content:center}
}
.msg-title-row{display:flex;justify-content:space-between;gap:14px}
.msg-actions .msg-add{flex:0 1 auto}
.msg-actions{flex-wrap:wrap}
.dm-badge.room-tag{width:auto;height:auto;padding:3px 8px;border-radius:999px;font-size:.7rem;font-weight:700;letter-spacing:.03em;gap:4px;flex:0 0 auto}
.dm-l1 .dm-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dm-l1 .dm-time{margin-left:auto;flex:0 0 auto}
.seg.chips{margin-bottom:16px}
.seg button{color:var(--ink-soft)}
.seg button:hover{color:var(--ink);background:var(--hover)}
.seg button.on{font-weight:750}
.room-row .dm-badge.room-tag{color:var(--violet);background:rgba(123,108,255,.13);border-color:rgba(123,108,255,.3)}
.rm-board{display:flex;flex-direction:column;gap:6px;padding-bottom:8px}
.rm-sec{display:flex;flex-direction:column;gap:8px}
.rm-sech{display:flex;align-items:center;gap:6px;padding:14px 2px 2px}
.rm-sect{display:flex;align-items:center;gap:8px;flex:1;min-height:40px;padding:0 6px;border-radius:11px;color:var(--on-amb-mut)}
.rm-sect:hover{background:var(--hover);color:var(--on-amb)}
.rm-sect svg{transition:transform .2s var(--e-out,ease);flex:0 0 auto}
.rm-sec.closed .rm-sect svg{transform:rotate(-90deg)}
.rm-sect small{margin-left:2px;padding:2px 7px;border-radius:999px;background:var(--chip);font-size:.72rem;font-weight:700;letter-spacing:0;color:var(--ink-mut)}
.rm-seca{display:flex;gap:4px;flex:0 0 auto}
.rm-sbtn{display:grid;place-items:center;background:var(--glass-2);border:1px solid var(--glass-brd);color:var(--ink-mut)}
.rm-sbtn:hover{color:var(--ink);background:var(--glass-strong)}
.rm-sbtn.danger:hover{color:#f0506e;border-color:rgba(240,80,110,.4)}
.rm-sec.closed .rm-list{display:none}
.rm-list{display:flex;flex-direction:column;gap:8px;min-height:8px}
.rm-tile{display:flex;align-items:center;gap:13px;border-radius:var(--r-md);background:var(--glass);border:1px solid var(--glass-brd);cursor:pointer;touch-action:pan-y}
.rm-tile:hover{background:var(--glass-strong)}
.rm-grip{display:none;flex:0 0 auto;color:var(--ink-dim);margin-right:-4px;cursor:grab;touch-action:none}
.rm-board.editing .rm-grip{display:block}
.rm-board.editing .rm-tile{touch-action:none;cursor:grab}
.rm-ic{flex:0 0 auto;width:50px;height:50px;display:grid;place-items:center;color:#fff;font-family:"Space Grotesk",Inter,sans-serif;font-weight:700;font-size:1.05rem;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),var(--sh-soft)}
.rm-i{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rm-n{display:flex;align-items:center;gap:7px;color:var(--ink)}
.rm-pt{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:999px;font-size:.66rem;font-weight:800;letter-spacing:.04em;background:rgba(154,140,255,.16);color:#7b6cff;border:1px solid rgba(154,140,255,.34)}
.rm-s{color:var(--ink-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rm-m{display:flex;gap:6px;font-size:.78rem}
.rm-un{border-radius:999px;background:rgba(47,214,166,.16);color:#12b98a;border:1px solid rgba(47,214,166,.3)}
.rm-go{flex:0 0 auto}
.rm-board.editing .rm-go{display:none}
.rm-empty{padding:18px;border-radius:var(--r-md);text-align:center;border:1.5px dashed var(--glass-brd);background:transparent}
.rm-help{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 16px;margin-bottom:14px;border-radius:var(--r-md);background:var(--grad-soft);border:1px solid var(--glass-brd)}
.rm-help>svg{color:var(--teal);flex:0 0 auto}
.rm-help div{flex:1;min-width:180px;display:flex;flex-direction:column;gap:2px}
.rm-help b{font-size:.94rem}
.rm-help span{font-size:.85rem;color:var(--ink-soft);line-height:1.4}
.rm-arrange{width:100%;margin-top:10px;min-height:52px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;gap:9px;border:1.5px dashed var(--glass-brd);color:var(--ink-mut);font-weight:650;font-size:.94rem}
.rm-arrange:hover{color:var(--ink);background:var(--hover);border-style:solid}
.rm-ghost{position:fixed;left:0;top:0;z-index:9999;pointer-events:none;margin:0;box-shadow:var(--sh-lift);transform-origin:0 0;opacity:.96;border-color:var(--teal)}
.rm-dragging{opacity:.32}
.rm-ph{border-radius:var(--r-md);border:1.5px dashed var(--teal);background:rgba(47,214,166,.08)}
body.rm-dnd{user-select:none;-webkit-user-select:none}
body.rm-dnd *{cursor:grabbing !important}
.chan-fab{position:absolute;right:18px;bottom:16px;z-index:8;width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:var(--grad);color:#fff;box-shadow:var(--sh-lift),0 0 0 1px rgba(255,255,255,.14) inset;transition:transform .18s var(--spring)}
.chan-fab:hover{transform:translateY(-2px) scale(1.03)}
.chan-fab:active{transform:translateY(0) scale(.97)}
.jump-new.show~.chan-fab{bottom:78px}
@media (min-width:1180px){
  .chan-fab{display:none}
}
.cs-body{max-height:min(64vh,560px);overflow-y:auto;-webkit-overflow-scrolling:touch}
.cs-cat{padding:18px 4px 8px;color:var(--ink-dim);position:sticky;top:-1px;z-index:2;background:linear-gradient(var(--surf-solid) 72%,rgba(0,0,0,0))}
.cs-cat:first-child{padding-top:2px}
.cs-ch{display:flex;align-items:center;gap:11px;width:100%;text-align:left;min-height:52px;padding:0 14px;margin-bottom:4px;border-radius:14px;background:transparent;color:var(--ink-soft);font-size:1rem;font-weight:600}
.cs-ch:hover{background:var(--hover);color:var(--ink)}
.cs-ch.on{background:var(--grad-soft);color:var(--ink);font-weight:750}
.cs-ic{flex:0 0 auto;color:var(--ink-dim);width:auto;height:auto;min-width:0;min-height:0;padding:0;background:none;box-shadow:none;border:0;border-radius:0;display:inline-flex;align-items:center}
.cs-ch.on .cs-ic{color:var(--teal)}
.cs-n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cs-dot{width:9px;height:9px;border-radius:50%;background:var(--teal);flex:0 0 auto}
.cs-cnt{padding:2px 8px;border-radius:999px;background:var(--chip);font-size:.76rem;font-weight:700;color:var(--ink-mut)}
.cs-here{padding:3px 9px;border-radius:999px;font-size:.7rem;font-weight:800;letter-spacing:.04em;background:rgba(47,214,166,.16);color:#12b98a;border:1px solid rgba(47,214,166,.32)}
.cs-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--hair)}
.calc-grid{display:grid;gap:12px;margin-bottom:22px}
.calc-card{text-align:left;border-radius:var(--r-md);background:var(--glass);border:1px solid var(--glass-brd);min-height:120px}
.calc-card .tic{width:calc(46px * var(--scale,1));height:calc(46px * var(--scale,1));display:grid;place-items:center;color:#fff}
.calc-card .tt{margin-top:10px}
.calc-card .td{color:var(--ink-mut);margin-top:3px}
.calc-form{display:grid;gap:12px;margin-bottom:16px}
.cf{display:flex;flex-direction:column;gap:6px}
.cf label{font-size:.9rem;font-weight:600;color:var(--ink-soft)}
.cf label span{color:var(--ink-dim);font-weight:500}
.cf input{min-height:52px;padding:0 15px;border-radius:var(--r-sm);font-size:1.05rem;background:var(--field);border:1px solid var(--glass-brd);color:var(--ink);width:100%}
.calc-out{padding:16px;border-radius:var(--r-md);background:var(--grad-soft);border:1px solid var(--glass-brd)}
.calc-out.is-err{background:rgba(240,80,110,.10);border-color:rgba(240,80,110,.3)}
.co-plain{font-size:1.02rem;line-height:1.5;font-weight:600;color:var(--ink)}
.co-row{display:flex;justify-content:space-between;gap:12px;padding-top:9px;margin-top:9px;border-top:1px solid var(--hair);font-size:.88rem;color:var(--ink-mut)}
.co-row b{color:var(--ink)}
.inv-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0}
.inv-q{font-size:.9rem;color:var(--ink-mut)}
.inv-q.low{color:var(--warn,#f0a63e);font-weight:700}
.inv-q.low::after{content:" low";font-weight:600}
.empty-block{padding:32px 18px;text-align:center;color:var(--ink-mut)}
.empty-block svg{color:var(--ink-dim);margin-bottom:10px}
.toast .tt{flex:1;min-width:0}
.toast .te{flex:0 0 auto;display:grid;place-items:center}
.toast.t-ok .te{color:#37d39a}
.toast.t-info .te{color:#3fb6f0}
.toast.t-warn .te{color:#f0a63e}
.toast.t-danger .te{color:#f0506e}
.toast.t-undo .te{color:#9a8cff}
.toast .t-act{flex:0 0 auto;margin-left:6px;padding:7px 13px;border-radius:999px;min-height:36px;background:rgba(255,255,255,.14);color:inherit;font-weight:700;font-size:.85rem}
.toast .t-act:hover{background:rgba(255,255,255,.22)}
.answer-strip{margin:0 0 8px}
.as-in{display:flex;align-items:flex-start;gap:11px;padding:12px 14px;border-radius:var(--r-md);background:var(--grad-soft);border:1px solid var(--glass-brd)}
.as-in>svg{color:var(--teal);flex:0 0 auto;margin-top:2px}
.as-t{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.as-t b{font-size:.9rem;font-weight:650}
.as-t span{font-size:.87rem;color:var(--ink-soft);line-height:1.4}
.as-btns{display:flex;gap:7px;flex:0 0 auto;align-items:center}
.as-read,.as-x{min-height:38px;padding:0 14px;border-radius:999px;font-size:.85rem;font-weight:650}
.as-read{background:var(--glass-strong);color:var(--ink);border:1px solid var(--glass-brd)}
.as-x{background:transparent;color:var(--ink-mut)}
@media (max-width:640px){
  .as-in{flex-wrap:wrap}
  .as-btns{width:100%;justify-content:flex-end}
}
.ans-body{font-size:1.05rem;line-height:1.55;padding:16px;border-radius:var(--r-md);background:var(--grad-soft);border:1px solid var(--glass-brd);margin-bottom:14px}
.ans-by{display:flex;align-items:center;gap:11px;margin-bottom:16px}
.ans-by b{display:block;font-size:.94rem}
.ans-by span{font-size:.84rem;color:var(--ink-mut)}
.ans-row{display:block;width:100%;text-align:left;padding:14px;margin-bottom:9px;border-radius:var(--r-md);background:var(--glass-2);border:1px solid var(--glass-brd)}
.ans-row b{display:block;font-size:.96rem;margin-bottom:3px}
.ans-row span{display:block;font-size:.86rem;color:var(--ink-mut);line-height:1.4}
.ans-row small{display:block;margin-top:6px;font-size:.78rem;color:var(--teal);font-weight:650}
.skip-link{position:fixed;left:12px;top:-60px;z-index:200;padding:12px 18px;border-radius:0 0 14px 14px;background:var(--glass-strong);color:var(--ink);border:1px solid var(--glass-brd);font-weight:650;transition:top .18s}
.skip-link:focus{top:0}
#screen:focus{outline:none}
#screen.revealed .wrap>*{animation:none !important;opacity:1 !important;transform:none !important}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .sheet{background:var(--glass-strong-flat,var(--glass-strong))}
  body[data-mode="day"] .sheet,body[data-mode="dusk"] .sheet{background:#fbfbff}
  body[data-mode="night"] .sheet{background:#1c1d29}
}
.ch-title{display:flex;flex-direction:column;justify-content:center;min-width:0;gap:0}
.mem-grp .mg-n{display:inline-flex;align-items:center;justify-content:center;min-width:20px;padding:1px 6px;margin-left:4px;border-radius:999px;background:var(--chip);color:var(--ink-mut)}
@media (min-width:821px){
  .ch-sub{display:none}
}
@media (max-width:820px){
  #app.server-mode .srv-main{border-radius:0;margin:0}
  #app.server-mode #screen{padding-left:0;padding-right:0}
  .chan-head{padding:calc(7px * var(--scale,1)) calc(6px * var(--scale,1));gap:calc(4px * var(--scale,1));min-height:0}
  .ch-title{display:flex;flex-direction:column;justify-content:center;min-width:0;flex:1;gap:0}
  .chan-head .ch-name{font-size:calc(1.02rem * var(--scale,1));line-height:1.2;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ch-sub{display:flex;align-items:center;gap:5px;font-size:calc(.72rem * var(--scale,1));line-height:1.25;color:var(--ink-mut);font-weight:600}
  .ch-sub .on-dot{width:7px;height:7px;border-radius:50%;background:#37d39a;flex:0 0 auto}
  .chan-head .ch-ic{opacity:.55}
  .chan-head .ch-ic svg{width:18px;height:18px}
  .ch-back,.chan-head .cha{width:var(--hit-min,44px);height:var(--hit-min,44px);display:grid;place-items:center;flex:0 0 auto}
  .chan-head .cha svg,.ch-back svg{width:20px;height:20px}
  .ch-actions{gap:0}
  .topic-chips{padding:calc(6px * var(--scale,1)) calc(10px * var(--scale,1))}
  .tchip{min-height:calc(32px * var(--scale,1));padding:0 calc(11px * var(--scale,1));font-size:calc(.8rem * var(--scale,1));gap:5px}
  .tchip svg{width:12px;height:12px}
  .c-hero-ic{width:42px;height:42px;border-radius:14px;margin-bottom:7px}
  .c-hero-ic svg{width:22px;height:22px}
  .c-hero h3{font-size:calc(1.12rem * var(--scale,1));line-height:1.25}
  .c-hero p{font-size:calc(.85rem * var(--scale,1));line-height:1.4}
  #app.server-mode .c-msg,.c-msg{padding:calc(2px * var(--scale,1)) calc(12px * var(--scale,1));gap:calc(9px * var(--scale,1))}
  #app.server-mode .c-gut,.c-gut{width:calc(34px * var(--scale,1));flex:0 0 calc(34px * var(--scale,1))}
  #app.server-mode .c-txt,.c-txt{font-size:calc(.95rem * var(--scale,1));line-height:1.42}
  .c-head{gap:7px;line-height:1.2}
  .c-name{font-size:calc(.93rem * var(--scale,1))}
  .c-time{font-size:calc(.7rem * var(--scale,1))}
  .c-msg:not(.cont){margin-top:calc(9px * var(--scale,1))}
  .c-reply{font-size:calc(.78rem * var(--scale,1));padding-left:calc(43px * var(--scale,1))}
  .c-reacts{gap:5px;margin-top:4px}
  .c-react{min-height:calc(28px * var(--scale,1));padding:0 calc(8px * var(--scale,1));font-size:.8rem}
  .c-div{margin:calc(14px * var(--scale,1)) 0 calc(6px * var(--scale,1));top:6px}
  .day-pill{font-size:calc(.7rem * var(--scale,1));padding:6px 12px;background:rgba(15,15,23,.94)}
  .chan-body{padding-bottom:calc(58px * var(--scale,1))}
  .chan-comp{padding:calc(6px * var(--scale,1)) calc(8px * var(--scale,1)) calc(8px * var(--scale,1))}
  .chan-comp .comp-inner{padding:calc(4px * var(--scale,1));gap:calc(4px * var(--scale,1));border-radius:20px}
  .comp-inner #composer{font-size:calc(.95rem * var(--scale,1));line-height:1.4;padding:calc(9px * var(--scale,1)) 2px;min-height:0}
  .comp-inner .add svg,.comp-inner .cbtn svg{width:20px;height:20px}
  .comp-send svg{width:19px;height:19px}
  #nav{padding:calc(5px * var(--scale,1)) calc(4px * var(--scale,1)) calc(env(safe-area-inset-bottom,0px) + 5px * var(--scale,1))}
  .nav-item{padding:calc(5px * var(--scale,1)) 2px;gap:2px}
  .nav-item .ic svg{width:22px;height:22px}
  .nav-item .lbl{font-size:calc(.64rem * var(--scale,1));line-height:1.1}
  :root{--navbar-h:70px}
  .chan-fab{width:48px;height:48px;border-radius:16px;right:14px;bottom:12px}
  .chan-fab svg{width:21px;height:21px}
  .jump-new.show~.chan-fab{bottom:68px}
}
@media (max-width:640px){
  .topic-chips{display:none}
}
@media (max-width:360px){
  .ch-sub{display:none}
  .chan-head .cha[data-act="pins"]{display:none}
}
[hidden]{display:none !important}

/* ------------------------------------------------------------------ polish-core.css */
body{--t-2xs:calc(.6875rem * var(--scale,1));--t-xs:calc(.75rem * var(--scale,1));--t-sm:calc(.8125rem * var(--scale,1));--t-md:calc(.875rem * var(--scale,1));--t-base:calc(1rem * var(--scale,1));--t-lg:calc(1.125rem * var(--scale,1));--t-xl:calc(1.375rem * var(--scale,1));--t-2xl:calc(1.75rem * var(--scale,1));--t-3xl:calc(2.125rem * var(--scale,1));--face-ui:"Inter",system-ui,sans-serif;--face-dsp:"Space Grotesk","Inter",system-ui,sans-serif;--s-1:calc(4px * var(--scale,1));--s-2:calc(8px * var(--scale,1));--s-3:calc(12px * var(--scale,1));--s-4:calc(16px * var(--scale,1));--s-5:calc(20px * var(--scale,1));--s-6:calc(24px * var(--scale,1));--s-7:calc(32px * var(--scale,1));--s-8:calc(40px * var(--scale,1));--frame:calc(20px * var(--scale,1));--lift:-2px}
:root{--r-xs:10px;--sh-soft:0 1px 2px rgba(15,14,30,.06), 0 6px 16px -8px rgba(15,14,30,.30);--sh-card:0 1px 2px rgba(15,14,30,.08), 0 16px 40px -18px rgba(15,14,30,.45);--sh-lift:0 2px 4px rgba(15,14,30,.10), 0 32px 72px -26px rgba(15,14,30,.58);--edge-hi:rgba(255,255,255,.75);--edge-lo:rgba(20,22,40,.05);--surf-nest:rgba(24,26,48,.04);--grad-ink:linear-gradient(135deg,#0b7d5f 0%,#2a6fc0 46%,#6a5bef 100%);--glow-teal:0 0 #0000;--glow-violet:0 0 #0000;--grain:.18;--ink:#191a28;--ink-soft:#3c3e52;--ink-mut:#4d5066;--ink-dim:#6e7189}
body[data-mode="day"]{--ink:#20223a;--ink-soft:#43465f;--ink-mut:#5b5e79;--ink-dim:#7a7d99;--surf-nest:rgba(24,26,48,.05);--grain:.10;--glass-brd:rgba(24,26,50,.07)}
body[data-mode="night"]{--ink:#eef0ff;--ink-soft:#c3c6e6;--ink-mut:#9fa2cb;--ink-dim:#8083ab;--sh-soft:0 1px 2px rgba(0,0,0,.30), 0 6px 18px -8px rgba(0,0,0,.55);--sh-card:0 1px 2px rgba(0,0,0,.36), 0 18px 44px -18px rgba(0,0,0,.68);--sh-lift:0 2px 4px rgba(0,0,0,.42), 0 34px 76px -26px rgba(0,0,0,.78);--surf-nest:rgba(255,255,255,.055);--grain:.24}
.pop,
.cmdk,
.day-pop,
.mention-box,
.day-pill,
body[data-mode="night"] #app.server-mode{--ink:#eef0ff;--ink-soft:#c3c6e6;--ink-mut:#9fa2cb;--ink-dim:#8083ab;--sh-soft:0 1px 2px rgba(0,0,0,.30), 0 6px 18px -8px rgba(0,0,0,.55);--sh-card:0 1px 2px rgba(0,0,0,.36), 0 18px 44px -18px rgba(0,0,0,.68);--sh-lift:0 2px 4px rgba(0,0,0,.42), 0 34px 76px -26px rgba(0,0,0,.78);--edge-hi:rgba(255,255,255,.10);--edge-lo:rgba(0,0,0,.35);--surf-nest:rgba(255,255,255,.055)}
body[data-mode="dusk"] #app.server-mode{--ink:#191a28;--ink-soft:#3c3e52;--ink-mut:#4d5066;--ink-dim:#6e7189;--sh-soft:0 1px 2px rgba(15,14,30,.06), 0 6px 16px -8px rgba(15,14,30,.30);--sh-card:0 1px 2px rgba(15,14,30,.08), 0 16px 40px -18px rgba(15,14,30,.45);--sh-lift:0 2px 4px rgba(15,14,30,.10), 0 32px 72px -26px rgba(15,14,30,.58)}
body[data-mode="day"] #app.server-mode{--ink:#20223a;--ink-soft:#43465f;--ink-mut:#5b5e79;--ink-dim:#7a7d99;--sh-soft:0 1px 2px rgba(15,14,30,.06), 0 6px 16px -8px rgba(15,14,30,.30);--sh-card:0 1px 2px rgba(15,14,30,.08), 0 16px 40px -18px rgba(15,14,30,.45);--sh-lift:0 2px 4px rgba(15,14,30,.10), 0 32px 72px -26px rgba(15,14,30,.58)}
body{font-family:var(--face-ui);font-size:var(--t-base);font-weight:400;line-height:1.55}
.nav-item .badge,
.rm-un,
.mem-grp .mg-n{font-family:var(--face-ui);font-size:var(--t-2xs);font-weight:800;line-height:1.2;letter-spacing:.02em}
.section-label,
.cat-h,
.mem-grp,
.menu-h,
.ppop-h,
.mb-h,
.cs-cat,
.rm-sect,
.today-h,
.st3 .l,
.pstat .l{font-family:var(--face-ui);font-size:var(--t-xs);font-weight:800;line-height:1.25;letter-spacing:.08em;text-transform:uppercase}
.c-time,
.dm-time,
.bub-time,
.ach-d,
.day-pill,
.yb-l{font-family:var(--face-ui);font-size:var(--t-xs);font-weight:600;line-height:1.25;letter-spacing:0}
.tile .td,
.calc-card .td,
.rm-s,
.set-row .ss,
.tchip{font-family:var(--face-ui);font-size:var(--t-sm);font-weight:500;line-height:1.4;letter-spacing:0}
.dm-prev,
.mem .mn,
.chn,
.inv-n,
.c-reply{font-family:var(--face-ui);font-size:var(--t-md);font-weight:500;line-height:1.45;letter-spacing:0}
.c-txt,
.bub,
.comp-inner textarea,
.hsub{font-family:var(--face-ui);font-size:var(--t-base);font-weight:400;line-height:1.55;letter-spacing:0}
.card-title,
.srv-shead,
.dm-name,
.tile .tt,
.calc-card .tt,
.rm-n,
.ach-n,
.sheet-h h3{font-family:var(--face-dsp);font-size:var(--t-lg);font-weight:600;line-height:1.3;letter-spacing:-.005em}
.c-hero h3,
.empty-t,
.st3 .v,
.pstat .v{font-family:var(--face-dsp);font-size:var(--t-xl);font-weight:600;line-height:1.25;letter-spacing:-.015em}
.htitle,
.greet,
.msg-title,
.prof .pname{font-family:var(--face-dsp);font-size:var(--t-2xl);font-weight:600;line-height:1.15;letter-spacing:-.02em}
@media (min-width:821px){
  .htitle,.greet,.msg-title{font-size:var(--t-3xl);line-height:1.1;letter-spacing:-.022em}
}
.brand .wm{font-family:var(--face-dsp);font-weight:600;letter-spacing:-.015em}
.boot-word{font-family:var(--face-dsp);font-weight:600;letter-spacing:-.02em}
.dm-time,.c-time,.st3 .v,.pstat .v,.xp-top span,.rm-m,.yb-bar span,.nav-item .badge{font-variant-numeric:tabular-nums}
.htitle,.greet,.msg-title,.prof .pname,.c-hero h3,.empty-t,.sheet-h h3{text-wrap:balance}
.tile .td,.calc-card .td,.rm-s,.c-txt,.hsub{text-wrap:pretty}
.card,
.tile,
.calc-card,
.st3,
.rm-tile{padding:var(--s-5)}
.card.tight{padding:var(--s-4)}
.dm-row,
.set-row,
.today-row{padding:var(--s-3) var(--s-4)}
.today-h{padding:var(--s-4) var(--s-4) var(--s-3)}
.today-end{padding:var(--s-3) var(--s-4)}
.chn,
.mem{padding:var(--s-2) var(--s-3)}
.section-label{margin:var(--s-6) var(--s-1) var(--s-3)}
.srv-rail,.srv-side,.srv-main,.srv-members{border-radius:var(--r-lg)}
.pop,.day-pop,.mention-box,
.st3,.ach,.strain,.tek-card,.mk-card,.scope-card,.raffle,.ep-row,.mag-card,
.ai-card,.contam,.remind-banner,.boost,.toast,
.btn,.btn-lg,.msg-add,.comp-inner,.labtab,.cs-preview{border-radius:var(--r-md)}
.g-next,.seg,.segc,.ln-node,.field input,.field select,.back-btn,.theme-fab,
.tile .tic,.calc-card .tic,.set-row .sic,.tek-ic,.ep-ic,.rm-ic,.inv-ic,
.raffle-ic,.g-next .nic,.badge-b,.tl-dot,.edit-ta,.reply-banner,
.lab-search,.pt-locked-chans,.g-meta .m,.pstat,.ppop-note{border-radius:var(--r-sm)}
.c-react,.c-embed,.qbtn,.srv-me .ub,.cha,.cbtn,.ch-ham,.ch-back,.rb-x,
.menu-item,.mb-row,.cmdk-row,.pin-row,.day-pop button,.cmk-ic,.toast .te,
.rm-sbtn,.emoji-btn,.sheet-x,.chn,.mem,.vu,.seg button,.segc button,
.pick button,.ai-note,.lc-row,.dm-add-chip,.c-tools,.c-typing .tp{border-radius:var(--r-xs)}
.dm-row,.set-row,.inv-row,.chn,.mem,.today-row,.c-react,.tchip,.ln-node{box-shadow:none}
.st3,.ach,.calc-card,.rm-tile,.strain,.tek-card,.feed,.gcard,
.mk-card,.scope-card,.mag-card,.ev-card,.xp-card,.ai-card,.raffle,.ep-row,
.back-btn,.msg-ibtn,.msg-add,.btn-glass,.find-btn{box-shadow:var(--sh-soft),inset 0 1px 0 var(--edge-hi),inset 0 -1px 0 var(--edge-lo)}
.card,.tile,.grow,.today-card,#nav,
.srv-rail,.srv-side,.srv-main,.srv-members,
.sheet,.pop,.cmdk,.toast,.comp-inner,.theme-fab{box-shadow:var(--sh-card),inset 0 1px 0 var(--edge-hi),inset 0 -1px 0 var(--edge-lo)}
.calc-card:hover,.rm-tile:hover,.strain:hover,.tek-card:hover,
.feed:hover,.gcard:hover,.mk-card:hover,.scope-card:hover,.mag-card:hover,
.ev-card:hover,.xp-card:hover,.back-btn:hover,.msg-ibtn:hover,.msg-add:hover,
.btn-glass:hover,.find-btn:hover{box-shadow:var(--sh-card),inset 0 1px 0 var(--edge-hi),inset 0 -1px 0 var(--edge-lo)}
.tile:hover,.grow.tap:hover{box-shadow:var(--sh-lift),inset 0 1px 0 var(--edge-hi),inset 0 -1px 0 var(--edge-lo)}
.btn-primary,
.comp-send,
.bub.me,
.labtab.on,
.msg-ibtn.accent,
.chip.on,
.jump-new,
.srail-home,
.tog.on,
.pick button.on,
.nav-item .badge,
.genpill{background-image:var(--grad-ink);background-color:#2a6fc0;background-size:100% 100%;background-repeat:no-repeat}
.msg-ibtn.accent,
:is(.card,.sheet,.pop,.srv-main) :is(.msg-ibtn.accent){background-image:var(--grad-ink);background-color:#2a6fc0}
.btn-primary[disabled],.comp-send[disabled],.msg-ibtn.accent[disabled]{background-image:none;background-color:var(--chip)}
.today-card,.rm-tile,.calc-card,.ach,.st3,.strain,.tek-card,.inv-row,
.mk-card,.scope-card,.raffle,.ep-row,.mag-card,.ai-card,.labtab,.seg{backdrop-filter:none;-webkit-backdrop-filter:none;background-color:var(--glass-flat);background-image:none}
:is(#nav,.comp-inner,.srv-rail,.srv-side,.srv-main,.srv-members,.sheet,.pop,
    .cmdk,.day-pop,.mention-box,.toast,.card,.tile,.grow,.gcard,.feed,.set,
    .dm-list,.xp-card,.ev-card,.ai-card,.mk-card,.mag-card,.scope-card,.strain,
    .prof .pbody,.ghero .gbody)
:is(.glass,.card,.tile,.grow,.gcard,.feed,.set,.dm-list,.xp-card,.ev-card,
    .btn-glass,.strain,.ach,.st3,.tek-card,.inv-row,.mk-card,.scope-card,
    .raffle,.ep-row,.mag-card,.ai-card,.bub.them,.msg-ibtn,.msg-add,.c-tools,
    .comp-inner){backdrop-filter:none;-webkit-backdrop-filter:none;background-color:var(--surf-nest);background-image:none;box-shadow:inset 0 0 0 1px var(--hair)}
:is(.card,.sheet,.pop,.srv-main) :is(.msg-ibtn.accent){background-image:var(--grad-ink);background-color:#2a6fc0;box-shadow:none}
#app.server-mode .srv-main{background:transparent}
body[data-mode="day"] #ambient{background:radial-gradient(120% 120% at 10% -10%, #dfeaff 0%, transparent 55%),
    radial-gradient(120% 120% at 100% 0%, #ece2ff 0%, transparent 50%),
    linear-gradient(160deg,#e6eaf7 0%,#dde3f2 100%)}
body[data-mode="day"] .blob{opacity:.5;filter:blur(90px) saturate(1.6)}
.blob{will-change:transform}
@keyframes drift{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(4vw,3vw,0)}
  100%{transform:translate3d(-3vw,-2vw,0)}
}
#ambient::before{opacity:var(--grain);mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.tile:hover,.grow.tap:hover,.gcard:hover,.feed:hover,.calc-card:hover,
.rm-tile:hover,.strain:hover,.tek-card:hover,.mk-card:hover,.scope-card:hover,
.mag-card:hover,.ev-card:hover,.xp-card:hover{transform:translateY(var(--lift))}
.btn,.comp-send,.msg-ibtn,.msg-add,.theme-fab,.back-btn,.jump-new,.srail-home,.vd{transition:transform var(--d-quick) var(--e-spring),
             box-shadow var(--d-pop) var(--e-out),
             background-color var(--d-instant) var(--e-out)}
.calc-card,.rm-tile,.ach,.inv-row,.raffle,.ep-row,.today-row,.labtab,.st3,
.tile,.grow,.gcard,.feed,.xp-card,.ev-card,.mk-card,.scope-card,.strain,
.tek-card,.mag-card,.find-btn{transition:transform var(--d-pop) var(--e-spring),
             box-shadow var(--d-pop) var(--e-out),
             background-color var(--d-instant) var(--e-out),
             border-color var(--d-instant) var(--e-out)}
body.theming #app,
body.theming #app *,
body.theming #themefab{transition:background-color var(--d-move) var(--e-out),
             border-color var(--d-move) var(--e-out),
             color var(--d-move) var(--e-out),
             box-shadow var(--d-move) var(--e-out)}
#screen.seg-swap .wrap>*{animation:fade var(--d-quick) var(--e-out) both;animation-delay:0s}
.c-msg,.dm-row{content-visibility:visible;contain-intrinsic-size:none}
.comp-inner textarea:focus-visible{outline:none}
.comp-inner:focus-within{box-shadow:0 0 0 var(--ring-w) var(--ring),var(--sh-card)}
@media (prefers-reduced-motion:reduce){
  .calc-card:hover,.rm-tile:hover,.strain:hover,.find-btn:hover,
  .msg-add:hover,.msg-ibtn:hover{transform:none}
  .blob{will-change:auto}
  #screen.seg-swap .wrap>*{animation-name:fade}
}
@media (prefers-contrast:more){
  :root{--edge-hi:rgba(255,255,255,.9);--edge-lo:rgba(20,22,40,.12);--grain:.06}
  body[data-mode="night"]{--edge-hi:rgba(255,255,255,.16);--edge-lo:rgba(0,0,0,.5)}
}

/* ------------------------------------------------------------------ polish-parts.css */
.srv{height:100%;padding:0;gap:var(--s-3,calc(12px*var(--scale,1)))}
@media (min-width:821px){
  #app.server-mode #screen{margin-left:calc(var(--nav-w) + 32px);padding:var(--frame,calc(20px*var(--scale,1))) var(--frame,calc(20px*var(--scale,1))) var(--frame,calc(20px*var(--scale,1))) 0}
}
@media (max-width:820px){
  #app.server-mode #screen{height:calc(100dvh - var(--navbar-h,84px));padding:0}
}
@media (min-width:1180px) and (max-width:1339px){
  #app.server-mode .srv-side{width:228px;flex:0 0 228px}
}
.srail-item .pip{left:0;width:3px;background:var(--teal-b);box-shadow:none;border-radius:0 3px 3px 0}
.srail-item.on .pip{height:28px}
.srv-chans,
.mem-scroll{-webkit-mask-image:linear-gradient(#000 calc(100% - 20px),transparent);mask-image:linear-gradient(#000 calc(100% - 20px),transparent)}
.mem-scroll{padding-bottom:var(--s-7,calc(32px*var(--scale,1)))}
.srv-me{row-gap:var(--s-1,calc(4px*var(--scale,1)))}
.srv-me .me{min-width:calc(120px*var(--scale,1))}
.srv-me .meta{flex:1}
.srv-me .ub{width:var(--hit-min);height:var(--hit-min)}
.srv-jump{background:var(--field);border:1px solid var(--glass-brd-2);color:var(--ink-mut);min-height:var(--hit-min)}
.srv-jump:hover{background:var(--chip);color:var(--ink)}
.srv-jump kbd{background:var(--chip);border-color:var(--glass-brd-2);color:var(--ink-mut)}
@media (max-width:1479px){
  #app.server-mode .ch-topic{display:none}
}
@media (min-width:821px){
  #app.server-mode .c-msg:not(.cont){margin-top:var(--s-3,calc(12px*var(--scale,1)))}
  #app.server-mode .c-msg.cont{padding-top:1px;padding-bottom:1px}
}
.c-div{margin:var(--s-5,calc(20px*var(--scale,1))) 0 var(--s-3,calc(12px*var(--scale,1)))}
.c-div::before{content:"";position:absolute;inset:-8px 0;z-index:-1;pointer-events:none;background:linear-gradient(var(--surf-solid) 62%,transparent)}
.day-pill{color:var(--ink-soft)}
.day-pill:hover{color:var(--ink)}
.c-react{position:relative}
.c-react::after{content:"";position:absolute;left:0;right:0;top:calc((28px*var(--scale,1) - var(--hit-min))/2);bottom:calc((28px*var(--scale,1) - var(--hit-min))/2)}
.day-pill{position:relative}
.day-pill::after{content:"";position:absolute;left:0;right:0;top:calc((30px*var(--scale,1) - var(--hit-min))/2);bottom:calc((30px*var(--scale,1) - var(--hit-min))/2)}
.c-hero{margin-bottom:auto}
.c-hero{padding:var(--s-5,calc(20px*var(--scale,1))) var(--s-5,calc(20px*var(--scale,1))) var(--s-2,calc(8px*var(--scale,1)))}
@media (max-width:820px){
  .c-hero{padding:var(--s-3,calc(12px*var(--scale,1))) var(--s-3,calc(12px*var(--scale,1))) var(--s-1,calc(4px*var(--scale,1)))}
}
.c-reply{position:relative;margin-top:var(--s-3,calc(12px*var(--scale,1)));margin-bottom:0}
.c-reply::before{content:"";position:absolute;left:calc(-15px*var(--scale,1));top:50%;width:calc(11px*var(--scale,1));height:calc(9px*var(--scale,1));border-left:2px solid var(--hair);border-top:2px solid var(--hair);border-top-left-radius:6px;pointer-events:none}
@media (max-width:820px){
  .comp-inner .add,
  .comp-inner .cbtn,
  .comp-send{width:var(--hit-min);height:var(--hit-min);flex:0 0 var(--hit-min)}
}
.comp-inner textarea::placeholder{color:var(--ink-mut)}
.comp-send[disabled]{background:var(--chip);color:var(--ink-dim);box-shadow:none;filter:none;opacity:1}
.comp-send[disabled]:hover{transform:none;box-shadow:none}
.nav-item .badge{min-width:calc(18px*var(--scale,1));height:calc(18px*var(--scale,1));padding:0 calc(5px*var(--scale,1))}
@media (max-width:820px){
  .nav-item .badge{top:0;right:calc(50% - 20px)}
}
.h-top{align-items:flex-start;justify-content:space-between}
.h-top>div:first-child{flex:1;min-width:0}
.home-top{align-items:flex-start}
.msg-title-row{align-items:flex-start}
@media (min-width:821px){
  #themefab{top:34px;right:var(--frame,calc(20px*var(--scale,1)));left:auto;bottom:auto;width:var(--hit-min);height:var(--hit-min);background:var(--glass-strong);color:var(--ink-soft);border:1px solid var(--glass-brd)}
  #themefab:hover{color:var(--ink)}
}
.rm-m{color:var(--ink-mut);min-height:calc(22px*var(--scale,1));align-items:center}
.rm-go{color:var(--ink-soft);opacity:.6}
.rm-un{padding:0 calc(8px*var(--scale,1));line-height:calc(18px*var(--scale,1));border-width:1px}
.rm-sbtn{width:var(--hit-min);height:var(--hit-min)}
.tchip{min-height:var(--hit-min)}
.tiles{grid-template-columns:1fr 1fr}
.calc-grid{grid-template-columns:repeat(auto-fill,minmax(158px,1fr))}
.ach-grid{grid-template-columns:repeat(auto-fill,minmax(132px,1fr))}
.calc-card,
.tile{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}
.inv-row{border:0;border-radius:0;box-shadow:none;background:transparent}
.inv-row:last-child{border-bottom:0}
.dm-row.unread::before{display:none}
.dm-row .dm-unread{position:absolute;right:calc(15px*var(--scale,1));bottom:calc(13px*var(--scale,1));width:8px;height:8px;margin:0}
.dm-row .dm-time{position:absolute;right:calc(15px*var(--scale,1));top:calc(11px*var(--scale,1));margin-left:0}
.dm-row .dm-l1{padding-right:calc(46px*var(--scale,1))}
.dm-row .dm-prev{padding-right:calc(22px*var(--scale,1))}
.dm-prev .pyou{color:var(--ink-dim);font-weight:600}
.dm-row.unread .dm-prev .pyou{color:var(--ink-dim);font-weight:600}
.remind-banner{background-image:var(--grad-soft),linear-gradient(var(--surf-solid),var(--surf-solid));border-color:var(--ok-line)}
.remind-banner.amber{border-color:var(--warn-line)}
.today-card{position:relative;border-top-color:var(--glass-brd)}
.today-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(47,214,166,.18)}
.today-row{align-items:flex-start}
.tr-i span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal;overflow:hidden}
.tr-go{margin-top:calc(11px*var(--scale,1))}
.today-end{padding-left:calc(var(--s-4,16px) + 40px + var(--s-3,12px))}
.tr-ic.warn{background:var(--warn-bg);color:var(--warn-fg)}
.tr-ic.info{background:var(--info-bg);color:var(--info-fg)}
.feed[style*="cursor:default"]{cursor:default}
.feed[style*="cursor:default"]:hover{transform:none;box-shadow:var(--sh-soft)}
.feed[style*="cursor:default"]:active{transform:none}
.set-row[data-act]{cursor:pointer}
.set-row[data-act]:hover{background:var(--hover)}
.set-row[data-act]:active{background:var(--active)}
.tog:hover{border-color:var(--glass-brd)}
.ach.locked{opacity:1;background:var(--glass-2)}
.ach.locked .ach-n{color:var(--ink-mut)}
.ach.locked .ach-d{color:var(--ink-dim)}
.ach.locked .ach-ic{background:var(--chip);color:var(--ink-dim)}
.grow .photo .day{background:rgba(0,0,0,.42);padding:calc(4px*var(--scale,1)) calc(10px*var(--scale,1));border-radius:999px;text-shadow:none}
.grow .photo::after{background:linear-gradient(180deg,transparent 62%,rgba(0,0,0,.22))}
.gsteps .s.done{color:var(--ink-mut)}
.gsteps .s.cur{color:var(--ink);font-weight:800;position:relative}
.gsteps .s.cur::before{content:"";position:absolute;left:50%;top:calc(-7px*var(--scale,1));width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--teal-b)}
.sheet-grab{position:sticky;top:0;z-index:3;width:100%;height:calc(21px*var(--scale,1));margin:0;display:grid;place-items:center;background:inherit;border-radius:0;opacity:1}
.sheet-grab::after{content:"";width:calc(44px*var(--scale,1));height:5px;border-radius:3px;background:var(--ink-dim);opacity:.4}
.sheet-h{position:sticky;top:calc(21px*var(--scale,1));z-index:2;background:inherit}
.sheet-b{padding:10px 24px calc(28px + env(safe-area-inset-bottom,0px))}
.toast .te,
.toast.t-ok .te,
.toast.t-info .te,
.toast.t-warn .te,
.toast.t-danger .te,
.toast.t-undo .te{width:calc(22px*var(--scale,1));height:calc(22px*var(--scale,1));background:none;border-radius:0}
.pop{background:var(--glass-strong-flat)}
.cmdk{background:var(--surf-solid)}
.ppop-av,
.ppop-av .on{border-color:var(--surf-solid)}
.menu-h,
.emoji-cat,
.ppop-tt,
.ppop-h,
.ppop-stats span,
.pin-top span,
.cmdk-in,
.cmk-s,
.cmk-t,
.cmdk-foot,
.mb-h{color:var(--ink-mut)}
.cmdk-in input::placeholder{color:var(--ink-mut)}
.ppop-note,
.ppop-about{color:var(--ink-soft)}
.msg-add,
:is(.card,.sheet,.pop,.srv-main) .msg-add{background:var(--grad-ink,var(--grad));color:#fff;border-color:transparent;flex:1 1 auto}
.msg-add svg{color:#fff}
.msg-ibtn.accent,
:is(.card,.sheet,.pop,.srv-main) .msg-ibtn.accent{background:var(--glass);color:var(--ink);border:1px solid var(--glass-brd);box-shadow:var(--sh-soft)}
.msg-ibtn{border-radius:var(--r-sm)}
.msg-ibtn[aria-pressed="true"]{background:var(--grad-soft);border-color:var(--glass-brd);color:var(--ink)}
.xp-ring{width:calc(54px*var(--scale,1));height:calc(54px*var(--scale,1))}
.xp-ring.big{width:calc(66px*var(--scale,1));height:calc(66px*var(--scale,1))}
.xp-ring::before{inset:5px}
.prof .pcover{height:104px}
.ygraph{height:calc(190px*var(--scale,1));padding-top:calc(26px*var(--scale,1));border-bottom:1px solid var(--hair)}
.yb-bar{width:100%;max-width:calc(40px*var(--scale,1));background:var(--teal);border-radius:8px 8px 0 0}
.yb-bar.best{background:var(--grad)}
.yb-bar span{top:calc(-18px*var(--scale,1))}
.st3 .v.grad,
.pstat .v.grad{background:none;-webkit-text-fill-color:currentColor;color:var(--ink)}
.lineage{position:relative}
.lineage>.ln-node:first-child{background:var(--grad-soft);border-color:var(--glass-brd);font-weight:700}
.ln-arrow{display:none}
.ln-node.child{margin-left:22px;position:relative}
.ln-node.child::before{content:"";position:absolute;left:-12px;top:-8px;bottom:50%;width:1px;background:var(--hair)}
.ln-node.child::after{content:"";position:absolute;left:-12px;top:50%;width:10px;height:1px;background:var(--hair)}
.av .on{border-color:var(--surf-solid)}
.bub-wrap{max-width:min(74%,62ch)}
.bub-name{margin:0 0 4px 16px;line-height:1.2;color:var(--on-amb-mut)}
.bub-time{color:var(--on-amb-mut)}
.bub-row:not(.cont){margin-top:calc(14px*var(--scale,1))}
.bub-row.cont{margin-top:2px}
.bub-row.cont .av{height:34px;margin:0 0 2px}
@media (prefers-reduced-motion:reduce){
  .rm-tile:hover,
  .calc-card:hover,
  .find-btn:hover,
  .day-pill:hover,
  .chan-fab:hover,
  .today-row:active{transform:none}
}

/* ------------------------------------------------------------------ polish-fix.css */
#app.server-mode .srv-main{backdrop-filter:blur(var(--blur-mid,12px)) saturate(1.5);-webkit-backdrop-filter:blur(var(--blur-mid,12px)) saturate(1.5)}
body[data-mode="day"] #app.server-mode .srv-main{background:rgba(255,255,255,.80)}
body[data-mode="dusk"] #app.server-mode .srv-main{background:rgba(255,255,255,.74)}
body[data-mode="night"] #app.server-mode .srv-main{background:rgba(22,24,38,.72)}
body[data-mode="day"] #app.server-mode .chan-head,
body[data-mode="dusk"] #app.server-mode .chan-head,
body[data-mode="night"] #app.server-mode .chan-head,
body[data-mode="day"] #app.server-mode .chan-body,
body[data-mode="dusk"] #app.server-mode .chan-body,
body[data-mode="night"] #app.server-mode .chan-body,
body[data-mode="day"] #app.server-mode .chan-comp,
body[data-mode="dusk"] #app.server-mode .chan-comp,
body[data-mode="night"] #app.server-mode .chan-comp,
body[data-mode="day"] #app.server-mode .voice-main,
body[data-mode="dusk"] #app.server-mode .voice-main,
body[data-mode="night"] #app.server-mode .voice-main{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
#app.server-mode .chan-head{border-bottom:1px solid var(--hair)}
#app.server-mode .chan-comp{border-top:1px solid var(--hair)}
body[data-mode="day"] #app.server-mode .srv-side,
body[data-mode="day"] #app.server-mode .srv-members{background:rgba(255,255,255,.72)}
body[data-mode="dusk"] #app.server-mode .srv-side,
body[data-mode="dusk"] #app.server-mode .srv-members{background:rgba(255,255,255,.66)}
body[data-mode="night"] #app.server-mode .srv-side,
body[data-mode="night"] #app.server-mode .srv-members{background:rgba(22,24,38,.66)}
body[data-mode="day"] #app.server-mode .srv-rail{background:rgba(255,255,255,.62)}
body[data-mode="dusk"] #app.server-mode .srv-rail{background:rgba(255,255,255,.56)}
body[data-mode="night"] #app.server-mode .srv-rail{background:rgba(22,24,38,.58)}
.srv-me{flex-wrap:nowrap;gap:1px;padding-left:8px;padding-right:6px}
.srv-me .ub{display:grid;place-items:center}
.srv-me .meta{min-width:0}
.srv-me .meta .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srv-me .meta .sub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (pointer:fine){
  .srv-me .ub{width:34px;height:34px}
  .srv-me .ub svg{width:17px;height:17px}
}
@media (pointer:coarse){
  .srv-me{flex-wrap:wrap;row-gap:4px}
  .srv-me .ub{width:var(--hit-min,44px);height:var(--hit-min,44px)}
}
@media (max-width:820px){
  #themefab{display:grid;place-items:center;position:fixed;left:auto;right:14px;top:auto;bottom:calc(var(--navbar-h,70px) + 14px);width:var(--hit-min,44px);height:var(--hit-min,44px);border-radius:15px;z-index:30}
  body.in-room #themefab{display:none}
  #app:not(.server-mode) #screen{padding-bottom:calc(var(--navbar-h,70px) + 22px)}
}
.srv-chans{padding-bottom:10px}
.av,
.rm-ic,
.ge,
.srail-ic,
.tic,
.mark,
.boot-orb,
.xp-ring,
.today-h svg{--grad:linear-gradient(135deg,#2fd6a6,#7b6cff)}
.nav-item.on .ic{color:var(--teal)}
.c-hero-ic{background:linear-gradient(135deg,#2fd6a6,#7b6cff);border-color:transparent;color:#fff;box-shadow:0 10px 24px -14px rgba(47,214,166,.7)}
.chan-body{display:flex;flex-direction:column;justify-content:flex-start}
.chan-body>*{flex-shrink:0}
.chan-body>.c-hero{margin-top:auto}
.st3 .l,.pstat .l{font-size:var(--t-2xs,.6875rem);letter-spacing:.04em;white-space:nowrap}
.today-h{font-size:var(--t-lg,1.05rem);font-weight:700;letter-spacing:.01em;text-transform:none;color:var(--ink)}
.today-card::after{border-color:rgba(47,214,166,.38)}
.rm-board,.rm-arrange{max-width:640px}
.rm-arrange{background:var(--glass-flat,rgba(255,255,255,.82));border-color:var(--glass-brd)}
.cat-h span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-reply::before{display:none}
@media (min-width:1180px) and (max-width:1339px){
  #app.server-mode .srv-members{display:flex;width:198px;flex:0 0 198px}
}
@media (max-width:1479px) and (min-width:1180px){
  #app.server-mode .ch-topic{display:block}
}
:root{--frame:20px}
@media (min-width:821px){
  #nav{left:var(--frame);top:var(--frame);bottom:var(--frame)}
}
body[data-mode="night"] .day-pill{background:rgba(46,49,74,.96);border-color:rgba(255,255,255,.14)}
body[data-mode="day"] #app.server-mode .comp-inner{background:rgba(255,255,255,.96);box-shadow:0 1px 0 rgba(20,22,50,.05) inset,0 8px 22px -16px rgba(20,22,50,.5)}
.c-div::before{display:none}
.day-pill{box-shadow:0 0 0 7px var(--surf-solid),0 2px 10px rgba(15,14,30,.18)}
.prof .pcover{position:relative}
.prof .pcover::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.34),rgba(255,255,255,0) 62%)}
.xp-ring::before{background:var(--surf-solid)}
@media (prefers-reduced-motion:reduce){
  #app.server-mode .srv-main{transition:none}
}

/* ------------------------------------------------------------------ account.css */
.acct{position:relative;margin-bottom:var(--s-4,16px);border-radius:var(--r-lg,24px);overflow:hidden;background:var(--glass-flat,var(--glass));border:1px solid var(--glass-brd)}
.acct-cover{height:110px;background:linear-gradient(to bottom,rgba(0,0,0,0) 46%,var(--glass-flat,var(--glass)) 100%),
    linear-gradient(118deg,#2fd6a6 0%,#39b6d8 44%,#7b6cff 100%);position:relative}
.acct-cover::after{content:"";position:absolute;inset:0;background:radial-gradient(130% 90% at 16% 0%,rgba(255,255,255,.32),rgba(255,255,255,0) 60%)}
.acct-av{position:absolute;left:20px;top:62px;z-index:2}
.acct-av .av{box-shadow:0 0 0 4px var(--glass-flat,var(--glass)),var(--sh-soft)}
.acct-edit{position:absolute;right:16px;top:120px;z-index:2;display:inline-flex;align-items:center;gap:7px;min-height:var(--hit-min,44px);padding:0 15px;border-radius:999px;background:var(--surf-inset,var(--chip));border:1px solid var(--glass-brd);color:var(--ink);font-weight:650;font-size:.9rem}
.acct-edit:hover{background:var(--hover)}
.acct-b{padding:44px 20px 18px}
.acct-n{font-family:"Space Grotesk",Inter,sans-serif;font-size:1.5rem;font-weight:700;color:var(--ink);line-height:1.15}
.acct-h{font-size:.9rem;color:var(--ink-mut);margin-top:3px}
.acct-status{display:flex;align-items:center;gap:9px;width:100%;text-align:left;margin-top:14px;min-height:var(--hit-min,44px);padding:9px 12px;border-radius:var(--r-sm,14px);background:var(--surf-inset,var(--field));border:1px solid transparent;color:var(--ink-soft)}
.acct-status:hover{background:var(--hover);border-color:var(--glass-brd)}
.ps-dot{width:10px;height:10px;border-radius:50%;background:#37d39a;flex:0 0 auto;box-shadow:0 0 0 3px var(--glass-flat,var(--glass))}
.ps-dot.idle{background:#f0a63e}
.ps-dot.dnd{background:#f0506e}
.ps-dot.off{background:var(--ink-dim)}
.ps-l{font-weight:650;color:var(--ink);flex:0 0 auto}
.ps-note{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-mut);font-size:.88rem}
.acct-status svg{color:var(--ink-dim);flex:0 0 auto}
.acct-ver{text-align:center;color:var(--on-amb-mut,var(--ink-dim));font-size:.78rem;padding:18px 0 6px}
.lvl-strip{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:14px 16px;margin-bottom:var(--s-4,16px);border-radius:var(--r-md,18px);background:var(--glass-flat,var(--glass));border:1px solid var(--glass-brd)}
.lvl-strip:hover{background:var(--surf-solid)}
.lvl-i{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.lvl-t{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.lvl-t b{font-size:.98rem;font-weight:650}
.lvl-t span{font-size:.8rem;color:var(--ink-mut);flex:0 0 auto}
.lvl-s{font-size:.8rem;color:var(--ink-mut)}
.lvl-strip>svg{color:var(--ink-dim);flex:0 0 auto}
.sgrp{margin-bottom:var(--s-5,22px)}
.sgrp-h{text-transform:uppercase;color:var(--on-amb-mut,var(--ink-mut));padding:0 4px 8px}
.sgrp-b{border-radius:var(--r-md,18px);overflow:hidden;background:var(--glass-flat,var(--glass));border:1px solid var(--glass-brd)}
.srow{display:flex;align-items:center;gap:13px;width:100%;text-align:left;min-height:var(--hit-min,44px);padding:12px 14px;background:transparent;color:var(--ink);border-top:1px solid var(--hair)}
.sgrp-b>.srow:first-child{border-top:0}
button.srow:hover{background:var(--hover)}
button.srow:active{background:var(--active)}
.srow.tall{align-items:flex-start;flex-direction:column;gap:10px}
.sr-ic{flex:0 0 auto;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;color:#fff;background:var(--grad-soft)}
.sr-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sr-l{font-size:.98rem;font-weight:600;color:var(--ink)}
.sr-s{font-size:.83rem;color:var(--ink-mut);line-height:1.35}
.sv{flex:0 0 auto;font-size:.88rem;color:var(--ink-mut);font-weight:600;max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srow .chev{color:var(--ink-dim);flex:0 0 auto;display:grid;place-items:center}
.srow.danger .sr-l{color:#e0405f}
body[data-mode="night"] .srow.danger .sr-l{color:#ff7d92}
.srow .tog{flex:0 0 auto}
.set-note{display:flex;gap:9px;align-items:flex-start;margin:-8px 2px var(--s-5,22px);padding:0 2px;font-size:.85rem;line-height:1.45;color:var(--on-amb-mut,var(--ink-mut))}
.set-note svg{flex:0 0 auto;margin-top:2px;opacity:.8}
.set-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:var(--s-5,22px)}
.set-head .back-btn{flex:0 0 auto;margin-top:-2px}
.set-h1{font-family:"Space Grotesk",Inter,sans-serif;font-size:1.65rem;font-weight:700;color:var(--on-amb,var(--ink));line-height:1.15}
.set-h2{font-size:.9rem;color:var(--on-amb-mut,var(--ink-mut));margin-top:5px;line-height:1.45;max-width:52ch}
.pv-wrap{margin-bottom:var(--s-5,22px)}
.pv{height:132px;border-radius:var(--r-md,18px);overflow:hidden;background:var(--glass-flat,var(--glass));border:1px solid var(--glass-brd);padding:12px;display:flex;flex-direction:column;gap:9px}
.pv-bar{height:26px;border-radius:9px;background:var(--surf-inset,var(--field))}
.pv-msg{display:flex;align-items:center;gap:9px}
.pv-msg span{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#2fd6a6,#7b6cff);flex:0 0 auto}
.pv-msg i{height:11px;border-radius:6px;background:var(--surf-inset,var(--field));flex:1;max-width:70%}
.pv-msg.alt i{max-width:48%}
.pv-l{text-align:center;font-size:.76rem;color:var(--on-amb-mut,var(--ink-mut));padding-top:8px}
.modepick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:12px 14px 14px}
.modepick button{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 6px;border-radius:var(--r-sm,14px);background:var(--surf-inset,var(--field));border:1.5px solid transparent;color:var(--ink-mut);font-size:.86rem;font-weight:650;min-height:var(--hit-min,44px)}
.modepick button.on{border-color:var(--teal);color:var(--ink);background:var(--hover)}
.mp-sw{width:100%;height:30px;border-radius:9px;border:1px solid var(--glass-brd)}
.mp-day{background:linear-gradient(135deg,#f4f6ff,#e5e9f8)}
.mp-dusk{background:linear-gradient(135deg,#eef0fb 46%,#232640 47%)}
.mp-night{background:linear-gradient(135deg,#242741,#12141f)}
.segc.wide{width:100%;padding:12px 14px 14px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.segc.wide button{min-height:var(--hit-min,44px)}
.about-hero{text-align:center;padding:26px 18px 22px;margin-bottom:var(--s-5,22px);border-radius:var(--r-md,18px);background:var(--glass-flat,var(--glass));border:1px solid var(--glass-brd)}
.about-mark{width:62px;height:62px;margin:0 auto 12px;border-radius:20px;background:linear-gradient(135deg,#2fd6a6,#7b6cff);box-shadow:var(--sh-soft)}
.about-t{font-family:"Space Grotesk",Inter,sans-serif;font-size:1.35rem;font-weight:700}
.about-v{font-size:.84rem;color:var(--ink-mut);margin-top:2px}
.about-hero p{margin:12px auto 0;max-width:40ch;font-size:.92rem;line-height:1.5;color:var(--ink-soft)}
.ep-top{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.ep-swatches{display:flex;flex-wrap:wrap;gap:8px;flex:1}
.ep-sw{width:34px;height:34px;border-radius:11px;border:2px solid transparent;box-shadow:var(--sh-soft)}
.ep-sw.on{border-color:var(--ink)}
.field label{display:block;font-size:.85rem;font-weight:650;color:var(--ink-soft);margin-bottom:6px}
.field textarea{width:100%;min-height:82px;padding:12px 14px;border-radius:var(--r-sm,14px);background:var(--field);border:1px solid var(--glass-brd);color:var(--ink);font:inherit;font-size:.95rem;line-height:1.45;resize:vertical}
.fhint{display:block;text-align:right;font-size:.76rem;color:var(--ink-dim);margin-top:5px}
.pres-list{display:flex;flex-direction:column;gap:6px}
.pres-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;min-height:var(--hit-min,44px);padding:12px 14px;border-radius:var(--r-sm,14px);background:var(--surf-inset,var(--field));border:1.5px solid transparent;color:var(--ink)}
.pres-row:hover{background:var(--hover)}
.pres-row.on{border-color:var(--teal);background:var(--hover)}
.pres-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pres-t b{font-size:.96rem;font-weight:650}
.pres-t span{font-size:.83rem;color:var(--ink-mut);line-height:1.35}
.pres-row>svg{color:var(--teal);flex:0 0 auto}
.xp-ring{background:none;position:relative;-webkit-mask:none;mask:none}
.xp-ring::before{display:none}
.xp-ring::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from -90deg,
    #2fd6a6 0%,
    #39b6d8 calc(var(--p,50) * .55%),
    #7b6cff calc(var(--p,50) * 1%),
    var(--track,var(--field)) calc(var(--p,50) * 1%),
    var(--track,var(--field)) 100%);-webkit-mask:radial-gradient(circle,#000 0 59%,rgba(0,0,0,0) 0) exclude,
               radial-gradient(circle,#000 0 100%);-webkit-mask-composite:xor;mask:radial-gradient(circle,rgba(0,0,0,0) 0 59%,#000 60%)}
.xp-ring span{position:relative;z-index:1}
.prof .pcover{background:linear-gradient(to bottom,rgba(0,0,0,0) 55%,var(--glass-flat,var(--glass)) 100%),
    linear-gradient(118deg,#2fd6a6 0%,#39b6d8 42%,#7b6cff 100%)}
.dm-row .dm-unread{background:var(--ok-fg,#0d9a74);box-shadow:0 0 0 3px var(--glass-flat,var(--glass))}
.dm-row.unread{background:var(--surf-inset,var(--field))}
#app:not(.server-mode) .wrap:has(.dm-box){display:flex;flex-direction:column;height:100%}
.dm-box{flex:1;min-height:0;display:flex;flex-direction:column}
.dm-box .chat-scroll{flex:1;min-height:0;overflow-y:auto}
.dm-box .composer{flex:0 0 auto;padding-top:10px}
body:has(#screen .acct) #themefab,
body:has(#screen .set-wrap) #themefab{display:none}
.lvl-t b{white-space:nowrap}
body:has(.dm-box) #themefab{display:none}

/* ------------------------------------------------------------------ craft.css */
:root{--i1:linear-gradient(140deg,#2fd6a6,#1fb894);--i2:linear-gradient(140deg,#31c0c8,#2a97c4);--i3:linear-gradient(140deg,#4f9ae8,#3f6fd8);--i4:linear-gradient(140deg,#6f76ee,#7b5fe0);--i5:linear-gradient(140deg,#9a6ae0,#a557c9);--iw:linear-gradient(140deg,#f0a63e,#e08234);--id:linear-gradient(140deg,#ee5a72,#cf3a56)}
.sr-ic.t1{background:var(--i1)}
.sr-ic.t2{background:var(--i4)}
.sr-ic.t3{background:var(--i3)}
.sr-ic.t4{background:var(--iw)}
.sr-ic.t5{background:var(--i5)}
.sr-ic.td{background:var(--id)}
.tile .tic.tg-teal{background:var(--i1)}
.tile .tic.tg-blue{background:var(--i3)}
.tile .tic.tg-violet{background:var(--i4)}
.tile .tic.tg-warm{background:var(--i5)}
.calc-card .tic{background:var(--i2)}
.sr-ic,.tile .tic,.calc-card .tic,.tr-ic{box-shadow:inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(0,0,0,.10),
    0 4px 10px -6px rgba(24,26,60,.5)}
.sgrp-b,.acct,.lvl-strip,.today-card,.card,.tile,.calc-card,.gcard,
.rm-tile,.set,.feed,.ev-card,.ach,.prof,.plus,.pv,.about-hero,
#nav,.srv-rail,.srv-side,.srv-main,.srv-members,.sheet,.comp-inner{box-shadow:inset 0 1px 0 var(--edge-hi,rgba(255,255,255,.5)),
    inset 0 -1px 0 var(--edge-lo,rgba(20,22,50,.05)),
    var(--sh-soft)}
body[data-mode="night"]{--edge-hi:rgba(255,255,255,.09);--edge-lo:rgba(0,0,0,.28)}
body[data-mode="day"]{--edge-hi:rgba(255,255,255,.85);--edge-lo:rgba(20,22,50,.06)}
body[data-mode="dusk"]{--edge-hi:rgba(255,255,255,.62);--edge-lo:rgba(20,22,50,.06)}
.today-card{box-shadow:inset 0 1px 0 var(--edge-hi),
    inset 0 -1px 0 var(--edge-lo),
    var(--sh-card)}
.sgrp-b>.srow+.srow::before,
.today-row+.today-row::before{content:"";position:absolute;left:60px;right:0;top:0;height:1px;background:var(--hair)}
.sgrp-b>.srow,.today-row{position:relative;border-top:0}
.srow.tall+.srow::before{left:0}
.inv-row+.inv-row{border-top:1px solid var(--hair)}
.inv-row{border-bottom:0}
.c-time,.dm-time,.lvl-t span,.xp-top span,.sv,.rm-m,.st3 .v,.pstat .v,
.mg-n,.sgrp-h small,.co-row b,.mk-price,.mk-rate,.badge,.rm-un,.cs-cnt,
.ach-n,.day-pill,.acct-ver,.yb-bar span,.set-h2{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1,"cv05" 1}
.acct-n,.set-h1,.greet,.htitle,.msg-title,.about-t,.set-h1{letter-spacing:-.021em}
.pname,.lvl-t b,.rm-n,.sr-l,.tt,.dm-name,.ch-name{letter-spacing:-.006em}
.sgrp-h,.section-label,.mem-grp,.cat-h,.cs-cat,.rm-sect{font-size:.7rem;letter-spacing:.075em;font-weight:700;opacity:.82}
.tile,.calc-card,.rm-tile,.srow,.today-row,.gcard,.dm-row,.ach,.pres-row,
.acct-status,.lvl-strip,.acct-edit,.cs-ch,.tchip,.btn,.rm-arrange{transition:transform .12s cubic-bezier(.2,.7,.3,1),
             background-color .16s ease,
             box-shadow .2s ease}
.tile:active,.calc-card:active,.rm-tile:active,.gcard:active,
.ach:active,.pres-row:active,.acct-edit:active,.btn:active{transform:scale(.978)}
button.srow:active,.today-row:active,.dm-row:active,
.acct-status:active,.lvl-strip:active,.cs-ch:active{transform:scale(.992)}
@media (prefers-reduced-motion:reduce){
  .tile,.calc-card,.rm-tile,.srow,.today-row,.gcard,.dm-row,.ach,
  .pres-row,.acct-status,.lvl-strip,.acct-edit,.btn{transition:none}
  .tile:active,.calc-card:active,.rm-tile:active,.gcard:active,
  .ach:active,.pres-row:active,.acct-edit:active,.btn:active{transform:none}
}
::selection{background:rgba(47,214,166,.28);color:var(--ink)}
body[data-mode="night"] ::selection{background:rgba(47,214,166,.32)}
input,textarea{caret-color:var(--teal)}
.scroll::-webkit-scrollbar,#screen::-webkit-scrollbar,
.chan-body::-webkit-scrollbar,.cs-body::-webkit-scrollbar{width:10px;height:10px}
.scroll::-webkit-scrollbar-thumb,#screen::-webkit-scrollbar-thumb,
.chan-body::-webkit-scrollbar-thumb,.cs-body::-webkit-scrollbar-thumb{background:var(--ink-dim);opacity:.4;border-radius:99px;border:3px solid transparent;background-clip:content-box}
.scroll:hover::-webkit-scrollbar-thumb,#screen:hover::-webkit-scrollbar-thumb,
.chan-body:hover::-webkit-scrollbar-thumb{background:var(--ink-mut);background-clip:content-box}
.av{box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.av .on{box-shadow:0 0 0 2.5px var(--surf-solid)}
.nav-item .badge,.rm-un,.dm-unread{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 2px 6px -3px rgba(20,22,60,.7)}
.comp-send svg{transform:translateX(1px)}
.srail-add svg,.chan-fab svg{transform:translateY(-.5px)}
.tiles .tile{min-height:0;padding:15px 15px 16px;display:flex;flex-direction:column;align-items:flex-start;gap:0}
.tile .tic{margin-bottom:11px}
.tile .tt{font-size:1rem;font-weight:650;line-height:1.25;margin:0}
.tile .td{font-size:.85rem;line-height:1.35;color:var(--ink-mut);margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#ambient{opacity:.94}
#ambient::after{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 78% 88%,rgba(8,9,18,.34),rgba(8,9,18,0) 62%)}
body[data-mode="day"] #ambient::after{background:radial-gradient(120% 90% at 78% 88%,rgba(255,255,255,.4),rgba(255,255,255,0) 62%)}
.rm-empty{border-style:dashed;border-width:1.5px;color:var(--ink-dim);font-size:.85rem;letter-spacing:.005em}
.pins-empty p,.empty-block p{font-size:.9rem;line-height:1.5;color:var(--ink-mut);max-width:30ch;margin:0 auto}
.today-end{font-style:normal;letter-spacing:.004em}
.hdr-acts{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.hdr-btn{width:var(--hit-min,44px);height:var(--hit-min,44px);display:grid;place-items:center;border-radius:999px;background:var(--glass-2,var(--chip));border:1px solid var(--glass-brd);color:var(--ink-soft);box-shadow:var(--sh-soft)}
.hdr-btn:hover{background:var(--glass-strong);color:var(--ink)}
.hdr-btn:active{transform:scale(.94)}
#themefab{display:none !important}

/* ============================================================================
   REFINEMENT PASS
   Everything below is new behaviour rather than an override, which is why it
   sits at the end rather than being folded into a component block above.
   ============================================================================ */

/* ---------------------------------------------------------------- SCROLL
   Three separate things were making scrolling feel wrong.

   1. No stable scrollbar gutter. A screen that scrolls is 10px narrower than
      one that does not, so every navigation between them nudged the whole
      layout sideways. That sideways twitch is most of why moving around the
      app felt unsteady.
   2. scroll-behavior:smooth was set globally, so every programmatic jump
      animated, including the scroll-to-bottom on opening a room. It now
      applies only where a human asked for a jump.
   3. No scroll anchoring control, so content loading above the viewport
      shifted what you were reading. */
#screen{scroll-behavior:auto}
/* Only where a scrollbar actually occupies layout. Mobile browsers overlay it,
   so reserving a gutter there just steals 10px from every screen. */
@media (pointer:fine) and (min-width:821px){#screen{scrollbar-gutter:stable}}
.chan-body,.chat-scroll,#screen,.scroll{overflow-anchor:auto;overscroll-behavior:contain}
[data-goday],[data-goanchor],.jump-new{scroll-behavior:smooth}

/* Momentum and edge behaviour that make a scroll container feel native rather
   than like a div with overflow. */
.chan-body,.chat-scroll,.cs-body,.mem-scroll,#screen{
  -webkit-overflow-scrolling:touch;
  scroll-padding-block:12px;
}

/* ---------------------------------------------------------------- NAVIGATION
   A forward push enters from the right, a back returns from the left, a tab
   change is a plain cross fade because a tab is a place you are, not a step
   you took. Before this every navigation was an instant swap, which is what
   made moving around feel like a set of pages rather than one app. */
@keyframes nav-in-right{from{opacity:0;transform:translate3d(18px,0,0)}to{opacity:1;transform:none}}
@keyframes nav-in-left{from{opacity:0;transform:translate3d(-14px,0,0)}to{opacity:1;transform:none}}
@keyframes nav-fade{from{opacity:0;transform:translate3d(0,5px,0)}to{opacity:1;transform:none}}
#screen.nav-fwd>.wrap{animation:nav-in-right .26s cubic-bezier(.22,.75,.28,1) both}
#screen.nav-back>.wrap{animation:nav-in-left .24s cubic-bezier(.22,.75,.28,1) both}
#screen.nav-swap>.wrap{animation:nav-fade .2s cubic-bezier(.25,.8,.35,1) both}

/* The per item stagger fights the screen transition: two animations on the
   same pixels reads as jitter. When a screen is moving as a whole, its
   children stay put. */
#screen.nav-fwd .wrap>*,
#screen.nav-back .wrap>*,
#screen.nav-swap .wrap>*{animation:none;opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  #screen.nav-fwd>.wrap,#screen.nav-back>.wrap,#screen.nav-swap>.wrap{animation:none}
}

/* ---------------------------------------------------------------- GLOW
   The coloured glow was doing too much. A teal halo under a button, a violet
   one on hover, another on chips and another on the brand mark reads as a
   sheen applied to everything rather than light coming from somewhere. Real
   depth is a tight contact shadow plus a wide soft one, both neutral, with
   colour only where the surface itself is coloured. */
:root{
  --glow-teal:0 6px 16px -8px rgba(20,120,95,.5),0 18px 44px -22px rgba(20,90,80,.45);
  --glow-violet:0 6px 16px -8px rgba(60,50,140,.5),0 18px 44px -22px rgba(50,42,120,.45);
}
.btn-primary{box-shadow:var(--glow-teal),inset 0 1px 0 rgba(255,255,255,.28)}
.btn-primary:hover{filter:none;box-shadow:var(--glow-violet),inset 0 1px 0 rgba(255,255,255,.32)}
.chip.on{box-shadow:0 2px 8px -4px rgba(20,90,80,.5)}
.brand .mark{box-shadow:0 4px 14px -8px rgba(20,90,80,.6)}
.card-glow-teal{box-shadow:var(--sh-card)}

/* ---------------------------------------------------------------- BUTTONS
   One family, three jobs. Primary is the single most likely action on a
   screen, glass is everything else, ghost is the quiet exit. They now share a
   height, a radius, a weight and a press, so a row of them lines up. */
.btn,.btn-primary,.btn-glass,.btn-ghost{
  min-height:var(--hit-min,44px);
  border-radius:var(--r-sm,14px);
  font-weight:640;letter-spacing:-.004em;
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:0 18px;
}
.btn-lg{min-height:calc(52px * var(--scale,1));padding:0 22px;font-size:1rem}
.btn-glass{background:var(--surf-inset,var(--chip));border:1px solid var(--glass-brd);color:var(--ink)}
.btn-glass:hover{background:var(--hover);border-color:var(--glass-brd)}
.btn-ghost{background:transparent;border:1px solid transparent;color:var(--ink-mut)}
.btn-ghost:hover{background:var(--hover);color:var(--ink)}
.btn:active,.btn-primary:active,.btn-glass:active,.btn-ghost:active{transform:scale(.982)}

/* ---------------------------------------------------------------- GLASS
   One material, one recipe. Every floating surface gets the same blur, the
   same edge and the same seat. The variation that is left is opacity, which
   is the only thing that should vary, because that is depth. */
.today-card,.sgrp-b,.acct,.lvl-strip,.card,.tile,.calc-card,.gcard,.rm-tile,
.set,.feed,.ev-card,.prof,.plus,.pv,.about-hero{
  border:1px solid var(--glass-brd);
}

/* ---------------------------------------------------------------- SWIPE
   The browser owns touch gestures until you tell it otherwise. pan-y means it
   keeps vertical scrolling, which must stay native and instant, and hands
   horizontal gestures to the app so a swipe can change tab.

   Anything that scrolls sideways of its own accord takes its gesture back, or
   the topic chips and the events rail would become impossible to scroll. */
#screen{touch-action:pan-y}
/* Only containers that genuinely scroll sideways. Listing a vertical one here hands
   its horizontal gestures back to the browser, which is what killed swiping on the
   Rooms tab: .rm-board is overflow-x:visible and never scrolls sideways at all. */
.topic-chips,.ev-row,.lab-grid{touch-action:pan-x pan-y}

/* While a swipe is being followed, nothing inside should try to animate its own
   press state at the same time. */
#app.swiping *{transition:none !important}

/* ---------------------------------------------------------------- ROOM WIZARD
   One sentence in, a whole room out. The proposal is shown as something you
   edit by tapping things off, not a form you fill in, because reviewing is
   faster than authoring and that is the entire point of the feature. */
.wz-ex{display:flex;flex-direction:column;gap:7px;margin:-4px 0 16px}
.wz-chip{
  text-align:left;padding:10px 13px;border-radius:var(--r-sm,14px);
  background:var(--surf-inset,var(--field));border:1px solid transparent;
  color:var(--ink-mut);font-size:.86rem;line-height:1.35;min-height:var(--hit-min,44px);
}
.wz-chip:hover{background:var(--hover);color:var(--ink);border-color:var(--glass-brd)}
.wz-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.wz-ic{
  width:56px;height:56px;border-radius:18px;flex:0 0 auto;display:grid;place-items:center;
  color:#fff;font-family:'Space Grotesk',Inter,sans-serif;font-weight:700;font-size:1.15rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),var(--sh-soft);
}
.wz-n{font-size:1.2rem;font-weight:700;letter-spacing:-.015em}
.wz-tag{font-size:.86rem;color:var(--ink-mut);line-height:1.35}
.wz-cat{margin-top:18px}
.wz-cn{
  font-size:.7rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink-dim);margin-bottom:8px;
}
.wz-ts{display:flex;flex-wrap:wrap;gap:7px}
.wz-t{
  display:inline-flex;align-items:center;gap:6px;
  min-height:38px;padding:0 12px;border-radius:999px;
  background:var(--surf-inset,var(--chip));border:1px solid var(--glass-brd);
  color:var(--ink);font-size:.87rem;font-weight:600;
}
.wz-t i{
  font-style:normal;font-size:.68rem;font-weight:700;letter-spacing:.04em;
  padding:2px 6px;border-radius:999px;background:var(--grad-soft);color:var(--teal);
}
.wz-t svg{color:var(--ink-dim)}
.wz-t.off{opacity:.38;text-decoration:line-through;background:transparent}
.wz-rules{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:7px}
.wz-rules li{color:var(--ink-mut);font-size:.88rem}
.wz-rules button{
  text-align:left;background:none;color:var(--ink-soft);font:inherit;line-height:1.4;padding:2px 0;
}
.wz-rules button.off{opacity:.38;text-decoration:line-through}
.inv-link{
  display:flex;align-items:center;gap:10px;justify-content:space-between;
  padding:12px 14px;border-radius:var(--r-sm,14px);margin-bottom:14px;
  background:var(--surf-inset,var(--field));border:1px solid var(--glass-brd);
}
.inv-link span{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9rem;color:var(--ink)}

/* ---------------------------------------------------------------- ROLES
   A permission is a sentence, not a bitmask. Grouped by the job it belongs to,
   so an owner reads down a short list and understands every line of it. */
.rl-body{padding:4px 0}
.rl-grp{padding:10px 14px}
.rl-grp+.rl-grp{border-top:1px solid var(--hair)}
.rl-h{
  display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:800;
  letter-spacing:.09em;text-transform:uppercase;margin-bottom:9px;
}
.rl-h span{
  padding:1px 7px;border-radius:999px;background:var(--chip);
  color:var(--ink-mut);font-size:.7rem;letter-spacing:0;
}
.rl-people{display:flex;flex-direction:column;gap:2px}
.rl-p{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  min-height:var(--hit-min,44px);padding:5px 8px;border-radius:12px;
  background:transparent;color:var(--ink);font-size:.94rem;font-weight:600;
}
.rl-p:hover{background:var(--hover)}
.rl-p span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rl-p svg{color:var(--ink-dim)}
.rl-sec{
  padding:14px 14px 6px;font-size:.7rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-dim);
}
.rl-dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto}

/* ---------------------------------------------------------------- TOPIC TOOLS
   Owners and moderators manage topics from the same sheet everyone uses to jump
   between them, rather than from a settings screen three taps away. Everyone
   else never sees these controls at all, so the sheet stays a jump list. */
.cs-tools{display:grid;grid-template-columns:1fr auto;gap:9px;margin-bottom:14px}
.cs-new{justify-content:center}
.cs-arr{padding:0 16px}
.cs-group{margin-bottom:2px}
.cs-list{display:flex;flex-direction:column;min-height:6px}
.cs-cat{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cs-add{
  width:30px;height:30px;border-radius:9px;display:grid;place-items:center;
  background:var(--chip);color:var(--ink-mut);flex:0 0 auto;
}
.cs-add:hover{background:var(--hover);color:var(--ink)}
.cs-empty{
  margin:4px 0 8px;padding:12px;border-radius:12px;text-align:center;
  border:1.5px dashed var(--glass-brd);color:var(--ink-dim);font-size:.83rem;
}
.cs-grip{flex:0 0 auto;color:var(--ink-dim);cursor:grab;touch-action:none;margin-right:-2px}
.cs-ch.arr{touch-action:none;cursor:grab}
.cs-del{
  width:32px;height:32px;border-radius:9px;display:grid;place-items:center;
  background:transparent;color:var(--ink-dim);flex:0 0 auto;
}
.cs-del:hover{color:#e0405f;background:rgba(240,80,110,.12)}
.cs-ghost{
  position:fixed;left:0;top:0;z-index:9999;pointer-events:none;margin:0;
  border-radius:14px;background:var(--surf-solid);box-shadow:var(--sh-lift);
  opacity:.97;display:flex;align-items:center;gap:11px;padding:0 14px;
}
.cs-dragging{opacity:.3}
.cs-ph{border-radius:12px;border:1.5px dashed var(--teal);background:rgba(47,214,166,.08);margin:2px 0}

/* the new topic form */
.nc-kinds{display:flex;flex-direction:column;gap:7px}
.nc-k{
  text-align:left;padding:11px 13px;border-radius:var(--r-sm,14px);
  background:var(--surf-inset,var(--field));border:1.5px solid transparent;
  min-height:var(--hit-min,44px);color:var(--ink);
}
.nc-k b{display:block;font-size:.94rem;font-weight:650}
.nc-k span{display:block;font-size:.82rem;color:var(--ink-mut);margin-top:2px;line-height:1.35}
.nc-k.on{border-color:var(--teal);background:var(--hover)}