:root{--ink: #1e1a16;--ink-soft: #5c544b;--glass: rgba(255, 252, 247, .62);--glass-edge: rgba(255, 255, 255, .7);--glass-shadow: 0 10px 34px rgba(40, 28, 16, .18);--accent: #e8731c;--ui: -apple-system, "SF Pro Text", system-ui, "Segoe UI", Roboto, sans-serif;--display: "New York", "Iowan Old Style", Georgia, serif}body[data-setting=table],body[data-setting=porch]{--ink: #fbf3e8;--ink-soft: #cdbba6;--glass: rgba(34, 24, 16, .5);--glass-edge: rgba(255, 236, 214, .18);--glass-shadow: 0 10px 34px rgba(0, 0, 0, .45)}html,body{height:100%;margin:0}body{background:#f6f4ef;color:var(--ink);font:15px/1.3 var(--ui);overflow:hidden;-webkit-tap-highlight-color:transparent;transition:background .9s}body[data-setting=table]{background:#1b130d}body[data-setting=porch]{background:#0c1018}#stage{position:fixed;inset:0}#stage canvas{width:100%!important;height:100%!important;display:block;touch-action:none}#chrome{position:fixed;inset:0;pointer-events:none}.caption{position:absolute;left:50%;top:calc(env(safe-area-inset-top,0px) + 7vh);transform:translate(-50%,6px);margin:0;font:400 clamp(22px,4.6vw,34px)/1.15 var(--display);letter-spacing:-.01em;text-align:center;color:var(--ink);opacity:0;transition:opacity .7s ease,transform .7s ease;max-width:min(90vw,22ch);text-wrap:balance}.caption.shown{opacity:1;transform:translate(-50%)}.caption.gone{opacity:0}.capsule{position:absolute;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);transform:translate(-50%);display:flex;gap:6px;padding:6px;border-radius:999px;pointer-events:auto;background:var(--glass);border:1px solid var(--glass-edge);box-shadow:var(--glass-shadow),inset 0 1px #ffffff59;-webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%)}.cap-btn{min-width:64px;min-height:52px;padding:6px 14px;border:0;border-radius:999px;background:transparent;color:var(--ink);display:grid;justify-items:center;align-content:center;gap:3px;font:600 11.5px/1 var(--ui);letter-spacing:.01em;white-space:nowrap;cursor:pointer;transition:background .2s,transform .12s}.cap-btn svg{width:22px;height:22px}.cap-btn:hover{background:#7f6e5a1f}.cap-btn:active{transform:scale(.96)}.cap-btn.primary{background:var(--accent);color:#fff}.cap-btn.primary:hover{background:#d9640f}.cap-btn:disabled{opacity:.38;cursor:default}.cap-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}#loading{position:fixed;inset:0;display:grid;place-items:center;font:400 22px var(--display);color:var(--ink-soft)}@media(prefers-reduced-motion:reduce){.caption,.cap-btn,body{transition:none}}:root{--glass: rgba(255,252,247,.88);--accent: #ae460e}body[data-setting=table],body[data-setting=porch]{--glass: rgba(26,20,16,.9)}.capsule{box-sizing:border-box;border:0;display:block;width:max-content;max-width:calc(100vw - 24px);isolation:isolate;box-shadow:var(--glass-shadow),inset 0 1px 2px #ffffff85,inset 0 -1px 3px #ffffff1f}.capsule[hidden]{display:none}.cap-items{display:flex;gap:6px}.cap-outgoing{position:absolute;left:6px;top:6px;pointer-events:none}.cap-btn{box-sizing:border-box;min-width:68px;min-height:56px;padding:7px 13px}.cap-btn:active:not(:disabled){transform:translateY(1px) scale(.96);box-shadow:inset 0 2px 5px #0002}.cap-btn.primary:hover{background:#963b0b}.cap-btn:disabled{opacity:.72}.cap-btn:disabled:hover{background:transparent}.cap-btn.primary:disabled:hover{background:var(--accent)}.cap-btn:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.caption{pointer-events:none;width:max-content;max-height:16vh}@media(prefers-reduced-motion:reduce){.caption,.caption.shown{transform:translate(-50%)}.caption,.cap-btn,body{transition:none;animation:none}}.cap-btn.primary:disabled,.cap-btn.primary:disabled:hover{opacity:1;background:#805039}.corner{position:absolute;top:calc(env(safe-area-inset-top,0px) + 14px);pointer-events:auto;display:flex;border-radius:999px;padding:4px;background:var(--glass);box-shadow:var(--glass-shadow),inset 0 1px 2px #fff6;-webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%);animation:corner-in .26s ease both}.corner[hidden]{display:none}.corner.start{left:calc(env(safe-area-inset-left,0px) + 14px)}.corner.end{right:calc(env(safe-area-inset-right,0px) + 14px)}.corner .cap-btn{display:flex;gap:6px;min-width:0;min-height:44px;padding:0 16px 0 12px;font-size:13px}.corner .cap-btn svg{width:20px;height:20px}@keyframes corner-in{0%{opacity:0}to{opacity:1}}.cap-btn.pressed{background:#e88c3238;box-shadow:inset 0 0 0 1.5px #e88c32bf}.cap-btn.pressed:hover{background:#e88c324d}@media(prefers-reduced-motion:reduce){.corner{animation:none}}#stage:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .9s;background:radial-gradient(ellipse 62% 58% at 50% 52%,transparent 45%,rgba(12,7,3,.62) 100%)}body[data-setting=table] #stage:after,body[data-setting=porch] #stage:after{opacity:1}@media(prefers-reduced-motion:reduce){#stage:after{transition:none}}.corner .cap-btn{align-items:center;align-content:normal;justify-content:center;height:44px}.corner.end .cap-btn{flex-direction:row-reverse;padding:0 12px 0 16px}.caption{top:calc(env(safe-area-inset-top,0px) + max(7vh,74px))}.cap-rule{width:1px;align-self:stretch;margin:10px 2px;background:var(--ink);opacity:.22}.cap-undo{min-width:60px}.view-pill{pointer-events:auto;display:flex;align-items:center;gap:6px;height:44px;padding:0 16px 0 12px;border:0;border-radius:999px;background:var(--glass);color:var(--ink);font:600 13px/1 var(--ui);cursor:pointer;box-shadow:var(--glass-shadow),inset 0 1px 2px #fff6;-webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%)}.view-pill[hidden]{display:none}.view-pill i{display:grid}.view-pill svg{width:20px;height:20px}.view-pill:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.caption.pinned{top:calc(env(safe-area-inset-top,0px) + 66px);font-size:clamp(15px,3.6vw,20px);max-width:min(78vw,34ch);opacity:1;transform:translate(-50%);text-shadow:0 1px 2px rgba(0,0,0,.65),0 0 14px rgba(0,0,0,.45);color:#fbf3e8}.pills{position:absolute;right:calc(env(safe-area-inset-right,0px) + 10px);top:calc(env(safe-area-inset-top,0px) + 158px);display:flex;flex-direction:column;gap:8px;pointer-events:none}.pills .view-pill{flex-direction:column;justify-content:center;gap:3px;width:56px;height:56px;padding:0;border-radius:28px;font-size:11px;letter-spacing:.01em}.pills .view-pill[hidden]{display:none}.view-pill.pressed{background:#e88c328c;box-shadow:inset 0 0 0 1.5px #e88c32e6,var(--glass-shadow)}.lit-pill{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.capsule{z-index:21}.cap-btn.has-family{position:relative;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.cap-mark{position:absolute;top:4px;right:7px;width:14px;height:14px;display:grid;place-items:center;opacity:.7;transition:transform .18s,opacity .18s}.cap-mark svg{width:9px;height:9px;display:block}.cap-btn.expanded .cap-mark{transform:rotate(180deg);opacity:1}.cap-btn.expanded{background:#e88c324d;box-shadow:inset 0 0 0 1.5px #e88c32e6}.cap-ring{position:absolute;inset:0;box-sizing:border-box;border-radius:inherit;padding:2.5px;pointer-events:none;opacity:0;background:conic-gradient(from 0deg,rgba(244,156,64,.98) var(--hold, 0%),transparent 0) border-box;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}.cap-btn.holding .cap-ring{opacity:1;animation:cap-hold .4s linear forwards}.cap-btn.holding.instant .cap-ring{animation-duration:1ms}@property --hold{syntax: "<percentage>"; inherits: false; initial-value: 0%;}@keyframes cap-hold{to{--hold: 100%}}.fan-scrim{position:fixed;inset:0;z-index:20;background:#0000002e;pointer-events:auto;animation:fan-fade .16s ease both}.fan-scrim[hidden]{display:none}.fan-open .capsule .cap-btn:not(.expanded),.fan-open .corner,.fan-open .pills{pointer-events:none}.fan-open .capsule .cap-btn:not(.expanded){opacity:.55}@keyframes fan-fade{0%{opacity:0}}.fan{position:fixed;z-index:22;box-sizing:border-box;display:flex;flex-direction:column;gap:6px;padding:6px;border-radius:26px;pointer-events:auto;background:var(--glass);color:var(--ink);box-shadow:var(--glass-shadow),inset 0 1px 2px #ffffff59;-webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%);transform-origin:var(--from, 50%) 100%;animation:fan-rise .2s cubic-bezier(.2,.8,.2,1) both;max-width:calc(100vw - 20px)}.fan[hidden]{display:none}@keyframes fan-rise{0%{opacity:0;transform:translateY(10px) scale(.94)}}.fan-group{display:flex;flex-direction:column;gap:2px}.fan-item{box-sizing:border-box;min-height:48px;min-width:168px;display:flex;align-items:center;gap:12px;padding:0 14px 0 12px;border:0;border-radius:999px;background:transparent;color:inherit;font:600 14px/1.15 var(--ui);text-align:left;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;transition:background .14s}.fan-item:hover{background:#7f6e5a29}.fan-item>svg{width:24px;height:24px;flex:none}.fan-label{display:grid;gap:2px}.fan-label small{font:500 11.5px/1.1 var(--ui);color:var(--ink-soft)}.fan-tick{margin-left:auto;width:18px!important;height:18px!important;opacity:0}.fan-item[aria-checked=true]{background:#e88c3233}.fan-item[aria-checked=true] .fan-tick{opacity:1}.fan-item:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}.fan-item.armed{background:#e88c326b}.fan.marbles .fan-group{display:grid;grid-template-columns:repeat(3,68px);gap:4px;justify-content:center}.fan.marbles .fan-group .fan-item{min-width:0;width:68px;min-height:68px;flex-direction:column;justify-content:center;gap:5px;padding:6px 0;border-radius:20px;font-size:11.5px;text-align:center}.fan.marbles .fan-group .fan-tick{display:none}.marble{width:32px;height:32px;border-radius:50%;flex:none;background:radial-gradient(circle at 34% 30%,#ffffffd0 0 8%,transparent 24%),radial-gradient(circle at 50% 56%,var(--c) 0 52%,var(--d) 100%);box-shadow:inset 0 -3px 6px #0005,0 0 14px color-mix(in srgb,var(--c) 45%,transparent),0 3px 8px #0006}.marble.cycle{background:radial-gradient(circle at 34% 30%,#ffffffd0 0 8%,transparent 24%),conic-gradient(from 200deg,#ff4d4d,#ffc24d,#4dff7a,#4dd2ff,#9a4dff,#ff4dc4,#ff4d4d)}.fan.marbles .fan-item[aria-checked=true]{background:#e88c3229}.fan.marbles .fan-item[aria-checked=true] .marble{box-shadow:0 0 0 3px #ffffff30,0 0 0 5px #e88c32f2,0 0 18px var(--c)}.fan-row{display:grid;gap:4px;padding:6px 4px 2px;border-top:1px solid color-mix(in srgb,var(--ink) 14%,transparent)}.fan-row-label{font:600 10.5px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);padding:0 8px}.fan-pills{display:flex;gap:4px}.fan-pill{flex:1 1 0;min-width:44px;min-height:44px;justify-content:center;padding:0 8px;font-size:12.5px;gap:0}.fan-pill>svg{display:none}.fan-pill .fan-tick{display:none}.fan-toggle{border-top:1px solid color-mix(in srgb,var(--ink) 14%,transparent);border-radius:0 0 20px 20px;min-height:46px;justify-content:center;gap:8px;font-size:13px}.fan-toggle>svg{width:20px;height:20px}.fan-toggle[aria-checked=true]{background:transparent;color:#f2a65a}.fan-toggle[aria-checked=true]:after{content:"On";font-size:11px;padding:3px 7px;border-radius:999px;background:#e88c324d}.fan-toggle[aria-checked=false]:after{content:"Off";font-size:11px;padding:3px 7px;border-radius:999px;background:color-mix(in srgb,var(--ink) 12%,transparent)}.fan-hint{position:fixed;z-index:23;font:600 12.5px/1 var(--ui);color:#2a1a0e;background:#ffd9a8;padding:8px 11px;border-radius:10px;white-space:nowrap;box-shadow:0 6px 16px #0006;pointer-events:none;animation:fan-rise .2s ease both}.fan-hint:after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;background:inherit;transform:translate(-50%) rotate(45deg)}.fan-hint[hidden]{display:none}@media(prefers-reduced-motion:reduce){.fan,.fan-scrim,.fan-hint,.cap-mark{animation:none;transition:none}}.cap-btn[data-state=busy]{transform:scale(.96);box-shadow:inset 0 2px 5px #0002}.cap-btn[data-state=busy] svg{animation:cap-busy .9s linear infinite}.cap-btn[data-state=busy] svg *{stroke-dasharray:6 4}@keyframes cap-busy{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.cap-btn[data-state=busy] svg{animation:none;opacity:.6}}body.labels-off [data-label=optional] :is(.cap-label,.name,.handle-name,span:not([class])),body.labels-off [data-label=handle]:not(.naming):not(:focus-visible) :is(.handle-name,span:not([class])){position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}.labels-toggle{position:fixed;right:calc(env(safe-area-inset-right,0px) + 16px);top:calc(env(safe-area-inset-top,0px) + 360px);z-index:6;width:44px;height:44px;border:0;border-radius:50%;padding:0;cursor:pointer;pointer-events:auto;background:transparent;color:var(--ink);font:500 13px/1 var(--ui);letter-spacing:-.02em;opacity:.32;transition:opacity .2s,background .2s}.labels-toggle:hover,.labels-toggle:focus-visible,.labels-toggle:active{opacity:.9;background:var(--glass)}.labels-toggle[aria-pressed=true]{opacity:.7}.labels-toggle:focus-visible{outline:3px solid var(--ink);outline-offset:2px}body[data-moment=find] .labels-toggle{display:none}.label-tip{position:fixed;z-index:30;pointer-events:none;padding:6px 10px;border-radius:10px;background:var(--glass);color:var(--ink);font:600 12.5px/1.2 var(--ui);box-shadow:var(--glass-shadow);white-space:nowrap}.label-tip[hidden]{display:none}
