/* Motion layer: theme-aware, finite entrances and no layout-moving hover effects. */
:root{--ease-out:cubic-bezier(.16,1,.3,1)}
#app-shell::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 16% 8%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 45%),radial-gradient(ellipse at 90% 65%,color-mix(in srgb,var(--accent) 5%,transparent),transparent 40%)}
#app-shell:not([inert]) .hero{animation:scene-in .7s var(--ease-out) both}
#app-shell:not([inert]) .user-panel{animation:scene-in .75s .08s var(--ease-out) both}
#content>.review-list,#settings-body>.split,#settings-body>.panel{animation:scene-in .45s var(--ease-out) both}
.hero-mark{position:relative;box-shadow:0 0 45px color-mix(in srgb,var(--accent) 12%,transparent),inset 0 1px #ffffff22}
.hero-mark::after{content:"";position:absolute;inset:-9px;border:1px solid color-mix(in srgb,var(--accent) 18%,transparent);border-radius:27px;pointer-events:none;animation:halo-arrive 1.4s var(--ease-out) both}
.hero h1{background:linear-gradient(115deg,var(--text) 25%,color-mix(in srgb,var(--accent) 40%,var(--text)) 70%,var(--text));background-clip:text;-webkit-background-clip:text;color:transparent}
.panel{box-shadow:0 18px 60px #0003,inset 0 1px #ffffff0b}
.upload{isolation:isolate;transition:border-color .25s,background .25s,box-shadow .25s}
.upload::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:radial-gradient(240px circle at var(--pointer-x,50%) var(--pointer-y,50%),color-mix(in srgb,var(--accent) 12%,transparent),transparent 75%);opacity:0;transition:opacity .3s}
.upload:hover::before,.upload:focus-within::before{opacity:1}
.upload.has-file{box-shadow:inset 0 0 22px color-mix(in srgb,var(--accent) 5%,transparent)}
.upload.has-file::after{content:"✓";position:absolute;right:10px;top:8px;color:var(--accent);font-size:11px;pointer-events:none;animation:check-in .4s var(--ease-out) both}
.upload.has-file img{animation:photo-in .4s var(--ease-out) both}
.file-state,.upload-icon{transition:color .2s,background .2s,box-shadow .2s}
.upload:hover .upload-icon{background:color-mix(in srgb,var(--accent) 12%,transparent);box-shadow:0 0 22px color-mix(in srgb,var(--accent) 10%,transparent)}
.attachment-progress{height:3px;margin:-3px 0 18px;border-radius:20px;overflow:hidden;background:#ffffff0a}
.attachment-progress span{display:block;height:100%;width:var(--attachment-progress,0%);border-radius:inherit;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 60%,transparent),var(--accent));transition:width .45s var(--ease-out);box-shadow:0 0 12px var(--accent)}
#files-count{transition:color .2s}#verify-form.attachments-ready #files-count{color:var(--accent)}
button.primary{position:relative;overflow:hidden;isolation:isolate;transition:box-shadow .25s,filter .25s,transform .15s}
button.primary::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,#ffffff35 50%,transparent 70%);transform:translateX(-120%)}
button.primary:hover::before,button.primary:focus-visible::before{animation:button-sheen .7s ease-out both}
button.primary:hover{box-shadow:0 6px 26px color-mix(in srgb,var(--accent) 24%,transparent)}
#verify-form>[type=submit] .icon{transition:transform .25s var(--ease-out)}
#verify-form>[type=submit]:hover .icon{transform:translateX(4px)}
#verify-form[aria-busy=true]>[type=submit]::before{animation:button-sheen 1.5s linear infinite}
#verify-form[aria-busy=true] .uploads{opacity:.65;transition:opacity .2s}
#upload-progress::before{content:"";display:inline-block;width:11px;height:11px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;margin-right:8px;vertical-align:-2px;animation:spin .8s linear infinite}
#toast{display:flex;align-items:center;gap:10px;border-color:color-mix(in srgb,var(--accent) 35%,var(--surface));background:color-mix(in srgb,var(--surface) 97%,transparent);backdrop-filter:blur(16px);font-size:13px;box-shadow:0 12px 42px #0005;animation:toast-in .3s var(--ease-out) both}
#toast .icon{color:var(--accent);width:18px;height:18px}
dialog[open]{animation:dialog-in .3s var(--ease-out) both}dialog[open]::backdrop{animation:backdrop-in .3s ease both}
.status-symbol{animation:check-in .55s var(--ease-out) both;box-shadow:0 0 30px color-mix(in srgb,var(--accent) 8%,transparent)}
.logo-stage{isolation:isolate}.logo-stage::before{content:"";position:absolute;inset:15%;z-index:-1;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 15%,transparent),transparent 70%);animation:halo-arrive 1.5s var(--ease-out) both}
#loader .loading-track i{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 55%,#2870ff),var(--accent),#e7fff5);box-shadow:0 0 15px color-mix(in srgb,var(--accent) 50%,transparent)}
@keyframes scene-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes photo-in{from{opacity:.3;transform:scale(.96)}to{opacity:1;transform:none}}
@keyframes halo-arrive{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
@keyframes check-in{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
@keyframes button-sheen{to{transform:translateX(120%)}}
@keyframes toast-in{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes dialog-in{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:700px){.hero-mark::after{inset:-7px;border-radius:23px}.upload.has-file::after{right:6px;top:4px;font-size:10px}#toast{bottom:max(18px,env(safe-area-inset-bottom));font-size:12px;max-width:calc(100vw - 32px);width:max-content}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.loading-track{opacity:1!important}.logo-stage img{opacity:1!important;clip-path:none!important;filter:none!important;transform:none!important}button.primary::before{display:none}}