:root{
  --ink-900:#030b17; --ink-800:#06152a; --ink-700:#0a2340;
  --aqua:#6EE7FF; --aqua-soft:#A8F0FF; --sky:#7CA8FF;
  --mint:#7CFFC4; --rose:#FF8FB0; --amber:#FFD98E;
  --txt:#EAF6FF; --dim:rgba(234,246,255,.60); --dim2:rgba(234,246,255,.38);
  --gl:rgba(150,220,255,.10); --gl2:rgba(150,220,255,.055);
  --edge:rgba(255,255,255,.16); --edge-hi:rgba(255,255,255,.42);
  --r-lg:26px; --r-md:20px; --r-sm:14px;
  --ease:cubic-bezier(.22,1,.36,1);
  --safeb:env(safe-area-inset-bottom,0px); --safet:env(safe-area-inset-top,0px);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;height:100%;overscroll-behavior:none}
body{background:var(--ink-900);color:var(--txt);
  font-family:"Zen Kaku Gothic New","Hiragino Sans","Hiragino Kaku Gothic ProN",-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;
  font-weight:500;-webkit-font-smoothing:antialiased;overflow:hidden;font-feature-settings:"palt" 1}
.num{font-family:"Space Grotesk",-apple-system,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* ===== aurora ===== */
#aurora{position:fixed;inset:-20%;z-index:0;filter:blur(70px) saturate(150%);opacity:.85;pointer-events:none;transition:transform .4s ease-out}
#aurora i{position:absolute;display:block;border-radius:50%;mix-blend-mode:screen;will-change:transform}
#aurora i:nth-child(1){width:62vmax;height:62vmax;left:-18vmax;top:-14vmax;background:radial-gradient(circle at 40% 40%,#1a7bd6,rgba(26,123,214,0) 68%);animation:dr1 26s var(--ease) infinite alternate}
#aurora i:nth-child(2){width:54vmax;height:54vmax;right:-16vmax;top:6vmax;background:radial-gradient(circle at 50% 50%,#25d7e8,rgba(37,215,232,0) 66%);animation:dr2 32s var(--ease) infinite alternate}
#aurora i:nth-child(3){width:58vmax;height:58vmax;left:8vmax;bottom:-24vmax;background:radial-gradient(circle at 50% 50%,#5a49d8,rgba(90,73,216,0) 66%);animation:dr3 38s var(--ease) infinite alternate}
#aurora i:nth-child(4){width:34vmax;height:34vmax;right:2vmax;bottom:-6vmax;background:radial-gradient(circle at 50% 50%,#3affd0,rgba(58,255,208,0) 64%);opacity:.5;animation:dr2 29s var(--ease) infinite alternate-reverse}
@keyframes dr1{to{transform:translate3d(14vmax,10vmax,0) scale(1.15)}}
@keyframes dr2{to{transform:translate3d(-12vmax,14vmax,0) scale(.88)}}
@keyframes dr3{to{transform:translate3d(10vmax,-12vmax,0) scale(1.12)}}
#grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.16;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence baseFrequency='.85' numOctaves='3'/></filter><rect width='140' height='140' filter='url(%23n)' opacity='.5'/></svg>")}
#vig{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 90% at 50% 0%,rgba(3,11,23,0) 40%,rgba(3,11,23,.72) 100%)}

/* ===== glass ===== */
.g{position:relative;background:linear-gradient(160deg,var(--gl),var(--gl2));border:1px solid var(--edge);
  border-radius:var(--r-lg);backdrop-filter:blur(22px) saturate(180%);-webkit-backdrop-filter:blur(22px) saturate(180%);
  box-shadow:inset 0 1px 0 var(--edge-hi),inset 0 -18px 30px -26px rgba(110,231,255,.5),0 18px 40px -24px rgba(0,0,0,.85);overflow:hidden}
.g::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.14) 45%,transparent 58%);
  transform:translateX(-120%);transition:transform .9s var(--ease)}
.g.sheen::after{transform:translateX(120%)}
.card,.rev,.stat,.rgrid .g,.qi{backdrop-filter:blur(12px) saturate(150%);-webkit-backdrop-filter:blur(12px) saturate(150%)}

/* ===== shell ===== */
#app{position:relative;z-index:2;height:100%}
.view{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;pointer-events:none;
  transform:translateY(18px) scale(.985);transition:opacity .34s var(--ease),transform .44s var(--ease)}
.view.on{opacity:1;pointer-events:auto;transform:none}
.scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:calc(var(--safet) + 18px) 18px calc(120px + var(--safeb));scrollbar-width:none}
.scroll::-webkit-scrollbar{display:none}
.eyebrow{font-size:10.5px;letter-spacing:.22em;color:var(--aqua);text-transform:uppercase;font-weight:700;margin:0 0 7px}
h1{font-size:27px;line-height:1.25;margin:0 0 4px;font-weight:900;letter-spacing:-.01em}
.sub{font-size:12.5px;color:var(--dim);margin:0 0 20px;font-weight:400;line-height:1.6}
.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.iconbtn{width:38px;height:38px;flex:0 0 auto;border-radius:50%;border:1px solid var(--edge);background:rgba(255,255,255,.07);
  color:var(--dim);cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(12px);transition:.2s var(--ease)}
.iconbtn:active{transform:scale(.92)}
.iconbtn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ===== hero gauge ===== */
.hero{padding:22px;margin-bottom:14px;display:flex;gap:20px;align-items:center}
.gauge{width:114px;height:114px;flex:0 0 auto;position:relative;border-radius:50%;
  background:radial-gradient(circle at 34% 26%,rgba(255,255,255,.20),rgba(255,255,255,.02) 58%);
  border:1px solid rgba(255,255,255,.22);overflow:hidden;box-shadow:inset 0 0 26px rgba(110,231,255,.20),0 8px 26px -12px rgba(110,231,255,.5)}
.liquid{position:absolute;left:-25%;width:150%;height:150%;bottom:-150%;transition:bottom 1.5s var(--ease)}
.liquid svg{position:absolute;bottom:100%;left:0;width:100%;height:16px}
.liquid .body{position:absolute;inset:0;background:linear-gradient(180deg,rgba(110,231,255,.85),rgba(90,130,255,.62))}
.liquid svg path{fill:rgba(110,231,255,.85)}
.liquid.w2{opacity:.45;animation:sway 7s ease-in-out infinite}
.liquid.w2 svg path{fill:rgba(124,255,196,.8)}
.liquid.w2 .body{background:linear-gradient(180deg,rgba(124,255,196,.7),rgba(110,231,255,.4))}
@keyframes sway{0%,100%{transform:translateX(-6%)}50%{transform:translateX(6%)}}
.gauge b{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:3;
  font-family:"Space Grotesk",sans-serif;font-size:29px;font-weight:600;letter-spacing:-.03em;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.gauge b s{text-decoration:none;font-size:10px;letter-spacing:.16em;color:rgba(255,255,255,.75);font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700;margin-top:1px}
.heroinfo{flex:1;min-width:0}
.heroinfo h2{margin:0 0 10px;font-size:15px;font-weight:700}
.kv{display:flex;gap:14px;flex-wrap:wrap}
.kv div{min-width:56px}
.kv span{display:block;font-size:9.5px;letter-spacing:.14em;color:var(--dim2);font-weight:700;margin-bottom:1px}
.kv em{font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:19px;font-weight:600;color:var(--aqua-soft)}
.kv em i{font-style:normal;font-size:10.5px;color:var(--dim);margin-left:2px;font-family:"Zen Kaku Gothic New",sans-serif}

/* ===== buttons ===== */
.btn{position:relative;width:100%;border:1px solid var(--edge);border-radius:var(--r-md);padding:16px;color:var(--txt);
  font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;overflow:hidden;
  background:linear-gradient(160deg,rgba(150,220,255,.14),rgba(150,220,255,.05));
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:inset 0 1px 0 var(--edge-hi),0 10px 26px -16px rgba(0,0,0,.9);
  transition:transform .16s var(--ease),box-shadow .24s var(--ease),background .24s}
.btn:active{transform:scale(.975)}
.btn.primary{background:linear-gradient(150deg,rgba(110,231,255,.9),rgba(90,140,255,.78));color:#022033;border-color:rgba(255,255,255,.5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 12px 34px -14px rgba(110,231,255,.85);font-size:16px}
.btn.warn{border-color:rgba(255,143,176,.45);color:var(--rose)}
.btn.sm{padding:11px;font-size:13px;border-radius:var(--r-sm)}
.btn .lab{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:8px}
.btn .lab small{font-size:11px;font-weight:600;opacity:.72}
.rip{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.55),rgba(255,255,255,0) 70%);
  transform:translate(-50%,-50%) scale(0);pointer-events:none;animation:rip .62s var(--ease) forwards}
@keyframes rip{to{transform:translate(-50%,-50%) scale(1);opacity:0}}

/* ===== resume card ===== */
.resume{padding:16px 18px;margin-bottom:10px;cursor:pointer;border-color:rgba(255,217,142,.34)}
.resume .rh{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.resume .rh b{font-size:13.5px;font-weight:800;color:var(--amber)}
.resume .rh span{margin-left:auto;font-size:10.5px;color:var(--dim2);font-weight:700}
.resume p{margin:0;font-size:12px;color:var(--dim);line-height:1.6}
.resume .bar u{background:linear-gradient(90deg,var(--amber),var(--aqua))}

/* ===== subject cards ===== */
.sectitle{display:flex;align-items:baseline;justify-content:space-between;margin:26px 2px 11px}
.sectitle h3{margin:0;font-size:13px;font-weight:800;letter-spacing:.05em}
.sectitle span{font-size:10.5px;color:var(--dim2);font-weight:700;letter-spacing:.1em}
.subj{display:flex;flex-direction:column;gap:9px}
.subj .card{animation:rise .5s var(--ease) backwards}
@keyframes rise{from{opacity:0;transform:translateY(14px)}}
.card{padding:15px 16px;cursor:pointer;transition:transform .18s var(--ease)}
.card:active{transform:scale(.985)}
.card .row{display:flex;align-items:center;gap:12px}
.dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 12px currentColor}
.card .nm{flex:1;min-width:0;font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .pc{font-family:"Space Grotesk",sans-serif;font-size:15px;font-weight:600;color:var(--aqua-soft)}
.card .pc i{font-style:normal;font-size:9.5px;color:var(--dim2);margin-left:1px}
.bar{height:4px;border-radius:99px;background:rgba(255,255,255,.09);margin-top:11px;overflow:hidden;position:relative}
.bar u{position:absolute;inset:0 auto 0 0;border-radius:99px;text-decoration:none;transition:width 1s var(--ease)}
.bar u.a{background:linear-gradient(90deg,var(--aqua),var(--sky));box-shadow:0 0 10px rgba(110,231,255,.6)}
.meta{display:flex;gap:12px;margin-top:9px;font-size:10.5px;color:var(--dim2);font-weight:600;letter-spacing:.04em;flex-wrap:wrap}
.meta b{color:var(--dim);font-weight:700}

/* ===== nav ===== */
nav{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + var(--safeb));z-index:40;
  display:flex;gap:2px;padding:5px;border-radius:99px;border:1px solid var(--edge);
  background:linear-gradient(160deg,rgba(150,220,255,.16),rgba(10,35,64,.55));
  backdrop-filter:blur(26px) saturate(180%);-webkit-backdrop-filter:blur(26px) saturate(180%);
  box-shadow:inset 0 1px 0 var(--edge-hi),0 18px 40px -18px rgba(0,0,0,.9);transition:opacity .3s,transform .3s var(--ease)}
nav.hide{opacity:0;transform:translateX(-50%) translateY(90px);pointer-events:none}
nav button{border:0;background:transparent;color:var(--dim);font-family:inherit;font-size:10.5px;font-weight:700;
  padding:9px 13px;border-radius:99px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;
  transition:color .24s,background .3s var(--ease);letter-spacing:.05em}
nav button svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
nav button.on{color:#04202f;background:linear-gradient(150deg,var(--aqua),var(--sky));box-shadow:0 6px 18px -8px rgba(110,231,255,.9)}

/* ===== sheet ===== */
.scrim{position:fixed;inset:0;z-index:50;background:rgba(2,8,17,.6);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .3s}
.scrim.on{opacity:1;pointer-events:auto}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:51;border-radius:30px 30px 0 0;padding:10px 18px calc(24px + var(--safeb));
  transform:translateY(102%);transition:transform .46s var(--ease);max-height:88vh;overflow-y:auto;
  background:linear-gradient(180deg,rgba(150,220,255,.16),rgba(8,26,48,.94));
  border:1px solid var(--edge);border-bottom:0;backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);
  box-shadow:inset 0 1px 0 var(--edge-hi),0 -20px 60px -20px rgba(0,0,0,.9)}
.sheet.on{transform:none}
.grab{width:38px;height:4px;border-radius:99px;background:rgba(255,255,255,.28);margin:0 auto 16px}
.sheet h3{margin:0 0 3px;font-size:19px;font-weight:900}
.sheet .sd{margin:0 0 18px;font-size:12px;color:var(--dim)}
.opt{margin-bottom:16px}
.opt>label{display:block;font-size:10px;letter-spacing:.16em;color:var(--dim2);font-weight:800;margin-bottom:8px}
.chips{display:flex;gap:7px;flex-wrap:wrap}
.chip{border:1px solid var(--edge);background:rgba(255,255,255,.05);color:var(--dim);border-radius:99px;
  padding:9px 15px;font-family:inherit;font-size:12.5px;font-weight:700;cursor:pointer;transition:all .22s var(--ease)}
.chip:active{transform:scale(.95)}
.chip.on{background:linear-gradient(150deg,rgba(110,231,255,.92),rgba(124,168,255,.85));color:#03202e;border-color:rgba(255,255,255,.5);box-shadow:0 6px 18px -9px rgba(110,231,255,.9)}
.chip.sm{padding:7px 12px;font-size:11.5px}
.chip:disabled{opacity:.3;cursor:not-allowed}

/* ===== quiz ===== */
.qtop{padding:calc(var(--safet) + 14px) 18px 12px;display:flex;align-items:center;gap:13px}
.xbtn{width:34px;height:34px;flex:0 0 auto;border-radius:50%;border:1px solid var(--edge);background:rgba(255,255,255,.07);
  color:var(--txt);cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(12px)}
.xbtn svg{width:15px;height:15px;stroke:currentColor;stroke-width:2.1;fill:none;stroke-linecap:round}
.prog{flex:1;height:5px;border-radius:99px;background:rgba(255,255,255,.10);overflow:hidden}
.prog u{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--aqua),var(--mint));
  box-shadow:0 0 12px rgba(110,231,255,.8);transition:width .5s var(--ease)}
.cnt{font-family:"Space Grotesk",sans-serif;font-size:12.5px;font-weight:600;color:var(--dim)}
.cnt b{color:var(--aqua-soft);font-size:15px}
.streak{position:absolute;right:18px;top:calc(var(--safet) + 56px);font-size:11px;font-weight:800;color:var(--amber);
  opacity:0;transform:translateY(-6px);transition:.3s var(--ease);letter-spacing:.06em}
.streak.on{opacity:1;transform:none}
.qbody{flex:1;overflow-y:auto;padding:6px 18px calc(20px + var(--safeb));scrollbar-width:none}
.qbody::-webkit-scrollbar{display:none}
.qtags{display:flex;gap:7px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.tag{font-size:10px;font-weight:800;letter-spacing:.1em;padding:5px 10px;border-radius:99px;border:1px solid var(--edge);color:var(--dim)}
.tag.k{color:#03202e;border-color:transparent;background:linear-gradient(150deg,var(--aqua),var(--sky))}
.qcard{padding:22px 20px;margin-bottom:16px}
.qtext{font-size:17px;line-height:1.72;font-weight:700;margin:0;letter-spacing:.005em}
.blank{display:inline-block;min-width:76px;border-bottom:2.5px solid var(--aqua);color:var(--aqua);text-align:center;
  margin:0 3px;font-weight:900;text-shadow:0 0 14px rgba(110,231,255,.7)}
.tfnote{margin:14px 0 0;font-size:11.5px;color:var(--dim2);font-weight:700;letter-spacing:.08em}
.answers{display:flex;flex-direction:column;gap:9px}
.ans{position:relative;width:100%;text-align:left;border:1px solid var(--edge);border-radius:var(--r-md);
  padding:15px 16px;color:var(--txt);font-family:inherit;font-size:14.5px;font-weight:600;line-height:1.6;cursor:pointer;
  background:linear-gradient(160deg,rgba(150,220,255,.11),rgba(150,220,255,.04));
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28);display:flex;gap:12px;align-items:flex-start;
  transition:transform .16s var(--ease),border-color .3s,box-shadow .3s,opacity .3s}
.ans:active{transform:scale(.985)}
.ans .k{flex:0 0 auto;width:23px;height:23px;border-radius:8px;display:grid;place-items:center;font-family:"Space Grotesk",sans-serif;
  font-size:11.5px;font-weight:700;background:rgba(255,255,255,.12);color:var(--aqua-soft);margin-top:1px}
.ans .t{flex:1;position:relative;z-index:2}
.ans.ok{border-color:rgba(124,255,196,.85);background:linear-gradient(160deg,rgba(124,255,196,.24),rgba(124,255,196,.07));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 30px -8px rgba(124,255,196,.65)}
.ans.ok .k{background:var(--mint);color:#04241a}
.ans.ng{border-color:rgba(255,143,176,.8);background:linear-gradient(160deg,rgba(255,143,176,.22),rgba(255,143,176,.06));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 0 30px -10px rgba(255,143,176,.6);animation:shake .42s}
.ans.ng .k{background:var(--rose);color:#2b0714}
.ans.mute{opacity:.36}
.ans:disabled{cursor:default}
@keyframes shake{15%{transform:translateX(-7px)}35%{transform:translateX(6px)}55%{transform:translateX(-4px)}75%{transform:translateX(3px)}100%{transform:none}}
.tfrow{display:flex;gap:10px}
.tf{flex:1;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:24px 12px;font-size:15px;font-weight:800}
.tf .g1{font-family:"Space Grotesk",sans-serif;font-size:34px;line-height:1;font-weight:500}
.expl{margin-top:14px;padding:17px 18px;border-radius:var(--r-md);opacity:0;transform:translateY(14px);
  transition:opacity .4s var(--ease),transform .5s var(--ease)}
.expl.on{opacity:1;transform:none}
.expl h4{margin:0 0 8px;font-size:11px;letter-spacing:.16em;font-weight:800;display:flex;align-items:center;gap:7px}
.expl.good h4{color:var(--mint)} .expl.bad h4{color:var(--rose)}
.expl p{margin:0;font-size:13.5px;line-height:1.78;color:rgba(234,246,255,.86);font-weight:500}
.expl .corr{margin:0 0 9px;font-size:13.5px;font-weight:800;color:var(--mint);line-height:1.6}
.qfoot{padding:12px 18px calc(16px + var(--safeb));opacity:0;transform:translateY(10px);pointer-events:none;transition:.36s var(--ease)}
.qfoot.on{opacity:1;transform:none;pointer-events:auto}
.qtools{position:absolute;right:18px;bottom:calc(84px + var(--safeb));z-index:5;display:flex;flex-direction:column;gap:9px}
.markbtn{width:42px;height:42px;border-radius:50%;border:1px solid var(--edge);background:rgba(150,220,255,.12);
  backdrop-filter:blur(14px);color:var(--dim);cursor:pointer;display:grid;place-items:center;transition:.24s var(--ease);position:relative}
.markbtn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linejoin:round}
.markbtn.on{color:var(--amber);background:rgba(255,217,142,.18);border-color:rgba(255,217,142,.5)}
.markbtn.hasnote{color:var(--mint);background:rgba(124,255,196,.16);border-color:rgba(124,255,196,.45)}

/* ===== memo ===== */
.memo{margin-top:12px}
.memo label{display:flex;align-items:center;gap:7px;font-size:10.5px;letter-spacing:.14em;color:var(--dim2);font-weight:800;margin-bottom:7px}
.memo label svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
textarea{width:100%;min-height:76px;resize:vertical;border-radius:var(--r-sm);border:1px solid var(--edge);
  background:rgba(3,16,32,.5);color:var(--txt);font-family:inherit;font-size:13.5px;line-height:1.7;font-weight:500;padding:12px 13px;
  backdrop-filter:blur(10px);transition:border-color .24s}
textarea:focus{outline:none;border-color:rgba(110,231,255,.6);box-shadow:0 0 0 3px rgba(110,231,255,.12)}
textarea::placeholder{color:var(--dim2)}
.memofoot{display:flex;align-items:center;gap:10px;margin-top:8px}
.memofoot .st{font-size:10.5px;color:var(--mint);font-weight:700;opacity:0;transition:.3s}
.memofoot .st.on{opacity:1}
.memofoot .del{margin-left:auto;background:none;border:0;color:var(--rose);font-family:inherit;font-size:11.5px;font-weight:700;cursor:pointer;padding:4px}

/* ===== result ===== */
.rwrap{padding:calc(var(--safet) + 30px) 18px calc(30px + var(--safeb));text-align:center;flex:1;overflow-y:auto;scrollbar-width:none}
.rwrap::-webkit-scrollbar{display:none}
.score{font-family:"Space Grotesk",sans-serif;font-size:74px;font-weight:600;line-height:1;letter-spacing:-.05em;
  background:linear-gradient(160deg,#fff,var(--aqua) 60%,var(--sky));-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 6px 26px rgba(110,231,255,.42))}
.score i{font-style:normal;font-size:24px;opacity:.5;margin-left:2px}
.rmsg{margin:12px 0 26px;font-size:14px;font-weight:700}
.rmsg small{display:block;font-size:11.5px;color:var(--dim);font-weight:500;margin-top:5px}
.rgrid{display:flex;gap:9px;margin-bottom:22px}
.rgrid .g{flex:1;padding:15px 8px}
.rgrid em{display:block;font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:24px;font-weight:600}
.rgrid span{display:block;font-size:9.5px;letter-spacing:.13em;color:var(--dim2);font-weight:800;margin-top:3px}

/* ===== list items (review / browse) ===== */
.rev,.qi{padding:14px 16px;margin-bottom:9px;cursor:pointer}
.rev .rt,.qi .rt{font-size:13.5px;line-height:1.65;font-weight:700}
.rev .rm,.qi .rm{display:flex;gap:8px;align-items:center;margin-top:9px;font-size:10px;color:var(--dim2);font-weight:700;letter-spacing:.06em;flex-wrap:wrap}
.pill{padding:3px 8px;border-radius:99px;border:1px solid var(--edge);font-size:9.5px;font-weight:800}
.pill.o{color:var(--mint);border-color:rgba(124,255,196,.4)}
.pill.x{color:var(--rose);border-color:rgba(255,143,176,.4)}
.pill.m{color:var(--amber);border-color:rgba(255,217,142,.4)}
.pill.n{color:var(--aqua);border-color:rgba(110,231,255,.4)}
.rev .body,.qi .body{max-height:0;overflow:hidden;transition:max-height .45s var(--ease)}
.rev.open .body,.qi.open .body{max-height:1400px}
.inner{padding-top:13px;margin-top:13px;border-top:1px solid rgba(255,255,255,.10)}
.inner .ca{font-size:13px;font-weight:800;color:var(--mint);line-height:1.6;margin:0 0 9px}
.inner .ex{margin:0;font-size:12.5px;line-height:1.75;color:rgba(234,246,255,.78);font-weight:500}
.olist{list-style:none;margin:0 0 11px;padding:0;display:flex;flex-direction:column;gap:5px}
.olist li{font-size:12.5px;line-height:1.6;color:var(--dim);font-weight:600;display:flex;gap:8px;padding:7px 10px;border-radius:10px;background:rgba(255,255,255,.04)}
.olist li.c{color:var(--mint);background:rgba(124,255,196,.10);font-weight:700}
.olist li b{flex:0 0 auto;font-family:"Space Grotesk",sans-serif;opacity:.7}
.itools{display:flex;gap:7px;margin-top:12px}
.itools button{flex:1;border:1px solid var(--edge);background:rgba(255,255,255,.05);color:var(--dim);border-radius:12px;
  padding:9px;font-family:inherit;font-size:11.5px;font-weight:700;cursor:pointer;transition:.2s var(--ease)}
.itools button.on{color:var(--amber);border-color:rgba(255,217,142,.45);background:rgba(255,217,142,.12)}
.empty{text-align:center;padding:56px 20px;color:var(--dim2)}
.empty .e1{font-size:38px;margin-bottom:14px;opacity:.5}
.empty p{margin:0;font-size:13px;line-height:1.8;font-weight:600}

/* ===== search ===== */
.search{position:relative;margin-bottom:12px}
.search input{width:100%;border-radius:99px;border:1px solid var(--edge);background:rgba(3,16,32,.45);color:var(--txt);
  font-family:inherit;font-size:14px;font-weight:600;padding:13px 42px 13px 42px;backdrop-filter:blur(14px)}
.search input:focus{outline:none;border-color:rgba(110,231,255,.55);box-shadow:0 0 0 3px rgba(110,231,255,.12)}
.search input::placeholder{color:var(--dim2);font-weight:500}
.search svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:var(--dim2);fill:none;stroke-width:2;stroke-linecap:round}
.search .clr{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:rgba(255,255,255,.1);color:var(--dim);
  width:26px;height:26px;border-radius:50%;cursor:pointer;font-size:15px;line-height:1;display:none}
.search .clr.on{display:block}
.filters{margin-bottom:14px}
.filters .row{display:flex;gap:7px;overflow-x:auto;padding-bottom:7px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.filters .row::-webkit-scrollbar{display:none}
.filters .row .chip{flex:0 0 auto}
.hits{font-size:11px;color:var(--dim2);font-weight:700;letter-spacing:.08em;margin:0 2px 11px}

/* ===== stats ===== */
.stat{padding:16px 17px;margin-bottom:9px}
.stat .sh{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px;gap:8px}
.stat .sh b{font-size:13.5px;font-weight:800}
.stat .sh span{font-size:10.5px;color:var(--dim2);font-weight:700;letter-spacing:.06em}
.dual{display:flex;flex-direction:column;gap:7px}
.dual .l{display:flex;align-items:center;gap:9px}
.dual .l i{font-style:normal;font-size:9.5px;width:38px;color:var(--dim2);font-weight:800;letter-spacing:.08em}
.dual .l em{font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:11.5px;width:38px;text-align:right;font-weight:600;color:var(--dim)}
.tips{padding:18px;margin-top:6px}
.tips h4{margin:0 0 11px;font-size:11px;letter-spacing:.15em;color:var(--aqua);font-weight:800}
.tips ul{margin:0;padding-left:17px}
.tips li{font-size:12.5px;line-height:1.85;color:var(--dim);font-weight:500;margin-bottom:6px}
.tips li b{color:var(--txt);font-weight:700}

/* ===== data manager ===== */
.dblock{padding:18px;margin-bottom:11px}
.dblock h4{margin:0 0 5px;font-size:13.5px;font-weight:800;display:flex;align-items:center;gap:8px}
.dblock h4 svg{width:15px;height:15px;stroke:var(--aqua);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.dblock p{margin:0 0 13px;font-size:12px;line-height:1.7;color:var(--dim);font-weight:500}
.dblock .btn{margin-top:7px}
.usage{display:flex;gap:9px;margin-bottom:11px}
.usage .g{flex:1;padding:13px 9px;text-align:center}
.usage em{display:block;font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:20px;font-weight:600;color:var(--aqua-soft)}
.usage span{display:block;font-size:9px;letter-spacing:.12em;color:var(--dim2);font-weight:800;margin-top:3px}
.subjreset{display:flex;flex-direction:column;gap:7px;margin-top:4px}
.subjreset div{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:700}
.subjreset div span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.subjreset div em{font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:11px;color:var(--dim2)}
.subjreset button{border:1px solid rgba(255,143,176,.35);background:rgba(255,143,176,.08);color:var(--rose);
  border-radius:10px;padding:6px 11px;font-family:inherit;font-size:11px;font-weight:700;cursor:pointer}
.backlink{display:flex;align-items:center;gap:8px;background:none;border:0;color:var(--aqua);font-family:inherit;
  font-size:12.5px;font-weight:700;cursor:pointer;padding:0;margin-bottom:16px}
.backlink svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.toast{position:fixed;left:50%;bottom:calc(96px + var(--safeb));transform:translate(-50%,16px);z-index:60;
  padding:11px 20px;border-radius:99px;font-size:12.5px;font-weight:700;opacity:0;pointer-events:none;max-width:86vw;text-align:center;
  background:rgba(10,35,64,.9);border:1px solid var(--edge);backdrop-filter:blur(18px);transition:.32s var(--ease)}
.toast.on{opacity:1;transform:translate(-50%,0)}
#boot{position:fixed;inset:0;z-index:99;display:grid;place-items:center;background:var(--ink-900);transition:opacity .5s var(--ease)}
#boot.off{opacity:0;pointer-events:none}
#boot div{text-align:center}
#boot .sp{width:44px;height:44px;margin:0 auto 16px;border-radius:50%;border:2px solid rgba(110,231,255,.2);border-top-color:var(--aqua);animation:spin .9s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
#boot p{margin:0;font-size:12px;color:var(--dim);font-weight:700;letter-spacing:.1em}

@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.06s!important}}
:focus-visible{outline:2px solid var(--aqua);outline-offset:3px;border-radius:6px}
@media(min-width:560px){.scroll,.qbody,.rwrap,.qtop,.qfoot{max-width:540px;margin-left:auto;margin-right:auto;width:100%}}