/* MosoPlay Games — the 2026 redesign: dark grid, MosoPlay lime, Moderniz display type, slanted (rhombus) buttons.
   Page sections carry their layout as inline styles in content/; the build turns those into /design.css. */
@font-face{font-family:Moderniz;src:url(/fonts/ModernizLatin.otf) format("opentype");font-display:swap}
:root{color-scheme:dark;--base:#0b0c10;--surface:#121318;--surface-raised:#191b22;--glass:#121318;--line:#262933;--line-strong:rgba(140,242,74,.45);--field:#3a3e4a;--text:#f2f4f7;--muted:#b9bcc8;--subtle:#8b8f9c;--accent:#8cf24a;--accent-hover:#c4fb9c;--accent-deep:#1f2a17;--gold:#f6c443;--danger:#ff8a94;--success:#c4fb9c;--radius:16px;--radius-small:8px;--slant:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);--shell:min(1192px,calc(100% - 48px));--display:Moderniz,"Segoe UI",Arial,sans-serif;--condensed:"Barlow Condensed","Arial Narrow","Segoe UI",sans-serif;--body:Barlow,"Segoe UI",system-ui,sans-serif;font-family:var(--body);font-size:18px;line-height:1.55;background:var(--base);color:var(--text);font-synthesis:none}
*{box-sizing:border-box}[hidden]{display:none!important}html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:var(--base);color:var(--text);isolation:isolate;overflow-x:hidden}
/* Backdrop: faint grid + green glow, fixed so every page shares it. */
body::before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(60% 520px at 50% -80px,rgba(140,242,74,.20),transparent 70%) no-repeat,linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) 0 0/48px 48px,var(--base)}
a{color:var(--accent);text-decoration-thickness:.1em;text-underline-offset:.2em}a:hover{color:var(--accent-hover)}
button,input{font:inherit;color:inherit}a,button,input,summary{touch-action:manipulation}button{cursor:pointer}img{max-width:100%;height:auto}iframe{border:0}
h1,h2,h3,p{margin-block-start:0}p{overflow-wrap:anywhere}h1,h2,h3,.display{overflow-wrap:break-word;word-break:normal}
h1,h2,h3,.display{font-family:var(--display);font-weight:400;letter-spacing:.03em;text-transform:uppercase;line-height:1.12}
h1{font-size:clamp(2rem,5vw,3.4rem);margin-bottom:1rem}h2{font-size:clamp(1.5rem,3.5vw,2.4rem);margin-bottom:.9rem}h3{font-size:clamp(1.1rem,2.4vw,1.5rem);margin-bottom:.6rem}
.eyebrow{display:block;margin-bottom:.8rem;color:var(--accent);font-family:var(--condensed);font-weight:700;font-size:16px;letter-spacing:.18em;text-transform:uppercase}
:focus-visible{outline:3px solid var(--accent-hover);outline-offset:4px}
::selection{background:var(--accent);color:var(--base)}
.skip{position:fixed;top:.75rem;left:.75rem;z-index:100;padding:.7rem 1rem;background:var(--accent);color:var(--base);border-radius:var(--radius-small);font-weight:800;transform:translateY(-200%)}.skip:focus{transform:none}
.page.account.signup-page{max-width:780px;padding:64px 24px 88px}.signup-intro{margin-bottom:32px}.signup-page .signup-intro h1{font-size:clamp(24px,4vw,40px);line-height:1.2}.signup-intro>p:last-child{color:var(--muted);max-width:640px}
@media(max-width:760px){.page.account.signup-page{padding:32px 16px 64px}}
.signup-card{max-width:640px;margin-inline:auto}.signup-form{display:grid;gap:20px}.signup-form label{display:block;margin-bottom:8px}.signup-form input{width:100%}.signup-hint{font-size:15px;color:var(--muted);margin:8px 0 0}.signup-form [role=group]>p{font-size:15px}.signup-form #signup-error,.signup-form #recovery-error{color:var(--danger);margin:0}.signup-form>button{justify-self:start}
/* Compact news archive, sharing the site's surfaces and lime controls. */
.news-heading,.news-archive{max-width:1240px;margin-inline:auto;padding-inline:24px}
.news-heading{padding-top:72px;padding-bottom:32px}.news-heading h1{font-size:clamp(26px,7.5vw,62px)}.news-heading>p:last-child{max-width:720px;color:var(--muted);font-size:21px}
.social-discord-copy{min-width:0}.social-discord-title{font-family:var(--display);font-size:clamp(18px,4.5vw,32px);line-height:1.15;overflow-wrap:break-word;word-break:normal}
.news-archive{padding-bottom:88px}.news-filters{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;margin-bottom:24px}
.news-filter-group{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:15px}.news-filter-group>span{color:var(--muted);margin-right:4px}
.news-filter-group button{border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--muted);padding:8px 14px;font:700 15px var(--condensed);min-height:44px}
.news-filter-group button[aria-pressed=true]{border-color:var(--accent);color:var(--accent);background:var(--accent-deep)}
.news-status{color:var(--muted);font-size:15px;margin-bottom:16px}
.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;scroll-margin-top:24px}
.news-card{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:border-color .2s ease,transform .2s ease}
.news-card:hover{border-color:var(--accent);transform:translateY(-3px)}
.news-card-link{height:100%;display:flex;flex-direction:column;color:var(--text);text-decoration:none}.news-card-link:hover{color:var(--text)}
.news-card-media{aspect-ratio:16/8;overflow:hidden;background:var(--base)}.news-card-media img{width:100%;height:100%;object-fit:cover}
.news-card-copy{padding:22px;display:flex;flex:1;flex-direction:column;gap:14px}.news-card-copy h2{font-size:20px;line-height:1.35;margin:0}
.news-card-copy>p{font-size:16px;color:var(--muted);margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.news-card-meta{display:flex;flex-wrap:wrap;gap:6px 12px;color:var(--subtle);font-size:13px}.news-card-meta time{flex-basis:100%}.news-game{color:var(--accent);font-weight:700}
.news-read{margin-top:auto;padding-top:6px;color:var(--accent);font-size:15px;font-weight:700}
.news-pagination{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:24px;margin-top:36px}.news-pagination>a{min-height:44px;padding:8px 24px}.news-pagination>span{font-size:16px;color:var(--muted)}
@media(max-width:1000px){.news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.news-grid{grid-template-columns:minmax(0,1fr)}.news-heading{padding-top:40px;padding-bottom:24px}.news-heading,.news-archive{padding-inline:16px}.news-card-copy{padding:20px}.news-filters{flex-direction:column}}
@media(prefers-reduced-motion:reduce){.news-card{transition:none}.news-card:hover{transform:none}}
/* Header, footer and shared pieces from the design */
header{position:sticky;top:0;z-index:80;width:100%}
.nav a{color:var(--muted);text-decoration:none}
.nav>a{background:linear-gradient(var(--accent),var(--accent)) 0 100%/0 2px no-repeat;transition:background-size .25s ease,color .2s ease}
.nav>a:hover{color:#fff;background-size:100% 2px}
.nav>a[aria-current=page],.sddb[aria-current=page]{color:#fff;border-bottom:2px solid var(--accent)}
.sdd{position:relative}
.sddb{display:inline-flex;align-items:center;gap:6px;padding:8px 0;background:none;border:0;color:var(--muted);font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;transition:color .2s ease,background-color .15s ease}
.sddb:hover,.sdd.open>.sddb{color:#fff}
.sddb svg{transition:transform .2s ease}
.sdd.open>.sddb svg,.sddb[aria-expanded=true] svg{transform:rotate(180deg)}
.sddm{display:none;position:absolute;top:100%;left:-16px;z-index:40;min-width:200px;flex-direction:column;gap:2px;padding:8px;background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:0 0 12px 12px;box-shadow:0 12px 28px rgba(0,0,0,.45)}
.sdd.open>.sddm{display:flex}
@media(min-width:1101px){header .nav .sdd:hover>.sddm,header .nav .sdd:focus-within>.sddm{display:flex}header .nav .sdd:hover>.sddb svg,header .nav .sdd:focus-within>.sddb svg{transform:rotate(180deg)}}
.sddm a{display:flex;align-items:center;padding:10px 14px!important;border:0!important;border-radius:8px;text-transform:none;letter-spacing:.02em;font-family:var(--body);font-size:16px;color:var(--muted);background:none!important;transition:background-color .15s ease,color .15s ease}
.sddm a:hover,.sddm a:focus-visible{background:rgba(140,242,74,.14)!important;color:#fff!important}
.sddm a[aria-current=page]{color:var(--accent)!important;background:rgba(140,242,74,.08)!important}
.fnav{min-width:0}.fnav a{color:var(--muted);text-decoration:none;line-height:1.4;overflow-wrap:break-word;transition:color .15s ease}.fnav a:hover{color:#fff}.fnav a:first-child{color:var(--text);font-weight:700;margin-bottom:2px}
.menu-toggle{display:none;width:44px;height:44px;padding:10.4px;flex-direction:column;gap:4.8px;align-items:stretch;justify-content:center;background:var(--accent);border:0;border-radius:8px;cursor:pointer;flex:none}
.menu-toggle span{display:block;height:2px;background:#111111;border-radius:999px}
.divider{max-width:1240px;margin:0 auto;padding:0 24px;box-sizing:border-box;display:flex;align-items:center;gap:6px}
.divider i{display:block;width:56px;height:8px;background:var(--accent);clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 100%,0 100%)}
.divider i+i{width:24px;opacity:.6}.divider i+i+i{width:12px;opacity:.35}
.divider b{flex:1;height:1px;margin-left:12px;background:var(--line)}
.card-link{text-decoration:none;color:inherit}.card-link:hover .lift{border-color:var(--accent)!important;transform:translateY(-4px)}
.lift{transition:border-color .2s ease,transform .25s cubic-bezier(.2,.7,.2,1),background-color .2s ease}
/* Slanted buttons with the boost hover (a sliding panel plus a light streak) */
.mbtn,.button{position:relative;isolation:isolate;overflow:hidden;transition:transform .2s cubic-bezier(.2,.7,.2,1),color .25s ease}
.mbtn::before,.button::before{content:"";position:absolute;top:0;bottom:0;left:-25%;width:150%;z-index:-1;transform:translateX(-105%) skewX(-22deg);transition:transform .42s cubic-bezier(.2,.7,.2,1)}
.mbtn::after,.button::after{content:"";position:absolute;top:0;bottom:0;left:-45%;width:28%;z-index:-1;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);opacity:0}
.mbtn:hover,.mbtn:focus-visible,.button:not(:disabled):hover,.button:not(:disabled):focus-visible{transform:translateX(3px)}
.mbtn:hover::before,.mbtn:focus-visible::before,.button:not(:disabled):hover::before,.button:not(:disabled):focus-visible::before{transform:translateX(0) skewX(-22deg)}
.mbtn:hover::after,.mbtn:focus-visible::after,.button:not(:disabled):hover::after,.button:not(:disabled):focus-visible::after{animation:mboost .65s cubic-bezier(.3,.6,.3,1)}
.mbtn:active,.button:not(:disabled):active{transform:translateX(3px) scale(.96)}
@keyframes mboost{0%{left:-45%;opacity:1}100%{left:125%;opacity:1}}
.mbtn-p,a.mbtn-p,a.mbtn-p:hover,.button--primary,a.button--primary:hover{background:var(--accent);color:var(--base)}.mbtn-p::before,.button--primary::before{background:var(--accent-hover)}
.mbtn-s,a.mbtn-s,.button:not(.button--primary),a.button:not(.button--primary){background:#262933;color:#fff}.mbtn-s::before,.button:not(.button--primary)::before{background:var(--accent)}
.mbtn-s:hover,.mbtn-s:focus-visible,a.mbtn-s:hover,.button:not(:disabled):hover,a.button:hover{color:var(--base)}
.mbtn-d,a.mbtn-d,a.mbtn-d:hover{background:var(--base);color:#fff}.mbtn-d::before{background:#262933}
.environment{font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;background:rgba(246,196,67,.12);color:var(--gold);text-align:center;padding:.3rem}
main{min-height:65vh}
/* Layout primitives */
.page{width:var(--shell);margin:0 auto;padding:4rem 0}.page>h1{text-align:center;margin-bottom:2.6rem}.page-eyebrow{text-align:center}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:0 26px;border:0;clip-path:var(--slant);font-family:var(--body);font-weight:700;font-size:16px;letter-spacing:normal;text-transform:none;text-decoration:none;cursor:pointer}
.button:disabled,.button[aria-disabled=true]{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.button--small,.button--sm,.mbtn-sm{min-height:40px;padding:0 18px;font-size:15px;font-weight:600}
.card{padding:28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.card--glow{border-color:var(--line-strong)}
/* Store */
.store-intro{max-width:44rem;margin:0 auto 2.4rem;text-align:center;color:var(--muted)}
.store-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.3rem}.pack{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.4rem}.pack h2{font-size:1.1rem;margin:0}.pack-amount{font-family:var(--display);font-size:2.4rem;color:var(--accent)}.pack-amount small{display:block;font-size:.7rem;letter-spacing:.2em;color:var(--muted)}.pack-price{font-size:1.1rem;margin:.2rem 0 .8rem}.pack-bonus{color:var(--gold);font-size:.85rem;min-height:1.3em}.pack .button{width:100%}
.store-gate{text-align:center;margin:2rem auto 0;padding:1.3rem;max-width:34rem}.store-gate p{margin:0 0 .9rem;color:var(--muted)}
.buy{max-width:64rem;margin:0 auto 2rem;display:grid;gap:1rem}.buy-label{font-family:var(--display);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.buy-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}.buy-currency{display:flex;align-items:center;gap:.5rem;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.buy-currency select{min-height:2.4rem;padding:.3rem .6rem;background:var(--base);color:var(--text);border:1px solid var(--line);border-radius:var(--radius-small)}.buy-creator{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.buy-creator input{flex:1;min-width:10rem;min-height:2.4rem;padding:.3rem .6rem;background:var(--base);color:var(--text);border:1px solid var(--line);border-radius:var(--radius-small);text-transform:none;letter-spacing:normal}.buy-error{margin:0;color:var(--danger);font-weight:600}.buy-note{margin:0;color:var(--muted);font-size:.85rem}.buy-deal{color:var(--gold)}.buy-readout{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem}.buy-bux{text-align:left}@media(min-width:720px){.buy-readout{flex-direction:row;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:nowrap}.buy-spend,.buy-bux{white-space:nowrap}.buy-bux{text-align:right}}.buy-spend{font-family:var(--display);font-size:clamp(2rem,6vw,3.2rem)}.buy-rate{display:block;color:var(--gold);font-size:.85rem}
.buy input[type=range]{--fill:0%;width:100%;height:2.6rem;margin:0;background:transparent;-webkit-appearance:none;appearance:none}.buy input[type=range]::-webkit-slider-runnable-track{height:.5rem;border-radius:999px;background:linear-gradient(90deg,var(--accent) var(--fill),rgba(255,255,255,.12) var(--fill))}.buy input[type=range]::-moz-range-track{height:.5rem;border-radius:999px;background:rgba(255,255,255,.12)}.buy input[type=range]::-moz-range-progress{height:.5rem;border-radius:999px;background:var(--accent)}.buy input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:1.6rem;height:1.6rem;margin-top:-.55rem;border-radius:50%;background:var(--accent);border:3px solid var(--base);box-shadow:0 0 0 2px var(--accent),0 0 18px rgba(101,222,20,.5)}.buy input[type=range]::-moz-range-thumb{width:1.3rem;height:1.3rem;border-radius:50%;background:var(--accent);border:3px solid var(--base);box-shadow:0 0 0 2px var(--accent)}
.buy-ticks{display:flex;justify-content:space-between;font-size:.7rem;letter-spacing:.1em;color:var(--muted);margin-top:-.6rem}
.rate-table{width:min(64rem,100%);margin:0 auto 2rem;border-collapse:collapse;font-size:.95rem}.rate-table caption{display:table-caption;margin-bottom:.6rem}.rate-table th,.rate-table td{padding:.6rem .8rem;border-bottom:1px solid var(--line);text-align:left}.rate-table th{font-family:var(--display);font-size:.7rem;letter-spacing:.12em;color:var(--muted)}
/* Account (/account): two-column sign-in, then a sidebar beside one section at a time (account.js shows the current tab). */
.page.account{width:auto;max-width:1240px;padding:40px 24px 96px}
.account-status{margin:0 0 1rem;padding:.7rem 0;color:var(--gold);text-align:center}.account-status:empty{display:none}
.account-signin{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:56px;align-items:center;padding:48px 0 24px}
.account-intro{display:flex;flex-direction:column;gap:16px}.account-intro>*{margin:0}.account-intro h1{font-size:clamp(34px,4vw,54px);line-height:1.05}.account-intro p{font-size:20px;color:var(--muted)}
.account-card form{display:flex;flex-direction:column;padding:36px;background:var(--surface);border:1px solid var(--line);border-radius:20px}
.account-card h2{margin:0 0 6px;font-size:26px}.account-card form>p{margin:6px 0 0;color:var(--muted)}.account-card form>.button{margin-top:22px;min-height:52px}
/* The code step is a single centred card, as in the design. */
#signed-out:has(#code-form:not([hidden])){grid-template-columns:minmax(0,460px);justify-content:center}#signed-out:has(#code-form:not([hidden])) .account-intro{display:none}
#code{min-height:56px;font-size:24px;letter-spacing:.4em;text-align:center}
.link-button{align-self:center;min-height:44px;margin-top:8px;padding:0 8px;border:0;background:transparent;color:var(--accent);font-size:16px;font-weight:600}.link-button:hover{color:var(--accent-hover)}
.account-help{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:16px;font-weight:600}.account-card form>.account-help{margin-top:10px}.account-help a{display:inline-flex;align-items:center;min-height:44px;color:var(--muted);text-decoration:none}.account-help a:hover{color:#fff}.account-help a[href="/signup"],.account-help a[href="/fr/signup"],.account-help a[href="/account"],.account-help a[href="/fr/account"]{color:var(--accent)}
.account label{display:block;margin:16px 0 6px;font-size:16px;font-weight:600;color:var(--text)}
.account input:not([type=range]),.account select{display:block;width:100%;min-height:52px;padding:0 16px;background:var(--base);border:1px solid var(--field);border-radius:var(--radius-small);color:#fff;font:inherit;line-height:1.3}.account input:focus,.account select:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 2px rgba(140,242,74,.2)}
.account form>.button{margin-top:16px}
#signed-out form>.button,.account-signin form>.button{align-self:stretch}
#recovery-form [role=group],#signup-form [role=group]{margin-top:16px}
#recovery-security-label,#signup-security-label{margin:0 0 6px;font-size:16px;font-weight:600;color:var(--text)}
#recovery-security-status,#signup-security-status{font-size:14px;color:var(--muted);margin:8px 0 0}
#recovery-error,#signup-error{color:var(--danger);margin:12px 0 0;font-size:15px}
#recovery-sent,#signup-sent{display:flex;flex-direction:column;gap:16px;padding:36px;background:var(--surface);border:1px solid var(--line);border-radius:20px}
#recovery-sent[hidden],#signup-sent[hidden]{display:none!important}
#recovery-sent h2,#signup-sent h2{margin:0;font-size:26px}
#recovery-sent p,#signup-sent p{margin:0;color:var(--muted);font-size:16px}
#recovery-sent>.button,#signup-sent>.button{align-self:stretch;margin-top:8px}
.signup-hint a{color:var(--accent);text-decoration:none}.signup-hint a:hover{color:#fff}
form>.signup-hint:last-child{margin-top:16px}
/* Signed in: sidebar (avatar chip, section nav, sign out) + the current section. */
.account-shell{display:grid;grid-template-columns:minmax(220px,260px) minmax(0,1fr);gap:40px;align-items:start}
.account-side{grid-row:1;grid-column:1;display:flex;flex-direction:column;gap:20px}
.account-shell>section{grid-row:1;grid-column:2;min-width:0;display:flex;flex-direction:column;gap:24px}
.account-chip{display:flex;align-items:center;gap:12px;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:14px}.account-chip>div{min-width:0}
.account-avatar{display:flex;align-items:center;justify-content:center;flex:none;width:48px;height:48px;border-radius:12px;background:var(--accent);color:var(--base)}
.account-chip-name{margin:0;font-family:var(--body);font-size:18px;font-weight:700;letter-spacing:normal;line-height:1.3;text-transform:none}.account-chip-sub{display:block;color:var(--subtle);font-size:15px}
.account-tabs{display:flex;flex-direction:column;gap:2px}
.account-tabs a,.account-signout{display:flex;align-items:center;min-height:44px;padding:0 16px;border-radius:8px;color:var(--muted);text-decoration:none;font-size:17px}
.account-tabs a:hover,.account-signout:hover{background:var(--surface-raised);color:#fff}
.account-tabs a[aria-current=true]{background:var(--accent-deep);color:var(--accent);font-weight:700}
.account-signout{width:100%;margin-top:12px;border:1px solid var(--field);background:transparent;text-align:left}.account-signout:disabled{opacity:.6;cursor:wait}
.account-head{display:flex;flex-direction:column;gap:6px}.account-head>*{margin:0}.account-head h2{font-size:clamp(28px,3.4vw,40px);line-height:1.1}.account-head p{max-width:680px;color:var(--muted)}
.account-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:20px}
.account-box{display:flex;flex-direction:column;min-width:0;gap:14px;padding:28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}.account-box>*,.account-box p{margin:0}
.account-box h3,.account-subbox h4{margin:0;font-family:var(--body);font-size:20px;font-weight:700;letter-spacing:normal;text-transform:none}
.account-box .account-title{font-family:var(--display);font-size:24px;font-weight:400;text-transform:uppercase}
.account-box--row{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 20px}.account-box--row>div{display:flex;flex-direction:column;gap:6px;max-width:640px}
.account-box--lime{background:var(--accent-deep);border-color:#3d5a22;color:var(--success)}.account-box--creator{border-color:var(--accent)}
.account-box--danger{background:#1a1012;border-color:#5a2a2f}.account-box--danger .data-row p{color:#d9b3b7}
.account-label{font-family:var(--condensed);font-size:15px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--subtle)}.account-box--lime .account-label{color:var(--success)}
.account-box .muted,.account-box p{font-size:16px}
.account-box .account-bux{font-family:var(--display);font-size:clamp(22px,4.5vw,34px);line-height:1.15;color:var(--accent);white-space:nowrap;overflow-wrap:normal;word-break:normal}.account-bux small{margin-left:.35em;font-size:.34em;letter-spacing:.14em;color:var(--success);vertical-align:baseline}
.account-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 20px;font-size:16px}.account-facts dt{color:var(--subtle)}.account-facts dd{margin:0;font-weight:600;overflow-wrap:anywhere}.account-facts .button{margin-left:.5rem;min-height:36px;padding:0 16px;font-size:14px}
.pill{display:inline-block;padding:2px 14px;clip-path:var(--slant);background:var(--accent-deep);color:var(--accent);font-size:14px;font-weight:700}.pill:empty{display:none}.pill--off{background:#2a1a1c;color:var(--danger)}
#account-continue{align-self:flex-start}
.account-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:16px}.account-links a{display:flex;flex-direction:column;gap:4px;padding:20px;border:1px solid var(--line);border-radius:14px;color:inherit;text-decoration:none;transition:border-color .2s ease}.account-links a:hover{border-color:var(--accent)}.account-links span{color:var(--subtle);font-size:15px}
#overview .account-cols{align-items:stretch}#overview .account-facts{gap:14px 20px;font-size:17px}
.account-box .account-code{max-width:100%;padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius-small);background:var(--base);color:var(--text);font-family:var(--body);font-size:clamp(20px,2.5vw,28px);font-weight:700;line-height:1.3;letter-spacing:.03em;white-space:nowrap;overflow-x:auto;overflow-y:hidden}.account-code:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.account-box .account-owed{font-family:var(--display);font-size:clamp(22px,2.5vw,36px);line-height:1.15;color:var(--accent);overflow-wrap:anywhere}
.account-box #copy-partner-code{align-self:flex-start}.account-box .copy-status{color:var(--success);font-size:15px}.account-box .copy-status.is-error{color:var(--danger)}.copy-status:empty{display:none}
.account-note{margin:0;padding:16px 20px;background:var(--surface);border:1px solid var(--line);border-radius:12px;color:var(--muted);font-size:16px}
.list-title{margin:8px 0 -12px;font-family:var(--condensed);font-size:18px;font-weight:700;letter-spacing:.14em;color:var(--subtle)}
.account-subbox{display:flex;flex-direction:column;padding:20px;border:1px solid var(--line);border-radius:12px}.account-subbox--danger{border-color:#5a2a2f}.account-subbox h4{margin-bottom:6px}.account-subbox p{margin:0;font-size:15px}.account-subbox>.button{align-self:flex-start;margin-top:16px}
.profile-form{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.profile-form #displayName{width:100%}.profile-form h3,.profile-form p{margin:0}.account .profile-mailing-choice{display:flex;align-items:center;gap:10px;margin:0;cursor:pointer}.account .profile-mailing-choice input[type=checkbox]{flex:none;width:18px;height:18px;min-height:0;padding:0;margin:0;accent-color:var(--accent)}.profile-mailing-choice span{line-height:1.4}
.profile-heading{display:flex;width:100%;flex-wrap:wrap;align-items:baseline;gap:6px 14px}.account .profile-heading label{margin:0}.profile-heading p{flex:1 1 280px}.account-mailing{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding-top:20px;border-top:1px solid var(--line)}.account-mailing p{margin:0}
.profile-input-row{display:flex;width:100%;align-items:stretch;gap:12px}.profile-input-row #displayName{flex:1 1 auto;width:auto;min-width:0}.profile-input-row .button{flex:none;min-height:52px}
.inline-form,.account-box.inline-form{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px;align-items:end}.inline-form label{flex:1 1 100%;margin:0 0 -6px}.inline-form input:not([type=range]){flex:1 1 260px;width:auto;min-width:0}.account .inline-form .button{flex:none;margin:0;min-height:52px}
.field-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:0 16px}.field-grid label{margin-top:0}
.account form>.button,.account-box>form>.button{align-self:flex-start}
/* Two-factor: badge and setup steps follow which panel account.js shows. */
.tf-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
#security:has(#two-factor-on:not([hidden])) .pill--off,#security:has(#two-factor-on[hidden]) .pill--on,#security:has(#two-factor-on:not([hidden])) .tf-steps{display:none}
.tf-steps{display:flex;flex-wrap:wrap;gap:8px;padding:0;list-style:none}.tf-steps li{padding:6px 14px;clip-path:var(--slant);background:var(--surface-raised);color:var(--subtle);font-size:15px;font-weight:600}.tf-steps b{margin-right:.6em}
#security:has(#two-factor-off:not([hidden])) .tf-steps li:first-child,#security:has(#two-factor-setup:not([hidden])) .tf-steps li+li{background:var(--accent);color:var(--base)}#security:has(#two-factor-setup:not([hidden])) .tf-steps li:first-child{background:var(--accent-deep);color:var(--accent)}
.tf-scan{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start}.tf-scan>div:last-child{flex:1 1 280px;display:flex;flex-direction:column;gap:14px}.tf-scan summary{cursor:pointer;color:var(--accent);font-size:16px;font-weight:600}.tf-scan details .secret{margin-top:8px}
.account-cols.two-factor-actions{display:flex;gap:16px;align-items:stretch;justify-content:flex-start}.two-factor-actions>.account-subbox{flex:1 1 0;width:0;min-width:0;max-width:none;margin:0}@media(max-width:760px){.account-cols.two-factor-actions{flex-direction:column}.two-factor-actions>.account-subbox{flex:auto;width:100%}}
.two-factor-qr{flex:none;width:180px;max-width:100%;padding:8px;background:#fff;border-radius:12px;color:var(--base)}.two-factor-qr:empty{display:none}.two-factor-qr svg{display:block;width:100%;height:auto}.secret{display:block;padding:.6rem;background:var(--base);border-radius:var(--radius-small);overflow-wrap:anywhere;font-size:.9rem}
.tf-codes{margin-top:20px;padding:20px;background:#2a2410;border:1px solid #6b5a1c;border-radius:12px}.tf-codes p{margin:0 0 12px;color:var(--gold);font-weight:700}
.backup-codes{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin:12px 0 0;padding:0;list-style:none;font-family:ui-monospace,Consolas,monospace;font-size:17px}.backup-codes li{padding:6px 10px;background:var(--base);border:1px solid var(--line);border-radius:var(--radius-small);text-align:center}.backup-codes:empty{display:none}.tf-codes .backup-codes{margin:0}.tf-codes .backup-codes li{padding:0;background:none;border:0;text-align:left}
.form-status{min-height:1.4em;margin:0;color:var(--success)}.form-status.is-error{color:var(--danger)}.form-status:empty{display:none}
.button--danger{background:#2a1a1c;color:var(--danger)}.button--danger::before{background:var(--danger)}
.button--alarm{background:var(--danger);color:var(--base)}.button--alarm::before{background:#ffc2c8}
.badge{display:inline-block;padding:.15rem .55rem;border-radius:999px;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line)}.badge--ok{color:var(--success);border-color:rgba(123,242,167,.5)}.badge--warn{color:var(--gold);border-color:rgba(246,196,67,.5)}
.account-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.25rem;align-items:center}.account-box .account-actions{margin-top:4px}.muted{color:var(--muted)}
/* Lists account.js fills (items, friends, trades, devices, activity). */
.item-filters{display:grid;gap:10px}.item-filters div{display:flex;flex-wrap:wrap;gap:8px}
.item-filters .button:focus-visible{color:var(--base);outline:none;filter:drop-shadow(0 0 4px #fff)}
#item-groups h3{margin:0 0 14px;font-family:var(--condensed);font-size:18px;font-weight:700;letter-spacing:.14em;color:var(--subtle)}
.item-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;margin:0 0 24px}
.item-card{position:relative;display:flex;flex-direction:column;gap:4px;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:14px;transition:border-color .2s ease}.item-card:hover{border-color:var(--accent)}.item-card strong{padding-right:3.2rem}.item-card .muted{color:var(--subtle);font-size:14px}.item-card .badge{position:absolute;top:12px;right:12px;color:var(--accent)}
.friend-list,.trade-list,.session-list{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
.friend-list li{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-columns:auto;align-items:center;gap:2px 8px;padding:14px 18px;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.friend-list li>strong{grid-row:1;grid-column:1}.friend-list li>span{grid-row:2;grid-column:1;color:var(--subtle);font-size:15px}.friend-list .button{grid-row:1/3;min-height:40px;padding:0 22px;font-size:15px}
.friend-list li.muted,.trade-list li.muted,.session-list li.muted{display:block;padding:14px 18px;background:none;border:1px dashed var(--line);color:var(--subtle);font-size:16px}
.trade-new summary{display:inline-flex;list-style:none}.trade-new summary::-webkit-details-marker{display:none}.trade-new form{gap:20px;margin-top:20px}.trade-new form>.button{min-height:52px}
.trade-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:16px}.trade-grid label{margin-top:0}
.trade-grid fieldset{margin:0;padding:20px;background:var(--base);border:1px solid var(--line);border-radius:14px}
.trade-grid legend{float:left;width:100%;margin-bottom:12px;padding:0;font-family:var(--condensed);font-size:15px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.trade-give legend{color:var(--danger)}.trade-get legend{color:var(--accent)}
.trade-side{clear:both;display:grid;gap:10px}.trade-side:not(:empty){margin-bottom:12px}
.trade-item{display:grid;grid-template-columns:minmax(0,1fr) 5.5rem auto;gap:8px;align-items:center;padding:10px;background:var(--surface-raised);border-radius:10px}.account .trade-item input,.account .trade-item select{min-height:44px;padding:0 10px}.trade-item .button{min-height:44px;padding:0 14px;font-size:15px}
.trade-add{width:100%;min-height:44px;border:1px dashed var(--field);border-radius:10px;background:transparent;color:var(--muted);font-size:16px;font-weight:600}.trade-add::before{content:"+ "}.trade-add:hover{border-color:var(--accent);color:#fff}
.trade-card{display:flex;flex-direction:column;gap:10px;padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:14px}.trade-card>strong{font-size:16px}.trade-card>span:not(.muted){padding:12px 14px;background:var(--base);border-radius:10px;font-size:16px;font-weight:600}.trade-card>.muted{color:var(--subtle);font-size:15px}
.trade-card .account-actions{margin:0}.account .trade-card input:not([type=range]){width:16rem;max-width:100%;min-height:44px}.trade-card .button{min-height:44px}
.session-list li{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:2px 16px;padding:18px 20px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.session-list li::before{content:"";grid-row:1/3;width:32px;height:32px;background:var(--muted);-webkit-mask:url(/assets/icons/monitor.svg) center/contain no-repeat;mask:url(/assets/icons/monitor.svg) center/contain no-repeat}.session-list li.muted::before{content:none}
.session-list li>strong{grid-column:2}.session-list li>span{grid-column:2;color:var(--subtle);font-size:15px}.session-list li>.button{grid-column:3;grid-row:1/3;min-height:40px;font-size:15px}
/* The current browser is the one without a Sign out button. */
.session-list li:not(.muted):not(:has(.button)){border:2px solid var(--accent)}.session-list li:not(:has(.button))::before{background:var(--accent)}
.audit-list{display:flex;flex-direction:column;gap:4px;margin:0;padding:0 0 0 4px;list-style:none;border-left:2px solid var(--line)}.audit-list li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;padding:14px 0 14px 24px}.audit-list li .muted{color:var(--subtle);font-size:15px}
.data-row,.account-box--row>.data-row{display:flex;flex-direction:row;gap:18px;align-items:flex-start}.data-row svg{flex:none}.data-row>div{display:flex;flex-direction:column;gap:4px}.data-row p{color:var(--muted)}
@media(max-width:760px){.page.account{padding:24px 16px 64px}.account-signin{gap:32px;padding-top:8px}.account-card form,#recovery-sent,#signup-sent{padding:24px}.account-shell{grid-template-columns:minmax(0,1fr);gap:24px}.account-side,.account-shell>section{grid-row:auto;grid-column:1}.account-tabs{flex-direction:row;flex-wrap:wrap;gap:6px}.account-tabs a,.account-signout{min-height:40px;padding:0 14px;border:1px solid var(--line);font-size:16px}.account-signout{width:auto;margin-top:0;border-color:var(--field)}.account-box{padding:20px}.inline-form .button{width:100%}.friend-list li{display:flex;flex-wrap:wrap;gap:4px 8px}.friend-list li>strong,.friend-list li>span{flex:1 1 100%}}
.kit{max-width:46rem;margin:0 auto 2rem;display:grid;gap:1rem}.kit h2{margin:0}.kit ul{margin:0;padding-left:1.2rem;color:var(--muted)}.kit-price{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap}.kit-price .pack-amount{margin:0}.kit-balance{color:var(--muted);text-align:right}.kit .account-actions{margin-top:0}
dialog.card{width:min(calc(100vw - 32px),32rem);max-width:32rem;color:var(--text)}dialog.card h2,#purchase-result h2{font-size:clamp(24px,4.5vw,32px);line-height:1.15;overflow-wrap:normal;word-break:normal}dialog::backdrop{background:rgba(0,0,0,.7)}
/* The MosoBux icon goes in front of every MosoBux amount. */
.bux::before,#bux-out::before,#rate-out::before,#mosobux-balance::before,#kit-price::before,#kit-balance::before,#kit-buy::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:.25em;vertical-align:-.08em;background:url(/assets/mosobux.svg) center/contain no-repeat}
/* Store and Event LAN Kits use the same left-aligned page header and 1240px column as the other pages. */
.page.store{width:auto;max-width:1240px;padding:80px 24px 96px}
.page.store>.page-eyebrow{text-align:left;margin-bottom:16px}
.page.store>h1{text-align:left;font-size:clamp(26px,4.8vw,62px);line-height:1.08;margin-bottom:16px}
.store .store-intro{max-width:680px;margin:0 0 40px;text-align:left;font-size:21px}
.store .buy,.store .kit,.store .rate-table,.store .store-gate{max-width:none;width:100%;margin-left:0;margin-right:0}
.store .store-gate{text-align:left}.store .rate-table caption{text-align:left}
/* Brand marks: white SVGs in /assets/icons used as masks, so each icon takes the surrounding text colour. */
.brand-icon{display:inline-block;flex:none;background:currentColor;-webkit-mask:var(--brand-icon) center/contain no-repeat;mask:var(--brand-icon) center/contain no-repeat}
.brand-icon--discord{--brand-icon:url(/assets/icons/discord.svg)}.brand-icon--x{--brand-icon:url(/assets/icons/x.svg)}
.brand-icon--linkedin{--brand-icon:url(/assets/icons/linkedin.svg)}.brand-icon--youtube{--brand-icon:url(/assets/icons/youtube.svg)}.brand-icon--tiktok{--brand-icon:url(/assets/icons/tiktok.svg)}.brand-icon--twitch{--brand-icon:url(/assets/icons/twitch.svg)}
/* Footer language menu (built per page by scripts/build.mjs into the footer). */
footer .lang-pick{margin-top:10px;align-self:flex-start;position:relative}
footer .lang-pick .sddb{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-small);color:var(--muted);font-family:var(--body);font-size:14px;font-weight:600;letter-spacing:.02em;text-transform:none;cursor:pointer;transition:border-color .2s,color .2s,background .2s}
footer .lang-pick .sddb:hover,footer .lang-pick:focus-within .sddb{color:#fff;border-color:var(--accent);background:var(--surface-raised)}
footer .lang-pick .sddm{display:none;position:absolute;top:auto;bottom:100%;margin-bottom:8px;left:0;right:auto;z-index:40;min-width:200px;flex-direction:column;padding:8px;background:var(--surface);border:1px solid var(--line);border-bottom:3px solid var(--accent);border-top:1px solid var(--line);border-radius:12px 12px 0 0;box-shadow:0 -12px 28px rgba(0,0,0,.55)}
footer .lang-pick.open .sddm,footer .lang-pick:hover .sddm,footer .lang-pick:focus-within .sddm{display:flex}
.lang-pick .sddm a,.lang-pick .sddm button{display:block;width:100%;text-align:left;color:var(--muted);text-decoration:none;background:none;border:0;padding:10px 14px!important;border-radius:8px;font-family:var(--body);font-size:15px;cursor:pointer;transition:background-color .15s,color .15s}
.lang-pick .sddm a:hover,.lang-pick .sddm button:hover,.lang-pick .sddm [aria-current="true"]{background:var(--accent-deep)!important;color:var(--accent)}

/* Display hero typography with fluid container scaling to avoid character collisions */
.home-hero-col{container-type:inline-size}
.home-hero-title{font-family:Moderniz,sans-serif;font-weight:400;font-size:clamp(26px,min(5.4vw,13cqw),64px);line-height:1.12;letter-spacing:0.01em;text-transform:uppercase;white-space:nowrap;overflow-wrap:normal;word-break:keep-all}
:lang(fr) .home-hero-title,html[lang="fr"] .home-hero-title{font-size:clamp(22px,min(4.8vw,11cqw),56px);line-height:1.12}

.community-section{max-width:1240px;margin:0 auto;padding:0 24px 64px}.community-section>h2{font-size:clamp(22px,4.5vw,36px);margin-bottom:12px}.community-description{color:var(--muted);max-width:680px;margin-bottom:28px}.community-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.community-grid>.card-link{display:flex;flex-direction:column;height:100%}.community-grid>.card-link>.lift{flex:1}.community-card{padding:32px;border:1px solid var(--line);border-radius:20px;background:var(--surface);color:var(--text);display:flex;flex-direction:column;gap:16px;transition:border-color .2s ease,transform .25s cubic-bezier(.2,.7,.2,1),background-color .2s ease}.community-card:hover{border-color:var(--accent);transform:translateY(-4px)}.community-card .brand-icon{width:32px;height:32px}.community-card h3{font-size:clamp(19px,4.2vw,24px);margin:0}.community-card p{margin:0;color:var(--muted)}
@media(max-width:1100px){header>div{min-height:72px;padding:12px clamp(8px,2vw,16px)!important;gap:8px clamp(6px,1.5vw,10px)!important}.menu-toggle{display:flex;order:2;width:40px;height:40px;padding:9.3px;margin-left:0}.account-link{order:1;margin-left:auto;min-height:40px!important;padding:0 clamp(14px,3vw,18px)!important;font-size:11.2px!important;line-height:1!important;flex-shrink:0}header .nav{display:none!important;flex:1 1 100%!important;flex-direction:column;gap:2px!important;order:3;padding-top:12px;border-top:1px solid var(--line);margin-top:8px;max-height:calc(100vh - 80px);overflow-y:auto}header .nav.open{display:flex!important}header .nav>a,header .nav .sddb{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:42px;padding:8px 12px!important;border:0!important;border-radius:8px;background:none;transition:background-color .15s ease,color .15s ease}header .nav>a:hover,header .nav>a:focus-visible,header .nav .sddb:hover,header .nav .sddb:focus-visible,header .nav .sdd.open>.sddb{background:rgba(255,255,255,.06);color:#fff}header .nav>a[aria-current=page],header .nav .sddb[aria-current=page]{color:var(--accent);background:rgba(140,242,74,.1)}header .nav .sddm{position:static;display:none;min-width:0;margin:2px 0 6px 12px;padding:4px 0 4px 12px;border:0;border-left:2px solid var(--line);border-radius:0;box-shadow:none;background:none;gap:2px}header .nav .sdd.open>.sddm{display:flex}header .nav .sddm a{padding:8px 12px!important;border-radius:8px}}
@media(max-width:820px){.page{padding:2.6rem 0}.community-grid{grid-template-columns:minmax(0,1fr)}.footer-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:24px 20px!important;padding:36px 24px!important}.footer-brand{grid-column:1/-1;padding-bottom:20px;border-bottom:1px solid var(--line)}}
@media(max-width:640px){header>div{min-height:72px;padding:12px clamp(8px,2vw,12px)!important;gap:8px clamp(6px,1.5vw,10px)!important}header a[href="/"] span,header a[href="/fr"] span{display:none!important}header a[href="/"] img,header a[href="/fr"] img{width:40px!important;height:40px!important}.page.store{padding:48px 16px 64px}.community-section{padding:0 16px 48px}.community-card{padding:22px}.card{padding:20px}.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px 16px!important;padding:28px 16px 36px!important;font-size:15px!important}.footer-brand{padding-bottom:16px}.footer-grid>.fnav:last-child{grid-column:1/-1;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px!important;padding-top:16px;border-top:1px solid var(--line)}.footer-grid>.fnav:last-child>a:first-child{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.mbtn,.mbtn::before,.button,.button::before,.lift,.nav a{transition:none}.mbtn::after,.button::after{animation:none!important}.mbtn:hover,.button:hover,.card-link:hover .lift{transform:none}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.about-section{opacity:1!important;transform:none!important}}
.header-buy{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 18px;text-decoration:none;font-family:Moderniz,'Segoe UI',Arial,sans-serif;font-size:11.5px;letter-spacing:.025em;line-height:1;text-transform:uppercase;white-space:nowrap;clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%)}
.header-buy img{width:22px;height:22px;flex:none}
@media(max-width:820px){header a[href="/"] span,header a[href="/fr"] span{display:none!important}header a[href="/"] img,header a[href="/fr"] img{width:40px!important;height:40px!important}}
@media(max-width:1100px){.header-buy{order:1;flex:none;margin-left:auto}.account-link{order:2;margin-left:0}.menu-toggle{order:3;margin-left:0}header .nav{order:4}}
@media(max-width:640px){.header-buy{padding:0 14px;white-space:nowrap;line-height:1.15;text-align:center}.account-link{padding-inline:14px!important;white-space:nowrap!important;line-height:1.15!important;text-align:center}}
@media(max-width:520px){.header-buy,.account-link{font-size:8.5px!important;padding-inline:14px!important}.header-buy{gap:4px}.header-buy img{width:18px;height:18px}}
@media(max-width:359px){.header-buy,.account-link{padding-inline:12px!important}.header-buy img{display:none}}
@media(max-width:1100px){header>div[class]{gap:8px clamp(6px,1.5vw,10px)!important;padding:12px clamp(8px,2vw,16px)!important}}
@media(max-width:640px){header>div[class]{padding:12px clamp(8px,2vw,12px)!important}}
@media(min-width:1101px){header>div[class]{gap:16px clamp(12px,1.2vw,20px)!important}header>div[class]>.nav{flex:1 1 0!important;min-width:0;justify-content:flex-start;gap:4px clamp(8px,1vw,14px)!important}}
@media(min-width:1101px) and (max-width:1199px){header>div[class]{gap:16px 10px!important}header>div[class]>.nav{gap:4px 6px!important}}

.buy-code-group{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.buy-code-group .buy-creator{flex:1 1 14rem;min-width:0}
.buy-note.buy-code-error{color:var(--danger);font-weight:600}

.item-character-filter{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.account .item-character-filter label{margin:0}.account .item-character-filter select{width:auto;min-width:200px;max-width:100%;margin:0;appearance:none;padding-right:44px;background-image:linear-gradient(45deg,transparent 50%,#fff 50%),linear-gradient(135deg,#fff 50%,transparent 50%);background-repeat:no-repeat;background-position:right 22px center,right 16px center;background-size:6px 6px}

.account-subbox--danger:hover,.account-subbox--danger:focus-within{background:#1a1012;border-color:#5a2a2f}
.audit-pagination{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px;margin-top:24px}.audit-pagination[hidden]{display:none}

.account-creator-stack{display:grid;gap:16px}.creator-code-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px}.creator-code-row .account-code{margin:0;min-width:0;overflow-wrap:anywhere}

#password-form .field-grid{grid-template-columns:minmax(0,1fr);gap:16px}#two-factor-manage,#two-factor-enable{display:flex;flex-direction:column;align-items:stretch;gap:12px}#two-factor-manage label,#two-factor-enable label{flex:none}#two-factor-manage input,#two-factor-enable input{flex:none;width:100%}#two-factor-enable .button{align-self:flex-start}

@media(max-width:760px){#two-factor-manage .account-actions .button{width:auto}}

#two-factor-confirm{display:flex;flex-direction:column;align-items:stretch;gap:12px}#two-factor-confirm label{flex:none}#two-factor-confirm input{flex:none;width:100%}#two-factor-confirm .button{align-self:flex-start}