:root{--hue-primary:168;--hue-danger:350;--hue-success:150;--hue-base:220;--bg-deg:135deg;--bg-start:hsl(var(--hue-base),30%,96%);--bg-end:hsl(var(--hue-primary),20%,94%);--surface-glass:hsla(0,0%,100%,0.75);--surface-glass-strong:hsla(0,0%,100%,0.9);--surface-hover:hsla(var(--hue-base),20%,95%,0.6);--border-light:hsla(var(--hue-base),20%,85%,0.6);--border-strong:hsla(var(--hue-base),20%,75%,0.8);--text-main:hsl(var(--hue-base),40%,15%);--text-muted:hsl(var(--hue-base),20%,45%);--text-subtle:hsl(var(--hue-base),15%,60%);--accent:hsl(var(--hue-primary),75%,42%);--accent-hover:hsl(var(--hue-primary),70%,38%);--accent-subtle:hsl(var(--hue-primary),60%,92%);--danger:hsl(var(--hue-danger),75%,55%);--danger-bg:hsl(var(--hue-danger),80%,96%);--success:hsl(var(--hue-success),70%,40%);--success-bg:hsl(var(--hue-success),70%,95%);--shadow-sm:0 2px 8px -2px hsla(var(--hue-base),20%,60%,0.1);--shadow-md:0 12px 32px -8px hsla(var(--hue-base),30%,50%,0.12),0 4px 12px -4px hsla(var(--hue-base),30%,50%,0.08);--shadow-inner:inset 0 2px 4px 0 rgba(0,0,0,0.02);--glass-blur:blur(16px);--glass-border:1px solid var(--border-light);--ease-spring:cubic-bezier(0.175,0.885,0.32,1.15);--ease-smooth:cubic-bezier(0.25,0.46,0.45,0.94)}@media (prefers-color-scheme:dark){:root{--bg-start:hsl(var(--hue-base),25%,10%);--bg-end:hsl(var(--hue-base),30%,14%);--surface-glass:hsla(var(--hue-base),25%,18%,0.7);--surface-glass-strong:hsla(var(--hue-base),25%,22%,0.9);--surface-hover:hsla(var(--hue-base),20%,30%,0.6);--border-light:hsla(var(--hue-base),15%,35%,0.5);--border-strong:hsla(var(--hue-base),15%,45%,0.6);--text-main:hsl(var(--hue-base),10%,95%);--text-muted:hsl(var(--hue-base),10%,70%);--text-subtle:hsl(var(--hue-base),10%,50%);--accent:hsl(var(--hue-primary),60%,50%);--accent-hover:hsl(var(--hue-primary),60%,45%);--accent-subtle:hsla(var(--hue-primary),50%,20%,0.4);--danger:hsl(var(--hue-danger),70%,65%);--danger-bg:hsla(var(--hue-danger),40%,20%,0.4);--success:hsl(var(--hue-success),60%,50%);--success-bg:hsla(var(--hue-success),40%,20%,0.4);--shadow-sm:0 4px 12px -2px rgba(0,0,0,0.3);--shadow-md:0 16px 48px -8px rgba(0,0,0,0.4)}}*{box-sizing:border-box}body,html{margin:0;padding:0;min-height:100vh;background-image:linear-gradient(var(--bg-deg),var(--bg-start),var(--bg-end));background-attachment:fixed;color:var(--text-main);font-family:var(--font-inter),var(--font-noto-sans-sc),system-ui,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}body:after,body:before{content:"";position:fixed;z-index:-1;border-radius:50%;filter:blur(80px);opacity:.4;animation:blobFloat 20s infinite alternate}body:before{width:min(600px,60vw);height:min(600px,60vw);top:-10%;left:-10%;background:radial-gradient(circle,var(--accent),transparent 70%)}body:after{width:min(500px,50vw);height:min(500px,50vw);bottom:-5%;right:-5%;background:radial-gradient(circle,var(--success),transparent 70%);animation-delay:-10s;animation-duration:25s}@keyframes blobFloat{0%{transform:translate(0) scale(1)}to{transform:translate(30px,50px) scale(1.1)}}a{color:inherit;text-decoration:none}.page{width:min(960px,100% - 32px);margin:0 auto;padding:32px 0 48px;animation:fadeIn .4s var(--ease-smooth)}.page.page-home{width:min(800px,100% - 32px)}.page.page-train{width:min(860px,100% - 32px)}.card{background:var(--surface-glass);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:var(--glass-border);border-radius:20px;padding:24px;box-shadow:var(--shadow-md);transition:transform .2s var(--ease-smooth),box-shadow .2s var(--ease-smooth)}.card.interactive:hover{transform:translateY(-2px);box-shadow:0 16px 40px -10px hsla(var(--hue-base),30%,50%,.15)}.card+.card{margin-top:20px}.header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.header.centered{flex-direction:column;text-align:center}h1,h2,h3{margin:0;color:var(--text-main);letter-spacing:-.02em}h1{font-size:1.75rem;font-weight:700}h2{font-size:1.4rem}h2,h3{font-weight:600}h3{font-size:1.1rem}.muted{color:var(--text-muted);font-size:.95rem;line-height:1.5}.grid{display:grid;grid-gap:16px;gap:16px}.grid.one{grid-template-columns:1fr}.grid.two{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.row{display:flex;align-items:center;gap:10px}.row.wrap{flex-wrap:wrap}.row.center{justify-content:center}.badge{background:var(--surface-hover);color:var(--text-muted);border:1px solid var(--border-light);border-radius:999px;padding:6px 14px;font-size:.8rem;font-weight:500;letter-spacing:.02em}.button,button{font-family:inherit;font-size:.95rem;font-weight:500;letter-spacing:.01em}button.ghost,button.primary,button.secondary{border:none;border-radius:14px;padding:12px 20px;cursor:pointer;transition:all .2s cubic-bezier(.2,0,0,1);display:inline-flex;align-items:center;justify-content:center;gap:8px}button.primary{background:linear-gradient(135deg,var(--accent),hsl(var(--hue-primary),80%,35%));color:#fff;box-shadow:0 4px 12px hsla(var(--hue-primary),60%,40%,.3);text-shadow:0 1px 2px rgba(0,0,0,.1)}button.primary:hover{transform:translateY(-1px);box-shadow:0 6px 16px hsla(var(--hue-primary),60%,40%,.4);filter:brightness(1.05)}button.primary:active{transform:translateY(1px);box-shadow:0 2px 6px hsla(var(--hue-primary),60%,40%,.3)}button.secondary{background:var(--surface-hover);color:var(--text-main);border:1px solid transparent}button.secondary:hover{background:var(--border-light)}button.secondary:active{transform:scale(.98)}button.ghost{background:transparent;color:var(--text-subtle);border:1px solid transparent;padding:8px 16px;border-radius:999px}button.ghost:hover{background:var(--surface-hover);color:var(--text-main)}button:disabled,input:disabled,select:disabled{cursor:not-allowed;opacity:.6;filter:grayscale(1)}input,select,textarea{font:inherit;border:1px solid var(--border-light);border-radius:12px;padding:10px 14px;width:100%;background:var(--surface-glass-strong);color:var(--text-main);transition:all .2s ease;box-shadow:var(--shadow-inner)}input:hover,select:hover{border-color:var(--border-strong)}input:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-subtle)}label.field{display:grid;grid-gap:8px;gap:8px;font-size:.9rem;font-weight:500;color:var(--text-muted)}.field-label-row{display:flex;align-items:center;gap:6px}.help-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--text-muted);font-size:.7rem;font-weight:700;color:var(--text-muted);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0}.help-trigger:hover{border-color:var(--accent);color:var(--accent)}.help-popover{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--surface);border:1px solid var(--border-light);border-radius:10px;padding:10px 14px;font-size:.8rem;font-weight:400;line-height:1.7;color:var(--text);white-space:pre-line;min-width:240px;max-width:320px;box-shadow:0 4px 16px rgba(0,0,0,.12);z-index:100;pointer-events:auto}.metric{border:1px solid var(--border-light);border-radius:16px;padding:16px;background:linear-gradient(180deg,var(--surface-glass),var(--surface-glass-strong));text-align:center}.metric .value{font-size:1.8rem;font-weight:700;color:var(--accent);margin-top:4px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;font-size:.95rem;color:var(--text-muted);margin-bottom:24px}.topbar .right{justify-self:end}.topbar-controls{display:flex;gap:10px}.topbar-btn{border:1px solid var(--border-light);border-radius:999px;padding:6px 12px;background:var(--surface-glass);color:var(--text-subtle);cursor:pointer;transition:all .2s;font-size:.85rem;font-weight:500}.topbar-btn:hover{background:var(--surface-hover);color:var(--text-main);transform:translateY(-1px)}.topbar-btn.is-resume{background:var(--accent);color:#fff;border-color:transparent;box-shadow:0 2px 8px hsla(var(--hue-primary),60%,40%,.3)}.equation{width:100%;font-weight:800;font-size:2.5rem;letter-spacing:.02em;text-align:center;margin:12px auto 24px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;color:var(--text-main);text-shadow:0 2px 4px rgba(0,0,0,.05)}.subline{font-size:1rem;color:var(--text-subtle);margin-top:-12px;margin-bottom:20px;display:block;text-align:center}.keypad{margin-top:24px;grid-gap:12px;max-width:380px;margin-left:auto;margin-right:auto}.keypad,.keypad-row{display:grid;gap:12px}.keypad-row{grid-template-columns:repeat(3,1fr);grid-gap:12px}.key{border:none;border-radius:16px;background:var(--surface-glass-strong);min-height:56px;font-size:1.25rem;font-weight:600;color:var(--text-main);cursor:pointer;box-shadow:0 4px 0 var(--border-light),0 4px 8px rgba(0,0,0,.05);transition:all .1s;display:flex;align-items:center;justify-content:center}.key:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--border-light),0 8px 12px rgba(0,0,0,.1);background:#fff}@media (prefers-color-scheme:dark){.key:hover{background:hsl(var(--hue-base),25%,25%)}}.key:active{transform:translateY(2px);box-shadow:0 2px 0 var(--border-light),0 2px 4px rgba(0,0,0,.05)}.key.key-fn{background:transparent;border:2px solid var(--border-light);color:var(--text-muted);box-shadow:none}.key.key-fn:hover{background:var(--surface-hover);border-color:var(--text-subtle);transform:translateY(-1px)}.key.key-fn:active{transform:translateY(1px)}.key.key-confirm{background:var(--accent);color:white;box-shadow:0 4px 0 hsl(var(--hue-primary),60%,35%),0 4px 10px hsla(var(--hue-primary),60%,40%,.4)}.key.key-confirm:hover{background:var(--accent-hover);box-shadow:0 6px 0 hsl(var(--hue-primary),60%,35%),0 8px 16px hsla(var(--hue-primary),60%,40%,.5)}.key.key-confirm:active{transform:translateY(2px);box-shadow:0 2px 0 hsl(var(--hue-primary),60%,35%)}@keyframes slideDown{0%{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%)}}.toast{position:fixed;top:24px;left:50%;transform:translateX(-50%);border-radius:999px;padding:10px 24px;font-size:.95rem;font-weight:600;z-index:100;animation:slideDown .3s var(--ease-spring);box-shadow:0 8px 20px rgba(0,0,0,.15);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.toast.success{background:var(--success-bg);color:var(--success);border:1px solid var(--success)}.toast.error{background:var(--danger-bg);color:var(--danger);border:1px solid var(--danger)}.table{width:100%;border-collapse:separate;border-spacing:0;font-size:.95rem}.table th{text-align:left;padding:12px;color:var(--text-muted);border-bottom:2px solid var(--border-light);font-weight:600}.table td{padding:12px;border-bottom:1px solid var(--border-light);color:var(--text-main)}.table tr:last-child td{border-bottom:none}.table tbody tr:hover td{background:var(--surface-hover)}.centered-card{max-width:640px;margin-left:auto;margin-right:auto}.action-row{display:flex;justify-content:center;gap:12px;margin-top:16px}.round-btn{border:1px solid var(--border-light);border-radius:999px;padding:10px 28px;background:var(--surface-glass);color:var(--text-muted);cursor:pointer;font-size:.95rem;font-weight:500;transition:all .2s cubic-bezier(.2,0,0,1)}.round-btn:hover{background:var(--surface-hover);color:var(--text-main);transform:translateY(-1px)}.round-btn:active{transform:translateY(1px)}.round-btn.primary{background:linear-gradient(135deg,var(--accent),hsl(var(--hue-primary),80%,35%));color:#fff;border-color:transparent;box-shadow:0 4px 12px hsla(var(--hue-primary),60%,40%,.3)}.round-btn.primary:hover{filter:brightness(1.05);box-shadow:0 6px 16px hsla(var(--hue-primary),60%,40%,.4)}.note-toggle{border:1px dashed var(--border-light);border-radius:12px;padding:8px 16px;background:transparent;color:var(--text-subtle);cursor:pointer;font-size:.9rem;transition:all .2s;width:100%;text-align:center}.note-toggle:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-subtle)}.pause-overlay{text-align:center;color:var(--text-muted);font-size:1rem;padding:12px;background:var(--surface-hover);border-radius:12px;margin:8px 0}.equation-paused{opacity:.3;filter:blur(4px);-webkit-user-select:none;-moz-user-select:none;user-select:none}.drill-floating-header{display:flex;align-items:center;justify-content:space-between;cursor:-webkit-grab;cursor:grab;touch-action:none}.drill-floating-header:active{cursor:-webkit-grabbing;cursor:grabbing}.drill-close-btn{padding:4px 12px!important;font-size:.85rem!important}.range-row{display:flex;align-items:center;gap:12px}.range-row input[type=range]{flex:1 1}.range-row input[type=number]{width:72px;flex:none}.toggle-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border-light);border-radius:999px;padding:8px 16px;color:var(--text-muted);background:var(--surface-glass);font-size:.9rem;cursor:pointer;transition:all .2s}.toggle-chip:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-subtle)}.drill-floating-panel{position:fixed;z-index:80;width:min(360px,calc(100vw - 32px));border:var(--glass-border);border-radius:20px;padding:16px;background:var(--surface-glass-strong);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:var(--shadow-md);animation:slideDown .3s var(--ease-smooth)}.equation-preview-wrap{margin-top:12px;border:2px dashed var(--border-light);border-radius:12px;background:rgba(255,255,255,.4);padding:12px;text-align:center}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.home-hero{text-align:center}.home-lead{max-width:480px;margin-left:auto;margin-right:auto}.home-grid{margin-top:12px}.answer-display{font-size:2rem;font-weight:700;text-align:center;padding:10px 20px;margin:0 auto 16px;min-width:120px;max-width:280px;border-bottom:3px solid var(--accent);color:var(--accent);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;letter-spacing:.04em;min-height:2.6em;display:flex;align-items:center;justify-content:center}@media (max-width:600px){.page{padding-top:20px}h1{font-size:1.5rem}.key{min-height:52px;font-size:1.1rem}.card{padding:16px}.grid.two{grid-template-columns:1fr}.header{flex-direction:column;text-align:center}.page.page-train{display:flex;flex-direction:column}.page.page-train>.train-header{order:100;margin-bottom:0;margin-top:24px;padding-top:16px;border-top:1px solid var(--border-light)}.page.page-train>.toast{order:-1}.topbar{grid-template-columns:1fr;gap:12px;text-align:center;justify-items:center}.topbar .right{justify-self:center}.answer-display{font-size:1.6rem;min-height:2.2em}.active-card{display:flex;flex-direction:column}.active-card>.auto-submit-row{order:90;margin-top:12px}.active-card>.action-row{order:91;margin-top:12px}}.user-bar{display:inline-flex;align-items:center;gap:8px;font-size:.85rem}.user-name{color:var(--text-muted)}.sync-badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.75rem;font-weight:500}.sync-idle{background:hsla(var(--hue-success),60%,90%,.8);color:hsl(var(--hue-success),50%,30%)}.sync-syncing{background:hsla(var(--hue-primary),60%,90%,.8);color:hsl(var(--hue-primary),50%,30%)}.sync-error{background:hsla(var(--hue-danger),60%,90%,.8);color:hsl(var(--hue-danger),50%,30%)}