*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --cream:#fffef5;--ink:#1a1a2a;
  --yellow:#FFD60A;--coral:#FF6B6B;--blue:#4CC9F0;
  --mint:#06D6A0;--lav:#C77DFF;--orange:#FF9F1C;
  --pink:#FF85A1;--teal:#00B4D8;
  --rule:rgba(0,0,0,0.06);
  --c-muted:rgba(20,20,50,.60);--c-done:rgba(0,0,0,.28);--c-div:rgba(0,0,0,.14);
}

/* ── FONT THEMES ──────────────────────────────────────────────── */
:root{--font-main:'Inter',sans-serif;--font-accent:'Fraunces',serif;--font-mono:'Space Mono',monospace}
[data-font="classic"]{--font-main:'Patrick Hand',cursive;--font-accent:'Caveat',cursive;--font-mono:'Space Mono',monospace}
[data-font="classic"] *[style*="font-accent"]{font-family:'Caveat',cursive!important}
[data-font="classic"] *[style*="font-main"]{font-family:'Patrick Hand',cursive!important}
html{scroll-behavior:smooth}
body.modal-open{overflow:hidden;overscroll-behavior:none}
body{background:var(--cream);font-family:var(--font-main);color:var(--ink);min-height:100vh;background-image:repeating-linear-gradient(transparent,transparent 31px,var(--rule) 31px,var(--rule) 32px);}
nav{background:#141426;padding:10px 18px;display:grid;grid-template-columns:auto minmax(220px,520px) auto auto auto;align-items:center;justify-content:center;gap:10px;position:sticky;top:0;z-index:100;box-shadow:0 6px 22px rgba(0,0,0,.16)}
.logo{font-family:var(--font-accent);font-size:1.55rem;font-weight:700;color:#fff;text-decoration:none;display:flex;align-items:center;gap:7px;white-space:nowrap}
.logo img{height:34px!important;width:34px!important;margin-right:0!important}
.logo span{color:var(--yellow)}
.nsearch{width:100%;position:relative}
.nsearch input{width:100%;padding:9px 38px 9px 15px;font-family:var(--font-main);font-size:1rem;
  border:1.5px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.1);color:#fff;outline:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
.nsearch input::placeholder{color:rgba(255,255,255,.5)}
.nsearch input:focus{border-color:var(--yellow)}
.nsearch .si{position:absolute;right:10px;top:50%;transform:translateY(-50%);pointer-events:none}
.hero{text-align:center;padding:34px 20px 24px}
.badge{display:inline-block;background:var(--yellow);color:#0d0920;font-family:var(--font-accent);font-size:.95rem;font-weight:700;
  padding:4px 16px;border-radius:4px;border:2px solid rgba(0,0,0,.3);transform:rotate(-1.5deg);margin-bottom:14px}
.hero h1{font-family:var(--font-accent);font-size:clamp(2.2rem,6vw,3.6rem);font-weight:700;line-height:1.1;display:inline-block;position:relative}
.hero h1::after{content:'';display:block;height:7px;background:var(--coral);border-radius:50%;margin-top:3px;transform:rotate(-.5deg) scaleX(1.04);opacity:.85}
.hero p{margin-top:14px;font-size:1.1rem;color:rgba(20,20,50,.68);max-width:520px;margin-left:auto;margin-right:auto}
.hstats{display:flex;justify-content:center;gap:16px;margin-top:20px;flex-wrap:wrap}
.stat{font-family:var(--font-accent);font-size:.95rem;font-weight:600;background:rgba(0,0,0,.05);border:1.5px solid rgba(0,0,0,.12);border-radius:8px;padding:4px 12px;box-shadow:2px 2px 0 rgba(0,0,0,.10)}
.tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:24px 16px 0}
.tab{font-family:var(--font-accent);font-size:.92rem;font-weight:600;padding:5px 14px;border:1.5px solid rgba(0,0,0,.16);border-radius:999px;background:#fff;cursor:pointer;box-shadow:2px 2px 0 rgba(0,0,0,.10);transition:all .15s;white-space:nowrap;color:var(--ink)}
.tab:hover,.tab.active{background:rgba(0,0,0,.07);color:var(--ink);transform:translateY(-2px);border-color:rgba(0,0,0,.24)}
.tab[data-cat="math"].active{background:var(--coral);border-color:var(--coral)}
.tab[data-cat="science"].active{background:var(--blue);border-color:var(--blue)}
.tab[data-cat="writing"].active{background:var(--mint);border-color:var(--mint);color:var(--ink)}
.tab[data-cat="study"].active{background:var(--lav);border-color:var(--lav)}
.tab[data-cat="finance"].active{background:var(--orange);border-color:var(--orange)}
.tab[data-cat="convert"].active{background:var(--teal);border-color:var(--teal)}
.tab[data-cat="misc"].active{background:var(--pink);border-color:var(--pink)}
.tab[data-cat="classes"].active{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}
.nb-tabs{display:flex;gap:3px;padding:0}
.nb-tab{font-family:var(--font-accent);font-size:.78rem;font-weight:600;padding:5px 11px;border:1.5px solid rgba(0,0,0,.12);border-radius:7px 7px 0 0;background:var(--nbtbg,#f4f4f4);cursor:pointer;color:var(--c-muted);transition:all .12s;border-bottom:none;position:relative}
.nb-tab.act{background:var(--nbtbg,#fff);border-color:var(--nbtc,rgba(0,0,0,.16));color:var(--nbtc,#000);border-bottom:2px solid var(--nbtc,#000)}
.nb-tab:hover:not(.act){background:var(--nbtbg,#f4f4f4);color:var(--nbtc,#000);opacity:.85}
.nb-panel{border:1.5px solid rgba(0,0,0,.12);border-radius:0 0 7px 7px;padding:8px;background:#fff;margin-top:-1px;border-top:none}
[data-theme="dark"] .nb-tab{background:var(--dm-card);border-color:var(--dm-bdr);color:var(--dm-subtle)}
[data-theme="dark"] .nb-tab.act{background:var(--dm-bg);border-bottom-color:var(--nbtc,var(--ink));color:var(--nbtc,var(--ink))}
[data-theme="dark"] .nb-panel{background:var(--dm-bg);border-color:var(--dm-bdr)}
[data-theme="glass"] .nb-tab{background:var(--nbtbg,rgba(255,255,255,.06));border-color:rgba(255,255,255,.1);color:rgba(255,255,255,.6)}
[data-theme="glass"] .nb-tab.act{background:var(--nbtbg,rgba(255,255,255,.1));border-bottom-color:var(--nbtc,rgba(255,255,255,.8));color:var(--nbtc,#fff)}
[data-theme="glass"] .nb-panel{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1)}
.slabel{font-family:var(--font-accent);font-size:1.4rem;font-weight:700;padding:26px 20px 0;max-width:1160px;margin:0 auto}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(198px,1fr));gap:18px;padding:18px 20px 60px;max-width:1160px;margin:0 auto}
.card{background:#fff;border:1.5px solid rgba(0,0,0,.12);border-radius:14px;padding:20px 16px 16px;cursor:pointer;position:relative;box-shadow:4px 4px 0 rgba(0,0,0,.09);transition:transform .15s,box-shadow .15s,border-color .15s;display:flex;flex-direction:column;gap:8px}
.card:nth-child(odd){transform:rotate(-.5deg)}.card:nth-child(even){transform:rotate(.4deg)}
.card:hover{transform:rotate(0deg) translateY(-5px)!important;box-shadow:6px 6px 0 rgba(0,0,0,.14)!important;border-color:rgba(0,0,0,.22)}
.card::before{content:'';position:absolute;top:-7px;left:50%;transform:translateX(-50%);width:32px;height:12px;background:rgba(255,214,10,.92);border:1.5px solid rgba(0,0,0,.22);border-radius:3px}
.stripe{position:absolute;top:0;left:0;right:0;height:5px;border-radius:11px 11px 0 0}
.cicon{font-size:2rem;line-height:1}.ctitle{font-family:var(--font-accent);font-size:1.2rem;font-weight:700}
.cdesc{font-size:.83rem;color:rgba(20,20,50,.62);line-height:1.4;flex:1}
.cmeta{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:4px}
.ctype{display:inline-block;font-family:var(--font-accent);font-size:.76rem;font-weight:700;padding:2px 9px;border-radius:999px;background:rgba(20,20,50,.07);color:rgba(20,20,50,.72)}
.ctag{display:inline-block;font-family:var(--font-accent);font-size:.8rem;font-weight:600;padding:2px 10px;border-radius:999px;border:1.5px solid currentColor;width:fit-content}
.card[data-cat="math"] .stripe{background:var(--coral)}.card[data-cat="math"] .ctag{color:var(--coral)}
.card[data-cat="science"] .stripe{background:var(--blue)}.card[data-cat="science"] .ctag{color:var(--blue)}
.card[data-cat="writing"] .stripe{background:var(--mint)}.card[data-cat="writing"] .ctag{color:var(--mint)}
.card[data-cat="study"] .stripe{background:var(--lav)}.card[data-cat="study"] .ctag{color:var(--lav)}
.card[data-cat="finance"] .stripe{background:var(--orange)}.card[data-cat="finance"] .ctag{color:var(--orange)}
.card[data-cat="convert"] .stripe{background:var(--teal)}.card[data-cat="convert"] .ctag{color:var(--teal)}
.card[data-cat="misc"] .stripe{background:var(--pink)}.card[data-cat="misc"] .ctag{color:var(--pink)}
.card[data-cat="classes"] .stripe{background:var(--yellow)}.card[data-cat="classes"] .ctag{color:#b88700}
.card-featured{grid-column:1/-1;max-width:680px;width:100%;margin:0 auto;transform:none!important;background:linear-gradient(rgba(252,247,222,.65),rgba(252,247,222,.65)),url('assets/wc2026.jpg') center/100% 100% no-repeat!important;border-color:rgba(232,160,32,.45)!important;box-shadow:6px 6px 0 rgba(232,160,32,.22)!important;padding:22px 20px 70px;align-items:center;text-align:center}
.card-featured:hover{transform:translateY(-5px)!important;box-shadow:8px 8px 0 rgba(232,160,32,.3)!important}
.card-featured .cicon{font-size:4rem;filter:grayscale(1) contrast(1.3)}.card-featured .ctitle{font-size:1.8rem;-webkit-text-fill-color:unset;background:none;color:#5a1020!important;font-weight:800}.card-featured .cdesc{font-size:.92rem;color:#5a1020!important;font-weight:700}.card-featured .ctag{font-size:.88rem;padding:3px 14px}
.card-featured .stripe{background:linear-gradient(90deg,#e8a020,#ffd700)!important}
.card-featured .ctag{color:#e8a020!important;border-color:#e8a020!important}
.card[data-cat="exclusive"] .stripe{background:linear-gradient(90deg,#e8a020,#ffd700)}.card[data-cat="exclusive"] .ctag{color:#e8a020}
.wc-pitch{position:absolute;bottom:10px;left:14px;right:14px;height:50px;pointer-events:none;overflow:hidden}
.wcp1{position:absolute;bottom:0;left:0;font-size:2rem;line-height:1;transform:scaleX(-1);animation:wck1 3.2s ease-in-out infinite}
.wcp2{position:absolute;bottom:0;right:0;font-size:2rem;line-height:1;animation:wck2 3.2s ease-in-out infinite}
.wcba{position:absolute;bottom:4px;font-size:1.4rem;animation:wcbm 3.2s ease-in-out infinite;filter:grayscale(1) contrast(1.3)}
@keyframes wcbm{0%,100%{left:13%;transform:rotate(0deg)}6%{left:15%;transform:rotate(-40deg)}46%{left:76%;transform:rotate(380deg)}54%{left:74%;transform:rotate(400deg)}94%{left:13%;transform:rotate(760deg)}}
@keyframes wck1{0%,4%,9%,100%{transform:scaleX(-1)}6%{transform:scaleX(-1) rotate(18deg) translateY(-4px)}}
@keyframes wck2{0%,49%,55%,100%{transform:none}52%{transform:rotate(-18deg) translateY(-4px)}}
[data-theme="dark"] .card-featured{background:linear-gradient(rgba(18,12,4,.68),rgba(18,12,4,.68)),url('assets/wc2026.jpg') center/100% 100% no-repeat!important;border-color:rgba(232,160,32,.4)!important}
[data-theme="dark"] .card-featured .ctitle,[data-theme="dark"] .card-featured .cdesc{color:#e8c060!important}
[data-theme="glass"] .card-featured{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:linear-gradient(rgba(210,210,230,.62),rgba(210,210,230,.62)),url('assets/wc2026.jpg') center/100% 100% no-repeat!important;border-color:rgba(232,160,32,.32)!important}
[data-theme="glass"] .card-featured .ctitle,[data-theme="glass"] .card-featured .cdesc{color:#e8c060!important}
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.42);z-index:200;align-items:center;justify-content:center;padding:12px;overscroll-behavior:contain}
.overlay.open{display:flex}
.modal{background:var(--cream);border-radius:18px;box-shadow:0 12px 44px rgba(0,0,0,.18);width:100%;max-width:540px;max-height:92vh;overflow-y:auto;padding:26px 22px 22px;position:relative;background-image:repeating-linear-gradient(transparent,transparent 31px,rgba(0,0,0,.06) 31px,rgba(0,0,0,.06) 32px)}
.modal.tool-physformula{max-width:840px;max-height:min(82vh,760px);padding:22px 22px 18px;overflow:hidden}

.modal.tool-periodic{max-width:920px}
.mcls{position:absolute;top:10px;right:12px;font-size:1.4rem;background:none;border:none;cursor:pointer;font-family:var(--font-accent);font-weight:700;color:var(--ink);padding:3px 8px;border-radius:6px}
.mcls:hover{background:var(--yellow)}
.mtitle{font-family:var(--font-accent);font-size:1.7rem;font-weight:700;margin-bottom:16px;padding-right:28px}
.tg{display:flex;flex-direction:column;gap:7px;margin-bottom:11px}
.tg label{font-family:var(--font-accent);font-size:1rem;font-weight:600}
.tg input,.tg select,.tg textarea{padding:9px 12px;font-family:var(--font-main);font-size:1rem;border:2px solid rgba(0,0,0,.22);border-radius:10px;background:#fff;color:var(--ink);outline:none;box-shadow:3px 3px 0 rgba(0,0,0,.10)}
.tg textarea{resize:vertical}
.trow{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.trow>.tg{flex:1;min-width:90px}
.btn{font-family:var(--font-accent);font-size:1.05rem;font-weight:700;padding:9px 20px;border:2px solid rgba(0,0,0,.22);border-radius:10px;background:var(--yellow);color:#0d0920;cursor:pointer;box-shadow:3px 3px 0 rgba(0,0,0,.32);transition:all .12s;white-space:nowrap}
.btn:hover{transform:translateY(-2px);box-shadow:5px 5px 0 rgba(0,0,0,.38)}.btn:active{transform:translateY(1px);box-shadow:1px 1px 0 rgba(0,0,0,.25)}
.btn.sm{font-size:.9rem;padding:6px 14px}.brow{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.res{background:var(--cream);border:1.5px dashed rgba(0,0,0,.25);border-radius:10px;padding:12px 14px;font-family:var(--font-accent);font-size:1.1rem;min-height:44px;margin-top:6px;word-break:break-all;line-height:1.5;color:var(--ink)}
.res.big{font-size:1.5rem;font-weight:700;text-align:center}
.note{font-size:.78rem;color:var(--c-muted);margin-top:5px}
/* CALC */
.cw{background:#1a1a2e;border-radius:14px;padding:14px}
.cdisp{background:#0d0d1a;border-radius:10px;padding:12px 14px;margin-bottom:10px;text-align:right}
.cexpr{font-family:var(--font-main);font-size:.85rem;color:var(--c-muted);min-height:18px;word-break:break-all}
.cnum{font-family:var(--font-accent);font-size:2.2rem;font-weight:700;color:#fff;word-break:break-all;min-height:44px}
.cmode{display:flex;gap:6px;margin-bottom:8px}
.cmode button{font-family:var(--font-accent);font-size:.8rem;padding:3px 10px;border:1.5px solid #444;border-radius:6px;background:#2a2a3e;color:#aaa;cursor:pointer;transition:all .12s}
.cmode button.on{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}
.cgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
.ck{font-family:var(--font-accent);font-size:.95rem;font-weight:700;padding:10px 3px;border-radius:9px;border:none;cursor:pointer;transition:all .1s;text-align:center}
.ck:active{transform:scale(.93)}
.ck.num{background:#2a2a3e;color:#fff}.ck.num:hover{background:#3a3a4e}
.ck.op{background:var(--orange);color:#fff}.ck.op:hover{background:#e08800}
.ck.fn{background:var(--blue);color:#1a1a2e;font-size:.82rem}.ck.fn:hover{background:#3ab8df}
.ck.eq{background:var(--mint);color:var(--ink)}.ck.eq:hover{background:#05c090}
.ck.cl{background:var(--coral);color:#fff}.ck.cl:hover{background:#e05050}
/* POMO */
.pring{display:flex;justify-content:center;margin:8px 0}
.psvg{transform:rotate(-90deg)}
.ptime{font-family:var(--font-accent);font-size:3rem;font-weight:700;text-align:center;margin:6px 0}
.plbl{font-family:var(--font-accent);font-size:1.1rem;text-align:center;color:var(--c-muted);margin-bottom:12px}
/* FC */
.fc3dwrap{perspective:900px;margin:6px 0;cursor:pointer}
.fcard{height:150px;width:100%;position:relative;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.4,0,.2,1);cursor:pointer;user-select:none}
.fcard.flipped{transform:rotateY(180deg)}
.fc-front,.fc-back{position:absolute;inset:0;border-radius:14px;display:flex;align-items:center;justify-content:center;font-family:var(--font-accent);font-size:1.35rem;font-weight:600;text-align:center;padding:20px;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:2.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);transition:box-shadow .15s,transform .15s}
.fc-front{background:#fff;color:var(--ink)}
.fc-back{background:#4CC9F033;color:var(--ink);transform:rotateY(180deg)}
.fc3dwrap:hover .fc-front,.fc3dwrap:hover .fc-back{box-shadow:8px 8px 0 var(--ink)}
[data-theme="dark"] .fc-front{background:var(--dm-card);border-color:var(--dm-bdr);box-shadow:5px 5px 0 var(--dm-bdr)}
[data-theme="dark"] .fc-back{background:#4CC9F022;border-color:var(--dm-bdr);box-shadow:5px 5px 0 var(--dm-bdr)}
[data-theme="dark"] .fc3dwrap:hover .fc-front,[data-theme="dark"] .fc3dwrap:hover .fc-back{box-shadow:8px 8px 0 var(--dm-bdr)}
.fprog{font-family:var(--font-accent);font-size:1rem;color:var(--c-muted);text-align:center;margin-bottom:6px}
/* GRADE */
.grow{display:flex;gap:6px;align-items:center;margin-bottom:6px}
.grow input{flex:1;padding:6px 8px;border:2px solid rgba(0,0,0,.22);border-radius:8px;font-family:var(--font-main);font-size:.9rem;background:#fff;color:var(--ink);outline:none}
/* PROG BAR */
.pbar{height:13px;background:#e0e0e0;border-radius:999px;overflow:hidden;margin:5px 0}
.pfill{height:100%;border-radius:999px;transition:width .4s;background:var(--mint)}
/* ELEMENT */
.elcard{display:inline-block;background:#fff;border:2px solid var(--ink);border-radius:8px;padding:5px 11px;text-align:center;margin:3px;box-shadow:3px 3px 0 var(--ink);min-width:88px;transition:border-color .15s,box-shadow .15s}
.elcard:hover{box-shadow:5px 5px 0 var(--ink)}
.elnum{font-size:.7rem;color:var(--c-muted)}.elsym{font-family:var(--font-accent);font-size:1.7rem;font-weight:700}
.elname{font-size:.7rem;color:var(--c-muted)}.elmass{font-size:.68rem;color:var(--c-muted)}
canvas{border:2px solid var(--ink);border-radius:10px;background:#fff;width:100%;max-width:460px;display:block;margin:0 auto}
footer{background:var(--ink);color:#999;text-align:center;padding:20px;font-family:var(--font-accent);font-size:1rem}
footer span{color:var(--yellow)}
@media(max-width:480px){
  nav{grid-template-columns:auto 1fr auto auto;justify-content:stretch;padding:9px 12px}
  .logo{font-size:1.35rem}
  .logo img{height:30px!important;width:30px!important}
  .nsearch{grid-column:1/-1;grid-row:2}
  .fontb,.dmb{width:34px;height:34px}
  .modal{padding:18px 14px}.cgrid{gap:4px}.ck{padding:9px 2px;font-size:.85rem}.trow{flex-direction:column}
  .modal.tool-periodic{padding:14px 8px;max-width:100%}
}
@media(min-width:769px){
  .modal{max-width:700px;max-height:94vh;padding:28px 26px 24px}
  .modal.tool-periodic{max-width:860px}
  .mtitle{font-size:2rem}
  .tg label{font-size:1.08rem}
  .tg input,.tg select,.tg textarea{font-size:1.05rem;padding:10px 13px}
  .note{font-size:.85rem}
  .btn{font-size:1rem;padding:10px 18px}
  .tab{font-size:1.08rem;padding:7px 20px}
  .tabs{gap:10px;padding:28px 20px 0}
  .grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:22px;padding-top:22px;max-width:1320px}
  .card{padding:24px 18px 18px}
  .cicon{font-size:2.4rem}
  .ctitle{font-size:1.35rem}
  .cdesc{font-size:.9rem}
  .ctag{font-size:.84rem}
  .card-featured{max-width:860px;padding-bottom:84px}
  .card-featured .cicon{font-size:5rem}.card-featured .ctitle{font-size:2.2rem}.card-featured .cdesc{font-size:1rem}
  .wc-pitch{height:68px}.wcp1,.wcp2{font-size:3.1rem}.wcba{font-size:2.1rem}
}
@media(min-width:1280px){
  .modal{max-width:860px;max-height:96vh;padding:32px 32px 28px}
  .modal.tool-periodic{max-width:1020px}
  .mtitle{font-size:2.2rem}
  .tg label{font-size:1.13rem}
  .tg input,.tg select,.tg textarea{font-size:1.1rem;padding:11px 14px}
  .note{font-size:.9rem}
  .btn{font-size:1.05rem;padding:11px 20px}
  .tab{font-size:1.18rem;padding:8px 24px}
  .tabs{gap:12px;padding:32px 24px 0}
  .grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:26px;padding-top:26px;max-width:1480px}
  .card{padding:26px 20px 20px}
  .cicon{font-size:2.6rem}
  .ctitle{font-size:1.45rem}
  .cdesc{font-size:.95rem}
  .ctag{font-size:.88rem}
  .card-featured{max-width:1040px;padding-bottom:96px}
  .card-featured .cicon{font-size:5.8rem}.card-featured .ctitle{font-size:2.6rem}.card-featured .cdesc{font-size:1.05rem}
  .wc-pitch{height:84px}.wcp1,.wcp2{font-size:3.9rem}.wcba{font-size:2.6rem}
}
/* ── VOCAB BUILDER ──────────────────────────── */
.vbtabs{display:flex;gap:4px;margin-bottom:12px;flex-wrap:wrap}
.vbt{font-family:var(--font-accent);font-size:.88rem;font-weight:700;padding:4px 12px;border:1.5px solid rgba(0,0,0,.16);border-radius:999px;background:#fff;cursor:pointer;transition:all .12s;color:var(--ink)}
.vbt.act{background:var(--lav);border-color:var(--lav);color:#fff}
.vbt:hover{background:rgba(0,0,0,.06)}
.vbcard{background:rgba(199,125,255,.08);border:1.5px solid rgba(199,125,255,.28);border-radius:14px;padding:16px 18px;margin-bottom:10px}
.vbcard-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:4px}
.vbword{font-family:var(--font-accent);font-size:2rem;font-weight:700;color:var(--ink)}
.vbpos{font-family:var(--font-main);font-size:.82rem;color:var(--c-muted);margin-left:6px;font-style:italic}
.vbpron{background:none;border:none;cursor:pointer;font-size:1.2rem;padding:2px 4px;border-radius:6px;transition:transform .1s;flex-shrink:0}
.vbpron:hover{transform:scale(1.2)}
.vbtags{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:8px}
.vbtag{font-family:var(--font-accent);font-size:.72rem;font-weight:700;padding:2px 9px;border-radius:999px}
.vbtag-pte{background:rgba(76,201,240,.18);color:#0077aa}
.vbtag-ielts{background:rgba(6,214,160,.18);color:#057a52}
.vbtag-band{background:rgba(199,125,255,.18);color:#8822dd}
.vbdef{font-size:.93rem;margin:6px 0 4px;line-height:1.5;color:var(--ink)}
.vbex{font-size:.85rem;color:var(--c-muted);font-style:italic;margin-bottom:6px;line-height:1.4;border-left:3px solid rgba(199,125,255,.4);padding-left:8px}
.vbhook{font-size:.82rem;background:rgba(255,214,10,.18);border-radius:8px;padding:5px 10px;margin-bottom:8px;color:var(--ink);line-height:1.4}
.vbrow{font-size:.8rem;margin-bottom:4px;line-height:1.5;color:var(--ink)}
.vbrow b{font-family:var(--font-accent);font-size:.85rem}
.vbdivider{border:none;border-top:1px dashed rgba(0,0,0,.15);margin:8px 0}
.vbtranslate{display:flex;gap:6px;align-items:center;margin-top:8px;flex-wrap:wrap}
.vbtranslate input{flex:1;min-width:120px;padding:5px 10px;font-family:var(--font-main);font-size:.85rem;border:1.5px solid rgba(0,0,0,.18);border-radius:8px;background:#fff;color:var(--ink)}
.vbtranslate button{font-family:var(--font-accent);font-size:.85rem;font-weight:700;padding:5px 12px;border:1.5px solid var(--lav);border-radius:8px;background:transparent;color:var(--lav);cursor:pointer;transition:all .12s;white-space:nowrap}
.vbtranslate button:hover{background:var(--lav);color:#fff}
.vbtranslated{font-size:.83rem;margin-top:6px;padding:6px 10px;background:rgba(199,125,255,.1);border-radius:8px;line-height:1.5;color:var(--ink)}
.vbactions{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.vbsavebtn{font-family:var(--font-accent);font-size:.88rem;font-weight:700;padding:5px 13px;border:1.5px solid var(--lav);border-radius:8px;background:transparent;color:var(--lav);cursor:pointer;transition:all .12s}
.vbsavebtn.saved{background:var(--lav);color:#fff}
.vbopt{width:100%;text-align:left;padding:10px 14px;border:1.5px solid rgba(0,0,0,.16);border-radius:10px;margin-bottom:6px;font-family:var(--font-main);font-size:.92rem;background:#fff;cursor:pointer;color:var(--ink);transition:background .12s}
.vbopt:hover{background:rgba(0,0,0,.05)}
.vbopt.correct{background:rgba(6,214,160,.18)!important;border-color:var(--mint)!important}
.vbopt.wrong{background:rgba(255,107,107,.15)!important;border-color:var(--coral)!important}
.vbgoalbar{background:rgba(0,0,0,.08);border-radius:999px;height:7px;margin:6px 0 10px;overflow:hidden}
.vbgoalfill{height:100%;background:linear-gradient(90deg,var(--lav),var(--blue));border-radius:999px;transition:width .4s}
.vbloading{text-align:center;padding:28px 0;font-family:var(--font-accent);font-size:1.1rem;color:var(--c-muted)}
.vbscroll{max-height:380px;overflow-y:auto;padding-right:2px}
[data-theme="dark"] .vbt{background:var(--dm-card);border-color:var(--dm-bdr);color:var(--ink)}
[data-theme="dark"] .vbt.act{background:var(--lav);border-color:var(--lav);color:#fff}
[data-theme="dark"] .vbcard{background:var(--dm-card);border-color:var(--dm-bdr)}
[data-theme="dark"] .vbopt{background:var(--dm-input);border-color:var(--dm-bdr);color:var(--ink)}
[data-theme="dark"] .vbtranslate input{background:var(--dm-input);border-color:var(--dm-bdr);color:var(--ink)}
[data-theme="dark"] #vbExpIn,[data-theme="dark"] #vbGoalNum{background:var(--dm-input)!important;border-color:var(--dm-bdr)!important;color:var(--ink)!important}
[data-theme="glass"] #vbExpIn,[data-theme="glass"] #vbGoalNum{background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.22)!important;color:var(--ink)!important}
[data-theme="dark"] .vbhook{background:rgba(255,214,10,.1)}
[data-theme="glass"] .vbt{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:var(--ink)}
[data-theme="glass"] .vbt.act{background:var(--lav);border-color:var(--lav);color:#fff}
[data-theme="glass"] .vbcard{background:rgba(199,125,255,.10);border-color:rgba(199,125,255,.22)}
[data-theme="glass"] .vbopt{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:var(--ink)}
[data-theme="glass"] .vbtranslate input{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.22);color:var(--ink)}
/* ── WORLD CUP 2026 ──────────────────────────── */
.wctabs{display:flex;gap:4px;margin-bottom:12px;flex-wrap:wrap}
.wct{font-family:var(--font-accent);font-size:.88rem;font-weight:700;padding:4px 12px;border:1.5px solid rgba(0,0,0,.16);border-radius:999px;background:#fff;cursor:pointer;transition:all .12s;color:var(--ink)}
.wct.act{background:#e8a020;border-color:#e8a020;color:#fff}
.wct:hover{background:rgba(232,160,32,.12)}
.wccard{background:rgba(255,200,0,.07);border:1.5px solid rgba(232,160,32,.28);border-radius:12px;padding:12px 14px;margin-bottom:8px}
.wctable{width:100%;border-collapse:collapse;font-size:.83rem;margin-top:8px}
.wctable th{text-align:left;padding:5px 6px;border-bottom:2px solid rgba(0,0,0,.12);font-family:var(--font-accent);font-size:.88rem;color:var(--c-muted)}
.wctable td{padding:5px 6px;border-bottom:1px solid rgba(0,0,0,.06);font-family:var(--font-main)}
.wctable tr.wq1 td:first-child::before{content:'🟢 '}
.wctable tr.wq2 td:first-child::before{content:'🔵 '}
.wcmatch{display:grid;grid-template-columns:1fr 36px 18px 36px 1fr;align-items:center;gap:6px;padding:5px 0;border-bottom:1px solid rgba(0,0,0,.06);font-size:.83rem;font-family:var(--font-main)}
.wcmatch input[type=number]{width:36px;text-align:center;border:1.5px solid rgba(0,0,0,.18);border-radius:6px;padding:4px 2px;font-size:.95rem;background:#fff;color:var(--ink);-moz-appearance:textfield}
.wcmatch input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}
.wcvs{font-family:var(--font-accent);font-size:.8rem;color:var(--c-muted);text-align:center}
.wcteamsel{flex:1;padding:5px 8px;border:1.5px solid rgba(0,0,0,.16);border-radius:8px;background:#fff;color:var(--ink);font-family:var(--font-main);font-size:.86rem;width:100%}
.wcopt{width:100%;text-align:left;padding:9px 12px;border:1.5px solid rgba(0,0,0,.15);border-radius:10px;margin-bottom:6px;font-family:var(--font-main);font-size:.9rem;background:#fff;cursor:pointer;color:var(--ink);transition:background .12s}
.wcopt:hover{background:rgba(0,0,0,.04)}
.wcopt.correct{background:rgba(6,214,160,.18)!important;border-color:var(--mint)!important}
.wcopt.wrong{background:rgba(255,107,107,.15)!important;border-color:var(--coral)!important}
.wcteamgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:6px;margin-top:6px;max-height:320px;overflow-y:auto}
.wcteambtn{border:1.5px solid rgba(0,0,0,.13);border-radius:10px;padding:8px 4px;text-align:center;cursor:pointer;background:#fff;transition:all .12s;font-size:.72rem;color:var(--ink);font-family:var(--font-main)}
.wcteambtn:hover{background:rgba(255,200,0,.18);border-color:#e8a020}
.wctflag{font-size:1.5rem;display:block;margin-bottom:2px}
.wcdetail{background:rgba(255,200,0,.08);border:1.5px solid rgba(232,160,32,.3);border-radius:12px;padding:14px;margin-top:10px}
.wcstat{background:rgba(0,0,0,.05);border-radius:8px;padding:8px;text-align:center}
.wcstat-lbl{font-size:.72rem;color:var(--c-muted);font-family:var(--font-main)}
.wcstat-val{font-weight:700;font-family:var(--font-accent);font-size:1rem}
.wcconfbtn{font-family:var(--font-accent);font-size:.85rem;font-weight:700;padding:8px 4px;border:1.5px solid rgba(0,0,0,.15);border-radius:10px;background:#fff;cursor:pointer;color:var(--ink);transition:all .12s;text-align:center;width:100%}
.wcconfbtn:hover{background:rgba(232,160,32,.1);border-color:rgba(232,160,32,.35)}
.wc-hero{border-radius:14px;padding:14px;background:linear-gradient(135deg,rgba(232,160,32,.18),rgba(255,255,255,.06));border:1.5px solid rgba(232,160,32,.32);margin-bottom:10px}
.wc-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:10px 0}
.wc-kpi{background:rgba(255,255,255,.35);border:1px solid rgba(0,0,0,.08);border-radius:9px;padding:8px;text-align:center}
.wc-kpi b{display:block;font-family:var(--font-accent);font-size:1.2rem;line-height:1}
.wc-kpi span{font-family:var(--font-main);font-size:.7rem;color:var(--c-muted)}
.wc-toolbar{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.wc-chip{font-family:var(--font-main);font-size:.78rem;border:1.5px solid rgba(0,0,0,.14);border-radius:999px;background:#fff;color:var(--ink);padding:4px 10px;cursor:pointer}
.wc-chip.act{background:#e8a020;border-color:#e8a020;color:#fff}
.wc-search{flex:1;min-width:130px;border:1.5px solid rgba(0,0,0,.16);border-radius:999px;background:#fff;color:var(--ink);padding:6px 12px;font-family:var(--font-main);font-size:.82rem}
.wc-match-card{border-radius:11px;padding:10px 12px;margin-bottom:6px;cursor:pointer;transition:transform .1s,box-shadow .1s;border:1.5px solid rgba(180,180,180,.12);background:rgba(255,255,255,.02)}
.wc-match-card:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.12)}
.wc-match-card.live{background:rgba(255,80,80,.07);border-color:rgba(255,80,80,.3)}
.wc-match-card.done{background:rgba(255,200,0,.05);border-color:rgba(232,160,32,.18)}
.favbtn{position:absolute;top:6px;right:44px;font-size:1rem;cursor:pointer;z-index:3;transition:transform .15s;background:none;border:none;padding:0;line-height:1;color:var(--c-muted)}
.favbtn:hover{transform:scale(1.3)}.favbtn.on{color:var(--yellow)}.card.fav{border-color:var(--yellow)!important;box-shadow:4px 4px 0 rgba(255,214,10,.25)!important}
.wc-status{display:inline-block;font-family:var(--font-main);font-size:.66rem;border-radius:999px;padding:2px 7px;background:rgba(0,0,0,.07);color:var(--c-muted)}
.wc-status.live{background:rgba(255,107,107,.15);color:var(--coral)}
.wc-mini{font-family:var(--font-main);font-size:.72rem;color:var(--c-muted)}
.wc-section-title{font-family:var(--font-accent);font-size:1rem;font-weight:700;margin:10px 0 8px}
.wc-timeline{display:grid;gap:6px}
.wc-event{display:grid;grid-template-columns:48px 1fr;gap:8px;align-items:start;border:1px solid rgba(0,0,0,.08);border-radius:9px;padding:7px 9px;background:rgba(255,255,255,.25)}
.wc-event-time{font-family:var(--font-accent);font-weight:700;color:#e8a020;text-align:right}
.wc-event-text{font-family:var(--font-main);font-size:.82rem;line-height:1.35}
.wc-empty{font-family:var(--font-main);font-size:.82rem;color:var(--c-muted);text-align:center;padding:12px;border:1px dashed rgba(0,0,0,.15);border-radius:10px}
.wc-quick{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px}
.wc-qbtn{font-family:var(--font-accent);font-size:.84rem;font-weight:700;border:1.5px solid rgba(232,160,32,.35);border-radius:10px;background:rgba(232,160,32,.1);color:var(--ink);padding:8px 6px;cursor:pointer}
.wc-news-item{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid rgba(0,0,0,.06)}
.wc-news-item:last-child{border-bottom:none}
.wc-news-img{width:100px;height:68px;object-fit:cover;border-radius:6px;flex-shrink:0}
.wc-news-content{flex:1;min-width:0}
.wc-news-headline{font-family:var(--font-main);font-size:.88rem;font-weight:600;line-height:1.3;margin-bottom:3px}
.wctable{width:100%;border-collapse:collapse;font-size:.75rem;font-family:var(--font-main)}
.wctable th,.wctable td{padding:4px 3px;text-align:center;border-bottom:1px solid rgba(0,0,0,.06)}
.wctable th{font-size:.68rem;font-weight:700;color:var(--c-muted);text-transform:uppercase}
.wctable .wq1{background:rgba(6,214,160,.08)}.wctable .wq2{background:rgba(232,160,32,.08)}
[data-theme="dark"] .wc-news-item{border-color:rgba(255,255,255,.08)}
[data-theme="glass"] .wc-news-item{border-color:rgba(255,255,255,.1)}
[data-theme="dark"] .wcconfbtn{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:var(--ink)}
[data-theme="glass"] .wcconfbtn{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.28);color:var(--ink)}
[data-theme="dark"] .wct{background:var(--dm-card);border-color:var(--dm-bdr);color:var(--ink)}
[data-theme="dark"] .wct.act{background:#e8a020;border-color:#e8a020;color:#fff}
[data-theme="dark"] .wccard,[data-theme="dark"] .wcdetail{background:var(--dm-card);border-color:var(--dm-bdr)}
[data-theme="dark"] .wcmatch input,.wcmatch input,[data-theme="dark"] .wcteambtn,[data-theme="dark"] .wcopt,[data-theme="dark"] .wcteamsel{background:var(--dm-input);border-color:var(--dm-bdr);color:var(--ink)}
[data-theme="dark"] .wcstat{background:rgba(255,255,255,.06)}
[data-theme="dark"] .wc-kpi,[data-theme="dark"] .wc-search,[data-theme="dark"] .wc-chip,[data-theme="dark"] .wc-event,[data-theme="dark"] .wc-qbtn{background:var(--dm-input);border-color:var(--dm-bdr);color:var(--ink)}
[data-theme="glass"] .wct{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:var(--ink)}
[data-theme="glass"] .wct.act{background:#e8a020;border-color:#e8a020;color:#fff}
[data-theme="glass"] .wccard,[data-theme="glass"] .wcdetail{background:rgba(255,200,0,.06);border-color:rgba(232,160,32,.22)}
[data-theme="glass"] .wcmatch input,[data-theme="glass"] .wcteambtn,[data-theme="glass"] .wcopt,[data-theme="glass"] .wcteamsel{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:var(--ink)}
[data-theme="glass"] .wc-kpi,[data-theme="glass"] .wc-search,[data-theme="glass"] .wc-chip,[data-theme="glass"] .wc-event,[data-theme="glass"] .wc-qbtn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:var(--ink)}
@media(max-width:560px){.wc-kpis{grid-template-columns:repeat(2,1fr)}.wc-quick{grid-template-columns:1fr}.wc-event{grid-template-columns:38px 1fr}}
/* ── WELCOME SCREEN ─────────────────────────── */
#welcome{position:fixed;inset:0;z-index:500;display:flex;align-items:center;justify-content:center;padding:20px;background:var(--cream);background-image:repeating-linear-gradient(transparent,transparent 31px,var(--rule) 31px,var(--rule) 32px);transition:opacity .45s ease,transform .45s cubic-bezier(.4,0,.2,1)}
#welcome.out{opacity:0;transform:scale(.97);pointer-events:none}
.wbglogo{position:absolute;width:min(88vmin,580px);height:min(88vmin,580px);object-fit:cover;border-radius:50%;opacity:.09;pointer-events:none;z-index:0;filter:blur(2px)}
[data-theme="dark"] .wbglogo{opacity:.13}
[data-theme="glass"] .wbglogo{opacity:.18;filter:blur(3px)}
.wbox{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;max-width:380px;gap:0}
.wbtn{font-family:var(--font-accent);font-size:1.3rem;font-weight:700;padding:13px 32px;border:2.5px solid rgba(0,0,0,.25);border-radius:12px;background:var(--yellow);color:#0d0920;cursor:pointer;box-shadow:4px 4px 0 rgba(0,0,0,.30);transition:all .12s;margin-top:24px}
.wbtn:hover{transform:translateY(-3px);box-shadow:6px 6px 0 rgba(0,0,0,.36)}
.wbtn:active{transform:translateY(1px);box-shadow:2px 2px 0 rgba(0,0,0,.22)}
@keyframes confetti{0%{opacity:1;transform:translate(0,0) rotate(0deg) scale(1.3)}60%{opacity:1}100%{opacity:0;transform:translate(var(--tx),var(--ty)) rotate(var(--rot)) scale(.2)}}
[data-theme="glass"] #welcome{background:#0a0618;background-image:radial-gradient(ellipse at 14% 14%,rgba(255,214,10,.20) 0%,transparent 48%),radial-gradient(ellipse at 86% 8%,rgba(76,201,240,.18) 0%,transparent 44%),radial-gradient(ellipse at 7% 88%,rgba(199,125,255,.20) 0%,transparent 44%),radial-gradient(ellipse at 92% 86%,rgba(255,107,107,.16) 0%,transparent 40%),radial-gradient(ellipse at 50% 52%,rgba(6,214,160,.13) 0%,transparent 52%);background-attachment:fixed}
[data-theme="glass"] .wbox{background:rgba(255,255,255,.07);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border:1.5px solid rgba(255,255,255,.15);border-radius:24px;padding:44px 40px;box-shadow:0 20px 56px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.12)}
/* ── TGLASS THEME ───────────────────────────── */
[data-theme="glass"]{
  --cream:#0d0920;--ink:#f0ecff;--rule:rgba(255,255,255,0.04);
  --c-muted:rgba(240,236,255,.58);--c-done:rgba(240,236,255,.38);--c-div:rgba(255,255,255,.14);
}
[data-theme="glass"] body{background:#0a0618;background-image:radial-gradient(ellipse at 14% 14%,rgba(255,214,10,.20) 0%,transparent 48%),radial-gradient(ellipse at 86% 8%,rgba(76,201,240,.18) 0%,transparent 44%),radial-gradient(ellipse at 7% 88%,rgba(199,125,255,.20) 0%,transparent 44%),radial-gradient(ellipse at 92% 86%,rgba(255,107,107,.16) 0%,transparent 40%),radial-gradient(ellipse at 50% 52%,rgba(6,214,160,.13) 0%,transparent 52%);background-attachment:fixed;background-size:100% 100vh;background-repeat:no-repeat}
[data-theme="glass"] nav{background:rgba(6,3,18,0.78);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-bottom:1px solid rgba(255,214,10,.35)}
[data-theme="glass"] .stat{background:rgba(255,255,255,.10);backdrop-filter:blur(8px);border:1.5px solid rgba(255,255,255,.20);box-shadow:2px 2px 0 rgba(0,0,0,.25)}
[data-theme="glass"] .tab{border:1.5px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);backdrop-filter:blur(8px);box-shadow:2px 2px 0 rgba(0,0,0,.28);color:var(--ink)}
[data-theme="glass"] .tab:hover,[data-theme="glass"] .tab.active{background:rgba(255,255,255,.22);color:#fff;border-color:rgba(255,255,255,.35)}
[data-theme="glass"] .card{background:rgba(255,255,255,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1.5px solid rgba(255,255,255,.13);box-shadow:0 8px 28px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.10)}
[data-theme="glass"] .card:hover{box-shadow:0 16px 40px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.15)!important;border-color:rgba(255,255,255,.26)}
[data-theme="glass"] .card::before{background:rgba(255,214,10,.88);border-color:rgba(0,0,0,.25)}
[data-theme="glass"] .cdesc{color:rgba(240,236,255,.62)}
[data-theme="glass"] .hero p{color:rgba(240,236,255,.72)}
[data-theme="glass"] .overlay{background:rgba(0,0,0,.65);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
[data-theme="glass"] .modal{background:rgba(10,6,26,0.72);backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px);border:1.5px solid rgba(255,255,255,.14);box-shadow:0 24px 64px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.10);background-image:none}
[data-theme="glass"] .tg input,[data-theme="glass"] .tg select,[data-theme="glass"] .tg textarea{background:rgba(255,255,255,.08)!important;color:var(--ink)!important;border:1.5px solid rgba(255,255,255,.18)!important;box-shadow:0 2px 8px rgba(0,0,0,.2)!important;backdrop-filter:blur(4px)!important}
[data-theme="glass"] .res{background:rgba(255,255,255,.06);border:1.5px dashed rgba(255,255,255,.22);color:var(--ink)}
[data-theme="glass"] .pbar{background:rgba(255,255,255,.12)}
[data-theme="glass"] .pcs{background:rgba(255,255,255,.07)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;border:1.5px solid rgba(255,255,255,.16)!important}
[data-theme="glass"] .grow input{background:rgba(255,255,255,.08);color:var(--ink);border:1.5px solid rgba(255,255,255,.20)}
[data-theme="glass"] .elcard{background:rgba(255,255,255,.09);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1.5px solid rgba(255,255,255,.20);box-shadow:0 4px 14px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.12)}
[data-theme="glass"] .elcard:hover{border-color:rgba(255,255,255,.38);box-shadow:0 8px 22px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.18)}
[data-theme="glass"] canvas{background:rgba(255,255,255,.06);backdrop-filter:blur(4px);border:1.5px solid rgba(255,255,255,.20)}
[data-theme="glass"] footer{background:rgba(6,3,18,0.78);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-top:1px solid rgba(255,255,255,.08);color:var(--c-muted)}
[data-theme="glass"] #sttBtn{background:rgba(6,3,18,0.75);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--ink);border:2px solid rgba(255,214,10,.55);box-shadow:0 4px 16px rgba(0,0,0,.45),0 0 0 1px rgba(255,214,10,.2)}
[data-theme="glass"] .fc-front{background:rgba(255,255,255,.14);border:2px solid rgba(255,255,255,.28);box-shadow:0 8px 24px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.18);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
[data-theme="glass"] .fc-back{background:rgba(76,201,240,.16);border-color:rgba(76,201,240,.45);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
[data-theme="glass"] .fc3dwrap:hover .fc-front,[data-theme="glass"] .fc3dwrap:hover .fc-back{box-shadow:0 14px 36px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.22)}
[data-theme="glass"] #alsFormula{background:rgba(76,201,240,.10);color:#7dd3fc;border-color:rgba(76,201,240,.35)}
[data-theme="glass"] #wcTxt,[data-theme="glass"] #caseTxt,[data-theme="glass"] #b64In,[data-theme="glass"] #rndIn,[data-theme="glass"] #tsIn{background:rgba(255,255,255,.08)!important;color:var(--ink)!important;border:1.5px solid rgba(255,255,255,.18)!important;backdrop-filter:blur(4px)!important}
[data-theme="glass"] #rsPass{background:rgba(255,255,255,.06)!important;color:var(--ink)!important;border:1.5px solid rgba(255,255,255,.18)!important;backdrop-filter:blur(6px)!important}
[data-theme="glass"] #notesA{border:1.5px solid rgba(255,255,255,.20)!important;box-shadow:0 4px 16px rgba(0,0,0,.25)!important}
[data-theme="glass"] #fcDeckSel{background:rgba(255,255,255,.08)!important;color:var(--ink)!important;border:1.5px solid rgba(255,255,255,.20)!important;backdrop-filter:blur(4px)!important}
[data-theme="glass"] #swLps{color:rgba(240,236,255,.60)!important}
/* ── DARK MODE ─────────────────────────────── */
/* Midnight (default) */
[data-theme="dark"]{
  --dm-bg:#0f0f1e;--dm-nav:#070715;--dm-card:#181830;
  --dm-modal:#151528;--dm-input:#0c0c1c;--dm-bdr:#4444aa;
  --dm-subtle:rgba(180,185,220,.80);--dm-pbar:#22224a;
  --cream:#0f0f1e;--ink:#dde0f8;--rule:rgba(100,100,200,0.10);
  --c-muted:rgba(200,205,240,.60);--c-done:rgba(200,205,240,.35);--c-div:rgba(100,100,200,.20);
}
/* Sepia */
[data-theme="dark"][data-dtheme="sepia"]{
  --dm-bg:#1a1410;--dm-nav:#100d09;--dm-card:#231d16;
  --dm-modal:#1e1710;--dm-input:#120f0a;--dm-bdr:#7a5c2e;
  --dm-subtle:rgba(220,185,140,.85);--dm-pbar:#2e2418;
  --cream:#1a1410;--ink:#f2dfc0;--rule:rgba(150,120,70,.12)
}
/* Forest */
[data-theme="dark"][data-dtheme="forest"]{
  --dm-bg:#0c1a10;--dm-nav:#071209;--dm-card:#112218;
  --dm-modal:#0e1c13;--dm-input:#081208;--dm-bdr:#2d7a40;
  --dm-subtle:rgba(160,215,175,.85);--dm-pbar:#162e1c;
  --cream:#0c1a10;--ink:#c8f0d4;--rule:rgba(50,180,90,.10)
}
/* Ocean */
[data-theme="dark"][data-dtheme="ocean"]{
  --dm-bg:#06172a;--dm-nav:#030f1e;--dm-card:#0d2236;
  --dm-modal:#0a1c2e;--dm-input:#040d18;--dm-bdr:#1a5faa;
  --dm-subtle:rgba(160,205,240,.85);--dm-pbar:#0e2a40;
  --cream:#06172a;--ink:#c0ddf5;--rule:rgba(40,140,220,.10)
}
/* Dusk */
[data-theme="dark"][data-dtheme="dusk"]{
  --dm-bg:#1c1917;--dm-nav:#120f0e;--dm-card:#272220;
  --dm-modal:#221e1c;--dm-input:#151110;--dm-bdr:#7a5e52;
  --dm-subtle:rgba(210,200,190,.85);--dm-pbar:#302825;
  --cream:#1c1917;--ink:#e8e1d9;--rule:rgba(150,130,120,.10)
}
/* Common dark overrides */
[data-theme="dark"] body{background-color:var(--dm-bg)}
[data-theme="dark"] nav,[data-theme="dark"] footer{background:var(--dm-nav)}
[data-theme="dark"] .card,[data-theme="dark"] .stat,[data-theme="dark"] .elcard{background:var(--dm-card)}
[data-theme="dark"] .modal{background:var(--dm-modal);background-image:repeating-linear-gradient(transparent,transparent 31px,rgba(100,100,200,0.07) 31px,rgba(100,100,200,0.07) 32px)}
[data-theme="dark"] .tg input,[data-theme="dark"] .tg select,[data-theme="dark"] .tg textarea{background:var(--dm-input)!important;color:var(--ink)!important;border-color:var(--dm-bdr)!important;box-shadow:none!important;backdrop-filter:none!important}
[data-theme="dark"] .res{background:var(--dm-input);color:var(--ink)}
[data-theme="dark"] .tab{background:var(--dm-card);color:var(--ink)}
[data-theme="dark"] .grow input{background:var(--dm-input);color:var(--ink);border-color:var(--dm-bdr)}
[data-theme="dark"] .pbar{background:var(--dm-pbar)}
[data-theme="dark"] .cw{background:var(--dm-nav)}
[data-theme="dark"] .cdesc{color:var(--dm-subtle)}
[data-theme="dark"] .hero p{color:var(--dm-subtle)}
[data-theme="dark"] .note{color:var(--dm-subtle)}
[data-theme="dark"] .elname,[data-theme="dark"] .elmass,[data-theme="dark"] .elnum{color:var(--dm-subtle)}
[data-theme="dark"] .fprog{color:var(--dm-subtle)}
[data-theme="dark"] .plbl{color:var(--dm-subtle)}
[data-theme="dark"] .cwans{color:var(--dm-subtle)}
[data-theme="dark"] .cexpr{color:var(--dm-subtle)}
[data-theme="dark"] canvas{background:var(--dm-input)}
[data-theme="dark"] #wcTxt,[data-theme="dark"] #caseTxt,[data-theme="dark"] #b64In,[data-theme="dark"] #rndIn,[data-theme="dark"] #tsIn{background:var(--dm-input)!important;color:var(--ink)!important;border-color:var(--dm-bdr)!important;backdrop-filter:none!important}
[data-theme="dark"] #rsPass{background:var(--dm-card)!important;color:var(--ink)!important;border-color:var(--dm-bdr)!important;backdrop-filter:none!important}
[data-theme="dark"] .pcs{background:var(--dm-card)!important;border-color:var(--dm-bdr)!important;backdrop-filter:none!important}
[data-theme="dark"] #notesA{border-color:var(--dm-bdr)!important;box-shadow:none!important}
[data-theme="dark"] #fcDeckSel{background:var(--dm-input)!important;color:var(--ink)!important;border-color:var(--dm-bdr)!important;backdrop-filter:none!important}
[data-theme="dark"] #alsFormula{background:#0c4a6e;color:#bae6fd;border-color:#38bdf8}
[data-theme="dark"] .elcard{border-color:var(--dm-bdr);box-shadow:none}
[data-theme="dark"] .eldetail{background:var(--dm-card);border-color:var(--dm-bdr);box-shadow:none}
[data-theme="glass"] .eldetail{background:rgba(255,255,255,.09);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1.5px solid rgba(255,255,255,.20);box-shadow:0 4px 14px rgba(0,0,0,.3)}
/* Percentage calc sections */
.pcs{background:#fff;border:2px solid rgba(0,0,0,.18);border-radius:10px;padding:11px;margin-bottom:0}
/* Element category color legend */
.elcat{display:inline-block;font-size:.58rem;padding:1px 5px;border-radius:3px;margin-top:2px;font-weight:700;letter-spacing:.02em}
.eldetail{background:var(--card);border:2px solid rgba(0,0,0,.15);border-radius:12px;padding:14px 16px;box-shadow:3px 3px 0 rgba(0,0,0,.09)}
#elLayout{margin-top:8px}
@media(min-width:600px){#elLayout{display:flex;align-items:flex-start;gap:14px}#elLayout #elRes{flex:1;min-width:0;margin-top:0!important}#elLayout #elDetail{width:240px;flex-shrink:0;position:sticky;top:8px;margin-top:0!important}}
/* ── Periodic table grid ── */
.ptbar{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-bottom:10px}
.ptbar #elSrch{flex:1;min-width:150px;padding:7px 11px;border:2px solid rgba(0,0,0,.2);border-radius:9px;font-family:var(--font-main);font-size:.92rem;background:#fff;color:var(--ink);outline:none}
.ptseg{display:flex;align-items:center;gap:5px;font-family:var(--font-main);font-size:.74rem;color:var(--c-muted)}
.ptopt{border:2px solid rgba(0,0,0,.18);background:#fff;border-radius:7px;padding:3px 9px;font-family:var(--font-main);font-size:.76rem;cursor:pointer;color:var(--ink)}
.ptopt.active{background:var(--yellow);border-color:var(--ink)}
.ptseg select{padding:4px 7px;border:2px solid rgba(0,0,0,.18);border-radius:7px;font-family:var(--font-main);font-size:.76rem;background:#fff;color:var(--ink);cursor:pointer}
.ptlegend{display:flex;flex-wrap:wrap;gap:5px 12px;align-items:center;margin-bottom:9px;font-family:var(--font-main);font-size:.7rem;color:var(--c-muted)}
.ptli{display:inline-flex;align-items:center;gap:4px}
.ptsw{width:11px;height:11px;border-radius:3px;display:inline-block}
.ptbar2{width:110px;height:11px;border-radius:6px;background:linear-gradient(90deg,#2c7bb6,#43d3c9,#ffd166,#e63946);display:inline-block}
.ptlk{font-weight:700}
.ptwrap{width:100%}
.ptgrid{display:grid;grid-template-columns:repeat(18,1fr);gap:2px}
.pttile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:1/1;border:1px solid rgba(0,0,0,.16);border-radius:5px;background:var(--tc,#e8e8e8);cursor:pointer;padding:1px 0 0;overflow:hidden;font-family:var(--font-main);line-height:1.02;color:#15191f;transition:transform .15s,box-shadow .15s;min-width:0;box-shadow:1px 2px 6px rgba(0,0,0,.1)}
.pttile:hover{transform:translateY(-3px);box-shadow:2px 6px 16px rgba(0,0,0,.22);z-index:6;border-color:rgba(0,0,0,.3)}
.ptn{font-size:.42rem;align-self:flex-start;margin:1px 0 0 2px;opacity:.85}
.pts{font-family:var(--font-accent);font-weight:700;font-size:1.05rem;margin-top:-1px}
.ptnm{font-size:.34rem;max-width:96%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.92}
.ptm{font-size:.32rem;opacity:.7}
.ptmark{font-family:var(--font-main);font-size:.5rem;color:#15191f;justify-content:center;cursor:default}
.ptmark:hover{transform:none;box-shadow:none}
.ptspacer{height:7px}
.pttile.ptdim{opacity:.2;filter:grayscale(.7)}
.pttile.pthit{outline:2px solid var(--ink);outline-offset:-1px;box-shadow:0 0 0 3px rgba(255,209,102,.75);z-index:7}
@media(max-width:768px){.ptnm,.ptm{display:none}.modal.tool-periodic .pts{font-size:.68rem}.modal.tool-periodic .ptn{font-size:.3rem}.modal.tool-periodic .ptgrid{gap:1px}.modal.tool-periodic .ptmark{font-size:.28rem;border-radius:4px}.ptwrap{overflow-x:hidden;padding-bottom:4px}.ptgrid{min-width:0}#ptLegend{display:none}.ptcl-mob{display:flex;flex-wrap:wrap;gap:5px 8px;margin-bottom:8px}.ptcl-mob .ptseg{display:flex;align-items:center;gap:4px}.ptcl-mob .ptseg span{font-size:.7rem;font-weight:600;color:var(--c-muted);white-space:nowrap}.ptcl-mob .ptseg select{font-size:.72rem;padding:3px 5px;border:1.5px solid rgba(0,0,0,.16);border-radius:5px;background:#fff;color:var(--ink);font-family:var(--font-main);max-width:95px}}

@media(max-width:430px){.modal.tool-periodic .pts{font-size:.58rem}.modal.tool-periodic .ptn{font-size:.26rem}.modal.tool-periodic .ptmark{font-size:.24rem}}
@media(min-width:769px){.modal.tool-periodic .pts{font-size:1.3rem}.modal.tool-periodic .ptn{font-size:.55rem}.modal.tool-periodic .ptnm{font-size:.45rem}.modal.tool-periodic .ptm{font-size:.4rem}.modal.tool-periodic .ptgrid{gap:3px}.modal.tool-periodic .ptmark{font-size:.7rem;border-radius:6px}}
.ptclass{display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:9px;align-items:flex-start}
.ptcl-toggle{display:none}
.ptclgrp{display:flex;flex-wrap:wrap;align-items:center;gap:3px}
.ptclgrp>span{font-family:var(--font-main);font-size:.7rem;font-weight:600;color:var(--c-muted);margin-right:3px;min-width:44px}
.ptcl{border:1.5px solid rgba(0,0,0,.14);background:#fff;border-radius:5px;padding:2px 7px;font-family:var(--font-main);font-size:.7rem;cursor:pointer;color:var(--ink);transition:all .1s}
.ptcl:hover{background:rgba(0,0,0,.04)}
.ptcl.act{background:var(--yellow);border-color:var(--ink);font-weight:600}
[data-theme="dark"] .ptcl{background:var(--dm-input);color:var(--ink);border-color:var(--dm-bdr)}
[data-theme="dark"] .ptcl.act{background:var(--yellow);color:#0d0920;border-color:var(--ink)}
[data-theme="dark"] .ptcl-toggle{background:var(--dm-input);color:var(--ink);border-color:var(--dm-bdr)}
[data-theme="glass"] .ptcl{background:rgba(255,255,255,.09);color:#eee;border-color:rgba(255,255,255,.2)}
[data-theme="glass"] .ptcl.act{background:var(--yellow);color:#0d0920}
[data-theme="glass"] .ptcl-toggle{background:rgba(255,255,255,.09);color:#eee;border-color:rgba(255,255,255,.2)}
/* ── Element detail modal ── */
.elov{display:none;position:fixed;inset:0;z-index:400;background:rgba(0,0,0,.55);align-items:center;justify-content:center;padding:14px}
.elov.open{display:flex}
.elmodal{background:var(--cream);border-radius:18px;width:100%;max-width:440px;max-height:92vh;overflow-y:auto;padding:20px 20px 22px;position:relative;box-shadow:0 16px 50px rgba(0,0,0,.32);border-top:5px solid var(--tc,#888)}
.elx{position:absolute;top:8px;right:11px;font-size:1.3rem;background:none;border:none;cursor:pointer;font-family:var(--font-accent);font-weight:700;color:var(--ink);padding:2px 7px;border-radius:6px;line-height:1}
.elx:hover{background:var(--yellow)}
.elhead{display:flex;gap:14px;align-items:center;margin-bottom:6px;padding-right:24px}
.elbig{width:82px;height:82px;border-radius:13px;background:var(--tc);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#10141a;flex-shrink:0;box-shadow:3px 4px 10px rgba(0,0,0,.18);transform:perspective(300px) rotateX(2deg) rotateY(-2deg);transition:transform .3s}
.elbig:hover{transform:perspective(300px) rotateX(0) rotateY(0) scale(1.04)}
.elbig .n{font-size:.7rem;font-family:var(--font-main)}
.elbig .s{font-family:var(--font-accent);font-size:2.5rem;font-weight:700;line-height:.9}
.elbig .m{font-size:.58rem;font-family:var(--font-main);opacity:.8}
.eltitle{font-family:var(--font-accent);font-size:1.9rem;font-weight:700;line-height:1;margin-bottom:6px}
.elbadges{display:flex;flex-wrap:wrap;gap:4px}
.elfields{display:grid;grid-template-columns:1fr 1fr;gap:9px 14px;margin:14px 0 6px;font-family:var(--font-main)}
.elf .k{display:block;font-size:.68rem;color:var(--c-muted)}
.elf .v{font-size:.92rem;font-weight:700}
.elf .ecv{font-family:var(--font-accent);font-size:1.05rem;font-weight:700}
.elbohr{display:flex;flex-direction:column;align-items:center;margin:6px 0 4px;perspective:400px}
.bohrsvg{transform:perspective(400px) rotateX(3deg) rotateY(2deg);filter:drop-shadow(2px 4px 8px rgba(0,0,0,.12));transition:transform .4s;display:block;border-radius:50%}
.bohrsvg:hover{transform:perspective(400px) rotateX(0deg) rotateY(0deg) scale(1.05)}
.elshells{font-family:var(--font-main);font-size:.72rem;color:var(--c-muted);margin-top:2px}
.eluse{font-family:var(--font-accent);font-size:1.12rem;text-align:center;margin-top:8px;padding-top:10px;border-top:1.5px dashed rgba(0,0,0,.18)}
@media(min-width:600px){.elmodal{max-width:460px}}
[data-theme="dark"] .elmodal{background:var(--dm-modal);color:var(--ink)}
[data-theme="dark"] .ptbar #elSrch,[data-theme="dark"] .ptopt,[data-theme="dark"] .ptseg select{background:var(--dm-input);color:var(--ink);border-color:var(--dm-bdr)}
[data-theme="dark"] .pttile{border-color:rgba(255,255,255,.1)}
[data-theme="dark"] .eluse{border-top-color:rgba(255,255,255,.18)}
[data-theme="glass"] .elov{background:rgba(0,0,0,.7)}
[data-theme="glass"] .elmodal{background:rgba(10,6,26,.82);backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px);border:1.5px solid rgba(255,255,255,.14);border-top:5px solid var(--tc,#888);color:#eee}
[data-theme="glass"] .ptbar #elSrch,[data-theme="glass"] .ptopt,[data-theme="glass"] .ptseg select{background:rgba(255,255,255,.09);color:#eee;border-color:rgba(255,255,255,.2)}
[data-theme="glass"] .pttile{border-color:rgba(255,255,255,.18)}
[data-theme="glass"] .eluse{border-top-color:rgba(255,255,255,.2)}
/* Theme swatch buttons */
.dmt{width:22px;height:22px;border-radius:50%;border:2.5px solid transparent;cursor:pointer;padding:0;transition:all .15s;flex-shrink:0;outline:none}
.dmt:hover{transform:scale(1.15)}
.dmt.act{border-color:#fff;transform:scale(1.25)}
.dmt[data-dtheme=""]{background:linear-gradient(135deg,#0f0f1e 50%,#dde0f8 50%)}
.dmt[data-dtheme="sepia"]{background:linear-gradient(135deg,#1a1410 50%,#f2dfc0 50%)}
.dmt[data-dtheme="forest"]{background:linear-gradient(135deg,#0c1a10 50%,#c8f0d4 50%)}
.dmt[data-dtheme="ocean"]{background:linear-gradient(135deg,#06172a 50%,#c0ddf5 50%)}
.dmt[data-dtheme="dusk"]{background:linear-gradient(135deg,#1c1917 50%,#e8e1d9 50%)}
#dmThemes{display:none;gap:6px;align-items:center}
/* ── MODAL ANIMATION ───────────────────────── */
.overlay.open .modal{animation:mslide .2s cubic-bezier(.4,0,.2,1) both}
@keyframes mslide{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}
/* ── SCROLL TO TOP ─────────────────────────── */
#sttBtn{position:fixed;bottom:22px;right:22px;z-index:150;background:var(--ink);color:var(--cream);border:2.5px solid var(--yellow);border-radius:50%;width:44px;height:44px;font-size:1.3rem;cursor:pointer;box-shadow:3px 3px 0 var(--yellow);display:none;align-items:center;justify-content:center;transition:transform .15s}
#sttBtn.vis{display:flex}#sttBtn:hover{transform:translateY(-3px)}
/* ── NEW BADGE ─────────────────────────────── */
.cnew{position:absolute;top:7px;right:9px;background:var(--mint);color:var(--ink);font-family:var(--font-accent);font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:999px;border:1.5px solid var(--ink)}
.cnew.ai-badge{background:var(--lav)}
/* ── TAB COUNT BADGE ───────────────────────── */
.tbadge{background:rgba(255,255,255,.2);border-radius:999px;font-size:.73rem;padding:1px 7px;margin-left:4px;font-family:var(--font-main)}
/* ── THEME SWITCHER ─────────────────────────── */
.thsw{position:relative}
.thdrop{position:absolute;top:calc(100% + 8px);right:0;flex-direction:column;gap:2px;background:rgba(10,6,24,0.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1.5px solid rgba(255,255,255,.16);border-radius:12px;padding:5px;min-width:136px;z-index:300;display:none;overflow:hidden;box-shadow:0 8px 28px rgba(0,0,0,.45)}
.thdrop.open{display:flex;animation:tdrop .22s cubic-bezier(.4,0,.2,1) both}
/* font picker */
.fontsw{position:relative}
.fontb{width:38px;height:38px;background:rgba(255,255,255,.10);border:1.5px solid rgba(255,255,255,.22);border-radius:10px;color:#fff;font-size:1rem;padding:0;cursor:pointer;transition:background .15s,transform .15s;white-space:nowrap;font-family:var(--font-accent);font-weight:700;letter-spacing:.02em;display:flex;align-items:center;justify-content:center}
.fontb:hover{background:rgba(255,255,255,.18);transform:translateY(-1px)}
.fontdrop{display:none;flex-direction:column;position:absolute;top:calc(100% + 8px);right:0;min-width:180px;background:#1a1a2a;border:1.5px solid rgba(255,255,255,.18);border-radius:12px;padding:6px;box-shadow:0 8px 32px rgba(0,0,0,.45);z-index:9999}
.fontdrop.open{display:flex;animation:tdrop .22s cubic-bezier(.4,0,.2,1) both}
.fontopt{font-size:.95rem;font-weight:700;padding:9px 14px;border:none;border-radius:8px;cursor:pointer;text-align:left;background:none;color:#f0ecff;transition:background .12s;white-space:nowrap;width:100%}
.fontopt:hover{background:rgba(255,255,255,.12)}
.fontopt.act{background:rgba(255,255,255,.18);color:#FFD60A}

@keyframes tdrop{from{opacity:0;transform:translateY(-10px) scaleY(.9)}to{opacity:1;transform:none}}
.thopt{font-family:var(--font-accent);font-size:1.05rem;font-weight:700;padding:9px 14px;border:none;border-radius:8px;cursor:pointer;text-align:left;background:none;color:#f0ecff;transition:background .12s;white-space:nowrap;width:100%}
.thopt:hover{background:rgba(255,255,255,.12)}
.thopt.act{background:rgba(255,255,255,.18);color:#FFD60A}
.dmb{width:38px;height:38px;background:rgba(255,255,255,.10);border:1.5px solid rgba(255,255,255,.22);border-radius:10px;color:#fff;font-size:1rem;padding:0;cursor:pointer;transition:background .15s,transform .15s;white-space:nowrap;font-family:var(--font-accent);display:flex;align-items:center;justify-content:center;overflow:hidden}
.dmb:hover{background:rgba(255,255,255,.18);transform:translateY(-1px)}
/* ── TABLE STYLING ─────────────────────────── */
.tbl{width:100%;border-collapse:collapse;font-size:.87rem;margin-bottom:4px}
.tbl th{padding:7px 9px;border:2px solid var(--ink);text-align:center;font-family:var(--font-accent);font-weight:700;background:var(--coral);color:#fff}
.tbl td{padding:6px 9px;border:1.5px solid var(--ink);text-align:center;font-family:var(--font-main)}
.tbl tr:nth-child(even) td{background:rgba(76,201,240,.09)}
/* ── ITEM ROWS ─────────────────────────────── */
.itemrow{display:flex;align-items:center;gap:8px;padding:7px 4px;border-bottom:1px dashed rgba(100,100,180,.2);font-size:.9rem;flex-wrap:wrap}
/* ── SCROLLBAR ─────────────────────────────── */
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(100,100,180,.3);border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:rgba(100,100,180,.5)}
/* ── FORMULA BAR ────────────────────────────── */
#alsFormula{background:#e0f2fe;color:#0369a1;border-color:#38bdf8}
/* ── CLASSWIZ CALC EXTRAS ───────────────────── */
.cwtabs{display:flex;gap:3px;margin-bottom:8px;flex-wrap:wrap}
.cwt{flex:1;min-width:52px;padding:5px 3px;font-family:var(--font-accent);font-size:.8rem;font-weight:700;border:1.5px solid #555;border-radius:7px;background:#2a2a3e;color:#aaa;cursor:pointer;transition:all .12s}
.cwt.act{background:var(--yellow);color:#1a1a2e;border-color:var(--yellow)}
.cwshift{background:#e08000!important;color:#fff!important;border-color:#e08000!important}
.cwshift.on{background:#fff!important;color:#e08000!important;border:2px solid #e08000!important}
.cks .s{display:none;font-size:.68rem;color:#f90;line-height:1}
.cks .p{font-size:.78rem;line-height:1}
.shifted .cks .s{display:block}
.shifted .cks .p{display:none}
.cwans{font-family:var(--font-main);font-size:.78rem;color:var(--c-muted);text-align:right;margin-top:2px}
/* ── 3D DICE ────────────────────────────────── */
.dface{position:absolute;width:120px;height:120px;border:2.5px solid rgba(0,0,0,.2);border-radius:14px;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr;padding:12px;box-sizing:border-box;box-shadow:inset 0 0 14px rgba(0,0,0,.15)}
.pip{width:14px;height:14px;border-radius:50%;background:#fff;align-self:center;justify-self:center;box-shadow:0 1px 3px rgba(0,0,0,.25)}

/* ── TIMETABLE BUILDER ─────────────────────────── */
.tt-wrap{overflow-x:auto}
.tt-grid{display:grid;grid-template-columns:52px repeat(7,1fr);gap:2px;min-width:480px;margin-top:8px}
.tt-hdr{font-family:var(--font-accent);font-weight:700;text-align:center;padding:4px 2px;background:rgba(0,0,0,.07);border-radius:4px;font-size:.82rem}
.tt-time{font-family:var(--font-main);font-size:.68rem;color:var(--c-muted);display:flex;align-items:center;justify-content:flex-end;padding-right:4px}
.tt-cell{min-height:26px;border:1px solid rgba(0,0,0,.09);border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:var(--font-main);font-size:.65rem;text-align:center;padding:2px;transition:all .1s;word-break:break-all}
.tt-cell:hover{border-color:rgba(0,0,0,.28)}.tt-cell.filled{color:#fff;font-weight:700;border-color:transparent}
.tt-swatch{width:22px;height:22px;border-radius:50%;cursor:pointer;border:2.5px solid transparent;transition:transform .12s;flex-shrink:0}
.tt-swatch.sel{border-color:var(--ink);transform:scale(1.25)}
.tt-subj{padding:6px 10px;font-family:var(--font-main);font-size:.9rem;border:2px solid rgba(0,0,0,.18);border-radius:8px;background:#fff;color:var(--ink);outline:none}
[data-theme="dark"] .tt-hdr{background:rgba(255,255,255,.08)}
[data-theme="dark"] .tt-subj{background:var(--dm-input);color:var(--ink);border-color:var(--dm-bdr)}
[data-theme="glass"] .tt-subj{background:rgba(255,255,255,.08);color:var(--ink);border-color:rgba(255,255,255,.18)}
/* ── MIND MAP ───────────────────────────────────── */
.mm-center{font-family:var(--font-accent);font-size:1.4rem;font-weight:700;text-align:center;padding:10px 18px;border:2.5px solid var(--ink);border-radius:50px;display:inline-block;margin:0 auto;box-shadow:3px 3px 0 var(--ink)}
.mm-branch-wrap{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.mm-branch{border-left:3px solid var(--lav);padding:6px 10px;border-radius:0 8px 8px 0;background:rgba(199,125,255,.08);position:relative}
.mm-branch-title{font-family:var(--font-accent);font-size:1.1rem;font-weight:700;color:var(--ink)}
.mm-subs{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.mm-sub-tag{background:rgba(199,125,255,.15);border:1px solid rgba(199,125,255,.4);border-radius:6px;padding:2px 8px;font-family:var(--font-main);font-size:.8rem;cursor:pointer}
.mm-sub-tag:hover{background:rgba(199,125,255,.3)}
.mm-del{position:absolute;top:4px;right:6px;background:none;border:none;cursor:pointer;font-size:.85rem;opacity:.5}
.mm-del:hover{opacity:1}
[data-theme="dark"] .mm-branch{background:rgba(199,125,255,.05)}
/* ── STUDY STREAK ───────────────────────────────── */
.ss-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-top:8px}
.ss-day{width:100%;aspect-ratio:1;border-radius:4px;background:rgba(0,0,0,.06);border:1px solid rgba(0,0,0,.08);font-family:var(--font-accent);font-size:.65rem;display:flex;align-items:center;justify-content:center;color:var(--c-muted)}
.ss-day.studied{background:var(--mint);border-color:transparent;color:var(--ink)}
.ss-day.today{border:2px solid var(--coral)}
.ss-day.future{opacity:.3}
[data-theme="dark"] .ss-day{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.08)}
[data-theme="glass"] .ss-day{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12)}
/* ── RANDOM QUESTION ────────────────────────────── */
.rq-card{border:2px solid rgba(0,0,0,.15);border-radius:14px;padding:18px;box-shadow:4px 4px 0 rgba(0,0,0,.09)}
.rq-q{font-family:var(--font-accent);font-size:1.25rem;font-weight:700;color:var(--ink);margin-bottom:10px;line-height:1.35}
.rq-a{background:rgba(6,214,160,.1);border:1.5px solid rgba(6,214,160,.35);border-radius:8px;padding:10px 12px;font-family:var(--font-main);font-size:.95rem;color:var(--ink);display:none;margin-top:8px}
.rq-a.vis{display:block}
[data-theme="dark"] .rq-card{background:var(--dm-card);border-color:var(--dm-bdr);box-shadow:none}
[data-theme="glass"] .rq-card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);box-shadow:none}
/* ── PHYSICS FORMULA ────────────────────────────── */
.pf-cat{font-family:var(--font-accent);font-size:1.1rem;font-weight:700;margin:10px 0 5px;color:var(--coral)}
.pf-item{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid rgba(0,0,0,.06);flex-wrap:wrap}
.pf-formula{font-family:var(--font-accent);font-size:1.1rem;font-weight:700;min-width:130px;color:var(--ink)}
.pf-desc{font-family:var(--font-main);font-size:.85rem;color:var(--c-muted);line-height:1.4}
.pf-shell{display:flex;flex-direction:column;gap:8px;min-height:100%;overflow:visible}
.pf-chiprow{display:flex;gap:6px;margin:8px 0;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.pf-chiprow::-webkit-scrollbar{display:none}
.pf-chip{font-family:var(--font-accent);font-size:.95rem;font-weight:700;padding:6px 12px;border:2px solid rgba(0,0,0,.12);border-radius:999px;background:#fff;cursor:pointer;box-shadow:2px 2px 0 rgba(0,0,0,.08);color:var(--ink);white-space:nowrap;flex-shrink:0}
.pf-chip:hover{transform:translateY(-1px)}
.pf-chip.act{background:var(--blue);border-color:var(--blue);color:#112}
.pf-counts{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 4px}
.pf-count{font-family:var(--font-accent);font-size:.9rem;font-weight:700;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.05);border:1px solid rgba(0,0,0,.1);color:var(--ink)}
.pf-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:12px 14px;border:2px solid rgba(0,0,0,.12);border-radius:14px;background:linear-gradient(135deg,rgba(76,201,240,.14),rgba(255,214,10,.16))}
.pf-hero.compact{padding:6px 14px;margin-bottom:0;align-items:center;gap:8px}
.pf-hero.compact .pf-kicker,.pf-hero.compact .pf-meta{display:none}
.pf-hero.compact .pf-current{font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-hero.compact .pf-badge{flex-shrink:0}
.pf-kicker{font-family:var(--font-accent);font-size:.92rem;font-weight:700;color:var(--c-muted)}
.pf-current{font-family:var(--font-accent);font-size:1.45rem;font-weight:700;line-height:1.15;color:var(--ink)}
.pf-meta{font-size:.82rem;color:var(--c-muted);margin-top:4px}
.pf-overview{display:flex;flex-direction:column;gap:10px}
.pf-side{display:flex;flex-direction:column;gap:10px}
.pf-card{border:2px solid rgba(0,0,0,.12);border-radius:14px;padding:12px 14px;background:rgba(255,255,255,.72)}
.pf-lab,.pf-challenge{border:2px solid rgba(0,0,0,.12);border-radius:14px;padding:14px;background:rgba(255,255,255,.72);margin-bottom:12px}
.pf-lab-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.pf-badge{display:inline-block;font-family:var(--font-accent);font-size:.86rem;font-weight:700;padding:3px 10px;border-radius:999px;background:rgba(0,0,0,.06);color:var(--ink)}
.pf-vars{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px;margin:10px 0}
.pf-quick{display:flex;gap:6px;margin:8px 0;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.pf-quick::-webkit-scrollbar{display:none}
.pf-quick button{margin:0;white-space:nowrap;flex-shrink:0}
.pf-unit-row{display:flex;gap:4px;align-items:center}
.pf-unit-row input{flex:1;min-width:0}
.pf-unit-sel{font-family:var(--font-main);font-size:.85rem;padding:4px 6px;border:2px solid rgba(0,0,0,.12);border-radius:8px;background:#fff;color:var(--ink);cursor:pointer;flex-shrink:0;max-width:80px}
[data-theme="dark"] .pf-unit-sel{background:var(--dm-card);border-color:var(--dm-bdr)}
[data-theme="glass"] .pf-unit-sel{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16)}
.pf-result{margin-top:8px}
.pf-tabs{display:flex;gap:8px;flex-wrap:wrap;position:sticky;top:0;z-index:2;background:var(--cream);padding:6px 0}
.pf-tab{font-family:var(--font-accent);font-size:.98rem;font-weight:700;padding:7px 14px;border:2px solid rgba(0,0,0,.12);border-radius:999px;background:#fff;cursor:pointer;color:var(--ink);box-shadow:2px 2px 0 rgba(0,0,0,.08)}
.pf-tab.act{background:var(--blue);border-color:var(--blue);color:#112}
.pf-panel-wrap{display:flex;flex-direction:column}
.pf-panel{display:none}
.pf-panel.act{display:block;min-height:0}
.pf-scroll{overflow:visible;padding-right:2px}
.modal.tool-physformula{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;overflow-y:auto}
.pf-ch-top{display:flex;gap:10px;align-items:center;margin-bottom:8px}
.pf-streak{font-family:var(--font-accent);font-size:1.1rem;font-weight:700;padding:4px 12px;border-radius:999px;background:rgba(255,214,10,.18);border:2px solid rgba(255,214,10,.4);white-space:nowrap}
.pf-question{font-family:var(--font-accent);font-size:1.18rem;font-weight:700;line-height:1.35;color:var(--ink);margin-bottom:8px}
.pf-hint{font-size:.84rem;color:var(--c-muted);line-height:1.5}
.pf-list-card{padding:10px 0;border-bottom:1px solid rgba(0,0,0,.06)}
.pf-list-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;flex-wrap:wrap}
.pf-list-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:5px}
.pf-mini{display:inline-block;font-family:var(--font-accent);font-size:.82rem;font-weight:700;padding:2px 8px;border-radius:999px;background:rgba(0,0,0,.05);color:var(--ink)}
[data-theme="dark"] .pf-card,[data-theme="dark"] .pf-lab,[data-theme="dark"] .pf-challenge{background:rgba(255,255,255,.05);border-color:var(--dm-bdr)}
[data-theme="dark"] .pf-tabs{background:var(--dm-modal)}
[data-theme="dark"] .pf-tab{background:var(--dm-card);border-color:var(--dm-bdr);box-shadow:none}
[data-theme="dark"] .pf-tab.act{background:var(--blue);border-color:var(--blue);color:#112}
[data-theme="dark"] .pf-item,[data-theme="dark"] .pf-list-card{border-color:rgba(255,255,255,.08)}
[data-theme="dark"] .pf-chip{background:var(--dm-card);border-color:var(--dm-bdr);box-shadow:none}
[data-theme="dark"] .pf-chip.act{background:var(--blue);border-color:var(--blue);color:#112}
[data-theme="dark"] .pf-hero{background:rgba(255,255,255,.05);border-color:var(--dm-bdr)}
[data-theme="dark"] .pf-streak{background:rgba(255,214,10,.1);border-color:rgba(255,214,10,.25)}
[data-theme="glass"] .pf-card,[data-theme="glass"] .pf-lab,[data-theme="glass"] .pf-challenge{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
[data-theme="glass"] .pf-tabs{background:rgba(10,6,26,0.72);backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px)}
[data-theme="glass"] .pf-tab{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);box-shadow:none}
[data-theme="glass"] .pf-chip{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);box-shadow:none}
[data-theme="glass"] .pf-hero{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
@media(max-width:768px){
  .modal.tool-physformula{max-width:100%;max-height:88vh;padding:14px 12px 12px}
  .pf-shell{gap:8px}
  .pf-hero.compact{padding:5px 10px}
  .pf-hero{padding:10px 12px}
  .pf-current{font-size:1.2rem}
  .pf-hero.compact .pf-current{font-size:1rem}
  .pf-meta{font-size:.78rem}
  .pf-tabs{gap:6px;padding:4px 0}
  .pf-tab{font-size:.88rem;padding:6px 10px}
  .pf-card,.pf-lab,.pf-challenge{padding:10px 12px}
  .pf-chip,.pf-count,.pf-mini{font-size:.82rem}
  .pf-chip{padding:5px 9px}
  .pf-counts,.pf-chiprow,.pf-quick{margin:4px 0;gap:5px}
  .pf-quick .btn.sm{font-size:.82rem;padding:5px 10px}
  .pf-vars{grid-template-columns:1fr;gap:6px}
  .pf-ch-top{flex-direction:column;align-items:stretch;gap:6px}
  .pf-streak{text-align:center}
}
/* ── SIMULTANEOUS EQ ────────────────────────────── */
.se-grid{display:grid;gap:6px;margin:10px 0}
.se-row{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.se-coeff{width:52px;padding:6px 4px;text-align:center;border:2px solid rgba(0,0,0,.18);border-radius:8px;font-family:var(--font-main);font-size:.95rem;background:#fff;color:var(--ink)}
.se-lbl{font-family:var(--font-accent);font-size:1rem;font-weight:700;color:var(--c-muted)}
[data-theme="dark"] .se-coeff{background:var(--dm-input);color:var(--ink);border-color:var(--dm-bdr)}
[data-theme="glass"] .se-coeff{background:rgba(255,255,255,.08);color:var(--ink);border-color:rgba(255,255,255,.18)}


/* ── HERO CATEGORY PILLS ─────────────────────────────────── */
/* ── CARD CATEGORY TINTS (light mode only) ───────────────── */
html:not([data-theme]) .card[data-cat="math"]{background:rgba(255,107,107,.04)}
html:not([data-theme]) .card[data-cat="science"]{background:rgba(76,201,240,.04)}
html:not([data-theme]) .card[data-cat="writing"]{background:rgba(6,214,160,.04)}
html:not([data-theme]) .card[data-cat="study"]{background:rgba(199,125,255,.04)}
html:not([data-theme]) .card[data-cat="finance"]{background:rgba(255,159,28,.04)}
html:not([data-theme]) .card[data-cat="convert"]{background:rgba(0,180,216,.04)}
html:not([data-theme]) .card[data-cat="misc"]{background:rgba(255,133,161,.04)}
html:not([data-theme]) .card[data-cat="classes"]{background:rgba(255,214,10,.06)}
/* ── MODAL CATEGORY BORDER ───────────────────────────────── */
#modalBox{border-top:5px solid transparent;transition:border-color .2s}


/* ── CLASS HUB ───────────────────────────────────────────── */
.ch-stages{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:4px}
.ch-stage{background:rgba(0,0,0,.03);border:1.5px solid rgba(0,0,0,.09);border-radius:14px;padding:12px 14px}
.ch-stage-lbl{font-family:var(--font-accent);font-size:1rem;font-weight:700;margin-bottom:8px;color:var(--ink)}
.ch-cls-row{display:flex;gap:7px;flex-wrap:wrap}
.ch-cls{font-family:var(--font-accent);font-size:1.1rem;font-weight:700;width:38px;height:38px;border-radius:50%;border:2px solid rgba(0,0,0,.16);background:#fff;cursor:pointer;box-shadow:3px 3px 0 rgba(0,0,0,.10);transition:all .13s;color:var(--ink)}
.ch-cls:hover{transform:translateY(-2px);box-shadow:5px 5px 0 rgba(0,0,0,.14)}
.ch-cls.act{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.ch-subrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.ch-sub{font-family:var(--font-accent);font-size:.95rem;font-weight:700;padding:6px 14px;border:2px solid rgba(0,0,0,.14);border-radius:999px;background:#fff;cursor:pointer;box-shadow:2px 2px 0 rgba(0,0,0,.09);transition:all .13s;color:var(--ink)}
.ch-sub:hover{transform:translateY(-2px)}
.ch-sub.act{background:var(--lav);border-color:var(--lav);color:#fff}
.ch-sub[data-s="math"].act{background:var(--coral);border-color:var(--coral)}
.ch-sub[data-s="english"].act{background:var(--mint);border-color:var(--mint);color:var(--ink)}
.ch-sub[data-s="science"].act{background:var(--blue);border-color:var(--blue);color:#1a1a2e}
.ch-sub[data-s="gk"].act{background:var(--orange);border-color:var(--orange)}
.ch-sub[data-s="history"].act{background:var(--pink);border-color:var(--pink)}
.ch-section-title{font-family:var(--font-accent);font-size:1.2rem;font-weight:700;margin:14px 0 8px;color:var(--ink);display:flex;align-items:center;gap:6px}
.ch-ref-item{display:flex;gap:8px;padding:6px 0;border-bottom:1px dashed rgba(0,0,0,.09);font-family:var(--font-main);font-size:.9rem;line-height:1.5}
.ch-ref-num{font-family:var(--font-accent);font-weight:700;color:var(--c-muted);min-width:18px;flex-shrink:0}
.ch-qa-item{margin-bottom:6px}
.ch-q{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding:9px 12px;border:1.5px solid rgba(0,0,0,.11);border-radius:10px;cursor:pointer;font-family:var(--font-main);font-size:.88rem;background:#fff;transition:background .12s;box-shadow:2px 2px 0 rgba(0,0,0,.06)}
.ch-q:hover{background:rgba(0,0,0,.025)}
.ch-q-num{font-family:var(--font-accent);font-weight:700;color:var(--c-muted);flex-shrink:0;margin-right:4px}
.ch-q-arr{color:var(--c-muted);flex-shrink:0;transition:transform .2s;font-size:.8rem}
.ch-q.open .ch-q-arr{transform:rotate(90deg)}
.ch-a{display:none;padding:7px 12px 9px;background:rgba(6,214,160,.08);border:1.5px solid rgba(6,214,160,.28);border-radius:0 0 10px 10px;font-family:var(--font-main);font-size:.88rem;margin-top:-2px;border-top:none}
.ch-a.vis{display:block}
.ch-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-width:600px){.ch-grid{grid-template-columns:1fr}}
[data-theme="dark"] .ch-stage{background:var(--dm-card);border-color:var(--dm-bdr)}
[data-theme="dark"] .ch-cls{background:var(--dm-input);color:var(--ink);border-color:var(--dm-bdr)}
[data-theme="dark"] .ch-cls.act{background:var(--ink);color:var(--dm-bg)}
[data-theme="dark"] .ch-sub{background:var(--dm-card);border-color:var(--dm-bdr);color:var(--ink)}
[data-theme="dark"] .ch-q{background:var(--dm-card);border-color:var(--dm-bdr);box-shadow:none}
[data-theme="dark"] .ch-a{background:rgba(6,214,160,.07);border-color:rgba(6,214,160,.25)}
[data-theme="dark"] .ch-ref-item{border-color:rgba(255,255,255,.08)}
[data-theme="glass"] .ch-stage{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
[data-theme="glass"] .ch-cls{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);color:var(--ink)}
[data-theme="glass"] .ch-sub{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:var(--ink)}
[data-theme="glass"] .ch-q{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);box-shadow:none}
[data-theme="glass"] .ch-a{background:rgba(6,214,160,.08);border-color:rgba(6,214,160,.22)}
.ch-ai-hero{border:1.5px solid rgba(199,125,255,.32);border-radius:14px;padding:16px;background:linear-gradient(135deg,rgba(255,214,10,.24),rgba(76,201,240,.16) 48%,rgba(199,125,255,.16));margin-bottom:14px;box-shadow:3px 3px 0 rgba(0,0,0,.06)}
.ch-ai-title{font-family:var(--font-accent);font-size:1.75rem;font-weight:700;line-height:1;color:var(--ink)}
.ch-ai-copy{font-family:var(--font-main);font-size:.92rem;color:var(--c-muted);margin-top:6px;line-height:1.45}
.ch-ai-panel{display:grid;grid-template-columns:minmax(240px,320px) 1fr;gap:14px;align-items:start}
.ch-ai-controls,.ch-ai-output,.ch-ai-saved{background:rgba(255,255,255,.76);border:1.5px solid rgba(0,0,0,.1);border-radius:14px;padding:14px;box-shadow:3px 3px 0 rgba(0,0,0,.06)}
.ch-ai-controls{position:sticky;top:76px;background:linear-gradient(180deg,rgba(255,214,10,.14),rgba(255,255,255,.85) 42%,rgba(6,214,160,.09))}
.ch-ai-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ch-ai-field{margin-bottom:9px}
.ch-ai-field label{display:block;font-family:var(--font-accent);font-size:.9rem;font-weight:700;margin-bottom:4px;color:var(--ink)}
.ch-ai-field input,.ch-ai-field select,.ch-ai-field textarea{width:100%;padding:8px 10px;border:1.5px solid rgba(0,0,0,.16);border-radius:9px;background:#fff;color:var(--ink);font-family:var(--font-main);font-size:.9rem;outline:none;box-shadow:2px 2px 0 rgba(0,0,0,.05)}
.ch-ai-field input:focus,.ch-ai-field select:focus,.ch-ai-field textarea:focus{border-color:var(--yellow);box-shadow:0 0 0 3px rgba(255,214,10,.2)}
.ch-mode-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.ch-mode{font-family:var(--font-accent);font-size:.88rem;font-weight:700;border:1.5px solid rgba(0,0,0,.14);border-radius:999px;background:#fff;color:var(--ink);padding:5px 11px;cursor:pointer;transition:all .12s}
.ch-mode.act{background:var(--lav);border-color:var(--lav);color:#fff;box-shadow:2px 2px 0 rgba(0,0,0,.12)}
.ch-ai-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.ch-ai-card{border:1.5px solid rgba(0,0,0,.1);border-radius:12px;background:#fff;padding:12px 14px;margin-bottom:9px;box-shadow:3px 3px 0 rgba(0,0,0,.06);position:relative;overflow:hidden}
.ch-ai-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--yellow),var(--mint),var(--blue),var(--lav))}
.ch-ai-card h3{font-family:var(--font-accent);font-size:1.12rem;margin-bottom:6px;color:#6d3cc5}
.ch-ai-card pre{white-space:pre-wrap;font-family:var(--font-main);font-size:.92rem;line-height:1.55;margin:0}
.ch-ai-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.ch-ai-pill{font-family:var(--font-main);font-size:.72rem;color:#5a3a00;border:1px solid rgba(255,214,10,.5);background:rgba(255,214,10,.18);border-radius:999px;padding:2px 8px}
.ch-ai-empty{font-family:var(--font-main);font-size:.9rem;color:var(--c-muted);text-align:center;padding:26px 12px;border:1.5px dashed rgba(199,125,255,.32);border-radius:12px;background:linear-gradient(135deg,rgba(255,214,10,.12),rgba(76,201,240,.1))}
.ch-ai-saved-list{display:grid;gap:7px;max-height:260px;overflow-y:auto}
.ch-save-item{border:1.5px solid rgba(0,0,0,.1);border-radius:10px;background:linear-gradient(135deg,#fff,rgba(255,214,10,.12));padding:8px 10px;cursor:pointer}
.ch-save-item:hover{border-color:var(--lav)}
.ch-save-title{font-family:var(--font-accent);font-size:.95rem;font-weight:700}
.ch-save-meta{font-family:var(--font-main);font-size:.72rem;color:var(--c-muted)}
.mt-hero{border:1.5px solid rgba(255,107,107,.28);border-radius:14px;padding:14px;background:linear-gradient(135deg,rgba(255,214,10,.22),rgba(255,107,107,.12),rgba(76,201,240,.14));box-shadow:3px 3px 0 rgba(0,0,0,.06);margin-bottom:12px}
.mt-title{font-family:var(--font-accent);font-size:1.55rem;font-weight:700;color:var(--ink)}
.mt-copy{font-size:.9rem;color:var(--c-muted);line-height:1.45;margin-top:4px}
.mt-examples{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 12px}
.mt-chip{font-family:var(--font-accent);font-size:.84rem;font-weight:700;border:1.5px solid rgba(0,0,0,.14);border-radius:999px;background:#fff;padding:4px 10px;cursor:pointer;color:var(--ink);box-shadow:2px 2px 0 rgba(0,0,0,.08)}
.mt-chip:hover{transform:translateY(-1px);border-color:var(--coral)}
.mt-panel{background:rgba(255,255,255,.75);border:1.5px solid rgba(0,0,0,.1);border-radius:14px;padding:13px;box-shadow:3px 3px 0 rgba(0,0,0,.06)}
.mt-symbols{display:grid;grid-template-columns:repeat(auto-fit,minmax(42px,1fr));gap:6px;margin:8px 0 10px}
.mt-symbols button{font-family:var(--font-accent);font-size:.96rem;font-weight:700;border:1.5px solid rgba(0,0,0,.14);border-radius:9px;background:#fff;color:var(--ink);padding:6px 4px;cursor:pointer;box-shadow:2px 2px 0 rgba(0,0,0,.08);min-height:34px}
.mt-symbols button:hover{background:rgba(255,214,10,.22);border-color:var(--orange);transform:translateY(-1px)}
.mt-output{margin-top:12px;display:grid;gap:9px}
.mt-card{border:1.5px solid rgba(0,0,0,.1);border-radius:12px;background:#fff;padding:11px 13px;box-shadow:3px 3px 0 rgba(0,0,0,.06);position:relative;overflow:hidden}
.mt-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--coral),var(--yellow),var(--mint),var(--blue))}
.mt-card h3{font-family:var(--font-accent);font-size:1.08rem;color:#d64b4b;margin-bottom:5px}
.mt-card pre{white-space:pre-wrap;font-family:var(--font-main);font-size:.92rem;line-height:1.55;margin:0}
.mt-work{background:rgba(255,214,10,.14);border:1.5px dashed rgba(0,0,0,.14);border-radius:12px;padding:10px 12px;font-family:var(--font-main);line-height:1.55;margin-top:8px}
.mt-paper{margin-top:6px;background:rgba(255,255,255,.58);border-left:4px solid var(--yellow);border-radius:8px;padding:8px 10px}
.mt-line{font-family:var(--font-accent);font-size:1.05rem;line-height:1.45;white-space:pre-wrap}
.mt-note{font-size:.82rem;color:var(--c-muted);margin-top:5px}
@media(max-width:760px){.ch-ai-panel{grid-template-columns:1fr}.ch-ai-controls{position:static}.ch-ai-row{grid-template-columns:1fr}}
[data-theme="dark"] .ch-ai-controls,[data-theme="dark"] .ch-ai-output,[data-theme="dark"] .ch-ai-saved{background:var(--dm-card);border-color:var(--dm-bdr)}
[data-theme="dark"] .ch-ai-card,[data-theme="dark"] .ch-save-item,[data-theme="dark"] .ch-mode,[data-theme="dark"] .ch-ai-field input,[data-theme="dark"] .ch-ai-field select,[data-theme="dark"] .ch-ai-field textarea,[data-theme="dark"] .mt-panel,[data-theme="dark"] .mt-card,[data-theme="dark"] .mt-chip,[data-theme="dark"] .mt-symbols button{background:var(--dm-input);border-color:var(--dm-bdr);color:var(--ink)}
[data-theme="glass"] .ch-ai-controls,[data-theme="glass"] .ch-ai-output,[data-theme="glass"] .ch-ai-saved{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
[data-theme="glass"] .ch-ai-card,[data-theme="glass"] .ch-save-item,[data-theme="glass"] .ch-mode,[data-theme="glass"] .ch-ai-field input,[data-theme="glass"] .ch-ai-field select,[data-theme="glass"] .ch-ai-field textarea,[data-theme="glass"] .mt-panel,[data-theme="glass"] .mt-card,[data-theme="glass"] .mt-chip,[data-theme="glass"] .mt-symbols button{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:var(--ink)}