:root{
  --bg:#0b0c10; --card:#12151b; --panel:#0d0f14; --key:#252a33; --key2:#303641;
  --text:#f5f7fb; --muted:#8c95a5; --accent:#f2a15b; --accent2:#ffb875;
  --border:rgba(255,255,255,.09); --shadow:0 28px 70px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
background:radial-gradient(circle at 20% 0%,#1a1d25 0,transparent 36%),linear-gradient(135deg,var(--bg),#17130f);
color:var(--text);display:flex;justify-content:center;align-items:center;padding:28px}
body.light{--bg:#eef1f6;--card:#fff;--panel:#f5f7fa;--key:#e7eaf0;--key2:#dce1e9;--text:#18202c;--muted:#687385;--border:rgba(0,0,0,.09);--shadow:0 28px 70px rgba(26,37,52,.18)}
.app-shell{display:flex;gap:18px;align-items:flex-start;width:min(980px,100%)}
.calculator,.side-panel{background:rgba(18,21,27,.94);border:1px solid var(--border);border-radius:24px;box-shadow:var(--shadow);backdrop-filter:blur(14px)}
body.light .calculator,body.light .side-panel{background:rgba(255,255,255,.94)}
.calculator{width:min(470px,100%);padding:20px}
.topbar{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}
.brand{font-size:12px;font-weight:800;letter-spacing:2px}.brand-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:6px;vertical-align:2px}
.subtitle{font-size:8px;color:var(--muted);letter-spacing:1.5px;margin-top:4px}
.icon-btn,.tool-btn,.keypad button,.scientific-grid button,.memory-grid button{border:0;color:var(--text);cursor:pointer;transition:.16s ease}
.icon-btn{width:34px;height:34px;border-radius:10px;background:var(--key);font-size:16px}
.icon-btn:hover,.tool-btn:hover,.keypad button:hover,.scientific-grid button:hover,.memory-grid button:hover{transform:translateY(-1px);filter:brightness(1.1)}
.icon-btn:active,.tool-btn:active,.keypad button:active,.scientific-grid button:active,.memory-grid button:active{transform:scale(.97)}
.display-panel{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:14px 16px 12px;min-height:110px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.expression{height:24px;color:var(--muted);font-size:13px;text-align:right;white-space:nowrap;overflow:auto}
.display{font-size:44px;font-weight:650;line-height:1.05;text-align:right;letter-spacing:-1px;white-space:nowrap;overflow:auto}
.toolbar{display:flex;gap:8px;margin:12px 0 8px}.tool-btn{flex:1;padding:9px 10px;border-radius:10px;background:var(--key);font-size:11px;font-weight:700}
.scientific-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:8px}
.scientific-grid button{padding:10px 6px;border-radius:10px;background:#1d222b;font-size:12px}
body.light .scientific-grid button{background:#eef0f4}
.memory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0}
.memory-grid button{padding:9px 5px;border-radius:10px;background:transparent;border:1px solid var(--border);font-size:11px}
.keypad{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.keypad button{height:56px;border-radius:13px;background:var(--key);font-size:16px;font-weight:650}
.keypad .utility{font-size:12px}.keypad .operator{background:#28231f;color:#ffb36f}.keypad .equals{background:var(--accent);color:#21170f}
body.light .keypad .operator{background:#fff1e4}.keypad button:focus-visible,.tool-btn:focus-visible,.icon-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hint{font-size:8px;color:var(--muted);text-align:center;margin-top:12px}
.side-panel{width:320px;padding:18px;max-height:620px;overflow:auto}.panel-head{display:flex;justify-content:space-between;align-items:center}
.panel-head h2{font-size:16px;margin:0}.clear-history{background:transparent;border:0;color:var(--accent);cursor:pointer;font-weight:700}
.history-list{display:flex;flex-direction:column;gap:8px;margin-top:14px}.history-item{padding:12px;border:1px solid var(--border);border-radius:12px;cursor:pointer}.history-item:hover{background:rgba(255,255,255,.04)}
.history-exp{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis}.history-result{font-size:20px;margin-top:4px;font-weight:700}.empty{color:var(--muted);font-size:13px}
.hidden{display:none!important}
@media(max-width:760px){body{padding:12px}.app-shell{display:block}.calculator{margin:auto}.side-panel{width:min(470px,100%);margin:14px auto 0}.keypad button{height:58px}.display{font-size:40px}}
@media(max-width:390px){.calculator{padding:14px;border-radius:18px}.keypad,.scientific-grid,.memory-grid{gap:6px}.keypad button{height:52px}.display{font-size:34px}}
