/* Motion layer: transform/opacity only (no layout shift); everything off under reduced motion. */
:focus-visible{outline:2px solid #F6E08A;outline-offset:2px;border-radius:4px}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes rowIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes toastIn{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
@keyframes shake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}30%,50%,70%{transform:translateX(-7px)}40%,60%{transform:translateX(7px)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(95,207,122,.6)}70%{box-shadow:0 0 0 8px rgba(95,207,122,0)}100%{box-shadow:0 0 0 0 rgba(95,207,122,0)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes shimmerBar{0%{background-position:-200px 0}100%{background-position:200px 0}}
@keyframes sweep{from{transform:translateX(-120%) skewX(-20deg)}to{transform:translateX(320%) skewX(-20deg)}}
main{animation:pageIn .32s cubic-bezier(.2,.7,.2,1) both}
.tabs a{transition:color .2s,border-color .2s,background .2s}.tabs a:hover{background:#221f12}
.tablewrap tr{animation:rowIn .4s cubic-bezier(.2,.7,.2,1) both}
.tablewrap tr:nth-child(2){animation-delay:.03s}.tablewrap tr:nth-child(3){animation-delay:.06s}.tablewrap tr:nth-child(4){animation-delay:.09s}.tablewrap tr:nth-child(5){animation-delay:.12s}.tablewrap tr:nth-child(6){animation-delay:.15s}.tablewrap tr:nth-child(7){animation-delay:.18s}.tablewrap tr:nth-child(8){animation-delay:.21s}.tablewrap tr:nth-child(n+9){animation-delay:.24s}
.tablewrap tr:hover td{background:#1d1a10;transition:background .15s}
.panel,.stat,.empty{animation:pageIn .4s cubic-bezier(.2,.7,.2,1) both;transition:transform .2s,box-shadow .2s,border-color .2s}
.stat:hover,.panel:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.5);border-color:#4a4326}
.stats .stat:nth-child(2){animation-delay:.05s}.stats .stat:nth-child(3){animation-delay:.1s}.stats .stat:nth-child(4){animation-delay:.15s}
.btn{position:relative;overflow:hidden;transition:transform .15s,box-shadow .2s,filter .2s}
.btn:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(201,162,39,.35)}.btn:active{transform:none}
.btn::after{content:"";position:absolute;top:0;left:0;width:30%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:translateX(-120%) skewX(-20deg);pointer-events:none}
.btn:hover::after{animation:sweep .7s ease}
input,select,textarea{transition:border-color .2s,box-shadow .2s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,162,39,.28),0 0 14px rgba(201,162,39,.25)}
.filters select,.filters input{transition:border-color .2s,box-shadow .2s,opacity .2s}
.tablewrap{transition:opacity .2s}
.is-loading .tablewrap table{opacity:.35}
.skeleton-rows{display:none}.is-loading .skeleton-rows{display:block}
.skeleton-rows i{display:block;height:16px;margin:12px 0;border-radius:4px;background:linear-gradient(90deg,#1d1a10 25%,#332d17 50%,#1d1a10 75%);background-size:400px 100%;animation:shimmerBar 1.2s linear infinite}
#toasts{position:fixed;bottom:18px;right:14px;z-index:50;display:flex;flex-direction:column;gap:8px;max-width:min(360px,calc(100vw - 28px))}
.toast{background:#17150f;border:1px solid var(--gold);border-left-width:5px;color:var(--ink);padding:10px 14px;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.6);animation:toastIn .3s cubic-bezier(.2,.7,.2,1) both;transition:opacity .3s,transform .3s}
.toast.out{opacity:0;transform:translateX(24px)}
.js .flash{display:none}
.top-progress{position:fixed;left:0;top:0;height:3px;width:0;background:linear-gradient(90deg,#7A5C0E,#F6E08A);z-index:60;opacity:0;transition:width .4s,opacity .3s}
body.nav-busy .top-progress{width:75%;opacity:1}
.h-ok{animation:pulse 2.2s infinite}.h-running,.run-running{background:#0a66c2;animation:pulse 1.4s infinite}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#5fcf7a;margin-right:6px;animation:pulse 2s infinite;vertical-align:middle}
.spinner{display:inline-block;width:13px;height:13px;border:2px solid rgba(0,0,0,.3);border-top-color:#000;border-radius:50%;animation:spin .7s linear infinite;vertical-align:-2px;margin-right:6px}
.btn.running{pointer-events:none;filter:brightness(.85)}
.ring{--p:0;width:44px;height:44px;border-radius:50%;display:inline-grid;place-items:center;font-weight:700;font-size:13px;color:var(--gold);background:conic-gradient(var(--gold) calc(var(--p)*1%),#2b2718 0);position:relative;transition:--p 1s}
.ring::before{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--panel)}
.ring span{position:relative}
.brand .logo{transition:transform .3s}.brand:hover .logo{transform:rotate(-4deg) scale(1.06)}
/* login */
body.login-page{min-height:100vh;overflow-x:hidden}
.login-page .top,.login-page .tabs{display:none}
.login-page main{max-width:none;min-height:calc(100vh - 90px);display:grid;place-items:center;position:relative;animation:none}
.login-page footer{position:relative;z-index:1;border:0}
.login-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:radial-gradient(ellipse 70% 50% at 50% 105%,rgba(201,162,39,.28),transparent 70%),#0B0B0B}
.login-bg::before{content:"";position:absolute;left:-10%;right:-10%;bottom:0;height:34vh;background:
 linear-gradient(#0B0B0B,#0B0B0B) 4% 100%/7% 55% no-repeat,linear-gradient(#0B0B0B,#0B0B0B) 13% 100%/5% 80% no-repeat,linear-gradient(#0B0B0B,#0B0B0B) 20% 100%/8% 45% no-repeat,linear-gradient(#0B0B0B,#0B0B0B) 31% 100%/6% 70% no-repeat,linear-gradient(#0B0B0B,#0B0B0B) 42% 100%/9% 40% no-repeat,linear-gradient(#0B0B0B,#0B0B0B) 55% 100%/6% 85% no-repeat,linear-gradient(#0B0B0B,#0B0B0B) 66% 100%/8% 50% no-repeat,linear-gradient(#0B0B0B,#0B0B0B) 78% 100%/5% 75% no-repeat,linear-gradient(#0B0B0B,#0B0B0B) 88% 100%/8% 48% no-repeat;opacity:.95}
.login-bg::after{content:"";position:absolute;width:60vmax;height:60vmax;left:20%;top:-30vmax;background:radial-gradient(circle,rgba(246,224,138,.12),transparent 60%);animation:drift 24s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate(-12%,0)}to{transform:translate(18%,10%)}}
#dust{position:absolute;inset:0;width:100%;height:100%}
.card{position:relative;z-index:1;width:min(400px,calc(100vw - 32px));background:rgba(23,21,15,.86);backdrop-filter:blur(6px);border:1px solid #4a4326;border-radius:14px;padding:26px 24px;box-shadow:0 20px 60px rgba(0,0,0,.65),0 0 40px rgba(201,162,39,.08);animation:cardIn .7s .55s cubic-bezier(.2,.7,.2,1) both}
@keyframes cardIn{from{opacity:0;transform:translateY(22px) scale(.98)}to{opacity:1;transform:none}}
.card.shake{animation:cardIn .01s both,shake .5s .05s}
.card h1{display:none}
.card .draw{display:block;width:100%;height:auto;margin:0 auto 18px}
.draw .stroke{stroke-dasharray:1;stroke-dashoffset:1;animation:drawIn 1.3s .1s ease forwards}
.draw .fill{opacity:0;animation:fadeIn .7s 1s ease forwards}
.draw .word{opacity:0;animation:fadeIn .8s 1.1s ease forwards}.draw .w2{animation-delay:1.35s}
.draw .shimmer{animation:glint 1.1s 1.8s ease-in-out both}
@keyframes drawIn{to{stroke-dashoffset:0}}@keyframes fadeIn{to{opacity:1}}
@keyframes glint{from{transform:translateX(0) skewX(-20deg)}to{transform:translateX(130px) skewX(-20deg)}}
.card .custom-logo{display:block;max-width:240px;max-height:110px;margin:0 auto 18px;animation:fadeIn .9s .1s both;opacity:0}
.login-page.leaving .card{opacity:0;transform:scale(.96) translateY(-10px);transition:opacity .45s,transform .45s}
.login-page.leaving .login-bg{filter:brightness(1.6);transition:filter .5s}
.card .err{background:rgba(140,24,18,.25);border-radius:6px;padding:8px 10px;margin:0 0 10px}
.card select,.card input{width:100%}
.card .btn{width:100%;margin-top:6px;padding:11px}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .draw .stroke{stroke-dashoffset:0;opacity:0}.draw .fill,.draw .word,.card .custom-logo{opacity:1}.draw .shimmer{display:none}
 #dust{display:none}.is-loading .tablewrap table{opacity:1}
}
/* ---- redesign additions ---- */
@keyframes rise{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.rise{animation:rise .5s calc(var(--i,0)*55ms) cubic-bezier(.2,.7,.2,1) both}
.ccard,.tile,.tcard,.stat{transition:transform .22s,box-shadow .22s,border-color .22s}
.ccard:hover,.tile:hover,.tcard:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 10px 26px rgba(0,0,0,.55),0 0 18px rgba(201,162,39,.18)}
.bars .bar i{animation:grow .9s calc(var(--i,0)*60ms + .2s) cubic-bezier(.2,.7,.2,1) both}
@keyframes grow{from{transform:scaleX(0)}to{transform:none}}
.spark path.line{stroke-dasharray:400;stroke-dashoffset:400;animation:drawLine 1.4s .3s ease forwards}
@keyframes drawLine{to{stroke-dashoffset:0}}
.tabs a .ic{transition:transform .2s}.tabs a:hover .ic{transform:scale(1.15)}
.h-running{animation:pulse 1.2s infinite}.h-pass,.h-fail{animation:rise .35s both}
@view-transition{navigation:auto}
::view-transition-old(root){animation:.18s ease both fadeOut}::view-transition-new(root){animation:.28s ease both pageIn}
@keyframes fadeOut{to{opacity:0}}
.viewtoggle button{transition:background .2s,color .2s}
[data-views] .as-cards,[data-views] .as-table{animation:pageIn .3s both}
body:not(.login-page) .content.anon{animation:none}
@media(prefers-reduced-motion:reduce){.rise,.bars .bar i,.spark path.line{animation:none!important;stroke-dashoffset:0}}