main{display:block;min-height:0;padding:20px 20px 30px}main>aside{display:none}.stage{min-height:580px}.screen-wrap{overflow:hidden;touch-action:none;user-select:none}#roundPanel{position:absolute;inset:0;border-radius:50%;z-index:6;background:radial-gradient(ellipse at 75% 15%,#0b2927,#020504 65%);color:#dfebe5;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:15% 14% 17%;gap:10px}#roundPanel[hidden]{display:none}#roundPanel h2{font-size:17px;font-weight:400;margin:0 0 6px;letter-spacing:2px}#roundPanel p{font-size:11px;color:#83988c;margin:4px 0 10px;text-align:center;line-height:1.8}#roundPanel button{background:transparent;color:inherit;border:1px solid #65877950;border-radius:22px;padding:10px 16px;font-size:12px;min-height:38px}#roundPanel .round-task{width:100%;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#roundPanel .round-task.active{border-color:#95d5b6;background:#9de5c010}#roundPanel .back{font-size:10px;border:0;min-height:26px;padding:5px 10px;color:#93ab9d}#roundPanel .row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}#roundPanel .chosen{background:#a8edcb24;border-color:#a8edcb}#roundPanel .symbol{font-size:58px;line-height:1.2;margin:2px 0 10px;color:#bde9d6;text-shadow:0 0 28px #7adcc88c}#roundPanel .notice{color:#c7e6d5}#roundNav{position:absolute;bottom:5%;left:35%;width:30%;display:flex;align-items:center;justify-content:center;gap:8px;z-index:9}#roundNav button{border:0;background:transparent;min-width:28px;height:28px;display:grid;place-items:center;padding:0}#roundNav button::before{content:'';width:4px;height:4px;background:#53635a;border-radius:50%}#roundNav button[aria-current=page]::before{width:13px;border-radius:4px;background:#b9e4d0}#timeHotspot{position:absolute;left:24%;top:40%;width:52%;height:13%;background:none;border:0;z-index:3}.screen-actions{z-index:4}#screenTask{z-index:3}body[data-page]:not([data-page='0']) .screen-actions,body[data-page]:not([data-page='0']) #screenTask,body[data-page]:not([data-page='0']) #timeHotspot{display:none}[data-appearance=day] #roundPanel{background:radial-gradient(ellipse at 70% 15%,#d8ebd9,#f1f4eb 65%);color:#273c2e}[data-appearance=day] #roundPanel p,[data-appearance=day] #roundPanel .back{color:#6a7f6c}[data-appearance=day] #roundPanel .symbol{color:#dcaa44;text-shadow:0 0 28px #e9c26666}[data-appearance=day] .screen-actions button,[data-appearance=day] .screen-actions small{color:#345b45}[data-appearance=day] #roundNav button[aria-current=page]::before{background:#426f54}[data-appearance=day] #roundPanel .chosen{border-color:#4d8c64;background:#46754c16}.screen-wrap{transition:box-shadow .6s}#roundPanel .big{font-size:36px;font-weight:300}footer{justify-content:center}footer span+span{display:none}@media(max-width:600px){.stage{min-height:490px}#roundPanel{gap:7px}#roundPanel button{padding:9px 13px;font-size:11px}header .device{font-size:9px}}
#roundPanel .palette-choices{display:flex;justify-content:center;gap:10px;width:100%;margin:4px 0 14px}#roundPanel .palette-choice{display:flex;flex-direction:column;align-items:center;gap:9px;font-size:10px;padding:10px 5px 8px;border-color:transparent;border-radius:18px;min-width:28%;white-space:nowrap}#roundPanel .palette-choice.selected{border-color:#94bfb26b;background:#8cdec610}#roundPanel .palette-choice i{display:block;width:48px;height:48px;border-radius:50%;background:radial-gradient(circle at 65% 26%,#b1fbdc65,transparent 47%),conic-gradient(from 235deg,#071411,#8ee6b3,#64cad5,#0c1e1b);box-shadow:inset 0 0 0 9px #02050499,0 0 18px #80dcb927}#roundPanel .palette-choice.blue i{filter:hue-rotate(55deg)}#roundPanel .palette-choice.violet i{filter:hue-rotate(115deg)}#roundPanel .voice-mic{display:grid;place-items:center;gap:8px;width:90px;height:90px;border-radius:50%;border-color:#8bd7b778;background:radial-gradient(circle,#81d9b329,transparent 70%);padding:12px;font-size:10px}#roundPanel .voice-mic svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}#roundPanel .voice-mic.listening{animation:mic-breathe 1.5s ease-in-out infinite}#roundPanel .voice-text{width:100%;max-width:230px;min-height:34px;padding:7px 10px;background:#ffffff08;border:1px solid #8ab7a83b;border-radius:12px;color:inherit;font-size:12px;text-align:center}#roundPanel .voice-note{font-size:9px;line-height:1.6;margin:0;max-width:220px}#roundPanel .voice-confirm{min-height:32px;padding:7px 20px}#roundPanel button:disabled{opacity:.35;cursor:default}[data-appearance=day] #roundPanel .palette-choice.selected{background:#679b7d18;border-color:#5c8269}[data-appearance=day] #roundPanel .voice-text{background:#ffffff70}@keyframes mic-breathe{50%{box-shadow:0 0 0 10px #91e8be0a,0 0 26px #72d3ad33}}@media(prefers-reduced-motion:reduce){#roundPanel .voice-mic.listening{animation:none}}
body{--ui-accent:#a2e7cb;--ui-edge:#6fae98;--ui-rgb:112,211,171;--ui-ink:#d9eee4;--ui-panel:#0b2927;--ui-dark:#426e56}body[data-palette=blue]{--ui-accent:#a6d8ff;--ui-edge:#7fa7d2;--ui-rgb:107,171,236;--ui-ink:#dae9f7;--ui-panel:#10243d;--ui-dark:#3c638a}body[data-palette=violet]{--ui-accent:#dcc0ff;--ui-edge:#ad8dd3;--ui-rgb:179,132,228;--ui-ink:#ece1f7;--ui-panel:#291b3b;--ui-dark:#79588f}
#roundPanel{background:radial-gradient(ellipse at 75% 15%,var(--ui-panel),#020504 65%);color:var(--ui-ink)}#roundPanel button{border-color:rgba(var(--ui-rgb),.30)}#roundPanel .chosen,#roundPanel .palette-choice.selected,#roundPanel .round-task.active{border-color:var(--ui-edge);background:rgba(var(--ui-rgb),.10)}#roundPanel .round-task.active{color:var(--ui-accent)}#roundPanel .back,#roundPanel p{color:color-mix(in srgb,var(--ui-accent) 55%,#52605b)}#roundPanel .voice-mic{border-color:var(--ui-edge);color:var(--ui-accent);background:radial-gradient(circle,rgba(var(--ui-rgb),.18),transparent 70%)}#roundPanel .voice-text{border-color:rgba(var(--ui-rgb),.32)}.screen-actions button,.screen-actions small{color:var(--ui-accent)}.screen-actions span{border-color:var(--ui-edge)}.screen-actions button:hover span{background:rgba(var(--ui-rgb),.10);box-shadow:0 0 20px rgba(var(--ui-rgb),.20)}#roundNav button[aria-current=page]::before{background:var(--ui-accent)}#roundNav button::before{background:color-mix(in srgb,var(--ui-edge) 40%,#26312d)}
[data-appearance=day] #roundPanel{background:radial-gradient(ellipse at 70% 15%,rgba(var(--ui-rgb),.22),transparent 65%),#f1f4eb;color:var(--ui-dark)}[data-appearance=day] #roundPanel p,[data-appearance=day] #roundPanel .back{color:var(--ui-dark)}[data-appearance=day] #roundPanel .chosen,[data-appearance=day] #roundPanel .palette-choice.selected,[data-appearance=day] #roundPanel .round-task.active{border-color:var(--ui-dark);background:rgba(var(--ui-rgb),.12)}[data-appearance=day] .screen-actions button,[data-appearance=day] .screen-actions small{color:var(--ui-dark)}[data-appearance=day] .screen-actions span{border-color:var(--ui-dark)}[data-appearance=day] #roundNav button[aria-current=page]::before{background:var(--ui-dark)}[data-appearance=day] #roundPanel .voice-mic{color:var(--ui-dark)}@keyframes mic-breathe{50%{box-shadow:0 0 0 10px rgba(var(--ui-rgb),.04),0 0 26px rgba(var(--ui-rgb),.23)}}
/* Luminous themes: saturated light against a quiet, readable centre. */
body{--ui-accent:#9dffce;--ui-rgb:30,255,159;--ui-edge:#36d99a;--ui-panel:#062c24}
body[data-palette=blue]{--ui-accent:#b5edff;--ui-rgb:56,142,255;--ui-edge:#518fff;--ui-panel:#071a48}
body[data-palette=violet]{--ui-accent:#ffd2f2;--ui-rgb:241,72,204;--ui-edge:#d768fa;--ui-panel:#350b3e}
#roundPanel{isolation:isolate;background:#010304}
#roundPanel::before{content:'';position:absolute;inset:-12%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 75% 25%,rgba(var(--ui-rgb),.42),transparent 42%),radial-gradient(ellipse at 20% 65%,rgba(var(--ui-rgb),.16),transparent 35%);filter:blur(14px);animation:panel-aurora 9s ease-in-out infinite alternate}
#roundPanel p{color:var(--ui-accent);opacity:.76}#roundPanel h2{color:var(--ui-ink);text-shadow:0 0 22px rgba(var(--ui-rgb),.35)}
#roundPanel .round-task.active,#roundPanel .chosen,#roundPanel .palette-choice.selected{box-shadow:inset 0 0 18px rgba(var(--ui-rgb),.12),0 0 15px rgba(var(--ui-rgb),.14);animation:selection-glow 4s ease-in-out infinite}
#roundPanel .voice-mic{position:relative;isolation:isolate;width:110px;height:90px;border:0;border-radius:0;background:none;box-shadow:none;animation:none;color:var(--ui-accent);overflow:visible}
#roundPanel .voice-mic svg{position:relative;z-index:2;width:31px;height:36px;filter:drop-shadow(0 0 9px rgba(var(--ui-rgb),.9))}
.voice-light{position:absolute;inset:6px -12px;z-index:-1;border-radius:46% 54% 62% 38%;background:radial-gradient(ellipse,rgba(var(--ui-rgb),.75),rgba(var(--ui-rgb),.16) 45%,transparent 72%);filter:blur(10px);animation:voice-drift 5s ease-in-out infinite alternate;pointer-events:none}
.voice-light::after{content:'';position:absolute;inset:12px -5px;background:linear-gradient(125deg,transparent,rgba(var(--ui-rgb),.9),#ffffff99,transparent);filter:blur(12px);border-radius:50%;transform:rotate(-25deg)}
#roundPanel .voice-mic.listening .voice-light{scale:calc(1 + var(--voice-level,0)*1.2);opacity:calc(.45 + var(--voice-level,0)*.55);filter:blur(calc(12px - var(--voice-level,0)*5px));transition:scale 70ms linear,opacity 70ms linear}
#roundPanel .voice-mic.listening svg{filter:drop-shadow(0 0 14px var(--ui-accent))}
#roundPanel .palette-choice.blue i{filter:none;background:conic-gradient(from 220deg,#02051b,#2855ff,#8ceaff,#061237)}
#roundPanel .palette-choice.violet i{filter:none;background:conic-gradient(from 220deg,#1b021c,#8e28ff,#ff4bb5,#22051e)}
#roundPanel .palette-choice i{animation:selection-glow 4s ease-in-out infinite}
.screen-actions span{box-shadow:0 0 17px rgba(var(--ui-rgb),.15);transition:color .6s,border-color .6s,box-shadow .6s}
#roundNav button[aria-current=page]::before{box-shadow:0 0 12px rgba(var(--ui-rgb),.9)}
[data-appearance=day] #roundPanel{background:#f1f4eb}[data-appearance=day] #roundPanel h2{color:var(--ui-dark)}[data-appearance=day] #roundPanel::before{opacity:.6}
@keyframes panel-aurora{to{transform:rotate(22deg) translate(4%,-3%) scale(1.12);opacity:.65}}
@keyframes selection-glow{50%{box-shadow:inset 0 0 20px rgba(var(--ui-rgb),.18),0 0 23px rgba(var(--ui-rgb),.28)}}
@keyframes voice-drift{to{transform:rotate(15deg) translateY(-6px);border-radius:60% 40% 38% 62%}}
@media(prefers-reduced-motion:reduce){#roundPanel::before,#roundPanel .round-task.active,#roundPanel .chosen,#roundPanel .palette-choice.selected,#roundPanel .palette-choice i,.voice-light{animation:none}#roundPanel .voice-mic.listening .voice-light{scale:1;transition:none}}
/* Silver glass capsules and a breathing lunar surface. */
#roundPanel::after{content:'';position:absolute;inset:8%;z-index:-1;pointer-events:none;background:url('moon-texture.png') center/contain no-repeat;mix-blend-mode:screen;opacity:.18;animation:lunar-breath 8s ease-in-out infinite}
#roundPanel button:not(.voice-mic):not(.palette-choice),.screen-actions span{background:linear-gradient(105deg,#06080cee 7%,#171b21dc 62%,#424950d9 100%);border:1px solid #dce8f13b;box-shadow:inset 0 1px 1px #ffffff42,inset -2px 0 5px #f1f7ff18,0 5px 15px #0009;color:#f1f5f7;border-radius:30px}
#roundPanel button:not(.voice-mic):not(.palette-choice):hover,.screen-actions button:hover span{border-color:#eaf3ff88;background:linear-gradient(105deg,#0d1018,#242e3b,#586778);box-shadow:inset 0 1px 1px #ffffff70,0 0 16px #dceeff20}
.screen-actions span{width:79px;height:42px;display:grid;place-items:center}.screen-actions small{color:#d5dfe8}.screen-actions button{color:#f2f5f7}
#roundPanel .round-task.active,#roundPanel .chosen{border-color:#e1f0f58c;background:linear-gradient(105deg,#10151a,#35414c);animation:none}
#roundPanel .back{background:none!important;box-shadow:none!important;border:0!important;color:#bcc8d4}
@keyframes lunar-breath{0%,100%{opacity:.10}50%{opacity:.32}}
@media(prefers-reduced-motion:reduce){#roundPanel::after{animation:none;opacity:.2}}
[data-appearance=day] #roundPanel{background:#fffaf3;color:#30271f}[data-appearance=day] #roundPanel::before{inset:0;background:url('day-grain.png') center/cover;filter:none;animation:none;opacity:1}[data-appearance=day] #roundPanel::after{display:none}[data-appearance=day] #roundPanel p,[data-appearance=day] #roundPanel h2{color:#564132;text-shadow:none}

/* Frosted capsules: translucent fill, soft raised rim, restrained shadow. */
#roundPanel button:not(.voice-mic):not(.palette-choice):not(.back),.screen-actions span{background:linear-gradient(150deg,#79848d30,#141c2966 55%,#a4b5c13b);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:#edf5ff55;box-shadow:inset 0 1px 2px #ffffff60,inset 0 -2px 4px #ffffff14,0 4px 10px #0006}
[data-appearance=day] #roundPanel button:not(.voice-mic):not(.palette-choice):not(.back),[data-appearance=day] .screen-actions span{background:linear-gradient(175deg,#ffffff70,#e4e5e13b 48%,#ffffff8c);border:1px solid #ffffffb0;color:#30332f;box-shadow:inset 0 2px 3px #ffffffb3,inset 0 -3px 6px #ffffff73,inset 1px 0 3px #85898224,0 4px 7px #48483f26,0 1px 2px #48483f1a;text-shadow:0 1px 1px #ffffff70}
[data-appearance=day] .screen-actions small{color:#4e4b42}
[data-appearance=day] #roundPanel button:not(.voice-mic):not(.palette-choice):not(.back):hover,[data-appearance=day] .screen-actions button:hover span{background:linear-gradient(175deg,#ffffffa6,#eceee56b,#ffffffb3);border-color:#fff}
[data-appearance=day] #roundPanel button.chosen{border-color:#ffffff;box-shadow:inset 0 2px 3px #fff,0 3px 8px #554c392b,0 0 0 1px #9c8b6b45}
#roundPanel button:active,.screen-actions button:active span{transform:translateY(1px)}
