@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#050505;--panel:#0d0d0d;--panel2:#121212;--line:#242424;--text:#fff;--muted:#8f8f8f;--accent:#ffd338;--accent2:#fff18a;--danger:#ff6868;--success:#56d98b;--shadow:0 22px 70px #0008}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#050505e8,#050505f5 42%,#030303 100%),radial-gradient(circle at 12% 0,#ffd3381d,transparent 30%),url('../img/site-bg.png') center top/cover fixed no-repeat;color:var(--text);font:14px/1.55 'Manrope','Segoe UI Variable',Segoe UI,Arial,sans-serif;min-height:100vh;letter-spacing:-.01em}a{color:inherit;text-decoration:none}button,input{font:inherit}.topbar{position:sticky;top:14px;z-index:50;margin:14px 24px 0;height:64px;padding:0 18px;display:flex;align-items:center;gap:28px;border:1px solid #ffffff12;border-radius:20px;background:#080808d8;backdrop-filter:blur(24px) saturate(1.15);box-shadow:0 18px 50px #000b}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:16px;white-space:nowrap}.brand img{width:30px;height:30px;object-fit:contain}.nav{display:flex;align-items:center;justify-content:center;gap:22px;flex:1;color:#9a9a9a}.nav a{display:inline-flex;align-items:center;gap:8px}.nav a:hover,.nav a.active{color:var(--accent)}.top-actions{display:flex;gap:8px}.btn{border:1px solid transparent;border-radius:13px;padding:12px 18px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:.18s ease}.btn:hover{transform:translateY(-1px);filter:brightness(1.05)}.btn.accent{background:var(--accent);color:#111}.btn.ghost{background:#111;border-color:#262626;color:#eee}.btn.danger{background:#261313;border-color:#552222;color:#ff9898}.btn.sm{padding:9px 14px}.btn.full{width:100%}.page{width:min(1320px,calc(100% - 48px));margin:36px auto 80px}.hero{min-height:610px;border:1px solid var(--line);border-radius:30px;overflow:hidden;display:grid;grid-template-columns:1.15fr .85fr;background:#0a0a0a;box-shadow:var(--shadow)}.hero-copy{padding:72px;display:flex;flex-direction:column;justify-content:center}.eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--accent);font-size:11px;font-weight:800}.hero h1{font-size:68px;line-height:1.02;margin:18px 0 18px;letter-spacing:-.045em}.hero h1 span{color:var(--accent)}.hero p{font-size:17px;color:#aaa;max-width:620px}.hero-actions{display:flex;gap:12px;margin-top:28px}.hero-art{position:relative;min-height:520px;background:url('../img/auth-hero.jpg') center/cover no-repeat}.hero-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a0a0a 0%,#0a0a0a33 35%,#0002 60%),linear-gradient(0deg,#000b,transparent 45%)}.hero-logo{position:absolute;z-index:2;right:48px;bottom:48px;width:120px;filter:drop-shadow(0 12px 25px #000)}.section{margin-top:72px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:24px}.section h2{font-size:38px;margin:0;letter-spacing:-.03em}.section p.lead{color:var(--muted);max-width:700px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{background:linear-gradient(180deg,#101010,#0a0a0a);border:1px solid var(--line);border-radius:22px;padding:24px}.card h3{margin:0 0 8px;font-size:20px}.card p{margin:0;color:var(--muted)}.feature-icon{width:42px;height:42px;border-radius:12px;background:#302900;border:1px solid #554700;color:var(--accent);display:grid;place-items:center;font-weight:900;margin-bottom:18px}.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.plan{position:relative;padding:28px;background:#0d0d0d;border:1px solid #262626;border-radius:24px}.plan.featured{border-color:#6b5c16;background:radial-gradient(circle at 70% 0,#4f420b55,transparent 35%),#0e0e0e}.badge{position:absolute;right:18px;top:18px;background:var(--accent);color:#121212;font-weight:900;font-size:10px;padding:7px 10px;border-radius:999px}.plan-price{font-size:46px;font-weight:850;letter-spacing:-.04em;margin:20px 0 2px}.plan small{color:#777}.plan ul{list-style:none;padding:18px 0;margin:18px 0;border-top:1px solid #222}.plan li{padding:7px 0;color:#bbb}.plan li:before{content:"✓";color:var(--accent);margin-right:9px;font-weight:900}.footer{width:min(1320px,calc(100% - 48px));margin:0 auto 28px;color:#777}.footer a{color:inherit}
.footer-rich{margin-top:34px;padding:40px 0 20px;border-top:1px solid #1d1d1d;display:grid;grid-template-columns:1.1fr 1.4fr;gap:44px;background:radial-gradient(circle at 50% 0,#17140b44,transparent 40%)}
.footer-brand-link{margin-bottom:18px;display:inline-flex}.footer-brand p{max-width:320px;color:#b5b5b5;font-size:18px;line-height:1.45;margin:0 0 24px}
.footer-socials{display:flex;gap:12px}.footer-socials a{width:44px;height:44px;border:1px solid #242424;border-radius:50%;display:grid;place-items:center;background:#0d0d0d;color:#d8d8d8}.footer-socials a:hover{color:var(--accent);border-color:#44380e}
.footer-columns{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.footer-columns h4{text-transform:uppercase;letter-spacing:.15em;font-size:12px;color:#6f6f6f;margin:0 0 18px}.footer-columns a{display:block;color:#c8c8c8;margin:0 0 12px}.footer-columns a:hover{color:var(--accent)}
.footer-bottom{grid-column:1/-1;margin-top:18px;padding-top:18px;border-top:1px solid #1b1b1b;display:flex;justify-content:space-between;gap:16px;color:#666}.footer-bottom a{color:#bbb}.footer-bottom a:hover{color:var(--accent)}.auth-shell{width:min(1000px,calc(100% - 32px));min-height:650px;margin:40px auto;display:grid;grid-template-columns:.86fr 1.14fr;border:1px solid var(--line);border-radius:30px;overflow:hidden;background:#090909;box-shadow:var(--shadow)}.auth-art{position:relative;background:url('../img/auth-hero.jpg') center/cover}.auth-art:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#050505e8 0%,#05050544 62%,#0004)}.auth-brand{position:absolute;z-index:2;left:28px;top:28px;display:flex;align-items:center;gap:10px;font-weight:800}.auth-brand img{width:32px}.auth-quote{position:absolute;z-index:2;left:30px;right:30px;bottom:32px}.auth-quote h2{font-size:26px;line-height:1.25;margin:0 0 10px}.auth-quote p{color:#aaa}.auth-panel{padding:54px 64px;display:flex;flex-direction:column;justify-content:center}.auth-panel h1{font-size:38px;line-height:1.05;margin:8px 0 8px}.auth-panel>p{color:var(--muted);margin:0 0 26px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{margin-bottom:14px}.field label{display:block;color:#9c9c9c;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;margin-bottom:7px}.input{width:100%;height:48px;border:1px solid #2b2b2b;border-radius:14px;background:#111;color:#fff;padding:0 15px;outline:none}.input:focus{border-color:#766517;box-shadow:0 0 0 3px #ffd33812}.turnstile-box{margin:14px 0;min-height:65px}.hint{font-size:12px;color:#777}.error,.success,.flash{padding:12px 14px;border-radius:12px;margin:12px 0}.error,.flash.error{background:#261414;border:1px solid #542323;color:#ff9696}.success,.flash.success{background:#11271b;border:1px solid #245635;color:#82e9a9}.split-link{display:flex;justify-content:space-between;align-items:center;margin-top:12px;color:#8d8d8d}.split-link a{color:var(--accent)}.account-layout{display:grid;grid-template-columns:240px 1fr;gap:18px}.sidebar{position:sticky;top:96px;height:max-content;background:#0c0c0c;border:1px solid #242424;border-radius:22px;padding:12px}.side-user{padding:16px;border-bottom:1px solid #202020;margin-bottom:8px}.side-user strong{display:block;font-size:16px}.side-user span{color:#777;font-size:12px}.side-nav a{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;color:#aaa}.side-nav a:hover,.side-nav a.active{background:#1a180d;color:var(--accent)}.content-card{background:linear-gradient(180deg,#0b0b0be8,#080808ef);border:1px solid #ffffff10;border-radius:24px;padding:30px;backdrop-filter:blur(18px);box-shadow:0 24px 80px #0007}.dash-head{display:flex;justify-content:space-between;gap:18px;align-items:start;margin-bottom:22px}.dash-head h1{margin:0;font-size:34px}.status-pill{padding:7px 11px;border-radius:999px;font-size:11px;font-weight:800}.status-pill.ok{background:#13301f;color:#78e9a5}.status-pill.off{background:#301719;color:#ff9ba1}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}.stat{background:#111;border:1px solid #242424;border-radius:18px;padding:18px}.stat span{display:block;color:#777;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.stat strong{font-size:18px;display:block;margin-top:6px}.account-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.security-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.security-box{border:1px solid #252525;border-radius:20px;padding:22px;background:#0e0e0e}.security-box h2{font-size:16px;margin:0 0 4px;color:#fff}.security-box .sub{color:#777;margin-bottom:18px}.requirements{color:#777;font-size:12px}.requirements li{margin:5px 0}.qr-wrap{width:164px;height:164px;background:#fff;border-radius:18px;padding:12px;display:grid;place-items:center;margin:16px 0}.code-row{display:flex;gap:10px}.code-row .input{letter-spacing:.45em;text-align:center;font-weight:800}.doc-layout{display:grid;grid-template-columns:250px 1fr;gap:18px}.doc-nav,.doc{background:#0d0d0d;border:1px solid #242424;border-radius:22px;padding:18px}.doc-nav{height:max-content;position:sticky;top:96px}.doc h1{font-size:38px;margin:8px 0}.doc h3{margin:0}.doc-section{display:grid;grid-template-columns:36px 1fr;gap:14px;padding:22px 0;border-top:1px solid #202020}.doc-num{color:var(--accent);font-weight:900}.doc-section p{color:#929292;margin:8px 0 0}.wardrobe{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.cosmetic{border:1px solid #242424;border-radius:18px;padding:16px;background:#0f0f0f}.cosmetic-img{aspect-ratio:1.5;background:linear-gradient(135deg,#201b05,#101010);border-radius:13px;display:grid;place-items:center;overflow:hidden;margin-bottom:14px}.cosmetic-img img{width:100%;height:100%;object-fit:cover}.cosmetic-img span{font-size:48px;color:var(--accent)}.flash{width:min(900px,100%);margin:0 auto 15px}.download-card{display:flex;align-items:center;justify-content:space-between;gap:22px;background:linear-gradient(110deg,#151205,#0d0d0d 55%);border:1px solid #443b12;border-radius:20px;padding:22px}.download-card h3{margin:0 0 4px}.download-card p{margin:0;color:#888}.bot-card{display:flex;align-items:center;justify-content:space-between;gap:18px}.muted{color:var(--muted)}.yellow{color:var(--accent)}hr.sep{border:0;border-top:1px solid #222;margin:22px 0}@media(max-width:980px){.nav{display:none}.hero{grid-template-columns:1fr}.hero-art{min-height:330px}.hero-copy{padding:46px}.hero h1{font-size:50px}.grid3,.plans,.wardrobe{grid-template-columns:1fr 1fr}.auth-shell{grid-template-columns:1fr}.auth-art{min-height:280px}.auth-panel{padding:40px}.account-layout,.doc-layout{grid-template-columns:1fr}.sidebar,.doc-nav{position:static}.security-grid,.account-grid{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}}@media(max-width:650px){.topbar{margin:8px 10px 0}.top-actions .ghost{display:none}.page{width:calc(100% - 20px);margin-top:20px}.hero-copy{padding:30px}.hero h1{font-size:40px}.grid3,.plans,.wardrobe,.stats,.form-grid{grid-template-columns:1fr}.section h2{font-size:30px}.auth-shell{margin:14px auto;width:calc(100% - 20px)}.auth-panel{padding:30px 22px}.auth-panel h1{font-size:32px}.footer{width:calc(100% - 20px);flex-direction:column;gap:8px}.download-card,.bot-card{align-items:flex-start;flex-direction:column}}

/* Duck Cosmetics Store */
.cosmetic-filters{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 20px}.filter-pill{padding:10px 14px;border:1px solid #262626;border-radius:999px;background:#101010;color:#929292;font-weight:750;transition:.18s}.filter-pill:hover,.filter-pill.active{border-color:#6d5c14;color:var(--accent);background:#1d1908}.cosmetics-store{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.store-cosmetic{display:flex;flex-direction:column;gap:11px;padding:14px;border:1px solid #242424;border-radius:20px;background:linear-gradient(180deg,#101010,#090909);min-width:0}.store-cosmetic.owned{border-color:#443a13;box-shadow:inset 0 0 0 1px #2e270d}.store-cosmetic-art{height:190px;position:relative;overflow:hidden;border-radius:15px;background:radial-gradient(circle at 50% 32%,#332b0d,#111 60%);display:grid;place-items:center}.store-cosmetic-art img{width:78%;height:78%;object-fit:contain;image-rendering:auto;filter:drop-shadow(0 18px 20px #000b)}.price-chip,.owned-chip{position:absolute;top:11px;padding:7px 10px;border-radius:999px;font-size:10px;font-weight:900;backdrop-filter:blur(10px)}.price-chip{right:11px;background:var(--accent);color:#111}.owned-chip{left:11px;background:#193421dd;color:#83eeac;border:1px solid #2b5b39}.price-chip.inline{position:static;display:inline-flex;float:right;margin:0 0 8px 12px}.cosmetic-copy h3{font-size:18px;margin:4px 0 2px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.cosmetic-copy p{font-size:11px;color:#6f6f6f;margin:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.cosmetic-action{margin:0}.preview-button{margin-top:auto}.preview-modal{position:fixed;z-index:250;inset:0;padding:24px;background:#000c;backdrop-filter:blur(14px);display:none;align-items:center;justify-content:center}.preview-modal.open{display:flex}.modal-lock{overflow:hidden}.preview-dialog{width:min(860px,100%);background:#090909;border:1px solid #292929;border-radius:26px;box-shadow:0 35px 120px #000;overflow:hidden}.preview-top{display:flex;align-items:start;justify-content:space-between;padding:22px 24px;border-bottom:1px solid #202020}.preview-top h2{font-size:27px;margin:4px 0 2px}.preview-top p{margin:0;color:#777}.preview-close{width:42px;height:42px;border:1px solid #2a2a2a;background:#131313;color:#aaa;border-radius:14px;font-size:26px;cursor:pointer}.preview-stage{height:min(64vh,520px);position:relative;background:radial-gradient(circle at 50% 42%,#29220a 0,#0b0b0b 44%,#060606 74%);overflow:hidden}.preview-stage:after{content:"";position:absolute;left:10%;right:10%;bottom:8%;height:1px;background:linear-gradient(90deg,transparent,#57480e,transparent);box-shadow:0 0 35px #ffd33855;pointer-events:none}.preview-stage canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:grab}.preview-stage canvas:active{cursor:grabbing}.preview-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#aaa;pointer-events:none}.preview-help{position:absolute;left:18px;bottom:15px;padding:8px 10px;border-radius:10px;background:#060606a8;border:1px solid #202020;color:#797979;font-size:11px;pointer-events:none}.preview-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px;color:#707070;font-size:12px}.preview-fallback{display:grid;place-items:center;height:100%;color:#999}.checkout{max-width:720px;margin:20px auto;padding:28px;border:1px solid #252525;border-radius:24px;background:#0d0d0d}.checkout h1{font-size:34px;margin:7px 0 8px}.checkout-price{font-size:48px;font-weight:900;color:var(--accent);letter-spacing:-.04em;margin:22px 0 6px}.checkout-product{display:flex;align-items:center;gap:14px;margin:18px 0;padding:12px;background:#111;border:1px solid #252525;border-radius:16px}.checkout-product img{width:70px;height:70px;object-fit:contain;background:#201b07;border-radius:12px}.checkout-product strong,.checkout-product span{display:block}.checkout-product span{color:#777;font-size:12px;margin-top:4px}.pay-methods{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}.pay-method{min-height:92px;text-align:left;padding:18px;border:1px solid #2a2a2a;border-radius:17px;background:#111;color:#fff;cursor:pointer}.pay-method:hover{border-color:#6a5914;background:#171406}.pay-method b,.pay-method span{display:block}.pay-method span{color:#777;margin-top:5px}.order-status{display:inline-flex;padding:7px 11px;border-radius:999px;font-size:11px;font-weight:900;margin:12px 0}.order-status.paid{background:#16331f;color:#7beaa4}.order-status.pending{background:#302a12;color:#ffe073}
@media(max-width:1050px){.cosmetics-store{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.cosmetics-store{grid-template-columns:1fr}.preview-modal{padding:8px}.preview-stage{height:55vh}.preview-bottom{align-items:flex-start;flex-direction:column}.pay-methods{grid-template-columns:1fr}}

.ico{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex:0 0 16px;color:currentColor}.ico svg{display:block;width:16px;height:16px}.ico.in-btn{width:15px;height:15px}.ico.in-btn.dark{color:#111}.account-grid .card h3,.download-card h3{display:flex;align-items:center;gap:10px}
.cosmetic-copy .meta-row{display:flex;align-items:center;gap:8px}
.store-cosmetic-art{height:210px;position:relative;overflow:hidden;border-radius:18px;background:radial-gradient(circle at 50% 18%,#41340e,#131313 58%);display:grid;place-items:center}
.store-cosmetic-art::before{content:"";position:absolute;inset:12px;border-radius:16px;background:linear-gradient(180deg,#ffffff05,#00000012);border:1px solid #252525}
.store-cosmetic-art img{position:relative;z-index:1;width:56%;height:56%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 20px 24px #000d)}
.store-cosmetic-art .cat-icon{position:absolute;left:16px;bottom:14px;width:54px;height:54px;border-radius:16px;background:#0b0b0bdc;border:1px solid #2a2a2a;color:var(--accent);display:grid;place-items:center;z-index:1}.store-cosmetic-art .cat-icon .ico,.store-cosmetic-art .cat-icon .ico svg{width:24px;height:24px}
.category-pill{display:inline-flex;align-items:center;gap:6px;color:var(--accent);font-size:11px;font-weight:850;letter-spacing:.16em;text-transform:uppercase}
.category-pill .ico,.category-pill .ico svg{width:14px;height:14px}
.cosmetic-copy h3{font-size:22px;margin:6px 0 2px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.cosmetic-copy p{font-size:12px;color:#7d7d7d;margin:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}

/* Premium typography + atmospheric background */
h1,h2,h3,.brand,.btn,.nav,.side-nav{font-family:'Manrope','Segoe UI Variable',Segoe UI,sans-serif}.hero h1,.dash-head h1,.cosmetics-title-row h1{font-weight:800;letter-spacing:-.055em}.card,.plan,.sidebar,.doc,.doc-nav,.security-box,.download-card{backdrop-filter:blur(14px)}

/* Delta-inspired cosmetics catalog — original Duck Visuals styling */
.cosmetics-catalog{padding:2px 2px 28px}.cosmetics-title-row{display:flex;align-items:flex-end;gap:14px;margin:4px 0 28px}.cosmetics-title-row>div{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}.cosmetics-title-row .eyebrow{width:100%;margin-bottom:-6px}.cosmetics-title-row h1{font-size:38px;line-height:1;margin:0}.cosmetics-title-row p{margin:0 0 3px;color:#7f7f7f;font-size:14px;max-width:760px}.cosmetics-title-row p:before{content:"/";margin-right:10px;color:#3f3f3f;font-weight:800}
.cos-category{margin:0 0 42px}.cos-category-head{display:flex;align-items:center;gap:10px;margin-bottom:20px}.cos-category-icon{width:30px;height:30px;border-radius:10px;background:#2b250c;color:var(--accent);display:grid;place-items:center;border:1px solid #5a4b12}.cos-category-icon .ico,.cos-category-icon .ico svg{width:16px;height:16px}.cos-category-head h2{font-size:17px;margin:0;font-weight:800}.cos-line{width:44px;height:4px;border-radius:99px;background:#252525;margin-left:2px}.cos-count{font-size:11px;color:#777;font-weight:800}
.cos-items-grid{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:24px 18px}.cos-tile{min-width:0;text-align:center;position:relative;padding:8px 6px 12px;border-radius:18px;transition:.2s ease}.cos-tile:hover{background:#ffffff05;transform:translateY(-2px)}.cos-model{display:block;width:100%;height:156px;padding:0;border:0;background:transparent;cursor:pointer;position:relative}.cos-model img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 20px 22px #000b);transition:.22s ease}.cos-tile:hover .cos-model img{transform:scale(1.045);filter:drop-shadow(0 22px 26px #000e) brightness(1.06)}.cos-name{font-weight:800;font-size:13px;color:#e8e8e8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:8px 4px 7px}.cos-price{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:76px;height:30px;border-radius:999px;border:0;background:var(--accent);color:#111;padding:0 12px;font-size:11px;font-weight:850;cursor:pointer}.cos-price .ico,.cos-price .ico svg{width:13px;height:13px}.cos-price.equipped{background:#232323;color:#ddd;border:1px solid #343434}.cos-mini-action{margin:0}.own-badge,.equip-badge{position:absolute;right:6px;top:6px;padding:5px 7px;border-radius:999px;font-size:8px;font-weight:900;letter-spacing:.06em;z-index:2}.own-badge{background:#181818dd;color:#bbb;border:1px solid #333}.equip-badge{background:#ffd338;color:#111}.cos-tile.owned .cos-model img{filter:drop-shadow(0 20px 24px #000d)}.cos-tile.equipped{background:linear-gradient(180deg,#ffd3380b,transparent)}
@media(max-width:1150px){.cos-items-grid{grid-template-columns:repeat(4,minmax(120px,1fr))}}@media(max-width:850px){.cos-items-grid{grid-template-columns:repeat(3,minmax(110px,1fr));gap:18px 12px}.cosmetics-title-row{align-items:flex-start;flex-direction:column}.cosmetics-title-row p:before{display:none}}@media(max-width:560px){.cos-items-grid{grid-template-columns:repeat(2,minmax(110px,1fr))}.cos-model{height:140px}.content-card{padding:18px}.cosmetics-title-row h1{font-size:32px}}

.compare-card{padding:18px;background:#0d0d0d;border:1px solid #232323;border-radius:30px;box-shadow:0 24px 90px #0008}
.compare-stage{position:relative;border-radius:28px;overflow:hidden;aspect-ratio:16/9;background:#050505}
.compare-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.compare-overlay{position:absolute;inset:0 auto 0 0;overflow:hidden;border-right:2px solid #f1f1f1;z-index:2}.compare-overlay .compare-img{width:100vw;max-width:none}
.compare-divider{position:absolute;top:0;bottom:0;width:0;z-index:3}.compare-divider::before{content:"";position:absolute;top:0;bottom:0;left:-1px;width:2px;background:#f5f5f5;box-shadow:0 0 0 1px #ffffff18}
.compare-handle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;border:0;background:#ffffff;box-shadow:0 8px 24px #0008;color:#111;font-size:21px;font-weight:900;display:grid;place-items:center;cursor:ew-resize}
.compare-badge{position:absolute;top:20px;z-index:4;padding:10px 14px;border-radius:999px;background:#00000060;border:1px solid #ffffff18;color:#fff;font-weight:800;letter-spacing:.08em;font-size:12px}.compare-badge.left{left:20px}.compare-badge.right{right:20px}
.compare-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:5}
@media(max-width:980px){.footer-rich{grid-template-columns:1fr}.footer-columns{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.compare-card{padding:10px;border-radius:22px}.compare-stage{border-radius:18px;aspect-ratio:4/3}.compare-badge{top:12px;padding:8px 10px;font-size:11px}.footer-columns{grid-template-columns:1fr 1fr}.footer-bottom{flex-direction:column}.footer-brand p{font-size:16px}}


/* fix pack: topbar/footer/compare */
.topbar{overflow:hidden}
.topbar .nav{flex-wrap:nowrap;overflow:auto hidden;scrollbar-width:none;white-space:nowrap;padding-bottom:2px}
.topbar .nav::-webkit-scrollbar{display:none}
.topbar .nav a{display:inline-flex!important;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-width:64px;font-size:12px;line-height:1.15;color:#9d9d9d}
.topbar .nav a .ico,.topbar .nav a .ico svg{width:18px!important;height:18px!important;flex:0 0 18px}
.topbar .nav a:hover,.topbar .nav a.active{color:var(--accent)}
.topbar .brand img{width:22px;height:22px}
.footer-rich{align-items:start}
.footer-socials{display:flex;gap:14px;flex-wrap:wrap}
.footer-socials a{width:auto;height:auto;border:0;background:transparent;padding:0;display:inline-flex;align-items:center;gap:10px;color:#d8d8d8}
.footer-socials .footer-circle{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#0d0d0d;border:1px solid #242424}
.footer-socials .footer-circle .ico,.footer-socials .footer-circle .ico svg{width:18px!important;height:18px!important}
.footer-socials a:hover{color:var(--accent)}
.footer-columns a{line-height:1.5}
.compare-card{padding:18px;background:#0d0d0d;border:1px solid #232323;border-radius:30px;box-shadow:0 24px 90px #0008;isolation:isolate}
.compare-stage{position:relative;border-radius:28px;overflow:hidden;aspect-ratio:16/9;background:#050505;max-width:100%}
.compare-stage img{user-select:none;-webkit-user-drag:none}
.compare-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.compare-overlay{position:absolute;left:0;top:0;bottom:0;width:50%;overflow:hidden;border-right:2px solid #f1f1f1;z-index:2}
.compare-overlay .compare-img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.compare-divider{position:absolute;top:0;bottom:0;left:50%;width:0;z-index:3}
.compare-divider::before{content:"";position:absolute;top:0;bottom:0;left:-1px;width:2px;background:#f5f5f5;box-shadow:0 0 0 1px #ffffff18}
.compare-handle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;border:0;background:#ffffff;box-shadow:0 8px 24px #0008;color:#111;font-size:21px;font-weight:900;display:grid;place-items:center;cursor:ew-resize}
.compare-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:5;margin:0}
@media(max-width:980px){.topbar{height:72px;padding:0 12px;gap:14px}.top-actions .btn{padding:8px 12px}.topbar .nav a{min-width:58px;font-size:11px}}
@media(max-width:700px){.topbar{margin:10px 10px 0;border-radius:16px}.page,.footer{width:min(1320px,calc(100% - 20px))}.topbar .brand span{display:none}.top-actions{display:none}}


/* mannequin cosmetics previews */
.cos-items-grid{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:28px 18px}
.cos-tile{display:flex;flex-direction:column;align-items:center;min-width:0}
.cos-model{position:relative;width:100%;height:190px;border:0;background:transparent;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.cos-scene{position:relative;display:block;width:100%;height:100%;border-radius:24px;background:radial-gradient(circle at 50% 22%,rgba(255,211,56,.09),rgba(255,211,56,.02) 25%,rgba(0,0,0,0) 62%)}
.cos-scene::after{content:"";position:absolute;left:18%;right:18%;bottom:16px;height:22px;border-radius:50%;background:radial-gradient(circle,#000b 0,#0008 35%,transparent 75%)}
.scene-base,.scene-item{position:absolute;left:50%;transform:translateX(-50%);image-rendering:pixelated;pointer-events:none}
.scene-base{bottom:24px;opacity:.95;filter:drop-shadow(0 8px 8px rgba(0,0,0,.45))}
.scene-item{filter:drop-shadow(0 10px 12px rgba(0,0,0,.55))}
.scene-backpacks .scene-base,.scene-wings .scene-base,.scene-capes .scene-base{width:120px;height:auto}
.scene-hats .scene-base{width:96px;bottom:52px}
.scene-pets .scene-base{width:160px;bottom:16px}
.scene-backpacks .scene-item{width:84px;top:56px}
.scene-wings .scene-item{width:112px;top:64px}
.scene-capes .scene-item{width:76px;top:52px}
.scene-hats .scene-item{width:74px;top:48px}
.scene-pets .scene-item{width:78px;top:78px;left:63%;transform:translateX(-50%)}
.cos-name{margin-top:8px;font-size:14px;font-weight:800;text-align:center;line-height:1.25;min-height:34px;display:flex;align-items:flex-end;justify-content:center}
.cos-price{display:inline-flex;align-items:center;gap:6px;justify-content:center;margin-top:10px;min-width:88px;padding:10px 14px;border-radius:999px;background:var(--accent);color:#111;font-weight:900;font-size:13px;border:0}
.cos-price.equipped{background:#202015;color:var(--accent);border:1px solid #5f4c12}.cos-price .ico,.cos-price .ico svg{width:12px;height:12px}
.cos-mini-action{margin:0}
.equip-badge,.own-badge{position:absolute;top:10px;left:50%;transform:translateX(-50%);padding:6px 10px;border-radius:999px;font-size:10px;font-weight:900;background:#111c;border:1px solid #2b2b2b;backdrop-filter:blur(8px)}
.equip-badge{color:#8af2aa;border-color:#315d3c;background:#102114c7}.own-badge{color:#ffd338;border-color:#5d4c18;background:#211b0fc7}
.cat-wings .cos-scene,.cat-capes .cos-scene{background:radial-gradient(circle at 50% 16%,rgba(255,211,56,.08),rgba(255,211,56,.015) 26%,transparent 62%)}
@media(max-width:1150px){.cos-items-grid{grid-template-columns:repeat(4,minmax(120px,1fr))}}
@media(max-width:850px){.cos-items-grid{grid-template-columns:repeat(3,minmax(110px,1fr));gap:20px 12px}}
@media(max-width:560px){.cos-items-grid{grid-template-columns:repeat(2,minmax(110px,1fr))}.cos-model{height:168px}.scene-pets .scene-base{width:140px}}


/* True overlay compare: both screenshots stay perfectly fixed, slider only reveals the top layer */
.compare-stage{
  --compare-pos:50%;
  position:relative!important;
  overflow:hidden!important;
  aspect-ratio:1920/1009!important;
  border-radius:28px!important;
  background:#050505!important;
}
.compare-stage>.compare-img.base,
.compare-stage>.compare-overlay,
.compare-stage>.compare-overlay>.compare-img.after{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
}
.compare-stage>.compare-img.base,
.compare-stage>.compare-overlay>.compare-img.after{
  object-fit:cover!important;
  object-position:center center!important;
  transform:none!important;
  max-width:none!important;
}
.compare-stage>.compare-overlay{
  z-index:2!important;
  overflow:visible!important;
  border-right:0!important;
  clip-path:inset(0 calc(100% - var(--compare-pos)) 0 0)!important;
  pointer-events:none!important;
}
.compare-stage>.compare-divider{
  position:absolute!important;
  top:0!important;
  bottom:0!important;
  left:var(--compare-pos)!important;
  width:0!important;
  z-index:4!important;
  pointer-events:none!important;
}
.compare-stage>.compare-divider::before{
  content:""!important;
  position:absolute!important;
  top:0!important;
  bottom:0!important;
  left:-1px!important;
  width:2px!important;
  background:#fff!important;
  box-shadow:0 0 18px #0008!important;
}
.compare-stage .compare-handle{
  pointer-events:none!important;
  width:54px!important;
  height:54px!important;
  background:#fff!important;
  color:#101010!important;
  border:1px solid #e7e7e7!important;
}
.compare-stage>.compare-range{
  position:absolute!important;
  inset:0!important;
  z-index:8!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  opacity:0!important;
  cursor:ew-resize!important;
}
.compare-stage>.compare-badge{z-index:6!important;pointer-events:none!important}

/* =========================================================
   Duck Visuals Motion Pack
   ========================================================= */
:root{
  --motion-fast:.18s;
  --motion-mid:.55s;
  --motion-slow:1.05s;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-spring:cubic-bezier(.2,1.35,.35,1);
}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
body::before,
body::after{
  content:"";
  position:fixed;
  z-index:-2;
  pointer-events:none;
  border-radius:50%;
  filter:blur(90px);
  opacity:.14;
  will-change:transform;
}
body::before{
  width:42vw;height:42vw;left:-14vw;top:7vh;
  background:#ffd338;
  animation:duckAmbientA 18s ease-in-out infinite alternate;
}
body::after{
  width:34vw;height:34vw;right:-12vw;top:46vh;
  background:#715c00;
  animation:duckAmbientB 22s ease-in-out infinite alternate;
}
@keyframes duckAmbientA{
  0%{transform:translate3d(0,0,0) scale(.9)}
  50%{transform:translate3d(10vw,8vh,0) scale(1.08)}
  100%{transform:translate3d(3vw,24vh,0) scale(.96)}
}
@keyframes duckAmbientB{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-8vw,-14vh,0) scale(1.14)}
  100%{transform:translate3d(-2vw,-28vh,0) scale(.92)}
}

/* page entrance */
body.duck-motion-ready .topbar{animation:duckTopbarIn .8s var(--ease-out) both}
body.duck-motion-ready .hero{animation:duckHeroIn .95s .06s var(--ease-out) both}
body.duck-motion-ready .auth-shell{animation:duckAuthIn .9s var(--ease-out) both}
body.duck-motion-ready .account-layout{animation:duckPageIn .8s .04s var(--ease-out) both}
body.duck-motion-ready .doc-layout{animation:duckPageIn .8s .04s var(--ease-out) both}
@keyframes duckTopbarIn{
  from{opacity:0;transform:translateY(-24px) scale(.985);filter:blur(8px)}
  to{opacity:1;transform:none;filter:none}
}
@keyframes duckHeroIn{
  from{opacity:0;transform:translateY(24px) scale(.985);filter:blur(10px)}
  to{opacity:1;transform:none;filter:none}
}
@keyframes duckAuthIn{
  from{opacity:0;transform:translateY(20px) scale(.975);filter:blur(10px)}
  to{opacity:1;transform:none;filter:none}
}
@keyframes duckPageIn{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:none}
}

/* sticky navbar breathing glass */
.topbar{
  transition:background .35s ease,border-color .35s ease,box-shadow .35s ease,transform .35s var(--ease-out);
}
.topbar.duck-scrolled{
  background:#080808f2;
  border-color:#ffd33824;
  box-shadow:0 18px 65px #000d,0 0 0 1px #ffd33808;
  transform:translateY(-2px);
}
.brand img{
  transition:transform .45s var(--ease-spring),filter .35s ease;
  animation:duckLogoFloat 4.6s ease-in-out infinite;
}
.brand:hover img{transform:rotate(-8deg) scale(1.14);filter:drop-shadow(0 0 14px #ffd33866)}
@keyframes duckLogoFloat{
  0%,100%{translate:0 0}
  50%{translate:0 -2px}
}
.nav a{
  position:relative;
  transition:color .22s ease,transform .26s var(--ease-spring);
}
.nav a::after{
  content:"";
  position:absolute;
  left:15%;right:15%;bottom:-8px;
  height:2px;border-radius:99px;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);
  transform:scaleX(0);
  opacity:0;
  transition:transform .3s var(--ease-out),opacity .3s ease;
}
.nav a:hover{transform:translateY(-3px)}
.nav a:hover::after,.nav a.active::after{transform:scaleX(1);opacity:1}
.nav a .ico{transition:transform .34s var(--ease-spring),filter .28s ease}
.nav a:hover .ico{transform:translateY(-2px) rotate(-5deg) scale(1.12);filter:drop-shadow(0 0 8px #ffd33866)}

/* hero motion */
.hero-copy>*{
  opacity:0;
  transform:translateY(18px);
  animation:duckHeroChild .72s var(--ease-out) forwards;
}
.hero-copy>*:nth-child(1){animation-delay:.18s}
.hero-copy>*:nth-child(2){animation-delay:.28s}
.hero-copy>*:nth-child(3){animation-delay:.38s}
.hero-copy>*:nth-child(4){animation-delay:.48s}
@keyframes duckHeroChild{to{opacity:1;transform:none}}
.hero-art{
  overflow:hidden;
  isolation:isolate;
}
.hero-art::before{
  content:"";
  position:absolute;inset:-5%;
  background:inherit;
  background-position:center;
  background-size:cover;
  z-index:-2;
  animation:duckHeroZoom 13s ease-in-out infinite alternate;
}
.hero-art::after{z-index:-1}
@keyframes duckHeroZoom{
  from{transform:scale(1.02) translate3d(-1%,0,0)}
  to{transform:scale(1.10) translate3d(2%,-1%,0)}
}
.hero-logo{
  animation:duckHeroLogo 4s ease-in-out infinite;
  transition:filter .4s ease;
}
.hero:hover .hero-logo{filter:drop-shadow(0 0 28px #ffd33888)}
@keyframes duckHeroLogo{
  0%,100%{transform:translateY(0) rotate(-2deg)}
  50%{transform:translateY(-10px) rotate(2deg)}
}

/* scroll reveal */
.duck-reveal{
  opacity:0;
  transform:translateY(34px) scale(.985);
  filter:blur(8px);
  transition:
    opacity .75s var(--ease-out),
    transform .75s var(--ease-out),
    filter .75s ease;
  transition-delay:var(--duck-delay,0ms);
}
.duck-reveal.duck-visible{
  opacity:1;
  transform:none;
  filter:none;
}
.duck-reveal-left{
  transform:translateX(-34px);
}
.duck-reveal-right{
  transform:translateX(34px);
}
.duck-reveal-left.duck-visible,
.duck-reveal-right.duck-visible{transform:none}

/* cards with spotlight */
.card,.plan,.stat,.security-box,.download-card,.doc,.doc-nav,.content-card,.sidebar,.store-cosmetic,.cos-tile{
  position:relative;
  isolation:isolate;
  transition:transform .34s var(--ease-out),border-color .34s ease,box-shadow .34s ease,background .34s ease;
}
.card::before,.plan::before,.stat::before,.security-box::before,.download-card::before,.store-cosmetic::before{
  content:"";
  position:absolute;inset:0;
  border-radius:inherit;
  z-index:-1;
  opacity:0;
  background:radial-gradient(220px circle at var(--spot-x,50%) var(--spot-y,50%),#ffd33816,transparent 65%);
  transition:opacity .3s ease;
}
.card:hover::before,.plan:hover::before,.stat:hover::before,.security-box:hover::before,.download-card:hover::before,.store-cosmetic:hover::before{opacity:1}
.card:hover,.plan:hover,.stat:hover,.security-box:hover,.download-card:hover,.store-cosmetic:hover{
  transform:translateY(-5px);
  border-color:#ffd3382c;
  box-shadow:0 18px 48px #0008,0 0 0 1px #ffd33806;
}

/* buttons */
.btn,.cos-price,.filter-pill{
  position:relative;
  overflow:hidden;
  transition:transform .25s var(--ease-spring),box-shadow .25s ease,filter .25s ease,border-color .25s ease;
}
.btn::after,.cos-price::after{
  content:"";
  position:absolute;top:-140%;left:-50%;
  width:38%;height:360%;
  background:linear-gradient(90deg,transparent,#fff8,transparent);
  transform:rotate(18deg) translateX(-220%);
  transition:transform .65s ease;
  pointer-events:none;
}
.btn:hover::after,.cos-price:hover::after{transform:rotate(18deg) translateX(500%)}
.btn:hover,.cos-price:hover{transform:translateY(-2px) scale(1.015)}
.btn.accent:hover,.cos-price:hover{box-shadow:0 10px 30px #ffd33822,0 0 0 1px #fff2 inset}
.duck-ripple{
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  transform:scale(0);
  background:#fff5;
  animation:duckRipple .62s ease-out forwards;
}
@keyframes duckRipple{
  to{transform:scale(5);opacity:0}
}

/* badges / prices */
.badge,.status-pill.ok,.price-chip{
  animation:duckBadgeBreath 2.8s ease-in-out infinite;
}
@keyframes duckBadgeBreath{
  0%,100%{box-shadow:0 0 0 0 #ffd33800}
  50%{box-shadow:0 0 0 6px #ffd33810}
}
.feature-icon,.cos-category-icon{
  transition:transform .35s var(--ease-spring),box-shadow .35s ease;
}
.card:hover .feature-icon,.cos-category:hover .cos-category-icon{
  transform:rotate(-7deg) scale(1.08);
  box-shadow:0 0 22px #ffd3381d;
}

/* compare section */
.compare-card{
  transition:transform .4s var(--ease-out),border-color .4s ease,box-shadow .4s ease;
}
.compare-card:hover{
  transform:translateY(-4px);
  border-color:#ffd3382c;
  box-shadow:0 28px 100px #000b,0 0 50px #ffd3380a;
}
.compare-divider::before{
  animation:duckCompareLine 2.3s ease-in-out infinite;
}
.compare-handle{
  animation:duckCompareHandle 2.1s ease-in-out infinite;
  transition:scale .2s var(--ease-spring),box-shadow .25s ease;
}
.compare-stage:hover .compare-handle{scale:1.08;box-shadow:0 10px 34px #000b,0 0 0 6px #ffffff16}
@keyframes duckCompareLine{
  0%,100%{box-shadow:0 0 8px #fff2}
  50%{box-shadow:0 0 20px #fff8}
}
@keyframes duckCompareHandle{
  0%,100%{transform:translate(-50%,-50%) scale(1)}
  50%{transform:translate(-50%,-50%) scale(1.06)}
}
.compare-badge{
  backdrop-filter:blur(12px);
  transition:transform .3s var(--ease-spring),background .3s ease;
}
.compare-stage:hover .compare-badge.left{transform:translateX(3px)}
.compare-stage:hover .compare-badge.right{transform:translateX(-3px)}

/* cosmetics */
.cos-category-head{transition:transform .35s var(--ease-out)}
.cos-category:hover .cos-category-head{transform:translateX(5px)}
.cos-line{
  transform-origin:left;
  animation:duckLinePulse 3s ease-in-out infinite;
}
@keyframes duckLinePulse{
  0%,100%{transform:scaleX(.82);opacity:.65}
  50%{transform:scaleX(1);opacity:1}
}
.cos-tile{
  transition:transform .32s var(--ease-spring),background .3s ease;
}
.cos-tile:hover{transform:translateY(-7px) scale(1.018)}
.cos-scene{transition:background .35s ease,box-shadow .35s ease}
.cos-tile:hover .cos-scene{
  background:radial-gradient(circle at 50% 24%,rgba(255,211,56,.16),rgba(255,211,56,.035) 33%,rgba(0,0,0,0) 66%);
}
.scene-base{
  animation:duckMannequinFloat 4.6s ease-in-out infinite;
}
.scene-item{
  animation:duckCosmeticFloat 3.8s ease-in-out infinite;
  animation-delay:var(--float-delay,0s);
  transition:filter .3s ease;
}
.cos-tile:hover .scene-item{filter:drop-shadow(0 16px 18px #000b) drop-shadow(0 0 10px #ffd3381f)}
@keyframes duckMannequinFloat{
  0%,100%{transform:translateX(-50%) translateY(0)}
  50%{transform:translateX(-50%) translateY(-3px)}
}
@keyframes duckCosmeticFloat{
  0%,100%{transform:translateX(-50%) translateY(0) rotate(-.6deg)}
  50%{transform:translateX(-50%) translateY(-7px) rotate(.6deg)}
}
.scene-pets .scene-item{
  animation-name:duckPetFloat;
}
@keyframes duckPetFloat{
  0%,100%{transform:translateX(-50%) translateY(0) rotate(-1deg)}
  50%{transform:translateX(-50%) translateY(-5px) rotate(1deg)}
}
.cos-tile.equipped .cos-scene::before{
  content:"";
  position:absolute;inset:14px;
  border-radius:22px;
  border:1px solid #ffd3383a;
  animation:duckEquippedGlow 2.8s ease-in-out infinite;
}
@keyframes duckEquippedGlow{
  0%,100%{opacity:.35;box-shadow:0 0 0 #ffd33800}
  50%{opacity:1;box-shadow:0 0 28px #ffd33816 inset}
}

/* modal */
.preview-modal.open{animation:duckModalBackdrop .28s ease both}
.preview-modal.open .preview-dialog{animation:duckModalIn .48s var(--ease-spring) both}
@keyframes duckModalBackdrop{from{opacity:0}to{opacity:1}}
@keyframes duckModalIn{
  from{opacity:0;transform:translateY(24px) scale(.94);filter:blur(8px)}
  to{opacity:1;transform:none;filter:none}
}
.preview-close{transition:transform .28s var(--ease-spring),background .25s ease,color .25s ease}
.preview-close:hover{transform:rotate(90deg) scale(1.08);background:#231f0e;color:var(--accent)}

/* auth */
.auth-art::before{
  content:"";
  position:absolute;inset:-4%;
  background:inherit;
  background-position:center;
  background-size:cover;
  animation:duckAuthBg 14s ease-in-out infinite alternate;
}
.auth-art>*{position:relative;z-index:2}
@keyframes duckAuthBg{
  from{transform:scale(1.02) translateX(-1%)}
  to{transform:scale(1.09) translateX(2%)}
}
.auth-panel .field,.auth-panel .turnstile-box,.auth-panel .btn,.auth-panel .split-link{
  transition:transform .3s var(--ease-out),opacity .3s ease;
}
.input{
  transition:border-color .25s ease,box-shadow .25s ease,transform .25s var(--ease-out),background .25s ease;
}
.input:focus{transform:translateY(-1px);background:#141414}
.field:focus-within label{color:var(--accent)}
.field label{transition:color .22s ease,transform .22s ease}
.field:focus-within label{transform:translateX(2px)}

/* sidebar */
.side-nav a{transition:background .25s ease,color .25s ease,transform .28s var(--ease-spring)}
.side-nav a:hover{transform:translateX(5px)}
.side-nav a .ico{transition:transform .28s var(--ease-spring)}
.side-nav a:hover .ico{transform:rotate(-7deg) scale(1.12)}

/* footer */
.footer-rich{position:relative}
.footer-rich::before{
  content:"";
  position:absolute;left:0;right:0;top:-1px;height:1px;
  background:linear-gradient(90deg,transparent,#ffd33855,transparent);
  background-size:35% 100%;
  animation:duckFooterLine 5s linear infinite;
}
@keyframes duckFooterLine{
  from{background-position:-40% 0}
  to{background-position:140% 0}
}
.footer-columns a{transition:color .22s ease,transform .25s var(--ease-out)}
.footer-columns a:hover{transform:translateX(4px)}
.footer-circle{transition:transform .35s var(--ease-spring),border-color .3s ease,box-shadow .3s ease}
.footer-socials a:hover .footer-circle{transform:translateY(-3px) rotate(-6deg);border-color:#5b4b16;box-shadow:0 0 20px #ffd33814}

/* top scroll progress */
.duck-scroll-progress{
  position:fixed;left:0;top:0;z-index:9999;
  height:2px;width:100%;
  transform:scaleX(0);
  transform-origin:left center;
  background:linear-gradient(90deg,#ffbe00,#fff08b,#ffd338);
  box-shadow:0 0 14px #ffd33888;
  pointer-events:none;
}

/* ambient tiny stars */
.duck-particle-field{
  position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;
}
.duck-particle{
  position:absolute;width:2px;height:2px;border-radius:50%;
  background:#ffd338;
  opacity:.18;
  animation:duckParticleRise var(--p-duration,12s) linear infinite;
  animation-delay:var(--p-delay,0s);
}
@keyframes duckParticleRise{
  0%{transform:translate3d(0,12vh,0) scale(.6);opacity:0}
  15%{opacity:.16}
  80%{opacity:.08}
  100%{transform:translate3d(var(--p-drift,15px),-112vh,0) scale(1.2);opacity:0}
}

/* Reduced motion accessibility */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
  .duck-particle-field{display:none}
  .duck-reveal{opacity:1!important;transform:none!important;filter:none!important}
}


/* Real player cosmetics preview pack */
.cos-model.player-preview-button{height:218px;padding:0;border:0;background:transparent;display:block;position:relative;overflow:visible}
.player-preview-frame{display:block;position:absolute;inset:0;border-radius:22px;overflow:hidden;background:#1a1b1e;border:1px solid #ffffff0b;box-shadow:inset 0 0 40px #0004,0 18px 36px #0007;transition:transform .32s cubic-bezier(.2,1.2,.3,1),border-color .3s ease,box-shadow .3s ease}
.player-preview-frame::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#ffffff05,transparent 40%,#0002);border-radius:inherit}
.player-preview-img{display:block;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;transition:transform .45s cubic-bezier(.16,1,.3,1),filter .35s ease}
.cos-tile:hover .player-preview-frame{transform:translateY(-5px) scale(1.025);border-color:#ffd33825;box-shadow:inset 0 0 42px #0003,0 24px 50px #000b,0 0 30px #ffd33809}
.cos-tile:hover .player-preview-img{transform:scale(1.035);filter:brightness(1.06)}
.player-preview-dialog{width:min(670px,96vw)}
.player-preview-large{min-height:560px;display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,#352b0b,#111 46%,#090909 78%);padding:22px;overflow:hidden}
.player-preview-large img{display:block;max-width:100%;max-height:70vh;width:auto;height:auto;image-rendering:pixelated;border-radius:18px;box-shadow:0 26px 70px #000a}
@media(max-width:700px){.cos-model.player-preview-button{height:185px}.player-preview-large{min-height:420px;padding:12px}}