:root{--bg:#efefe8;--bg-warm:#f4f1e6;--ink:#1c1a18;--ink-soft:#32302f;--muted:#8a8278;--line:#1c1a18;--accent:#c2553a;--safe-top:env(safe-area-inset-top);--safe-bottom:env(safe-area-inset-bottom);--safe-left:env(safe-area-inset-left);--safe-right:env(safe-area-inset-right)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}html,body,#root{background:var(--bg);min-height:100%;color:var(--ink);overscroll-behavior:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0;font-family:Inter Tight,-apple-system,system-ui,sans-serif;font-weight:400}html,body{width:100%;height:100%;position:fixed;overflow:hidden}#root{height:100%;overflow:hidden}input,button,textarea,select{font-family:inherit;font-size:16px}button{-webkit-user-select:none;user-select:none}.app{max-width:540px;height:100%;padding:calc(var(--safe-top) + 1rem) calc(var(--safe-right) + 1.5rem) var(--safe-bottom) calc(var(--safe-left) + 1.5rem);flex-direction:column;gap:1.25rem;margin:0 auto;transition:background .6s;display:flex;overflow:hidden}.header{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);flex-shrink:0;justify-content:center;align-items:center;padding:.85rem 0;display:flex}.brand-name{text-transform:uppercase;letter-spacing:.18em;color:var(--ink);font-size:11px;font-weight:700}.brand-dot{color:var(--muted);margin-left:.05em;font-weight:400}.stage{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:1rem;min-height:0;padding:.5rem 0;display:flex}.progress{flex-direction:column;gap:.4rem;width:100%;max-width:360px;display:flex}.progress-bar{background:#1c1a181a;border-radius:999px;height:6px;overflow:hidden}.progress-fill{background:var(--accent);border-radius:999px;height:100%;transition:width .4s cubic-bezier(.34,1.2,.64,1),background .4s}.progress-label{text-transform:uppercase;letter-spacing:.2em;color:var(--muted);font-size:11px;font-weight:600}.eyebrow{text-transform:uppercase;letter-spacing:.3em;color:var(--muted);font-size:11px;font-weight:600}.number{color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.06em;font-size:clamp(8rem,38vw,14rem);font-weight:800;line-height:.82;transition:transform .22s cubic-bezier(.34,1.56,.64,1),color .3s}.number.bump{color:var(--accent);transform:scale(1.04)}.note-banner{background:var(--accent);color:var(--bg);border-radius:12px;align-items:center;gap:.7rem;max-width:360px;padding:.7rem 1rem;transition:background .4s;display:flex}.note-banner-label{text-transform:uppercase;letter-spacing:.2em;white-space:nowrap;background:#0000002e;border-radius:6px;padding:.25rem .5rem;font-size:9px;font-weight:700}.note-banner-text{font-size:14px;font-weight:500}.action-banner{background:var(--ink);color:var(--bg);border-radius:12px;align-items:center;gap:.7rem;max-width:360px;padding:.7rem 1rem;display:flex}.action-banner-label{text-transform:uppercase;letter-spacing:.2em;white-space:nowrap;background:#ffffff24;border-radius:6px;padding:.25rem .5rem;font-size:9px;font-weight:700}.action-banner-text{text-transform:lowercase;font-size:14px;font-weight:600}.next-milestone{background:0 0;border:1.5px dashed #1c1a1847;border-radius:999px;flex-wrap:wrap;justify-content:center;align-items:center;gap:.55rem;max-width:360px;padding:.55rem 1rem;display:inline-flex}.next-milestone-label{text-transform:uppercase;letter-spacing:.22em;color:var(--muted);font-size:9px;font-weight:700}.next-milestone-distance{color:var(--ink);text-transform:lowercase;font-size:12px;font-weight:600}.next-milestone-dot{color:var(--muted);font-weight:700}.next-milestone-text{color:var(--ink-soft);font-size:12px;font-weight:500}.next-milestone-goal .next-milestone-text{color:var(--accent);font-weight:600}.next-milestone-action .next-milestone-text{color:var(--ink);font-weight:600}.controls{flex-direction:column;flex-shrink:0;gap:.6rem;display:flex}.counter-buttons{gap:.6rem;display:flex}.counter-btn{letter-spacing:-.02em;cursor:pointer;touch-action:manipulation;font-variant-numeric:tabular-nums;border-radius:999px;flex:1;padding:1.4rem 1.8rem;font-size:22px;font-weight:800;transition:transform .12s,background .25s,border-color .25s,color .25s}.counter-btn-plus{border:1.5px solid var(--ink);background:var(--ink);color:var(--bg)}.counter-btn-plus:active{background:var(--accent);border-color:var(--accent);transform:scale(.98)}.counter-btn-minus{border:1.5px solid var(--ink);color:var(--ink);background:0 0}.counter-btn-minus:active{background:var(--ink);color:var(--bg);transform:scale(.98)}.reset-btn{width:100%;color:var(--muted);text-transform:uppercase;letter-spacing:.18em;cursor:pointer;touch-action:manipulation;background:0 0;border:1.5px solid #1c1a184d;border-radius:999px;padding:.85rem 1rem;font-size:11px;font-weight:600;transition:color .2s,border-color .2s}.reset-btn:active{color:var(--ink);border-color:var(--ink)}.big-button{border:1.5px solid var(--ink);background:var(--ink);width:100%;color:var(--bg);cursor:pointer;touch-action:manipulation;border-radius:999px;justify-content:center;align-items:center;padding:1.4rem 1.8rem;font-size:16px;font-weight:500;transition:transform .12s,background .25s,border-color .25s;display:flex}.big-button-label{text-transform:uppercase;letter-spacing:.22em;font-size:12px;font-weight:600}.big-button:active{background:var(--accent);border-color:var(--accent);transform:scale(.98)}.meta{border-top:1px solid var(--ink);text-transform:uppercase;letter-spacing:.15em;color:var(--muted);flex-shrink:0;justify-content:space-between;align-items:center;padding-top:.75rem;font-size:11px;display:flex}.meta-time strong{color:var(--ink);margin-left:.4rem;font-weight:700}.meta-actions{align-items:center;gap:1.1rem;display:flex}.meta-toggle{color:var(--ink);text-transform:uppercase;letter-spacing:.18em;cursor:pointer;text-underline-offset:4px;touch-action:manipulation;background:0 0;border:none;padding:0;font-size:11px;font-weight:600;text-decoration:underline}.ruler-screen{background:var(--bg);z-index:60;display:flex;position:fixed;inset:0}.ruler-edge{background:var(--bg-warm);border-right:1.5px solid var(--ink);flex-shrink:0;width:72px;position:relative;overflow:hidden}.ruler-tick{background:var(--ink);width:12px;height:1px;position:absolute;left:0}.ruler-tick.major{width:22px;height:1.5px}.ruler-tick.five{width:32px;height:2px}.ruler-num{font-variant-numeric:tabular-nums;color:var(--ink);font-size:14px;font-weight:700;position:absolute;top:-10px;left:40px}.ruler-calibrate{border:1px dashed #1c1a1840;border-radius:14px;flex-direction:column;align-items:center;gap:.5rem;padding:1rem;display:flex}.ruler-calibrate-label{text-transform:uppercase;letter-spacing:.18em;color:var(--muted);font-size:11px;font-weight:600}.ruler-calibrate-row{align-items:center;gap:.85rem;display:flex}.ruler-calibrate-value{color:var(--ink);font-variant-numeric:tabular-nums;text-align:center;min-width:5.5rem;font-size:13px;font-weight:600}.ruler-step{border:1.5px solid var(--ink);width:2.4rem;height:2.4rem;color:var(--ink);cursor:pointer;touch-action:manipulation;background:0 0;border-radius:999px;font-size:18px;font-weight:700}.ruler-step:active{background:var(--ink);color:var(--bg)}.ruler-calibrate-hint{color:var(--muted);text-align:center;font-size:11px;line-height:1.5}.ruler-content{padding:calc(var(--safe-top) + 2.5rem) calc(var(--safe-right) + 1.5rem) calc(var(--safe-bottom) + 1.25rem) 1.5rem;text-align:center;flex-direction:column;flex:1;justify-content:space-between;align-items:stretch;gap:1.5rem;display:flex}.ruler-hint{text-transform:uppercase;letter-spacing:.22em;color:var(--muted);margin:0;font-size:11px;font-weight:600}.drawer-overlay{z-index:50;background:#1c1a1873;position:fixed;inset:0}.drawer-content{z-index:51;background:var(--bg);border-top-left-radius:28px;border-top-right-radius:28px;outline:none;flex-direction:column;max-height:92vh;display:flex;position:fixed;bottom:0;left:0;right:0}.drawer-handle-wrap{flex-shrink:0;justify-content:center;padding:.75rem 0 .25rem;display:flex}.drawer-handle{background:#1c1a1833;border-radius:999px;width:44px;height:5px}.drawer-inner{padding:.5rem 1.5rem calc(var(--safe-bottom) + 1.5rem);-webkit-overflow-scrolling:touch;flex-direction:column;gap:1.5rem;display:flex;overflow-y:auto}.drawer-title{letter-spacing:-.02em;color:var(--ink);margin:0;font-size:24px;font-weight:800}.drawer-desc{color:var(--muted);margin:-1.25rem 0 0;font-size:13px}.settings-block{flex-direction:column;gap:.6rem;display:flex}.settings-label{text-transform:uppercase;letter-spacing:.2em;color:var(--muted);font-size:11px;font-weight:600}.drawer-inner input[type=number],.drawer-inner input[type=text]{border:1.5px solid var(--ink);background:var(--bg);color:var(--ink);appearance:none;border-radius:999px;outline:none;min-width:0;padding:.85rem 1rem;font-size:16px;font-weight:500;transition:border-color .2s}.drawer-inner input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.drawer-inner input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.drawer-inner input:focus{border-color:var(--accent)}.drawer-inner input[type=number]{text-align:center;width:4.5rem}.drawer-inner input[type=text]{flex:1}.note-row-input{width:4rem!important}.settings-row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.settings-text{color:var(--ink-soft);font-size:14px;font-weight:500}.add-note{border:1.5px solid var(--ink);background:var(--ink);width:2.8rem;height:2.8rem;color:var(--bg);cursor:pointer;touch-action:manipulation;border-radius:999px;flex-shrink:0;font-size:22px;font-weight:700;transition:background .2s}.add-note:active{background:var(--accent);border-color:var(--accent)}.notes-list{flex-direction:column;gap:.4rem;margin:.4rem 0 0;padding:0;list-style:none;display:flex}.notes-list li{background:#1c1a180d;border:1px solid #1c1a181f;border-radius:12px;align-items:center;gap:.7rem;padding:.7rem .9rem;font-size:14px;display:flex}.notes-row{text-transform:uppercase;letter-spacing:.15em;color:var(--muted);flex-shrink:0;font-size:10px;font-weight:700}.notes-text{color:var(--ink);flex:1}.notes-list li button{color:var(--muted);cursor:pointer;touch-action:manipulation;background:0 0;border:none;padding:0 .4rem;font-size:22px;line-height:1}.notes-list li button:active{color:var(--accent)}.danger{color:var(--muted);text-transform:uppercase;letter-spacing:.2em;cursor:pointer;touch-action:manipulation;background:0 0;border:1.5px solid #1c1a184d;border-radius:999px;padding:.85rem 1rem;font-size:11px;font-weight:600;transition:color .2s,border-color .2s}.danger:active{color:#c2553a;border-color:#c2553a}
