@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:400;src:url(./fredoka-latin-400-normal-17JuUzdy.woff2) format("woff2"),url(./fredoka-latin-400-normal-DbXSrOeS.woff) format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:500;src:url(./fredoka-latin-500-normal-B0JifZgm.woff2) format("woff2"),url(./fredoka-latin-500-normal-BL692wg7.woff) format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:600;src:url(./fredoka-latin-600-normal-C4zohCW5.woff2) format("woff2"),url(./fredoka-latin-600-normal-CcrEjrB4.woff) format("woff")}:root{--ink: #5a4535;--ink-soft: #8a7362;--cream: #fff7e8;--cream-2: #fdecd2;--sage: #9fd1ad;--sage-deep: #6fb388;--peach: #f6ae86;--butter: #ffd978;--sky: #a9d8ea;--rose: #ffb2c1;--shadow: 0 4px 0 var(--ink), 0 10px 24px rgba(60, 40, 20, .18);--radius: 22px;font-family:Fredoka,Trebuchet MS,system-ui,sans-serif;color:var(--ink)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#cfe6ee;-webkit-tap-highlight-color:transparent}#app{position:fixed;inset:0}#app canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}#app canvas:active{cursor:grabbing}.vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 55%,rgba(60,35,20,.28) 100%);transition:background .6s ease}body[data-time=paused] .vignette{background:radial-gradient(ellipse at 50% 45%,#7896dc0f 45%,#28326e6b)}body[data-time=rewinding] .vignette{background:radial-gradient(ellipse at 50% 45%,#ffbe7814 45%,#783c1e73)}.hud{position:fixed;inset:0;pointer-events:none;padding:16px}.card{pointer-events:auto;background:var(--cream);border:3px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow)}.clock-card{position:absolute;top:16px;left:16px;display:flex;align-items:center;gap:14px;padding:10px 18px 10px 10px}.dial{position:relative;width:86px;height:50px;border-radius:16px 16px 10px 10px;border:2.5px solid var(--ink);overflow:hidden;background:linear-gradient(#6aaee8,#d0e6ee)}.dial svg{position:absolute;inset:0;width:100%;height:100%}.dial-arc{stroke:#fff9;stroke-width:2.5;stroke-dasharray:2 5;stroke-linecap:round;fill:none}.dial-ground{stroke:var(--ink);stroke-width:3}.dial-body{position:absolute;width:0;height:0}.dial-sun,.dial-moon{position:absolute;left:-8px;top:-8px;width:16px;height:16px;border-radius:50%;border:2px solid var(--ink)}.dial-sun{background:radial-gradient(circle at 35% 35%,#fff2b0,#ffc93d);box-shadow:0 0 10px 3px #ffd65abf}.dial-moon{background:radial-gradient(circle at 35% 35%,#fff,#dfe3ff);box-shadow:0 0 8px 2px #c8d2ff99}.clock-time{font-size:34px;font-weight:600;line-height:1;letter-spacing:.5px;font-variant-numeric:tabular-nums}.clock-day{margin-top:4px;font-size:15px;font-weight:500;color:var(--ink-soft)}.robot-card{position:absolute;top:16px;right:16px;display:flex;gap:12px;align-items:center;max-width:min(420px,calc(100vw - 32px));padding:10px 18px 10px 10px}.robot-avatar{flex:none;width:58px;height:58px;border-radius:18px;background:var(--sage);border:2.5px solid var(--ink);display:grid;place-items:center}.robot-avatar svg{width:46px;height:46px;animation:bob 2.6s ease-in-out infinite}.robot-avatar .eye{transform-origin:center 22.75px;transform-box:view-box;animation:blink 4.2s infinite}.robot-avatar.is-asleep{background:#b8b9e6}.robot-avatar.is-asleep .eye{animation:none;transform:scaleY(.18)}.robot-avatar.is-asleep svg{animation-duration:4.5s}.robot-avatar.is-asleep .bulb{fill:#c9b88a}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}@keyframes blink{0%,93%,to{transform:scaleY(1)}96%{transform:scaleY(.1)}}.robot-name{font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:1.5px;color:var(--sage-deep)}.robot-status{font-size:18px;font-weight:600;line-height:1.2}.robot-detail,.robot-crate{font-size:14px;color:var(--ink-soft);line-height:1.3}.robot-detail:empty{display:none}.robot-crate{margin-top:3px}.time-badge{position:absolute;left:50%;top:22px;transform:translate(-50%);padding:8px 16px;font-weight:600;font-size:16px;background:var(--butter);border:3px solid var(--ink);border-radius:999px;box-shadow:var(--shadow);white-space:nowrap;transition:opacity .25s ease,transform .25s ease}.time-badge:empty{opacity:0;transform:translate(-50%,-12px)}body[data-time=rewinding] .time-badge{background:var(--peach);animation:wobble 1.2s ease-in-out infinite}body[data-time=paused] .time-badge{background:var(--sky)}@keyframes wobble{0%,to{transform:translate(-50%) rotate(-1.5deg)}50%{transform:translate(-50%) rotate(1.5deg)}}.controls{position:absolute;left:50%;bottom:22px;transform:translate(-50%);display:flex;align-items:center;gap:14px;padding:10px 14px;border-radius:999px}.transport,.speeds,.extras{display:flex;align-items:center;gap:8px}.speeds{padding:0 12px;border-left:2.5px dashed rgba(90,69,53,.35);border-right:2.5px dashed rgba(90,69,53,.35)}button{font:inherit;color:inherit;cursor:pointer}.btn{display:grid;place-items:center;width:50px;height:50px;padding:0;border-radius:50%;border:3px solid var(--ink);background:var(--cream-2);box-shadow:0 4px 0 var(--ink);transition:transform .08s ease,box-shadow .08s ease,background .2s ease}.btn svg{width:24px;height:24px}.btn:hover{background:#fff1d9;transform:translateY(-1px);box-shadow:0 5px 0 var(--ink)}.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}.btn-main{width:60px;height:60px;background:var(--butter)}.btn-main svg{width:28px;height:28px}.btn-main:hover{background:#ffe39a}.btn[data-action=rewind].is-active{background:var(--peach);animation:pulse 1.1s ease-in-out infinite}.btn[data-action=forward].is-active{background:var(--sage)}.btn-main.is-active{background:var(--sky)}.btn-small{width:42px;height:42px}.btn-small svg{width:20px;height:20px}.btn-small[aria-pressed=true],.btn-small[aria-expanded=true]{background:var(--rose)}@keyframes pulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.1)}}.chip{min-width:46px;height:34px;padding:0 8px;border-radius:999px;border:2.5px solid var(--ink);background:var(--cream);font-weight:600;font-size:15px;box-shadow:0 3px 0 var(--ink);transition:transform .08s ease,box-shadow .08s ease,background .2s ease}.chip:hover{background:#fff1d9}.chip:active{transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}.chip.is-active{background:var(--sage);transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}.speed-icon{display:grid;place-items:center;width:26px;height:26px;color:var(--ink-soft)}.speed-icon svg{width:24px;height:24px}button:focus-visible{outline:3px dashed var(--sage-deep);outline-offset:3px}.help{position:absolute;right:16px;bottom:110px;width:min(360px,calc(100vw - 32px));padding:14px 18px;font-size:15px;line-height:1.45}.help h2{margin:0 0 6px;font-size:19px}.help p{margin:6px 0}.help ul{margin:6px 0;padding-left:18px}.help .muted{color:var(--ink-soft);font-size:14px}kbd{display:inline-block;min-width:22px;padding:0 5px;border:2px solid var(--ink);border-radius:7px;background:var(--cream-2);font:inherit;font-size:13px;text-align:center;box-shadow:0 2px 0 var(--ink)}#loading{position:fixed;inset:0;display:grid;place-items:center;background:linear-gradient(#bfe0ee,#fdf0d8);transition:opacity .8s ease;z-index:10}#loading.is-done{opacity:0;pointer-events:none}.loading-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:22px 30px;font-size:20px;font-weight:600}.sprout{width:64px;height:64px;animation:grow 1.6s ease-in-out infinite;transform-origin:50% 100%}@keyframes grow{0%,to{transform:scale(.85) rotate(-4deg)}50%{transform:scale(1.05) rotate(4deg)}}.loading-error{max-width:320px;font-size:15px;font-weight:400;text-align:center;color:var(--ink-soft)}@media(max-width:760px){.hud{padding:10px}.clock-card{top:10px;left:10px;padding:6px 12px 6px 6px;gap:10px}.dial{width:64px;height:38px}.clock-time{font-size:26px}.clock-day{font-size:13px}.robot-card{inset:auto 10px 150px;max-width:none;padding:8px 12px 8px 8px}.robot-avatar{width:46px;height:46px}.robot-avatar svg{width:36px;height:36px}.robot-status{font-size:16px}.time-badge{top:76px;font-size:14px}.controls{left:10px;right:10px;bottom:12px;transform:none;flex-wrap:wrap;justify-content:center;gap:10px;border-radius:28px}.speeds{order:3;width:100%;justify-content:center;border:none;padding:0;gap:6px}.chip{min-width:0;flex:1;max-width:58px;font-size:14px}.help{bottom:230px;right:10px}}@media(prefers-reduced-motion:reduce){.robot-avatar svg,.robot-avatar .eye,.sprout,body[data-time=rewinding] .time-badge,.btn[data-action=rewind].is-active{animation:none}}