:root{--bg:#080808;--ink:#f1f1f1;--muted:#9a9a9a;--line:#2e2e2e;--line-bright:#b8b8b8;--glass:#ffffff1f;--sand:#dba33b;--accent:#38bdf8;--success:#4ade80;--danger:#fb7185;--surface:#1a1a1a;--sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font:16px/1.5 var(--sans);letter-spacing:0;color:var(--ink);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input{font:inherit}button{min-height:34px;color:var(--ink);cursor:pointer;background:#ffffff0b;border:1px solid #9a9a9a47;border-radius:999px;padding:0 14px}button:hover:not(:disabled){background:#ffffff13;border-color:#edf2f76b}button:focus-visible,input:focus-visible{outline-offset:3px;outline:2px solid #38bdf8b8}button:disabled{cursor:not-allowed;opacity:.42}button.primary{color:var(--bg);background:var(--accent);border-color:#38bdf8b8}button.primary:hover:not(:disabled){background:#67d7ff;border-color:#bae6fde6}p{margin:0}#app{min-height:100svh}.shell{align-content:center;gap:22px;width:min(960px,100% - 32px);min-height:100svh;margin:0 auto;padding:34px 0;display:grid}.visualization{grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:clamp(22px,7vw,72px);width:min(560px,100%);margin:0 auto;padding:0 0 34px;display:grid;position:relative}.visualization:after{content:"";inset-inline:4%;background:var(--surface);border-radius:999px;height:2px;position:absolute;bottom:9px}.glass-card{z-index:1;min-width:0;color:var(--ink);justify-items:center;gap:16px;display:grid;position:relative}.remaining-readout{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.86rem;line-height:1}.glass-card.pending .remaining-readout{color:var(--accent)}.glass-heading{justify-items:center;min-height:0;display:grid}.glass-editor,.target-editor{justify-items:center;gap:6px;display:grid}.glass-editor span,.elapsed-readout span,.target-editor span{color:var(--muted);letter-spacing:0;text-transform:uppercase;font-size:.72rem;font-weight:700}.glass-editor input,.target-editor input{width:68px;min-height:34px;color:var(--ink);text-align:center;appearance:textfield;background:#ffffff0e;border:1px solid #9a9a9a42;border-radius:999px;padding:0;font-weight:700}.target-editor input{width:88px}.glass-editor input::-webkit-outer-spin-button{appearance:none;margin:0}.glass-editor input::-webkit-inner-spin-button{appearance:none;margin:0}.target-editor input::-webkit-outer-spin-button{appearance:none;margin:0}.target-editor input::-webkit-inner-spin-button{appearance:none;margin:0}.glass-editor input[aria-invalid=true],.target-editor input[aria-invalid=true]{background:#fb71851a;border-color:#fb7185bd}.hourglass{transform-origin:50%;width:152px;height:252px;min-height:0;color:inherit;cursor:pointer;background:0 0;border:0;grid-template-rows:minmax(0,1fr) 16px minmax(0,1fr);margin:0 auto;padding:0;transition:transform .36s cubic-bezier(.2,.8,.2,1);display:grid}.glass-card.pending .hourglass{color:var(--accent)}.hourglass:focus-visible{outline-offset:10px;outline:2px solid #38bdf8b8}.hourglass[aria-disabled=true]{cursor:not-allowed}.hourglass.rotated{transform:rotate(180deg)}.bulb{border:2px solid var(--line-bright);background:var(--glass);position:relative;overflow:hidden}.bulb.top{clip-path:polygon(12% 0,88% 0,56% 100%,44% 100%);border-bottom-width:0}.bulb.bottom{clip-path:polygon(44% 0,56% 0,88% 100%,12% 100%);border-top-width:0}.sand{inset-inline:10%;height:var(--fill);background:var(--sand);border-radius:50% 50% 0 0;position:absolute;bottom:0}.hourglass.rotated .sand{border-radius:0 0 50% 50%;top:0;bottom:auto}.neck{border-inline:2px solid var(--line-bright);background:var(--glass);width:20px;margin:-1px auto;position:relative}.neck:after{content:"";inset-block:-5px;background:var(--sand);opacity:0;border-radius:999px;width:3px;position:absolute;left:50%;transform:translate(-50%)}.decision-panel{grid-template-columns:minmax(72px,max-content) minmax(160px,1fr) minmax(88px,max-content);align-items:end;gap:10px 14px;width:min(540px,100%);margin:0 auto;display:grid}.elapsed-readout,.target-editor{grid-template-rows:14px 34px;align-items:center;gap:6px;min-height:54px;display:grid}.elapsed-readout{justify-items:start}.elapsed-readout strong{min-height:34px;color:var(--ink);font-variant-numeric:tabular-nums;align-items:center;font-size:1.42rem;font-weight:650;line-height:1;display:flex}.progress-meter{background:#ffffff14;border-radius:999px;align-self:end;width:100%;height:5px;margin-bottom:14.5px;overflow:hidden}.progress-meter span{border-radius:inherit;background:var(--accent);height:100%;display:block}.shell.success .progress-meter span{background:var(--success)}.shell.missed .progress-meter span{background:var(--danger)}.button-row{flex-wrap:wrap;grid-column:1/-1;justify-content:center;gap:8px;display:flex}.solve-row{grid-column:1/-1;justify-content:center;display:flex}.solver-panel{justify-items:center;gap:8px;width:min(720px,100%);margin:0 auto;display:grid}.solver-summary{align-items:baseline;gap:8px;display:flex}.solver-summary strong{color:var(--ink);font-size:.9rem;font-weight:650}.solver-panel.impossible .solver-summary strong{color:var(--danger)}.solution-steps{flex-wrap:wrap;justify-content:center;gap:6px;margin:0;padding:0;list-style:none;display:flex}.solution-steps li{min-height:28px;color:var(--muted);font-variant-numeric:tabular-nums;border:1px solid #9a9a9a38;border-radius:999px;justify-content:center;align-items:center;padding:0 12px;font-size:.78rem;display:flex}.solution-steps strong{color:var(--accent);font-weight:650}@media (width<=680px){.shell{gap:18px;width:min(100% - 40px,960px);padding:24px 0}.visualization{gap:18px;width:min(320px,100%);padding-bottom:30px}.hourglass{width:min(104px,100%);height:178px}.glass-editor input{width:58px}.decision-panel{grid-template-columns:minmax(62px,max-content) minmax(96px,1fr) minmax(76px,max-content);justify-items:center;gap:12px;width:min(320px,100%)}.solver-panel{width:min(320px,100%)}}@media (width<=380px){.shell{width:min(100% - 32px,960px)}.visualization{gap:12px;width:min(292px,100%)}.hourglass{width:min(96px,100%);height:166px}.decision-panel{grid-template-columns:1fr;width:min(292px,100%)}.progress-meter{align-self:center;width:100%;margin-bottom:0}.elapsed-readout,.target-editor{justify-items:center;min-height:auto}}@media (prefers-reduced-motion:reduce){.hourglass{transition-duration:80ms}}
