:root{--ink:var(--color-ink);--ink-soft:var(--color-ink-2);--sun:var(--color-sun);--sky:var(--color-sky);--coral:var(--color-coral);--mint:var(--color-mint);--grape:var(--color-grape);--card:var(--color-card);--shadow:var(--shadow-card);--panel-width:clamp(23rem,30vw,28rem)}*{box-sizing:border-box}html,body{background:var(--color-shell);height:100%;margin:0;overflow:hidden}body{font-family:var(--font-body);color:var(--ink);-webkit-font-smoothing:antialiased;justify-content:center;align-items:center;font-weight:500;display:flex}#phone{background:var(--color-sky);width:min(100vw,56.25vh);height:min(100vh,177.778vw);box-shadow:0 20px 60px oklch(from var(--color-shell) l c h / .45);border-radius:26px;position:relative;overflow:hidden}@media (aspect-ratio<=9/16){#phone{border-radius:0}}#stage{position:absolute;inset:0}canvas{touch-action:none;display:block}#ui{pointer-events:none;flex-direction:column;gap:6px;padding:9px;display:flex;position:absolute;inset:0}#ui>*{pointer-events:auto}.spacer{pointer-events:none;flex:1}.card{background:var(--card);box-shadow:var(--shadow);border-radius:16px;padding:9px 12px}#topRow{z-index:8;opacity:0;pointer-events:none;align-items:flex-start;gap:6px;transition:opacity .22s,transform .22s;display:flex;position:absolute;top:9px;left:9px;right:9px;transform:translateY(-10px)}#ui.screen-home #topRow.open{opacity:1;pointer-events:auto;transform:none}#tapHint{color:var(--color-ink-on-dark);background:oklch(from var(--color-ink) l c h / .55);pointer-events:none;z-index:5;opacity:0;white-space:nowrap;border-radius:999px;padding:5px 12px;font-size:11px;font-weight:700;transition:opacity .4s;position:absolute;bottom:96px;left:50%;transform:translate(-50%)}#tapHint.show{opacity:1}#focusHint{text-align:right;max-width:172px;color:var(--color-ink-on-dark);background:oklch(from var(--color-ink) l c h / .6);pointer-events:none;z-index:5;opacity:0;border-radius:14px;padding:8px 13px;font-size:11px;font-weight:700;line-height:1.55;transition:opacity .4s;position:absolute;bottom:100px;right:14px}#focusHint.show{opacity:1}#tutOverlay{z-index:55;pointer-events:none;display:none;position:absolute;inset:0}#tutOverlay.show{display:block}#tutOverlay .bar{pointer-events:auto;background:#14120fa8;transition:opacity .32s cubic-bezier(.22,.8,.28,1);position:absolute}#tutHole{pointer-events:none;z-index:56;border-radius:20px;transition:opacity .32s cubic-bezier(.22,.8,.28,1),box-shadow .32s cubic-bezier(.22,.8,.28,1);position:absolute;box-shadow:0 0 0 4px #fffffff2,0 0 0 10px #ffc44b99,0 10px 32px #0006}@keyframes tutHolePulse{0%,to{box-shadow:0 0 0 4px #fffffff2,0 0 0 10px #ffc44b99,0 10px 32px #0006}50%{box-shadow:0 0 0 4px #fffffff2,0 0 0 14px #ffc44b52,0 10px 32px #0006}}#tutCallout{z-index:57;background:var(--card);max-width:210px;box-shadow:var(--shadow);color:var(--ink);pointer-events:none;border-radius:16px;padding:13px 16px;font-size:13px;line-height:1.62;transition:opacity .32s cubic-bezier(.22,.8,.28,1),transform .32s cubic-bezier(.22,.8,.28,1);position:absolute}#tutCallout.center{text-align:center;max-width:240px;padding:22px 20px}#tutCallout .tut-emoji{margin-bottom:8px;font-size:30px}#tutCallout .btn{pointer-events:auto;width:100%;margin-top:12px}#tutSkip{z-index:57;background:oklch(from var(--color-shell) l c h / .55);color:var(--color-ink-on-dark);cursor:pointer;border:0;border-radius:999px;padding:7px 13px;font-size:11.5px;font-weight:700;position:absolute;top:12px;right:12px}#tutSkip:active{opacity:.7}#ui.intro .on-home{opacity:0;transition:opacity .5s}#ui:not(.intro) .on-home{opacity:1;transition:opacity .5s}#home{flex:1}#stageName{font-size:14px;font-weight:700}#chips{flex-wrap:wrap;gap:4px;margin-top:5px;display:flex}.chip{background:var(--color-sun-soft);color:var(--color-sun-ink);border-radius:999px;padding:3px 8px;font-size:10.5px;font-weight:700}#bar{background:var(--color-paper-3);border-radius:999px;height:6px;margin-top:7px;overflow:hidden}#barFill{background:var(--sun);transform-origin:0;border-radius:999px;width:100%;height:100%;transition:transform .4s;transform:scaleX(0)}#barNote{color:var(--ink-soft);margin-top:4px;font-size:9.5px;font-weight:700}#logList{scrollbar-width:none;gap:4px;margin-top:6px;display:flex;overflow-x:auto}#logList::-webkit-scrollbar{display:none}.rec{white-space:nowrap;border-radius:8px;flex:none;padding:3px 7px;font-size:9.5px;font-weight:700}#logEmpty{color:var(--ink-soft);font-size:9.5px}#ui{transition:opacity .2s}.on-home,.on-pick,.on-focus{display:none!important}#ui.screen-home .on-home,#ui.screen-pick .on-pick,#ui.screen-focus .on-focus{display:flex!important}#ui.screen-home #dayQ:not([hidden]){display:flex}#ui.screen-home #dayQ[hidden]{display:none}#ui.screen-home #ctrl[hidden],#ui.screen-pick #dayQ,#ui.screen-focus #dayQ{display:none!important}#ui.screen-focus #say{opacity:0;pointer-events:none;margin:0;transition:opacity .2s;position:absolute;bottom:14px;left:12px;right:118px;display:flex!important}#ui.screen-focus #say.show-confirm{opacity:1}#backBtn{z-index:7;pointer-events:auto;background:var(--card);width:52px;height:52px;box-shadow:var(--shadow);color:var(--ink);cursor:pointer;border:0;border-radius:50%;justify-content:center;align-items:center;font-size:21px;display:none;position:absolute;top:12px;left:12px}#backBtn:active{transform:translateY(1px)}#helpBtn{z-index:7;pointer-events:auto;width:40px;height:40px;box-shadow:var(--shadow);color:var(--color-ink-on-dark);cursor:pointer;background:#26241f66;border:0;border-radius:50%;justify-content:center;align-items:center;font-size:16px;font-weight:700;display:none;position:absolute;top:12px;right:12px}#helpBtn:active{transform:translateY(1px)}#focusGauge{pointer-events:auto;cursor:pointer;z-index:6;width:112px;height:112px;box-shadow:var(--shadow);background:#26241f6b;border-radius:26px;flex-direction:column;align-items:stretch;transition:none;display:none;position:absolute;bottom:14px;right:14px;overflow:hidden}#ui.screen-focus #focusGauge{display:flex}#focusGauge.open{cursor:default;border-radius:26px;width:236px;height:280px}#focusGauge .gwrap{flex:none;align-self:center;width:112px;height:112px;position:relative}#gaugeSvg{width:112px;height:112px;display:block}#gaugeSvg rect{fill:none;stroke-width:8px;stroke-linecap:round;paint-order:stroke}#gaugeFg{stroke:var(--mint);transition:stroke-dashoffset .25s linear}#focusGauge.paused #gaugeFg{stroke:var(--sun)}#gaugeTime{font-variant-numeric:tabular-nums;color:var(--color-ink-on-dark);text-shadow:0 2px 6px #0006;letter-spacing:.01em;pointer-events:none;font-size:20px;font-weight:700;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#focusMenu{pointer-events:auto;flex-direction:column;gap:7px;padding:8px 10px 10px;display:none}#focusGauge.open #focusMenu{display:flex}#bQuit{touch-action:none;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}#bQuit .holdRing{background:conic-gradient(var(--coral) calc(var(--hold,0)*1%), transparent 0);opacity:.55;pointer-events:none;border-radius:12px;position:absolute;inset:0}#bQuit span{position:relative}#lenPick{display:none}#pickCtrl{margin-bottom:9px}#pickTop{align-items:center;gap:8px;display:flex}#pickCard{text-align:center;flex:1;padding:14px 12px}#pickTime{font-variant-numeric:tabular-nums;letter-spacing:.01em;font-size:46px;font-weight:700}#pickTotal{color:var(--ink-soft);margin-top:2px;font-size:11px;font-weight:700}#pickSlider{appearance:none;background:var(--color-paper-3);border-radius:999px;outline:none;width:100%;height:8px;margin:10px 0 4px;position:relative}#pickSlider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--color-paper);border:3px solid var(--coral);cursor:pointer;border-radius:50%;width:26px;height:26px;box-shadow:0 2px 6px #3f3a344d}#pickSlider::-moz-range-thumb{background:var(--color-paper);border:3px solid var(--coral);cursor:pointer;border-radius:50%;width:20px;height:20px;box-shadow:0 2px 6px #3f3a344d}#pickTicks{color:var(--ink-soft);justify-content:space-between;padding:0 2px;font-size:10.5px;font-weight:700;display:flex}#pickSug{height:4px;margin:0 11px;position:relative}#pickSugDot{background:var(--sky);border:2px solid var(--color-paper);border-radius:50%;width:10px;height:10px;position:absolute;top:-3px;transform:translate(-50%);box-shadow:0 1px 3px #3f3a344d}#pickTagLabel{color:var(--ink-soft);margin:12px 0 6px;font-size:11px;font-weight:700}#pickTags{flex-wrap:wrap;gap:8px;display:flex}#pickTags button{background:var(--color-paper-2);min-height:48px;color:var(--ink-soft);cursor:pointer;border:0;border-radius:999px;padding:13px 22px;font-family:inherit;font-size:15px;font-weight:700;transition:transform .16s,background-color .16s}#pickTags button[aria-pressed=true]{background:var(--coral);color:var(--color-ink)}#stageName{cursor:pointer;-webkit-user-select:none;user-select:none}.seg{background:var(--color-paper-2);border-radius:11px;flex:1;gap:2px;padding:2px;display:flex}.seg button{min-height:40px;color:var(--ink-soft);cursor:pointer;background:0 0;border:0;border-radius:9px;flex:1;padding:9px 0;font-family:inherit;font-size:13px;font-weight:700;transition:transform .16s,background-color .16s}.seg button[aria-pressed=true]{background:var(--sun);color:var(--color-sun-ink);box-shadow:0 2px #b4820a47}#say{align-items:center;min-height:64px;padding:16px 20px;display:flex;position:relative}#sayName{color:var(--color-danger-ink);background:var(--color-danger-soft);border-radius:999px;margin-bottom:5px;padding:4px 10px;font-size:12px;font-weight:700;display:inline-block}#sayText{font-size:16px;line-height:1.55}#say.quiet #sayText{color:var(--ink-soft);font-size:15px}#ctrl{grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:9px;display:grid}.btn{background:var(--color-paper);min-height:52px;color:var(--ink);cursor:pointer;border:0;border-radius:16px;padding:14px 8px;font-family:inherit;font-size:15px;font-weight:700;transition:transform .1s,box-shadow .1s;box-shadow:0 3px #3f3a3424}.btn:active{transform:translateY(2px);box-shadow:0 1px #3f3a3424}.btn.primary{background:var(--coral);color:var(--color-ink);box-shadow:0 4px 0 var(--color-coral-deep);grid-column:span 3;min-height:68px;padding:18px 8px;font-size:20px}.btn.primary:active{box-shadow:0 1px 0 var(--color-coral-deep)}.btn.sky{background:var(--sky);color:var(--color-sky-ink);box-shadow:0 3px 0 var(--color-sky-deep)}.btn.sky:active{box-shadow:0 1px 0 var(--color-sky-deep)}.btn.plain{background:var(--color-paper-2);color:var(--ink-soft);box-shadow:0 3px #3f3a341a}.btn:disabled{opacity:.34;cursor:default;transform:none}.btn:focus-visible{outline:3px solid var(--grape);outline-offset:2px}#dayQ{flex-direction:column;gap:8px;margin-top:0;padding:9px 13px;display:flex}#dqText{font-size:12.5px;font-weight:700}#dqBtns{grid-template-columns:1fr 1fr;gap:6px;display:grid}#coin{color:var(--color-sun-ink);text-shadow:0 2px 0 var(--color-paper);opacity:0;pointer-events:none;font-size:21px;font-weight:700;position:absolute;top:44%;left:50%;transform:translate(-50%)}@keyframes rise{0%{opacity:0;transform:translate(-50%,10px)}20%{opacity:1}to{opacity:0;transform:translate(-50%,-50px)}}#ttFrame{z-index:40;background:linear-gradient(180deg,var(--color-title-sky-top) 0%,var(--color-title-sky-bottom) 28%,var(--color-title-horizon) 42%);transition:transform .9s var(--ease-in-out),opacity .9s var(--ease-in-out);position:absolute;inset:0;overflow:hidden}#ttFrame.tt-leaving{pointer-events:none;transform:translateY(120%);-webkit-mask-image:linear-gradient(#0000 0%,#00000014 3%,#00000059 8%,#000000bf 14%,#000 22%);mask-image:linear-gradient(#0000 0%,#00000014 3%,#00000059 8%,#000000bf 14%,#000 22%)}#ttReveal{z-index:39;pointer-events:none;opacity:1;transition:opacity var(--dur-long) var(--ease-out);background:0 0;position:absolute;inset:0}#ttReveal[hidden]{display:none}#ttReveal.tt-fading{opacity:0}#ttRays{aspect-ratio:1;width:250%;-webkit-mask-image:radial-gradient(circle,#0000003d 0%,var(--color-ink) 24%,#00000075 46%,transparent 74%);-webkit-mask-image:radial-gradient(circle,#0000003d 0%,var(--color-ink) 24%,#00000075 46%,transparent 74%);mask-image:radial-gradient(circle,#0000003d 0%,var(--color-ink) 24%,#00000075 46%,transparent 74%);pointer-events:none;background:repeating-conic-gradient(#ffffff42 0deg 5deg,#fff0 5deg 14deg);animation:90s linear infinite ttSpin;position:absolute;top:28%;left:50%;transform:translate(-50%,-50%)}@keyframes ttSpin{to{transform:translate(-50%,-50%)rotate(360deg)}}.tt-cloud{pointer-events:none;background:#ffffffe6;border-radius:999px;position:absolute}.tt-cloud:before,.tt-cloud:after{content:"";background:inherit;border-radius:999px;position:absolute}#ttC1{opacity:.75;width:34%;height:4.2%;animation:46s linear infinite ttDrift;top:5%;left:-8%}#ttC1:before{width:52%;height:150%;top:-72%;left:16%}#ttC1:after{width:34%;height:120%;top:-52%;left:56%}#ttC2{opacity:.55;width:36%;height:3.8%;animation:62s linear infinite reverse ttDrift;top:30%;right:-10%}#ttC2:before{width:46%;height:145%;top:-70%;left:22%}#ttC2:after{width:30%;height:112%;top:-46%;left:8%}@keyframes ttDrift{0%{transform:translate(-14%)}to{transform:translate(14%)}}#ttLand{background:radial-gradient(120% 78% at 50% 0%,var(--color-title-grass-top) 0%,var(--color-title-grass-mid) 52%,var(--color-title-grass-bottom) 100%);pointer-events:none;border-radius:50% 50% 0 0/22% 22% 0 0;position:absolute;inset:38% -16% -6%}#ttLandShade{pointer-events:none;background:radial-gradient(60% 26% at 22% 32%,#ffffff29,#0000 70%),radial-gradient(52% 22% at 78%,#ffffff1f,#0000 70%),linear-gradient(#ffffff24 0%,#0000 26%,#32462429 100%);border-radius:50% 50% 0 0/22% 22% 0 0;position:absolute;inset:38% -16% -6%}#ttLandEdge{pointer-events:none;border-radius:50% 50% 0 0/62% 62% 0 0;height:14%;position:absolute;top:38%;left:-16%;right:-16%;box-shadow:inset 0 7px #ffffff42}.tt-tuft{pointer-events:none;background:var(--color-title-grass-bottom);border-radius:60% 60% 40% 40%/90% 90% 12% 12%;position:absolute}#ttStage{position:absolute;inset:0}#ttStage canvas{display:block}#ttLogo{pointer-events:none;z-index:3;animation:ttLogoIn .85s var(--ease-out) both;flex-direction:column;align-items:center;gap:2px;display:flex;position:absolute;top:6%;left:0;right:0}@keyframes ttLogoIn{0%{transform:translateY(-10px)scale(.9)}to{transform:none}}#ttLogoMain{filter:drop-shadow(0 9px #5a3e003d)drop-shadow(0 14px 26px #1f35425c);width:min(102%,470px);height:auto;display:block}#ttLogoSub{filter:drop-shadow(0 3px #5a3e0047)drop-shadow(0 6px 14px #1f35424d);width:min(94%,400px);height:auto;margin-top:-2px;display:block}#ttStart{font-family:var(--font-display);letter-spacing:.16em;color:var(--color-ink);background:var(--color-coral);cursor:pointer;box-shadow:0 6px 0 var(--color-coral-deep),0 14px 30px #1f35425c;z-index:3;border:0;border-radius:999px;padding:18px 62px 18px 70px;font-size:clamp(22px,6.6vw,31px);font-weight:700;animation:2.6s ease-in-out infinite ttBreathe;position:absolute;bottom:5%;left:50%;transform:translate(-50%)}#ttStart:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}@keyframes ttBreathe{0%,to{transform:translate(-50%)}50%{transform:translate(-50%)translateY(-4px)}}@media (prefers-reduced-motion:reduce){#ttRays,#ttC1,#ttC2,#ttLogo,#ttStart{animation:none}}html,body{background:var(--color-shell);width:100%;min-height:100%;overflow:clip hidden}body{font-family:var(--font-body);color:var(--color-ink);padding:0}h1,h2{overflow-wrap:anywhere;min-width:0}button,input{font:inherit}button{white-space:nowrap}#phone{background:var(--color-sky);width:100%;max-width:none;height:100dvh;max-height:none;box-shadow:none;border-radius:0}#appMain{position:absolute;inset:0;overflow:hidden}#stage{min-width:0;inset:0}#stage canvas{outline:none;width:100%;height:100%}.renderNotice{width:min(22rem,100% - 2rem);padding:var(--space-md);border-radius:var(--radius-card);background:var(--color-card);color:var(--color-ink);font-size:var(--text-sm);text-align:center;box-shadow:var(--shadow-card);margin:0;line-height:1.6;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#phone.is-2d #stage{background-color:var(--color-sky);background-image:radial-gradient(circle at 50% 35%,oklch(from var(--color-paper) l c h / .8),transparent 32%),url(../icon.svg);background-position:50%,50% 34%;background-repeat:no-repeat;background-size:100% 100%,clamp(8rem,28vw,14rem)}#phone.is-2d .renderNotice{top:68%}#phone.is-2d #tapHint,#phone.is-2d #focusHint{display:none}.srOnly{clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}.card{background:var(--color-card);border-radius:var(--radius-card);padding:var(--space-sm) var(--space-md);box-shadow:var(--shadow-card)}#ui{padding:max(var(--space-sm),env(safe-area-inset-top)) max(var(--space-sm),env(safe-area-inset-right)) max(var(--space-sm),env(safe-area-inset-bottom)) max(var(--space-sm),env(safe-area-inset-left));gap:var(--space-xs)}#appToolbar{inset-inline:var(--space-sm);top:max(var(--space-sm),env(safe-area-inset-top));z-index:var(--z-raised);pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute}#toolbarActions{gap:var(--space-xs);pointer-events:auto;margin-inline-start:auto;display:flex}.utilityBtn{justify-content:center;align-items:center;gap:var(--space-2xs);min-width:3rem;min-height:2.75rem;padding:var(--space-xs) var(--space-sm);border:var(--rule-thin) solid oklch(from var(--color-ink) l c h / .12);border-radius:var(--radius-pill);background:var(--color-card);color:var(--color-ink);font-size:var(--text-sm);box-shadow:0 3px 0 oklch(from var(--color-ink) l c h / .12);cursor:pointer;pointer-events:auto;transition:transform var(--dur-micro) var(--ease-out),background-color var(--dur-short) var(--ease-out);font-weight:700;display:inline-flex}#backBtn,#helpBtn{width:auto;height:auto;display:none;position:static}.utilityBtn:active{box-shadow:0 1px 0 oklch(from var(--color-ink) l c h / .12);transform:translateY(2px)}.utilityBtn:disabled,#pickAdvice:disabled,#pickTags button:disabled,#gaugeToggle:disabled,#tutSkip:disabled,#ttStart:disabled{opacity:.5;cursor:not-allowed;pointer-events:none;transform:none}:where(button,input,[tabindex]):focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}#topRow{inset-inline:var(--space-sm);top:calc(max(var(--space-sm),env(safe-area-inset-top)) + 3.5rem);gap:var(--space-xs);z-index:var(--z-raised);transition:opacity var(--dur-short) var(--ease-out),transform var(--dur-short) var(--ease-out)}#stageName{font-size:var(--text-base)}#chips{gap:var(--space-2xs);margin-top:var(--space-xs)}.chip{font-size:var(--text-xs);padding:var(--space-2xs) var(--space-xs);background:var(--color-paper-2);color:var(--color-sun-ink)}.chip.b{background:oklch(from var(--color-sky) 94% calc(c * .35) h);color:var(--color-sky-ink)}.chip.c{background:var(--color-mint-soft);color:var(--color-mint-ink)}#bar{background:var(--color-paper-3);height:.5rem;margin-top:var(--space-xs)}#barFill{width:100%;transition:transform var(--dur-long) var(--ease-out);transform-origin:0;transform:scaleX(0)}#barNote,#logEmpty,.rec{font-size:var(--text-xs)}#barNote{color:var(--color-ink-2);margin-top:var(--space-2xs)}#logList{gap:var(--space-2xs);margin-top:var(--space-xs)}.rec{padding:var(--space-2xs) var(--space-xs);border-radius:var(--radius-input)}.rec.ok{background:var(--color-mint-soft);color:var(--color-mint-ink)}.rec.ng{background:var(--color-danger-soft);color:var(--color-danger-ink)}#tapHint,#focusHint{font-size:var(--text-xs);color:var(--color-ink-on-dark);background:var(--color-backdrop);transition:opacity var(--dur-long) var(--ease-out)}#focusHint{border-radius:var(--radius-input);max-width:14rem}#tutOverlay{z-index:var(--z-modal)}#tutOverlay .bar{background:var(--color-backdrop);transition:none}#tutHole{z-index:calc(var(--z-modal) + 1);border-radius:var(--radius-card);box-shadow:0 0 0 4px var(--color-paper),0 0 0 10px oklch(from var(--color-sun) l c h / .55);transition:opacity var(--dur-short) var(--ease-out)}#tutHole.pulse{animation:none}#tutCallout{z-index:calc(var(--z-modal) + 2);background:var(--color-card);border-radius:var(--radius-card);max-width:min(18rem,100% - 1.5rem);padding:var(--space-md);font-size:var(--text-sm);color:var(--color-ink);transition:opacity var(--dur-short) var(--ease-out);line-height:1.65}#tutCallout b{color:var(--color-danger-ink)}#tutCallout.center{max-width:min(21rem,100% - 1.5rem);padding:var(--space-lg)}#tutCallout h2{margin:0 0 var(--space-xs);font-family:var(--font-display);font-size:var(--text-lg);line-height:1.2}#tutCallout p{color:var(--color-ink-2);margin:0}#tutCallout .tutActions{gap:var(--space-xs);margin-top:var(--space-md);display:grid}#tutCallout .btn{pointer-events:auto;margin-top:0}#tutSkip{z-index:calc(var(--z-modal) + 2);right:max(var(--space-sm),env(safe-area-inset-right));top:max(var(--space-sm),env(safe-area-inset-top));min-height:2.75rem;padding:var(--space-xs) var(--space-sm);background:var(--color-ink);color:var(--color-ink-on-dark);font-size:var(--text-sm);border-radius:var(--radius-pill);pointer-events:auto}#ui.intro .on-home,#ui:not(.intro) .on-home{transition:opacity var(--dur-long) var(--ease-out)}#say{padding:var(--space-md);min-height:4rem}#sayName,#sayNamePick{font-size:var(--text-xs);color:var(--color-danger-ink);background:var(--color-danger-soft);padding:var(--space-2xs) var(--space-xs);border-radius:var(--radius-pill);margin-bottom:var(--space-2xs)}#sayText,#sayTextPick{font-size:var(--text-base);line-height:1.55}#say.quiet #sayText{font-size:var(--text-sm);color:var(--color-ink-2)}#sayPick.quiet #sayTextPick{color:var(--color-ink-2)}#ctrl,#pickCtrl{margin-bottom:var(--space-xs)}#ctrl .btn,#pickCtrl .btn{flex:1;width:100%}.btn{--btn-face:var(--color-paper-2);--btn-ink:var(--color-ink);--btn-edge:var(--color-rule);--btn-cast:oklch(from var(--color-ink) l c h / .16);border-radius:var(--radius-input);min-height:3.25rem;padding:var(--space-sm) var(--space-md);font-family:var(--font-body);font-weight:700;font-size:var(--text-base);background:var(--btn-face);color:var(--btn-ink);cursor:pointer;box-shadow:0 4px 0 var(--btn-edge),0 7px 14px -6px var(--btn-cast);transition:transform var(--dur-micro) var(--ease-out),box-shadow var(--dur-micro) var(--ease-out),background-color var(--dur-short) var(--ease-out);border:0;justify-content:center;align-items:center;gap:.5em;display:inline-flex;transform:translateY(0)}.btn:active{box-shadow:0 1px 0 var(--btn-edge),0 2px 6px -3px var(--btn-cast);transition-duration:70ms;transform:translateY(3px)}.btn.primary{--btn-face:var(--color-coral);--btn-ink:var(--color-ink);--btn-edge:var(--color-coral-deep);--btn-cast:oklch(from var(--color-coral) l c h / .35);color:var(--btn-ink);font-size:var(--text-md);min-height:4rem;padding:var(--space-md)}.btn.sky{--btn-face:var(--color-sky);--btn-ink:var(--color-sky-ink);--btn-edge:var(--color-sky-deep);color:var(--btn-ink)}.btn.plain{--btn-face:var(--color-paper-2);--btn-ink:var(--color-ink);--btn-edge:var(--color-rule);color:var(--btn-ink)}.btn:disabled,.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed;pointer-events:none;box-shadow:0 4px 0 var(--btn-edge);transform:none}.btn[aria-busy=true]{cursor:progress;opacity:.72}.btn.is-error{--btn-face:var(--color-danger-soft);--btn-ink:var(--color-danger-ink)}.btn.is-success{--btn-face:var(--color-mint-soft);--btn-ink:var(--color-mint-ink)}#dayQ{padding:var(--space-sm) var(--space-md);gap:var(--space-xs)}#dqText{font-size:var(--text-sm)}#dqBtns,#pickTop{gap:var(--space-xs)}#pickCard{padding:var(--space-md)}#pickTime{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:clamp(2.5rem,12vw,3.5rem);line-height:1}#pickTotal{font-size:var(--text-xs);color:var(--color-ink-2);margin-top:var(--space-2xs)}#pickSliderWrap{padding:var(--space-sm) var(--space-2xs) var(--space-2xs)}#pickSliderLabel{text-align:start;font-size:var(--text-sm);color:var(--color-ink);font-weight:700;display:block}#pickSlider{background:var(--color-paper-3);outline-offset:3px;height:.55rem;margin:var(--space-md) 0 var(--space-xs);outline:3px solid #0000}#pickSlider:focus-visible{outline-color:var(--color-focus)}#pickSlider:disabled{opacity:.55;cursor:not-allowed}#pickSlider::-webkit-slider-thumb{background:var(--color-paper);border:3px solid var(--color-coral);width:2rem;height:2rem;box-shadow:0 2px 6px oklch(from var(--color-ink) l c h / .28)}#pickSlider::-moz-range-thumb{background:var(--color-paper);border:3px solid var(--color-coral);width:1.75rem;height:1.75rem;box-shadow:0 2px 6px oklch(from var(--color-ink) l c h / .28)}#pickTicks{font-size:var(--text-xs);color:var(--color-ink-2)}#pickSugDot{background:var(--color-sky);border-color:var(--color-paper);box-shadow:0 1px 3px oklch(from var(--color-ink) l c h / .3)}#pickAdvice{min-height:2.75rem;margin-top:var(--space-xs);padding:var(--space-xs) var(--space-sm);border:var(--rule-thin) solid var(--color-sky-deep);border-radius:var(--radius-pill);background:oklch(from var(--color-sky) 95% calc(c * .25) h);color:var(--color-sky-ink);font-size:var(--text-sm);cursor:pointer;justify-content:center;align-items:center;font-weight:700;display:inline-flex}#pickAdvice:active,#pickTags button:active{transform:translateY(2px)}#pickTagLabel{font-size:var(--text-sm);color:var(--color-ink-2);margin:var(--space-md) 0 var(--space-xs)}#pickTags{gap:var(--space-xs)}#pickTags button{min-height:2.75rem;padding:var(--space-xs) var(--space-md);font-family:var(--font-body);font-size:var(--text-sm);background:var(--color-paper-2);color:var(--color-ink);transition:transform var(--dur-micro) var(--ease-out),background-color var(--dur-short) var(--ease-out)}#focusGauge{right:max(var(--space-sm),env(safe-area-inset-right));bottom:max(var(--space-sm),env(safe-area-inset-bottom));border-radius:var(--radius-card);width:7rem;height:7rem;box-shadow:none;cursor:default;background:0 0;transition:none;overflow:visible}#focusGauge.open{border-radius:var(--radius-card);width:7rem;height:7rem}#focusGauge .gwrap{border-radius:var(--radius-card);background:var(--color-backdrop);width:7rem;height:7rem;box-shadow:var(--shadow-card);cursor:pointer;color:var(--color-ink-on-dark);border:0;padding:0;position:relative}#gaugeToggle:active{transform:translateY(1px)}#gaugeToggle:focus-visible,#tutSkip:focus-visible{outline-color:var(--color-paper)}#gaugeSvg{width:7rem;height:7rem}#gaugeBg{stroke:oklch(from var(--color-paper) l c h / .34)}#gaugeFg{transition:stroke-dashoffset .25s linear}#focusGauge.paused #gaugeFg,#focusGauge.nudging #gaugeFg{stroke:var(--color-sun)}#gaugeTime{font-family:var(--font-display);font-size:var(--text-md);color:var(--color-ink-on-dark);text-shadow:none;top:45%}#focusState{inset-inline:0;text-align:center;color:var(--color-ink-on-dark);pointer-events:none;font-size:.6875rem;font-weight:700;position:absolute;bottom:1.35rem}#focusMenu{right:0;bottom:calc(100% + var(--space-sm));gap:var(--space-xs);width:min(15rem,100vw - 2rem);padding:var(--space-sm);background:var(--color-card);border-radius:var(--radius-card);box-shadow:var(--shadow-card);opacity:1;visibility:visible;pointer-events:auto;transition:opacity var(--dur-short) var(--ease-out),transform var(--dur-short) var(--ease-out);flex-direction:column;display:flex;position:absolute;transform:none}#focusMenu[hidden]{opacity:0;transform:translateY(var(--space-xs));visibility:hidden;pointer-events:none;display:flex!important}#focusMenu .btn{width:100%}#ui.screen-focus #say{right:8rem}#coin{color:var(--color-sun-ink);text-shadow:0 2px 0 var(--color-paper);font-size:var(--text-md)}#coin.go{animation:rise 1.2s var(--ease-out)}#ttFrame{z-index:var(--z-modal)}#ttReveal{z-index:calc(var(--z-modal) - 1)}#ttLogo{animation:ttLogoIn var(--dur-long) var(--ease-out) both}#ttLead{z-index:3;width:min(88%,30rem);color:var(--color-ink);text-align:center;text-shadow:0 1px 0 oklch(from var(--color-paper) l c h / .55);margin:0;font-size:clamp(.875rem,3.5vw,1.15rem);font-weight:700;line-height:1.55;position:absolute;top:34%;left:50%;transform:translate(-50%)}#ttStart{bottom:calc(max(var(--space-3xl),env(safe-area-inset-bottom) + 4.75rem));min-height:3.5rem;padding:var(--space-md) var(--space-xl);font-family:var(--font-display);letter-spacing:.02em;color:var(--color-ink);background:var(--color-coral);border-radius:var(--radius-pill);box-shadow:0 5px 0 var(--color-coral-deep),0 14px 28px oklch(from var(--color-ink) l c h / .26);transition:transform var(--dur-micro) var(--ease-out),box-shadow var(--dur-micro) var(--ease-out);font-size:clamp(1rem,4.6vw,1.35rem);animation:none}#ttStart:active{box-shadow:0 2px 0 var(--color-coral-deep),0 8px 18px oklch(from var(--color-ink) l c h / .24);transform:translate(-50%)translateY(3px)}#ttStart:focus-visible{outline-color:var(--color-focus)}@media (hover:hover) and (pointer:fine){.utilityBtn:hover,#pickAdvice:hover,#pickTags button:hover{background-color:var(--color-paper);transform:translateY(-1px)}.btn:hover{box-shadow:0 6px 0 var(--btn-edge),0 12px 22px -7px var(--btn-cast);transform:translateY(-2px)}#ttStart:hover{box-shadow:0 7px 0 var(--color-coral-deep),0 18px 32px oklch(from var(--color-ink) l c h / .28);transform:translate(-50%)translateY(-2px)}}@media (width>=48rem){body{padding:var(--space-md)}#phone{border-radius:var(--radius-shell);width:min(100%,96rem);height:min(100dvh - 2rem,56rem);box-shadow:var(--shadow-shell)}#stage{right:var(--panel-width)}#ui{width:var(--panel-width);padding:var(--space-lg);gap:var(--space-sm);background:var(--color-paper);border-inline-start:var(--rule-thin) solid var(--color-rule);left:auto;right:0;overflow:hidden auto}#appToolbar{inset-inline:var(--space-lg);top:var(--space-lg)}#topRow{inset-inline:var(--space-lg);opacity:1;pointer-events:auto;top:5.5rem;transform:none}#ui:not(.screen-home) #topRow{opacity:0;visibility:hidden;pointer-events:none}#infoBtn{display:none!important}#tapHint{display:none}#focusHint{right:calc(var(--panel-width) + var(--space-lg));bottom:var(--space-lg);text-align:left}#coin{left:calc((100% - var(--panel-width))/2)}#ctrl,#pickCtrl{margin-bottom:var(--space-sm)}#say,#sayPick,#dayQ,#pickTop,#ctrl,#pickCtrl{width:100%}#pickCard{padding:var(--space-lg)}#pickTime{font-size:3.5rem}#focusGauge{right:var(--space-lg);bottom:var(--space-lg)}#ui.screen-focus #say{left:var(--space-lg);right:8.5rem;bottom:var(--space-lg)}#ttLogo{align-items:flex-start;width:min(42%,34rem);top:clamp(2rem,7vh,4.5rem);left:clamp(2rem,6vw,6rem);right:auto}#ttLogoMain{width:100%}#ttLogoSub{width:92%}#ttLead{text-align:left;width:min(27rem,38%);font-size:clamp(1rem,1.5vw,1.35rem);top:39%;left:clamp(2rem,6vw,6rem);transform:none}#ttStart{font-size:1.25rem;bottom:clamp(3rem,11vh,7rem);left:clamp(2rem,6vw,6rem);right:auto;transform:none}#ttStart:active{transform:translateY(3px)}#ttRays{left:72%}.mobileBreak{display:none}@media (hover:hover) and (pointer:fine){#ttStart:hover{transform:translateY(-2px)}}}@media (width<=59.99rem) and (orientation:landscape) and (height<=42rem){#phone{border-radius:0;width:100%;height:100dvh}#stage{right:50%}#ui{width:50%;padding:var(--space-sm);background:var(--color-paper);border-inline-start:var(--rule-thin) solid var(--color-rule);left:50%;overflow-y:auto}#appToolbar{min-height:2.75rem;margin-bottom:var(--space-xs);flex:none;position:sticky;top:0;left:auto;right:auto}#infoBtn{display:inline-flex!important}#topRow{margin-bottom:var(--space-xs);display:none;position:relative;inset:auto}#ui.screen-home #topRow.open{display:flex}.spacer{display:none!important}#ctrl,#pickCtrl,#say,#sayPick{margin-top:var(--space-xs)}#focusGauge{right:var(--space-sm);bottom:var(--space-sm)}#focusHint{right:calc(50% + var(--space-sm));bottom:var(--space-sm)}#tapHint{left:25%;bottom:var(--space-sm)}#coin{left:25%}#ttLogo{top:2%;left:var(--space-lg);align-items:flex-start;width:42%;right:auto}#ttLogoMain{width:100%}#ttLogoSub{width:94%}#ttLead{left:var(--space-lg);text-align:left;width:38%;font-size:.8rem;line-height:1.4;top:52%;transform:none}#ttStart{left:var(--space-lg);width:38%;padding:var(--space-sm) var(--space-md);font-size:1rem;bottom:2rem;right:auto;transform:none}#ttStart:active{transform:translateY(3px)}@media (hover:hover) and (pointer:fine){#ttStart:hover{transform:translateY(-2px)}}}@media (width>=60rem) and (orientation:landscape) and (height<=42rem){#phone{height:calc(100dvh - 2rem)}#ui{overflow-y:auto}#appToolbar{min-height:2.75rem;margin-bottom:var(--space-xs);flex:none;position:sticky;top:0;left:auto;right:auto}#infoBtn{display:inline-flex!important}#topRow{margin-bottom:var(--space-xs);display:none;position:relative;inset:auto}#ui.screen-home #topRow.open{display:flex}.spacer{display:none!important}#ctrl,#pickCtrl,#say,#sayPick{margin-top:var(--space-xs)}#ttLogo{top:2%;left:var(--space-xl);width:min(38%,28rem)}#ttLogoSub{width:min(92%,24rem)}#ttLead{left:var(--space-xl);width:36%;font-size:.9rem;line-height:1.4;top:54%}#ttStart{left:var(--space-xl);width:min(22rem,36%);padding:var(--space-sm) var(--space-md);font-size:1rem;bottom:2rem;right:auto}}@media (width<=22rem){#toolbarActions{gap:var(--space-2xs)}.utilityBtn{min-width:2.75rem;padding-inline:var(--space-xs);font-size:var(--text-xs)}#backBtn span{display:none}#pickTags button{flex:1 1 calc(50% - var(--space-xs))}#ttStart{padding-inline:var(--space-lg)}}@media (orientation:portrait) and (height<=42rem){#ui.screen-pick{overscroll-behavior:contain;overflow-y:auto}#ui.screen-pick #appToolbar{min-height:2.75rem;margin-bottom:var(--space-xs);flex:none;position:sticky;top:0;left:auto;right:auto}#ui.screen-pick .spacer{display:none!important}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.15s!important;animation-duration:.15s!important;animation-iteration-count:1!important}#ttFrame.tt-leaving{opacity:0;transition-property:opacity;transform:none;-webkit-mask-image:none;mask-image:none}#ttRays,#ttC1,#ttC2,#ttLogo,#ttStart{animation:none!important}#tutHole{box-shadow:0 0 0 4px var(--color-paper),0 0 0 9px oklch(from var(--color-sun) l c h / .5)}}#ui{overscroll-behavior:contain;overflow-y:auto}#ui>*{flex-shrink:0}#ui .spacer{flex-shrink:1;min-height:4.5rem}#appToolbar{min-height:2.75rem;z-index:var(--z-raised);flex:none;position:sticky;inset:0 auto auto}.btn,button{white-space:normal;overflow-wrap:anywhere}#pickTags button{align-items:center;gap:.4rem;display:inline-flex}#pickTags button:before{content:"✓";visibility:hidden}#pickTags button[aria-pressed=true]:before{visibility:visible}#pickTags button[aria-pressed=true]{background:var(--color-paper-2);color:var(--color-ink);box-shadow:inset 0 0 0 2px var(--color-ink)}#gaugeTime{top:43%}#gaugeAction{inset-inline:0;font-size:var(--text-sm);color:var(--color-ink-on-dark);position:absolute;bottom:1.3rem}#pauseQuick{right:calc(100% + var(--space-xs));width:7rem;min-height:3.25rem;font-size:var(--text-sm);position:absolute;bottom:0}#quitDialog{border:1px solid var(--color-rule);border-radius:var(--radius-card);width:min(25rem,100vw - 2rem);max-height:calc(100dvh - 2rem);padding:var(--space-lg);background:var(--color-paper);color:var(--color-ink);box-shadow:var(--shadow-shell);overflow:auto}#quitDialog::backdrop{background:var(--color-backdrop)}#quitDialog h2{margin:0 0 var(--space-sm);font-size:var(--text-lg)}#quitDialog p{margin:0 0 var(--space-lg);line-height:1.65}.quitActions{gap:var(--space-sm);flex-direction:column;display:flex}.quitActions .btn.primary{font-size:var(--text-base);min-height:3.25rem}@media (orientation:portrait) and (height<=42rem){#ttFrame{padding:var(--space-lg);align-items:center;gap:var(--space-lg);flex-direction:column;display:flex;overflow-y:auto}#ttLogo,#ttLead,#ttStart{flex:none;width:min(100%,26rem);position:relative;inset:auto;transform:none}#ttLead{margin:0}#ttStart{margin-top:auto;margin-bottom:var(--space-lg)}}#root{width:100%;min-width:0;height:100%}:root{--color-paper:oklch(98% .016 88);--color-paper-2:oklch(95% .026 86);--color-paper-3:oklch(91% .035 82);--color-card:oklch(99% .01 88/.96);--color-ink:oklch(29% .024 62);--color-ink-2:oklch(52% .035 65);--color-ink-on-dark:oklch(97% .012 88);--color-rule:oklch(84% .025 78);--color-backdrop:oklch(18% .022 62/.68);--color-shell:oklch(20% .022 62);--color-sun:oklch(86% .17 88);--color-sun-soft:oklch(95% .065 82);--color-sun-deep:oklch(66% .15 65);--color-sun-ink:oklch(32% .09 62);--color-sky:oklch(79% .13 226);--color-sky-soft:oklch(95% .045 226);--color-sky-deep:oklch(64% .13 224);--color-sky-ink:oklch(34% .085 224);--color-coral:oklch(72% .18 34);--color-coral-deep:oklch(59% .17 31);--color-coral-ink:oklch(99% .006 88);--color-mint:oklch(79% .14 161);--color-mint-soft:oklch(94% .045 158);--color-mint-ink:oklch(39% .09 169);--color-grape:oklch(69% .14 300);--color-grape-soft:oklch(93% .045 300);--color-danger-soft:oklch(94% .045 36);--color-danger-ink:oklch(48% .15 32);--color-focus:oklch(40% .17 292);--color-title-sky-top:oklch(75% .12 229);--color-title-sky-bottom:oklch(84% .08 221);--color-title-horizon:oklch(92% .075 78);--color-title-grass-top:oklch(76% .12 125);--color-title-grass-mid:oklch(68% .13 127);--color-title-grass-bottom:oklch(60% .12 130);--font-display:"Outfit", "Zen Maru Gothic", sans-serif;--font-body:"Zen Maru Gothic", "Hiragino Maru Gothic ProN", sans-serif;--font-label:"Outfit", "Zen Maru Gothic", sans-serif;--space-3xs:.125rem;--space-2xs:.25rem;--space-xs:.5rem;--space-sm:.75rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2.5rem;--space-2xl:4rem;--space-3xl:6rem;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-md:1.25rem;--text-lg:1.5625rem;--text-xl:1.953rem;--text-2xl:2.441rem;--text-display:clamp(2.75rem, 5vw + 1rem, 5.25rem);--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in:cubic-bezier(.7, 0, .84, 0);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--dur-micro:.12s;--dur-short:.22s;--dur-long:.42s;--radius-input:.75rem;--radius-card:1.25rem;--radius-shell:1.75rem;--radius-pill:999px;--rule-thin:1px;--shadow-card:0 4px 0 oklch(29% .024 62/.09), 0 12px 28px oklch(29% .024 62/.14);--shadow-shell:0 24px 72px oklch(12% .02 62/.48);--z-base:1;--z-raised:10;--z-dropdown:100;--z-sticky:200;--z-modal:400;--z-toast:500;--z-tooltip:600}
