@font-face{font-family:system-mono;src:local("SFMono-Regular"),local("Consolas"),local("Liberation Mono")}
:root{color-scheme:dark;--paper:#e1e2db;--muted:#949c93;--shell:#343b3c;--lcd:#b0be8f;--accent:#b8c99a;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 50% 20%,#303833 0,#1c2421 65%,#171e1c 100%);color:var(--paper)}
main{width:min(100% - 36px,460px);margin:0 auto;padding:42px 0 24px}.intro{margin:0 5px 25px}.eyebrow{font:10px system-mono,monospace;letter-spacing:3px;color:var(--accent)}h1{font-size:23px;font-weight:550;letter-spacing:.5px;margin:10px 0 0}h1 span{display:block;font-size:12px;letter-spacing:.2px;font-weight:400;color:var(--muted);margin-top:6px}
.calculator{padding:25px 27px 18px;border-radius:25px 25px 38px 38px;background:linear-gradient(115deg,#41494a 0,#303739 56%,#2c3334 100%);border:1px solid #59615d;box-shadow:inset 0 2px 1px #ffffff12,inset -3px -5px 5px #111a1c99,0 24px 46px #050b0999,0 4px 0 #111a19}
.brand{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;letter-spacing:1px;font-weight:650;margin:0 1px 22px}.model{color:#a3b5b0;font-size:10px;letter-spacing:.2px;white-space:nowrap}.model b{color:#dde4dd;font-weight:400}
.display-bezel{padding:13px 13px 16px;background:linear-gradient(145deg,#1b2725,#202c29);border:1px solid #17201d;border-bottom-color:#657267;border-radius:10px 10px 18px 18px;box-shadow:inset 2px 3px 6px #0c161699}
.display-label{display:flex;justify-content:space-between;gap:8px;color:#93a28e;font:8px system-mono,monospace;letter-spacing:1.3px;margin:0 1px 10px}
#lcd{display:block;width:100%;height:auto;aspect-ratio:3/2;background:var(--lcd);image-rendering:pixelated;image-rendering:crisp-edges;box-shadow:0 0 0 2px #0d1512,0 0 0 3px #64745955;outline-offset:5px;border-radius:1px}
.session{display:flex;justify-content:space-between;gap:8px;margin:15px 2px 0;color:#acb6ad;font:9px system-mono,monospace}.light{font-size:8px;letter-spacing:1px;white-space:nowrap}.light i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#b6ca87;box-shadow:0 0 6px #b6ca8733;margin:0 5px 1px 0}.light i.paused{background:#a39b7c;box-shadow:none}
.controls{display:flex;align-items:center;justify-content:space-between;gap:28px;margin:29px 3px 27px}.dpad{display:grid;grid-template:repeat(3,46px)/repeat(3,46px);gap:3px}.key{font-family:inherit;color:#e3e6dc;border:1px solid #68726c;background:linear-gradient(#56615e,#3e4a47);box-shadow:0 4px 0 #18211e,0 5px 4px #14201a99,inset 0 1px 1px #ffffff24;border-radius:8px;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.key:hover{filter:brightness(1.08)}.key.pressed,.key:active{transform:translateY(3px);box-shadow:0 1px 0 #18211e,inset 0 1px 4px #0004;filter:brightness(.95)}.key:disabled{opacity:.45;cursor:wait}.key svg{width:20px;height:20px;vertical-align:middle;fill:#dce4d8}.up{grid-area:1/2}.left{grid-area:2/1}.right{grid-area:2/3}.down{grid-area:3/2}.dpad-center{grid-area:2/2;background:radial-gradient(circle,#3d4844,#2a3430);border-radius:50%;margin:9px;box-shadow:inset 0 2px 3px #1118}
.enter-wrap{flex:1;max-width:148px;align-self:center}.key-legend{display:block;font:7px system-mono,monospace;letter-spacing:1px;line-height:1.8;color:#b4c39d;text-align:center;margin-bottom:8px}.enter{width:100%;height:76px;background:linear-gradient(#bccc9e,#9eae81);color:#202d22;border-color:#c1ceab;font:700 16px system-mono,monospace;letter-spacing:1px;border-radius:9px 9px 16px 9px}.enter span{display:block;font-size:20px;line-height:1.1;margin-top:3px;opacity:.7}
.case-bottom{display:flex;justify-content:space-between;align-items:center;margin:0 3px}.case-mark{font:8px system-mono,monospace;letter-spacing:1.1px;color:#a0aaa1}.case-ridges{font:14px system-mono,monospace;letter-spacing:2px;color:#202a27;text-shadow:1px 0 #616c6033}
.below{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin:19px 5px 0}#status{font-size:11px;line-height:1.5;color:#b3bcb0;min-height:32px;margin:0}.text-button{padding:0;background:none;border:0;color:#c9d2c2;text-decoration:underline;text-underline-offset:3px;cursor:pointer;font:11px inherit;min-height:32px}.story{font-size:11px;line-height:1.9;text-align:center;color:#909d90;margin:24px 0 0}
button:focus-visible,a:focus-visible,summary:focus-visible,.import-button:focus-within{outline:2px solid #d7eab8;outline-offset:4px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:pre-wrap}button:disabled{cursor:wait}
dialog{width:min(100% - 32px,440px);max-height:85svh;overflow:auto;background:#28312d;color:var(--paper);border:1px solid #66725f;border-radius:18px;padding:24px;box-shadow:0 30px 80px #0008}dialog::backdrop{background:#0b1511bb;backdrop-filter:blur(5px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}h2{font-size:20px;font-weight:550;margin:0}.close{width:40px;height:40px;font-size:26px;color:inherit;border:0;border-radius:50%;background:#ffffff09;cursor:pointer}.dialog-intro{font-size:13px;color:#bcc6b7;line-height:1.6}.option-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}.option-grid button,.import-button{padding:13px 10px;background:#37443a;border:1px solid #56664e;color:#e4ebdd;border-radius:7px;font:12px/1.4 system-ui,sans-serif;text-align:center;cursor:pointer}.option-grid button:hover,.import-button:hover{background:#46533e}.import-button{position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center}.import-button input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.option-grid button:last-child{background:transparent}.credits{font-size:10px}details{border-top:1px solid #495744;padding-top:16px;margin-top:18px;font-size:12px;line-height:1.7;color:#bfcaba}summary{cursor:pointer;color:#dce5d5}a{color:#cee0b5}#options-message{font-size:12px;color:#e3cfa4}
@media(max-width:380px){main{width:calc(100% - 24px);padding-top:22px}.calculator{padding:22px 18px 17px}.controls{gap:18px;margin-left:0;margin-right:0}.dpad{grid-template:repeat(3,42px)/repeat(3,42px)}.key-legend{font-size:6px}.brand{font-size:10px}.enter{height:70px;font-size:14px}}
@media(max-height:760px){main{padding-top:20px}.intro{margin-bottom:18px}.story{margin-top:15px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}