:root{--ground:#e8eaef;--ground-tint:linear-gradient(160deg,#dfe3ec 0%,#e9eaf0 45%,#e3e6ee 100%);--surface:#ffffffdb;--surface-solid:#fff;--chrome:#f6f7f9d1;--sidebar:#eceef3bf;--raised:#ececef;--border:#0000001a;--border-strong:#00000029;--rule:#eceef2;--well:#f5f6f8;--text:#1d1d1f;--muted:#6e6e73;--faint:#9e9ea4;--accent:#0a84ff;--accent-press:#0060df;--accent-soft:#0a84ff1f;--pos:#34c759;--pos-ink:#1d7a34;--neg:#ff3b30;--neg-ink:#c0271e;--warn:#ff9f0a;--warn-ink:#9a6a08;--radius-card:16px;--radius-ctl:8px;--shadow-card:0 1px 2px #0000000d, 0 8px 28px #1e23321a;--shadow-pop:0 10px 34px #1e23322e;--font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro SC","PingFang SC","Helvetica Neue","Microsoft YaHei",sans-serif;--mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,monospace}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font);background:var(--ground);background-image:var(--ground-tint);color:var(--text);-webkit-font-smoothing:antialiased;background-attachment:fixed}.app{grid-template-rows:52px 1fr;grid-template-columns:264px 1fr;height:100svh;display:grid;overflow:hidden}.topbar{background:var(--chrome);-webkit-backdrop-filter:saturate(180%)blur(20px);backdrop-filter:saturate(180%)blur(20px);border-bottom:1px solid var(--border);grid-column:1/3;align-items:center;gap:12px;padding:0 18px;display:flex}.mark{border-radius:6.5px;flex:none;width:27px;height:27px;box-shadow:0 1px 2px #0a84ff66,inset 0 1px #ffffff59}.topbar h1{letter-spacing:-.01em;white-space:nowrap;font-size:15px;font-weight:600}.topbar .sub{color:var(--muted);white-space:nowrap;font-size:13px}.topbar .stats{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;margin-left:auto;font-size:13px}.topbar .stats b{color:var(--text);font-weight:600}.side{background:var(--sidebar);-webkit-backdrop-filter:saturate(160%)blur(18px);backdrop-filter:saturate(160%)blur(18px);border-right:1px solid var(--border);flex-direction:column;min-height:0;display:flex}.search{margin:12px 12px 8px}.search input{border:1px solid var(--border);border-radius:var(--radius-ctl);width:100%;height:32px;color:var(--text);background:#ffffffbf url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%239e9ea4' stroke-width='2.4' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='m20 20-3.5-3.5'/></svg>") 10px no-repeat;padding:0 10px 0 30px;font-family:inherit;font-size:13.5px;transition:box-shadow .12s,border-color .12s}.search input:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-soft);outline:none}.search input::placeholder{color:var(--faint)}.frow{align-items:center;gap:8px;margin:0 12px 8px;display:flex}.flabel{color:var(--muted);flex:none;width:26px;font-size:12px;font-weight:500}.gsel{border:1px solid var(--border);border-radius:var(--radius-ctl);height:32px;color:var(--text);appearance:none;background-color:#ffffffbf;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%236e6e73' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>"),linear-gradient(#ffffffbf,#ffffffbf);background-position:right 9px center,0 0;background-repeat:no-repeat,no-repeat;background-size:auto;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;flex:1;padding:0 8px;font-family:inherit;font-size:13.5px}.gsel:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-soft);outline:none}.diffs{border-radius:var(--radius-ctl);background:#0000000e;flex:1;gap:2px;padding:2px;display:flex}.diffs button{color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:6px;flex:1;height:28px;font-family:inherit;font-size:13px;font-weight:500;transition:background .12s,color .12s,box-shadow .12s}.diffs button:hover{color:var(--text)}.diffs button.active{background:var(--surface-solid);color:var(--text);font-weight:600;box-shadow:0 1px 2.5px #00000024,0 0 .5px #0000001f}.list{flex:1;padding:2px 8px 16px;overflow-y:auto}.grp h3{color:var(--muted);cursor:pointer;-webkit-user-select:none;user-select:none;text-transform:none;letter-spacing:.01em;border-radius:6px;align-items:center;gap:6px;margin-top:4px;padding:7px 8px;font-size:12px;font-weight:600;display:flex}.grp h3:hover{color:var(--text);background:#0000000d}.chev{width:12px;color:var(--faint);flex:none;font-size:9px;transition:transform .16s;display:inline-block}.chev.closed{transform:rotate(-90deg)}.grp h3 .cnt{font-variant-numeric:tabular-nums;color:var(--faint);margin-left:auto;font-size:11.5px;font-weight:500}.items{flex-direction:column;gap:1px;display:flex}.items button{text-align:left;width:100%;color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;height:32px;padding:0 9px;font-family:inherit;font-size:13.5px;transition:background .1s;display:flex}.items button:hover{background:#0000000e}.items button.active{background:var(--accent);color:#fff;font-weight:500;box-shadow:0 1px 3px #0a84ff59}.items button.active .dtag{color:#fff!important;background:#ffffff3d!important}.items .nm{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.dtag{font-variant-numeric:tabular-nums;border-radius:999px;flex:none;padding:1.5px 7px;font-size:10.5px;font-weight:600}.dtag.d1{color:var(--pos-ink);background:#34c75929}.dtag.d2{color:var(--warn-ink);background:#ff9f0a2e}.dtag.d3{color:var(--neg-ink);background:#ff3b3024}.empty{color:var(--muted);padding:16px 10px;font-size:13px}.sidefoot{border-top:1px solid var(--border);color:var(--muted);padding:10px 14px;font-size:11.5px;line-height:1.55}.main{gap:12px;min-width:0;min-height:0;padding:12px 16px 16px;display:flex}.stagewrap{background:var(--surface);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);flex-direction:column;flex:1;min-width:0;padding:12px;display:flex}.stagewrap svg{touch-action:none;background:var(--surface-solid);cursor:pointer;border:1px solid var(--rule);border-radius:12px;flex:1;width:100%;height:auto;min-height:0;display:block}.controls{align-items:center;gap:12px;margin-top:10px;display:flex}.controls button{background:var(--accent);color:#fff;border-radius:var(--radius-ctl);cursor:pointer;border:none;padding:7px 18px;font-family:inherit;font-size:13.5px;font-weight:500;transition:background .12s,transform 80ms;box-shadow:0 1px 2px #0a84ff59,inset 0 1px #ffffff38}.controls button:hover{background:var(--accent-press)}.controls button:active{transform:scale(.97)}.hint{color:var(--muted);font-size:13px}.panel{background:var(--surface);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);flex:none;width:356px;padding:16px;overflow-y:auto}.panel h2{letter-spacing:-.01em;padding-right:4px;font-size:19px;line-height:1.25}.meta{flex-wrap:wrap;align-items:center;gap:6px;margin:7px 0 12px;display:flex}.en-title{color:var(--faint);letter-spacing:.06em;width:100%;font-size:11px}.badge{background:var(--accent-soft);color:var(--accent-press);border-radius:999px;padding:2.5px 9px;font-size:11.5px;font-weight:500;display:inline-block}.acc{border:1px solid var(--rule);background:var(--surface-solid);border-radius:12px;margin-bottom:8px;overflow:hidden}.acc-head{cursor:pointer;width:100%;color:var(--text);text-align:left;background:0 0;border:none;align-items:center;gap:7px;padding:11px 12px;font-family:inherit;font-size:13.5px;font-weight:600;transition:background .1s;display:flex}.acc-head:hover{background:var(--well)}.acc-head .chev{color:var(--faint)}.acc-badge{color:var(--faint);margin-left:auto;font-size:11px;font-weight:500}.acc-body{border-top:1px solid var(--rule);padding:2px 12px 12px;animation:.18s accIn}@keyframes accIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.theory{color:var(--text);padding:8px 0 4px;font-size:14px;line-height:1.7}.formula{color:var(--accent-press);font-size:14px;font-weight:600;font-family:var(--mono);background:var(--accent-soft);border-radius:8px;margin:8px 0 10px;padding:9px 12px}.rows{flex-direction:column;margin-bottom:8px;font-size:13.5px;display:flex}.rows .row{border-bottom:1px solid var(--rule);justify-content:space-between;gap:10px;padding:8px 0;display:flex}.rows .row:last-child{border-bottom:none}.rows .val{font-variant-numeric:tabular-nums;text-align:right;font-weight:500;font-family:var(--mono);font-size:13px}.note{color:var(--muted);padding-top:6px;font-size:12.5px;line-height:1.6}.kp{border-bottom:1px solid var(--rule);padding:8px 0}.kp:last-child{border-bottom:none}.kp-t{color:var(--accent-press);margin-bottom:3px;font-size:13px;font-weight:600}.kp-d{color:var(--text);font-size:13px;line-height:1.65}.vlinks{flex-direction:column;gap:2px;padding-top:6px;list-style:none;display:flex}.vlinks a{color:var(--accent-press);border-radius:7px;padding:7px 10px;font-size:13.5px;text-decoration:none;transition:background .1s;display:block}.vlinks a:hover{background:var(--accent-soft);text-decoration:underline}.vlink-note{color:var(--faint);padding:6px 2px 0;font-size:11.5px;line-height:1.55}.hl{color:var(--neg);font-weight:600}.hg{color:var(--pos-ink);font-weight:600}.hb{color:var(--accent-press);font-weight:600}.ho{color:var(--warn-ink);font-weight:600}.hp{color:var(--text);font-weight:600}@keyframes rise{0%{opacity:0;transform:translateY(10px)scale(.995)}to{opacity:1;transform:translateY(0)scale(1)}}.topbar{animation:.35s ease-out both rise}.side{animation:.4s ease-out 50ms both rise}.stagewrap{animation:.4s ease-out 80ms both rise}.panel{animation:.4s ease-out .12s both rise}.items button:focus-visible,.diffs button:focus-visible,.controls button:focus-visible,.acc-head:focus-visible{outline:2px solid var(--accent);outline-offset:1px}@media (prefers-reduced-motion:reduce){.topbar,.side,.stagewrap,.panel,.acc-body{animation:none}*{transition:none!important}}.list::-webkit-scrollbar{width:8px}.panel::-webkit-scrollbar{width:8px}.list::-webkit-scrollbar-thumb{background:#0000002e padding-box content-box;border:2px solid #0000;border-radius:4px}.panel::-webkit-scrollbar-thumb{background:#0000002e padding-box content-box;border:2px solid #0000;border-radius:4px}.list::-webkit-scrollbar-thumb:hover{background:#0000004d padding-box content-box;border:2px solid #0000}.panel::-webkit-scrollbar-thumb:hover{background:#0000004d padding-box content-box;border:2px solid #0000}.menu-btn{border:1px solid var(--border);background:var(--surface-solid);border-radius:var(--radius-ctl);height:34px;color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent;flex:none;align-items:center;gap:6px;padding:0 12px;font-family:inherit;font-size:13.5px;display:none;box-shadow:0 1px 2px #0000000f}.menu-btn:active{background:var(--well)}.mnav-name{text-overflow:ellipsis;white-space:nowrap;max-width:30vw;font-weight:600;overflow:hidden}.mnav-chev{color:var(--faint);font-size:9px}.scrim{z-index:40;opacity:0;pointer-events:none;background:#00000052;transition:opacity .2s;position:fixed;inset:0}.drawer{z-index:41;background:var(--surface-solid);border:1px solid var(--border);border-bottom:none;border-radius:18px 18px 0 0;flex-direction:column;max-height:72svh;transition:transform .26s cubic-bezier(.32,.72,.28,1);display:flex;position:fixed;bottom:0;left:0;right:0;transform:translateY(102%);box-shadow:0 -10px 40px #1e233238}.drawer.open{transform:translateY(0)}.scrim.show{opacity:1;pointer-events:auto}.drawer-grab{background:#0000002e;border-radius:99px;flex:none;width:38px;height:4.5px;margin:9px auto 2px}.drawer-head{border-bottom:1px solid var(--rule);flex:none;align-items:center;gap:10px;padding:6px 16px 10px;font-size:15px;font-weight:600;display:flex}.drawer-head .close{background:var(--raised);color:var(--muted);cursor:pointer;border:none;border-radius:50%;place-items:center;width:28px;height:28px;margin-left:auto;font-family:inherit;font-size:13px;display:grid}.drawer-body{flex:1;min-height:0;overflow-y:auto}.drawer-body .side{-webkit-backdrop-filter:none;background:0 0;border:none;height:100%}.drawer-body .sidefoot{display:none}@media (width<=900px),(width<=1100px) and (pointer:coarse){.app{grid-template-rows:52px 1fr;grid-template-columns:1fr;height:100svh;overflow:hidden}.topbar{grid-column:1;gap:9px;padding:0 12px}.topbar .sub,.topbar .stats{display:none}.menu-btn{display:flex}.app>.side{display:none}.main{-webkit-overflow-scrolling:touch;padding:10px 10px calc(14px + env(safe-area-inset-bottom));flex-direction:column;grid-area:2/1;gap:10px;overflow-y:auto}.stagewrap{flex:none;padding:8px}.stagewrap svg{aspect-ratio:640/460;flex:none;height:auto}.controls{flex-wrap:wrap;gap:8px;margin-top:8px}.controls button{min-height:40px;padding:8px 16px}.hint{font-size:12px}.panel{flex:none;width:100%;padding:13px}.panel h2{font-size:17px}.theory{font-size:13.5px}.stagewrap svg{max-height:62vh}}@media (width<=520px),(width<=1030px) and (pointer:coarse) and (orientation:portrait){.topbar h1{font-size:14px}.stagewrap svg{aspect-ratio:640/440}.acc-head{padding:10px}.acc-body{padding:2px 10px 10px}.rows .row{padding:7px 0}.rows{font-size:12.5px}.rows .val{font-size:12px}}@media (prefers-reduced-motion:reduce){.drawer,.scrim{transition:none}}
