:root{--bg: #0f1117;--panel: #171a23;--panel-2: #1e222d;--key: #262b37;--key-hover: #313847;--fn: #1f2431;--op: #2f3a4d;--accent: #4f8cff;--add: #16a34a;--add-glow: #22c55e;--eq: #4f8cff;--text: #eef1f7;--muted: #8d95a8;--border: #2a2f3d;font-family:Inter,Noto Sans TC,-apple-system,Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(1200px 700px at 15% -10%,#1b2233 0%,var(--bg) 60%);color:var(--text);display:flex;justify-content:center;padding:28px 18px}.app{display:grid;grid-template-columns:minmax(340px,430px) minmax(260px,320px);gap:20px;align-items:start;width:100%;max-width:800px}.calculator{background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:16px;box-shadow:0 24px 60px #00000073}.topbar h1{font-size:15px;margin:0 0 10px;letter-spacing:.04em;color:var(--muted);font-weight:600}.modes{display:flex;gap:6px;background:var(--panel-2);padding:4px;border-radius:12px}.modes button{flex:1;padding:8px 4px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;transition:background .15s,color .15s}.modes button:hover{color:var(--text)}.modes button.active{background:var(--accent);color:#fff}.add-counter{margin:12px 0;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;border-radius:14px;background:linear-gradient(120deg,#16a34a2e,#16a34a0a);border:1px solid rgba(34,197,94,.35);transition:box-shadow .2s,transform .2s}.add-counter.flash{box-shadow:0 0 0 3px #22c55e59;transform:scale(1.015)}.add-counter-body{display:flex;align-items:baseline;gap:8px}.add-counter-label{font-size:13px;color:#9fe6b8;letter-spacing:.05em}.add-counter-value{font-size:30px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--add-glow);line-height:1}.add-counter-unit{font-size:13px;color:#9fe6b8}.add-counter-reset{background:transparent;border:1px solid rgba(34,197,94,.4);color:#9fe6b8;border-radius:8px;padding:5px 12px;font-size:12px;cursor:pointer}.add-counter-reset:hover:not(:disabled){background:#22c55e26}.add-counter-reset:disabled{opacity:.4;cursor:default}.display{background:var(--panel-2);border-radius:14px;padding:12px 16px 16px;text-align:right;border:1px solid var(--border)}.display-meta{display:flex;justify-content:space-between;align-items:center;min-height:18px;font-size:12px;color:var(--muted)}.display-meta .expr{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flags{display:flex;gap:6px}.flag{border:1px solid var(--border);border-radius:5px;padding:1px 5px;font-size:10px;letter-spacing:.06em;color:var(--accent)}.display-value{margin-top:6px;font-size:clamp(26px,8vw,42px);font-weight:600;font-variant-numeric:tabular-nums;word-break:break-all;line-height:1.15;min-height:48px}.memory-bar{display:flex;align-items:center;gap:6px;margin:10px 0 4px;flex-wrap:wrap}.mem-key{flex:0 0 auto;min-width:44px;padding:6px 0;background:var(--fn);border:1px solid var(--border);color:var(--text);border-radius:8px;font-size:12px;cursor:pointer}.mem-key:hover:not(:disabled){background:var(--key-hover)}.mem-key:disabled{opacity:.35;cursor:default}.mem-value{margin-left:auto;font-size:11px;color:var(--muted)}.pad{display:grid;gap:8px;margin-top:10px}.pad-num{grid-template-columns:repeat(4,1fr)}.pad-sci,.pad-prog{grid-template-columns:repeat(5,1fr)}.key{padding:14px 0;font-size:17px;border:1px solid var(--border);border-radius:11px;background:var(--key);color:var(--text);cursor:pointer;transition:background .12s,transform .06s;font-variant-numeric:tabular-nums}.key:hover{background:var(--key-hover)}.key:active{transform:translateY(1px)}.key:disabled{opacity:.3;cursor:default}.key-fn{background:var(--fn);font-size:14px}.key-op{background:var(--op);font-weight:600}.key-hex{background:var(--fn);font-weight:600;color:var(--accent)}.key-eq{background:var(--eq);border-color:var(--eq);font-weight:700}.key-span5{grid-column:span 5}.key-eq:hover{background:#6fa1ff}.key-op.add{background:var(--add);border-color:var(--add-glow);font-weight:700}.key-op.add:hover{background:var(--add-glow)}.prog{margin-top:10px}.base-list{display:grid;gap:4px;background:var(--panel-2);border:1px solid var(--border);border-radius:12px;padding:6px}.base-row{display:flex;justify-content:space-between;align-items:center;gap:10px;background:transparent;border:0;border-radius:8px;padding:6px 10px;color:var(--muted);cursor:pointer;font-size:13px}.base-row:hover{background:var(--key)}.base-row.active{background:var(--key);color:var(--text)}.base-row.active .base-key{color:var(--accent)}.base-key{font-weight:700;letter-spacing:.06em}.base-val{font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.converter{margin-top:12px}.cat-tabs{display:flex;flex-wrap:wrap;gap:6px}.cat-tabs button{padding:6px 12px;border-radius:999px;border:1px solid var(--border);background:var(--fn);color:var(--muted);font-size:12px;cursor:pointer}.cat-tabs button.active{background:var(--accent);color:#fff;border-color:var(--accent)}.conv-row{display:flex;gap:8px;align-items:stretch;margin-top:12px}.conv-input,.conv-result{flex:1;background:var(--panel-2);border:1px solid var(--border);border-radius:12px;padding:14px 16px;color:var(--text);font-size:24px;font-variant-numeric:tabular-nums;text-align:right;min-width:0;overflow:hidden;text-overflow:ellipsis}.conv-input:focus{outline:2px solid var(--accent)}.conv-result{color:var(--accent);font-weight:600}.conv-row select{width:130px;background:var(--key);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:0 8px;font-size:13px}.conv-swap{margin:10px auto 0;display:block;background:var(--fn);border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:6px 16px;font-size:12px;cursor:pointer}.conv-swap:hover{background:var(--key-hover);color:var(--text)}.side{display:grid;gap:16px}.history,.tips{background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:14px 16px}.history-head{display:flex;justify-content:space-between;align-items:center}.history h2,.tips h2{font-size:13px;margin:0;color:var(--muted);letter-spacing:.05em}.history-head button{background:transparent;border:1px solid var(--border);color:var(--muted);border-radius:7px;font-size:11px;padding:3px 9px;cursor:pointer}.history-head button:disabled{opacity:.35;cursor:default}.history-empty{color:var(--muted);font-size:12px}.history ul{list-style:none;margin:10px 0 0;padding:0;max-height:320px;overflow-y:auto;display:grid;gap:4px}.history li button{width:100%;display:grid;gap:2px;text-align:right;background:transparent;border:0;border-radius:9px;padding:7px 9px;color:var(--text);cursor:pointer}.history li button:hover{background:var(--panel-2)}.h-expr{font-size:11px;color:var(--muted)}.h-tag{color:var(--add-glow);font-style:normal;margin-right:4px}.h-result{font-size:16px;font-variant-numeric:tabular-nums}.tips ul{margin:10px 0 0;padding-left:18px;display:grid;gap:7px}.tips li{font-size:12px;color:var(--muted);line-height:1.6}.tips b{color:var(--add-glow)}.tips code{background:var(--panel-2);border-radius:4px;padding:1px 5px;font-size:11px;color:var(--text)}@media (max-width: 780px){.app{grid-template-columns:1fr;max-width:460px}}