/* Shared rhythm: short departures, soft arrivals, translucent paper. */
.daylight-pointer{position:fixed;left:0;top:0;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,#fff9 0%,#fff5 12%,#fff2 35%,transparent 70%);pointer-events:none;z-index:25;opacity:0;transition:opacity .2s ease;contain:strict}
.daylight-pointer.is-visible{opacity:1}
#app:not([data-theme="moon"]) .daylight-pointer{background:radial-gradient(circle,rgba(247,198,115,.38) 0%,rgba(245,193,109,.22) 12%,rgba(238,181,102,.09) 35%,transparent 70%)}
@media(prefers-reduced-motion:reduce),(hover:none){.daylight-pointer{display:none}}
/* Keep page context and account controls visible while the workspace scrolls. */
.workspace>header {
 position:sticky;
 top:0;
 z-index:20;
 flex-shrink:0;
}
dialog, .welcome-dialog {
 background:rgb(255 253 247 / 82%);
 backdrop-filter:blur(24px) saturate(1.15);
 -webkit-backdrop-filter:blur(24px) saturate(1.15);
 border-color:rgb(255 255 240 / 65%);
 box-shadow:0 24px 80px #15201930,inset 0 1px #ffffff70;
}
html[data-app-theme="moon"] #editor {
 background:rgb(37 49 42 / 84%);
 border-color:rgb(162 183 142 / 30%);
}
dialog::backdrop,.welcome-dialog::backdrop { background:#17241955; backdrop-filter:blur(5px); }
dialog[open] { animation:dialog-arrive .24s cubic-bezier(.2,.75,.2,1); }
@keyframes dialog-arrive { from {opacity:0;transform:translateY(12px) scale(.98)} to {opacity:1;transform:translateY(0) scale(1)} }
.welcome-backdrop { animation:none; transform:scale(1.045); }
.welcome-dust { display:none; }
.welcome-light {
 inset:-30%; opacity:.16;
 background:repeating-linear-gradient(113deg,transparent 0 10%,#fff1b31a 11% 14%,transparent 15% 24%);
 filter:blur(10px);
 animation:window-light 18s ease-in-out infinite alternate paused;
}
.welcome-screen.is-motion-playing .welcome-light { animation-play-state:running; }
@keyframes window-light {
 from { transform:translate3d(-4%,0,0) rotate(-2deg);opacity:.09 }
 to { transform:translate3d(4%,2%,0) rotate(2deg);opacity:.25 }
}
.welcome-cursor-light { background:radial-gradient(ellipse 380px 300px at var(--spot-x,50%) var(--spot-y,50%),#ffedb52b,transparent 100%); }
@media(prefers-reduced-motion:reduce) {
 dialog[open],.welcome-light {animation:none!important}
 .welcome-light {opacity:.1;transform:none}
}
@supports not (backdrop-filter:blur(1px)) {
 dialog,.welcome-dialog {background:#fffdf7}
 html[data-app-theme="moon"] #editor {background:#25312a}
}