:root{--sq-ease:cubic-bezier(.22,1,.36,1);--sq-out:cubic-bezier(.16,1,.3,1);--sq-fast:180ms;--sq-medium:360ms;--sq-slow:650ms}
html{scroll-behavior:smooth;scroll-padding-top:24px}
button,a,[role=button],input,select,textarea{transition:background-color 220ms ease,color 220ms ease,border-color 220ms ease,box-shadow 280ms var(--sq-ease),opacity 180ms ease,translate 260ms var(--sq-ease),scale 260ms var(--sq-ease),filter 220ms ease;touch-action:manipulation}
button:not(:disabled),a,[role=button]{-webkit-tap-highlight-color:transparent}
button:disabled{cursor:not-allowed;opacity:.55}
button:active:not(:disabled),a:active,[role=button]:active{scale:.97;transition-duration:100ms}
button:focus-visible,a:focus-visible,[role=button]:focus-visible{outline:3px solid #ec642e;outline-offset:5px}
input,select,textarea{accent-color:#ec642e}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #ec642e80;outline-offset:2px;box-shadow:0 0 0 5px #ec642e0c}
.search{transition:background-color 220ms,border-color 220ms,box-shadow 280ms}
.search:focus-within{border-color:#9eae89;background:#fffdf6;box-shadow:0 0 0 4px #94a77a14}
.quest-card,.people article,.economy-card,.inventory-item,.travel-cell,.shop-item,.room-slot,.help-grid>div,.profile-card,.bottom-banner{transition:translate 420ms var(--sq-ease),box-shadow 420ms var(--sq-ease),border-color 260ms ease,background-color 260ms ease}
.quest-art svg,.hero-art svg,.brand-mark,.wordmark>span,.card-link,.hero-actions button>span{transition:transform 650ms var(--sq-out),color 220ms}
.progress>div,.online-progress span,.xp-track span,#xp-fill,#quest-progress span{transition:width 700ms var(--sq-ease),background-color 280ms}
.tabs button,.economy-tabs button{transition:background-color 280ms,color 220ms,box-shadow 280ms,translate 220ms var(--sq-ease)}
.tabs button.selected,.economy-tabs button.chosen{box-shadow:0 2px 7px #26351b0a}
.role,.pill,.quest-tag,.quest-time{transition:background-color 240ms,color 240ms,border-color 240ms}
header nav button::after{content:'';position:absolute;height:3px;background:var(--orange,#ec642e);bottom:0;left:0;right:0;transform:scaleX(0);transform-origin:50%;transition:transform 360ms var(--sq-ease)}
header nav button.active::after{transform:scaleX(1)}
dialog{opacity:0;transform:translateY(12px) scale(.98);transition:opacity 180ms ease,transform 260ms var(--sq-ease),display 260ms allow-discrete,overlay 260ms allow-discrete}
dialog[open]{opacity:1;transform:translateY(0) scale(1)}
dialog::backdrop{opacity:0;transition:opacity 220ms ease,display 260ms allow-discrete,overlay 260ms allow-discrete}
dialog[open]::backdrop{opacity:1}
@starting-style{dialog[open]{opacity:0;transform:translateY(18px) scale(.975)}dialog[open]::backdrop{opacity:0}}
.sq-click-ring{position:fixed;width:22px;height:22px;border:1px solid #ec642e75;border-radius:50%;pointer-events:none;z-index:2147483647;margin:-11px 0 0 -11px;background:#ec642e0a}
.hero-art{transition:box-shadow 600ms var(--sq-ease),border-color 400ms}
.hero-copy h1 svg path{stroke-dasharray:800;stroke-dashoffset:0;animation:sq-draw 1400ms var(--sq-out) 200ms both}
.hero-art .speech{animation:sq-speech 900ms var(--sq-out) 250ms both}
@keyframes sq-draw{from{stroke-dashoffset:800}}
@keyframes sq-speech{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
.hero-art .scene-hit{transition:filter 280ms ease;transform-box:fill-box;transform-origin:center}
#toast{transition:opacity 220ms ease,transform 420ms var(--sq-ease)}
.notice,.economy-feedback,.world-announcement:not([hidden]){animation:sq-message 420ms var(--sq-out) both}
@keyframes sq-message{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
button[aria-busy=true]{cursor:wait;opacity:.65}
.load-mark{animation:sq-load 1800ms ease-in-out infinite}
@keyframes sq-load{0%,100%{translate:0 0;rotate:-3deg}50%{translate:0 -6px;rotate:3deg}}
@media(hover:hover) and (pointer:fine){
 button:not(:disabled):hover,a:hover{translate:0 -2px}
 header nav button:hover,.tabs button:hover,.economy-tabs button:hover{translate:0 -1px}
 .quest-card:hover,.quest-card:focus-visible{transform:none;translate:0 -7px;border-color:#a9b891;box-shadow:0 16px 30px -16px #28331b35}
 .quest-card:hover .quest-art svg,.quest-card:focus-visible .quest-art svg{transform:scale(1.045)}
 .quest-card:hover .card-link{color:#c84d20;transform:translateX(3px);display:inline-block}
 .people article:hover,.economy-card:hover,.travel-cell:hover,.room-slot:hover{translate:0 -3px;box-shadow:0 10px 22px -17px #26351b60}
 .brand:hover .brand-mark,.wordmark:hover>span{transform:rotate(-7deg) scale(1.04)}
 .hero-actions button:hover>span{display:inline-block;transform:translate(3px,-2px)}
 .hero-art:hover{border-color:#b5c4a3;box-shadow:0 15px 35px -25px #34452c55}
 .hero-art:hover #town-illustration>svg{transform:translateY(-3px)}
 a:not(.brand):not(.wordmark):hover{color:#bb4d25}
 .outline:hover,.secondary:hover{box-shadow:0 4px 12px -8px #26351b60}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}button:active,a:active,[role=button]:active{scale:1}button:hover,a:hover,.quest-card:hover,.people article:hover,.economy-card:hover,.travel-cell:hover,.room-slot:hover{translate:none!important}.quest-card:hover .quest-art svg,.hero-art:hover #town-illustration>svg,.brand:hover .brand-mark{transform:none}.sq-click-ring{display:none}::view-transition-old(*),::view-transition-new(*),::view-transition-group(*){animation:none!important}}
