:root{color:#172229;font-synthesis:none;--panel:#fafcfceb;--ink:#172229;--muted:#53636b;--line:#23383e26;--accent:#226571;background:#adb8b7;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select,input[type=checkbox],summary{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,canvas:focus-visible{outline-offset:4px;outline:3px solid #288994}button{color:var(--ink);border:1px solid var(--line);background:0 0;border-radius:8px;min-height:38px;padding:8px 12px}button:hover{background:#507b851a}button:disabled{opacity:.5;cursor:wait}button[hidden]{display:none}#app,#viewport{position:fixed;inset:0}canvas{touch-action:none;width:100%;height:100%;display:block}.masthead{pointer-events:none;align-items:flex-start;gap:20px;display:flex;position:absolute;top:32px;left:36px}.eyebrow{letter-spacing:.2em;color:var(--muted);font-size:11px;font-weight:650}h1{letter-spacing:-1.1px;color:var(--ink);margin:5px 0;font:34px/1.2 Georgia,serif}.draft{background:var(--panel);border:1px solid var(--line);color:var(--muted);border-radius:20px;margin-top:15px;padding:6px 10px;font-size:12px}.views{gap:8px;display:flex;position:absolute;top:32px;right:32px}.views select,.views button{background:var(--panel);box-shadow:0 3px 20px #152d3110}.views select{border:1px solid var(--line);min-height:42px;color:var(--ink);border-radius:8px;padding:8px 36px 8px 14px;font-size:14px}.views button{padding:5px 11px;font-size:23px;line-height:1}.controls{background:var(--panel);border:1px solid var(--line);width:278px;color:var(--ink);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:14px;max-height:calc(100dvh - 118px);position:absolute;bottom:28px;right:32px;overflow:auto;box-shadow:0 8px 40px #071a2920}.controls summary{justify-content:space-between;align-items:center;padding:15px 19px;font-size:15px;font-weight:600;list-style:none;display:flex}.controls summary::-webkit-details-marker{display:none}.controls[open] summary{border-bottom:1px solid var(--line)}.controls:not([open]) summary span{transform:rotate(180deg)}.control-content{padding:18px 19px 13px}.control-head{justify-content:space-between;align-items:center;margin:0 0 9px;font-size:14px;display:flex}.control-head output{font-variant-numeric:tabular-nums;color:var(--accent);font-size:13px}input[type=range]{width:100%;accent-color:var(--accent);height:16px;margin:0 0 12px}.time-marks{color:var(--muted);justify-content:space-between;margin:-6px 0 14px;font-size:11px;display:flex}.presets{gap:5px;margin:0 0 24px;display:flex}.presets button{flex:1;min-height:32px;padding:6px 3px;font-size:12px}.presets button.active{background:var(--accent);color:#fff;border-color:var(--accent)}.check{border-top:1px solid var(--line);justify-content:space-between;align-items:center;padding:10px 0;font-size:14px;display:flex}.check input{width:17px;height:17px;accent-color:var(--accent);margin:0}.cycle{width:100%;margin-top:12px;font-size:14px}.cycle[aria-pressed=true]{background:var(--accent);color:#fff}.small-note{color:var(--muted);text-align:center;margin:12px 0 0;font-size:11px;line-height:1.4}footer{max-width:calc(100vw - 380px);color:var(--muted);font-size:12px;position:absolute;bottom:28px;left:36px}.hint{margin:0 0 10px}.credits{position:relative}.credits summary{border-bottom:1px solid;font-size:12px;display:inline-block}.credits p{max-width:450px;font-size:12px;line-height:1.5}.credits[open]{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 18px}.loading{z-index:10;color:#172229;background:#bdc7c6;flex-direction:column;justify-content:center;align-items:center;gap:6px;transition:opacity .4s;display:flex;position:absolute;inset:0}.loading.done{opacity:0;pointer-events:none}.loading h2{margin:10px 0;font:27px Georgia,serif}.loading p{color:#4b5c60;text-align:center;max-width:420px;padding:0 24px;font-size:14px}.loading progress{accent-color:#226571;width:220px;height:5px}.loader-mark{border:1px solid #607e8244;border-top-color:#226571;border-radius:50%;width:30px;height:30px;animation:1s linear infinite spin}.loading.error .loader-mark{border-color:#a24832;animation:none}.loading.error progress{display:none}.sr-only{clip:rect(0,0,0,0);width:1px;height:1px;position:absolute;overflow:hidden}body.night{--panel:#131d2eed;--ink:#e9eef4;--muted:#a3b2c6;--line:#b8cbe62e;--accent:#ecb570}.night input{accent-color:#ecb570}.night .presets button.active,.night .cycle[aria-pressed=true]{color:#172229}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=700px){.masthead{display:block;top:20px;left:20px}.eyebrow{font-size:10px}h1{font-size:28px}.draft{margin-top:6px;font-size:10px;display:inline-block}.views{top:22px;right:16px}.views select{max-width:138px;padding:7px;font-size:12px}.views button{display:none}.controls{width:242px;max-height:calc(100dvh - 140px);bottom:18px;right:16px}.control-content{padding:14px 16px}.controls summary{padding:12px 16px}.presets{margin-bottom:16px}.check{padding:8px 0}footer{max-width:calc(100vw - 290px);bottom:20px;left:18px}.hint{display:none}.credits[open]{z-index:12;max-width:none;position:fixed;bottom:16px;left:15px;right:15px}.credits summary{font-size:11px}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.zoom-controls{flex-direction:column;gap:6px;display:flex;position:absolute;top:92px;right:32px}.zoom-controls button{background:var(--panel);width:44px;height:44px;padding:0;font-size:24px;line-height:1}button,select{min-height:44px}.controls input[type=range]{height:28px}.presets button,.check{min-height:44px}.loading.done{visibility:hidden}.masthead{top:max(26px,env(safe-area-inset-top))}.controls{bottom:max(22px,env(safe-area-inset-bottom))}footer{bottom:max(24px,env(safe-area-inset-bottom))}@media (width<=700px){.masthead{left:18px;top:max(16px,env(safe-area-inset-top));gap:0}h1{font-size:27px}.draft{margin-top:3px;padding:4px 8px;font-size:10px}.views{left:18px;right:18px;top:calc(max(16px,env(safe-area-inset-top)) + 98px);gap:8px}.views select{flex:1;min-width:0;max-width:none;padding:10px 12px;font-size:16px}.views button{width:44px;font-size:24px;display:block}.zoom-controls{top:calc(max(16px,env(safe-area-inset-top)) + 156px);right:18px}.controls{left:18px;right:18px;bottom:calc(max(12px,env(safe-area-inset-bottom)) + 26px);width:auto;max-height:calc(100dvh - 220px)}.controls summary{min-height:48px;padding:13px 16px}.control-content{padding:14px 18px}.presets{margin-bottom:12px}footer{max-width:none;left:18px;right:18px;bottom:max(10px,env(safe-area-inset-bottom));justify-content:space-between;align-items:center;gap:10px;display:flex}.hint{margin:0;font-size:10px;display:block}.credits summary{white-space:nowrap;font-size:10px}.credits[open]{bottom:max(12px,env(safe-area-inset-bottom))}.credits[open] summary{font-size:13px}.credits[open] p{font-size:12px}}@media (height<=500px) and (orientation:landscape){.masthead{left:max(18px,env(safe-area-inset-left))}.draft{display:none}.views{top:15px;left:auto;right:max(18px,env(safe-area-inset-right));width:250px}.zoom-controls{top:70px;right:max(18px,env(safe-area-inset-right))}.controls{width:270px;left:auto;right:max(18px,env(safe-area-inset-right));max-height:calc(100dvh - 90px)}footer{left:max(18px,env(safe-area-inset-left));right:310px}.hint{display:none}}@media (width<=700px){.controls{max-height:min(55dvh,100dvh - 220px)}footer{background:var(--panel);border-radius:6px;padding:4px 7px;font-size:10px}.credits[open]{background:var(--panel)}}input[type=date]{border:1px solid var(--line);min-width:0;max-width:160px;color:var(--ink);font:inherit;background:0 0;border-radius:7px;min-height:40px;padding:6px}