.calculator-container{justify-content:center;align-items:center;min-height:100%;padding:2rem 1rem;display:flex}.calculator{background-color:var(--bg-color);box-shadow:var(--shadow-lg);border-radius:1rem;width:100%;max-width:400px;padding:1.5rem}.calculator-display{background-color:var(--bg-secondary);border:2px solid var(--border-color);text-align:right;color:var(--text-color);word-wrap:break-word;overflow-wrap:break-word;border-radius:.5rem;min-height:4rem;margin-bottom:1.5rem;padding:1.5rem;font-size:2.5rem;font-weight:600}.calculator-keypad{grid-template-columns:repeat(4,1fr);gap:.75rem;display:grid}.calc-btn{border:none;border-radius:.5rem;padding:1.25rem;font-size:1.5rem;font-weight:600;transition:all .2s}.digit-btn{background-color:var(--bg-secondary);color:var(--text-color)}.digit-btn:hover{background-color:var(--border-color)}.digit-btn:active{transform:scale(.95)}.operation-btn{background-color:var(--primary-color);color:#fff}.operation-btn:hover{background-color:var(--primary-dark)}.operation-btn:active{transform:scale(.95)}.function-btn{background-color:var(--text-secondary);color:#fff}.function-btn:hover{background-color:var(--text-color)}.function-btn:active{transform:scale(.95)}.equals-btn{background-color:var(--accent-color);color:#fff;grid-row:span 2}.equals-btn:hover{background-color:var(--accent-dark)}.equals-btn:active{transform:scale(.95)}.zero-btn{grid-column:span 2}@media (width<=480px){.calculator{max-width:100%}.calculator-display{padding:1rem;font-size:2rem}.calc-btn{padding:1rem;font-size:1.25rem}}:root{--ink:#111827;--ink-muted:#6b7280;--bg:#fff;--surface:#f3f4f6;--rule:#e5e7eb;--accent:#2563eb;--accent-ink:#fff;--accent-secondary:#10b981;--primary-color:#2563eb;--primary-dark:#1d4ed8;--primary-light:#3b82f6;--accent-color:#10b981;--accent-dark:#059669;--accent-light:#34d399;--bg-color:#fff;--bg-secondary:#f3f4f6;--text-color:#111827;--text-secondary:#6b7280;--border-color:#e5e7eb;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--measure:60ch;scrollbar-color:var(--rule) transparent;caret-color:var(--accent);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--ink:#f9fafb;--ink-muted:#9ca3af;--bg:#111827;--surface:#1f2937;--rule:#374151;--accent:#3b82f6;--accent-ink:#111827;--accent-secondary:#34d399;--primary-color:#3b82f6;--primary-dark:#2563eb;--primary-light:#60a5fa;--accent-color:#34d399;--accent-dark:#10b981;--accent-light:#6ee7b7;--bg-color:#111827;--bg-secondary:#1f2937;--text-color:#f9fafb;--text-secondary:#9ca3af;--border-color:#374151}}*,:before,:after{box-sizing:border-box}html{overflow-x:clip}body{-webkit-font-smoothing:antialiased;color:var(--ink);background:var(--bg);margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.6}.screen{min-height:100vh}p{text-wrap:pretty}h1,h2,h3{text-wrap:balance}::selection{background:var(--accent);color:var(--accent-ink)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}a{color:var(--accent);text-underline-offset:.18em}.num{font-variant-numeric:tabular-nums}button,[role=button],summary,select,input[type=checkbox],input[type=radio]{min-height:44px}button{min-width:44px}input,select,textarea{font:inherit;font-size:max(1rem,16px)}img,video,canvas,svg{max-width:100%;height:auto}pre{overflow-x:auto}@media (width<=480px){.screen{padding-inline:1rem}}.app-container{flex-direction:column;min-height:100vh;display:flex}.app-header{background-color:var(--primary-color);color:#fff;align-items:center;gap:.75rem;padding:1rem;display:flex;box-shadow:0 1px 3px #0000001a}.back-button{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:.375rem;justify-content:center;align-items:center;padding:.25rem .5rem;font-size:1.5rem;transition:background-color .2s;display:flex}.back-button:hover{background-color:var(--primary-dark)}.app-title{font-size:1.25rem;font-weight:600}.app-content{background-color:var(--surface);flex:1}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}@media (width<=480px){body,.container,[class*=container],section,header,footer,nav,main,article{padding-inline:max(1rem,16px)}}
