@import url("./board-themes.css?v=20261009p");
@import url('./variants/style.css');
@import url('./memes/style.css');
@import url('./fidgets/style.css');

:root{font-family:'Avenir Next','Segoe UI',Arial,sans-serif;color:#f6eedf;background:#10101c;font-synthesis:none;--text:#f6eedf;--muted:#bab2cb;--cream:#ffe4b4;--mint:#afdcd0;--lilac:#c2a4e8;--panel:#241d33;color-scheme:dark}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button,a,input,select{-webkit-tap-highlight-color:transparent}button{border:1px solid transparent;background:none;color:inherit}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid #ffe2a0;outline-offset:4px}button svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}button[hidden],[hidden]{display:none!important}h1,h2,p{margin:0}input,select{color:var(--text);background:#181424;border:1px solid #665273;border-radius:12px;padding:12px;min-width:0}select{cursor:pointer}a{color:var(--cream)}
.site-frame{min-height:100dvh;display:flex;flex-direction:column}.site-header{height:80px;flex-shrink:0;padding:0 clamp(20px,4vw,72px);display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid #c8b5e315;background:#10101cf2;position:relative;z-index:2}.wordmark{display:flex;align-items:center;gap:11px;padding:6px 0;font-weight:600;font-size:18px;letter-spacing:-.3px}.brand-symbol{font-family:Georgia,serif;color:#ffe3b3;font-size:36px;line-height:1}.header-actions{display:flex;align-items:center;gap:8px}.icon-button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #93809b30;border-radius:14px;color:#dcd0eb;transition:background .2s,border-color .2s}.icon-button:hover,.profile-button:hover{background:#a58bc31a;border-color:#b08ac968}.language-button{width:50px;font-size:13px;font-weight:700}.profile-button{display:flex;align-items:center;gap:9px;max-width:210px;padding:8px 13px;min-height:44px;border-radius:14px;font-size:13px;font-weight:600;border:1px solid transparent}.profile-button span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-symbol{font-family:Georgia,serif;color:#e5c5fa;font-size:26px;line-height:1}
.game-app{display:flex;flex-direction:column;flex:1;min-height:0}.wild-home{position:relative;flex:1;min-height:calc(100dvh - 80px);overflow:hidden;background:#10101c;isolation:isolate}.hero-visual{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}.hero-visual img{width:100%;height:100%;object-fit:cover;object-position:center;transform:translate(var(--hero-x,0px),var(--hero-y,0px)) scale(1.025);transition:transform 1.2s ease;animation:art-arrive 1s ease both}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#10101caa 0%,#10101c36 35%,transparent 63%),linear-gradient(0deg,#10101ca6,transparent 23%)}
.home-content{position:relative;max-width:1680px;margin:auto;padding:clamp(40px,6dvh,80px) clamp(24px,5vw,88px) 32px;display:flex;flex-direction:column;min-height:calc(100dvh - 80px);justify-content:center;align-items:flex-start}.intro{width:min(100%,650px);animation:content-arrive .6s ease both}.intro h1{font-size:clamp(64px,6.2vw,94px);font-weight:600;line-height:1.02;letter-spacing:-2.6px;color:#f5e3c3;text-shadow:none}.intro h1 span{display:block}.intro h1 span:last-child{color:#c3a9de;font-size:.9em;letter-spacing:-2px;margin-top:2px}.home-play-actions{display:flex;align-items:center;gap:24px;margin-top:32px}.primary{background:linear-gradient(180deg,#ffdfab,#e9ba78);color:#262031;border:1px solid #ffebc0;border-radius:15px;box-shadow:0 4px 0 #85603b;font-weight:750;padding:12px 20px;min-height:44px;transition:filter .2s,transform .2s}.primary:hover{filter:brightness(1.055)}.primary:active{transform:translateY(2px);box-shadow:0 2px 0 #85603b}.secondary{background:linear-gradient(155deg,#443451,#30263e);border:1px solid #8f6ea155;border-radius:12px;padding:10px 15px;font-weight:600;box-shadow:0 3px 0 #120e1c;transition:background .2s}.secondary:hover{background:#4b385e}.catalogue-button.primary{display:flex;gap:30px;align-items:center;justify-content:space-between;min-width:246px;min-height:54px;border-radius:12px;padding:13px 20px;font-size:16px;font-weight:600;background:#f0d2a2;border:1px solid #ffe9c130;box-shadow:0 3px 12px #07051025;transition:background .2s,transform .2s}.catalogue-button.primary:hover{background:#f8dfb6;filter:none}.catalogue-button.primary:active{transform:translateY(1px);box-shadow:none}.catalogue-button svg{width:20px;height:20px;stroke-width:1.6}.resume-button{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:400;color:#c8bdcf;text-align:left;line-height:1.4;min-height:44px;padding:6px 0}.resume-button span:first-child{font-size:20px;color:#d9c6a5}.resume-button:hover{color:var(--cream)}
.featured{margin-top:44px;width:min(100%,640px);animation:content-arrive .75s .1s ease both}.featured-heading{margin-bottom:14px}.featured-heading h2{font-size:14px;font-weight:500;letter-spacing:0;color:#d4cbdc}.featured-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.featured-card{position:relative;display:flex;flex-direction:column;align-items:center;text-align:left;min-width:0;border:1px solid #b296cd2c;background:#242031b8;backdrop-filter:blur(12px);border-radius:18px;padding:9px 15px 16px;box-shadow:0 8px 24px #07051020;overflow:hidden;transition:transform .25s ease,border-color .25s ease,background .25s ease}.featured-card[data-variant=duck]{--feature-accent:#acd5c9}.featured-card[data-variant=atomic]{--feature-accent:#e5be99}.featured-card[data-variant=spell]{--feature-accent:#c6a2ed}.featured-card[data-variant=corners]{--feature-accent:#cbb8de}.featured-card .mode-card-art{width:100%;aspect-ratio:1;max-height:145px;flex-shrink:0}.featured-copy{display:grid;grid-template-columns:1fr auto;width:100%;gap:6px 8px;margin-top:4px}.featured-copy strong{font-size:16px;font-weight:600;line-height:1.3;color:var(--feature-accent);letter-spacing:0}.featured-copy small{font-size:11px;line-height:1.5;color:#bcb3c8;grid-column:1;max-width:160px}.featured-copy svg{width:16px;height:16px;color:var(--feature-accent);grid-column:2;grid-row:1/3;align-self:center;stroke-width:1.5;opacity:.75}.featured-card:focus-visible{border-color:var(--feature-accent)}.featured-card:active{transform:translateY(1px)}.home-bottom{display:flex;align-items:center;margin-top:22px;font-size:11px;line-height:1.5;color:#aca1bb}
.shell-dialog{width:min(480px,calc(100vw - 28px));padding:24px;max-height:calc(100dvh - 32px);border:1px solid #b493c578;border-radius:25px;background:linear-gradient(145deg,#35283e,#211b2f);color:var(--text);box-shadow:0 10px 0 #090511;overflow:auto}.shell-dialog::backdrop{background:#090610ad;backdrop-filter:blur(8px)}.shell-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:23px}.shell-dialog header h2{font-size:25px;color:var(--cream);line-height:1.2;letter-spacing:-.5px}.shell-dialog header .icon-button{font-size:28px;flex-shrink:0}.shell-form{display:grid;gap:15px}.shell-form label{display:grid;gap:6px;font-size:13px;color:#d6c8e0}.shell-form input,.shell-form select{width:100%;min-height:44px;font-size:15px}.shell-options{display:grid;grid-template-columns:1fr 1fr;gap:13px}.shell-toggle{display:flex!important;align-items:center;justify-content:space-between;gap:20px;padding:10px 0;border-bottom:1px solid #a28bab1c}.shell-toggle input{width:21px;height:21px;min-height:21px;accent-color:#c9a3ed}.shell-form .primary{margin-top:3px;width:100%}.shell-note{font-size:12px;line-height:1.5;color:#bfb2cc}.shell-error{color:#ffc998;font-size:13px;line-height:1.4}.language-options{display:grid;gap:10px}.language-options button{display:flex;justify-content:space-between;align-items:center;min-height:52px}.language-options button[aria-pressed=true]{border-color:#e7c396;color:var(--cream)}.profile-overview{display:flex;align-items:center;gap:18px;padding-bottom:6px}.profile-overview svg{width:70px;height:70px}.profile-overview p{font-size:12px;line-height:1.5;color:#c7b8d3}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:12px 20px;background:#30243e;color:var(--cream);border:1px solid #9c7bb669;border-radius:13px;box-shadow:0 6px 20px #0006;z-index:100;font-size:14px;max-width:calc(100vw - 32px);text-align:center}
.squares,.pieces{position:absolute;inset:0}.square{width:12.5%;height:12.5%;padding:0;transition:none}.square.light{background-color:var(--light,#abd8ca)}.square.dark{background-color:var(--dark,#398388)}.piece{position:absolute}.piece-art{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 3px 1.5px #1f251b42)}.no-shadows .piece-art{filter:none}.eyes{transform-origin:50px 53px;animation:piece-blink 9s infinite}.no-eyes .eyes{display:none}.quiet-eyes .eyes{animation:none}
body.rules-active .site-frame{height:100dvh;min-height:0}body.rules-active .game-app{padding:8px clamp(16px,3vw,48px) 20px;overflow:hidden}body.rules-active .site-header{height:65px}.rules-header h1{font-weight:750;letter-spacing:-.7px}.rules-header p{line-height:1.4}.rules-dialog .primary{color:#262031}.rules-dialog .rules-setup-actions{gap:11px}#rules-scene .rules-card{background:linear-gradient(145deg,#342b44,#201a30)!important}#rules-scene .rules-cards{width:100%}
@media(hover:hover){.featured-card:hover{transform:translateY(-3px);border-color:#bba6cc75;background:#2d283bcf}}
@media(min-width:1000px) and (max-height:820px){.site-header{height:72px}.wild-home,.home-content{min-height:calc(100dvh - 72px)}.home-content{padding-top:32px;padding-bottom:26px}.intro h1{font-size:clamp(64px,6.2vw,82px)}.home-play-actions{margin-top:28px}.featured{margin-top:36px;width:610px}.featured-card .mode-card-art{max-height:130px}.home-bottom{margin-top:20px}}
@media(max-width:1000px){.hero-visual img{object-position:60% center}.hero-shade{background:linear-gradient(90deg,#10101ccb,#10101c88 55%,#10101c28),linear-gradient(0deg,#10101cbb,transparent 70%)}.intro{width:560px;max-width:100%}.intro h1{font-size:76px}.featured{width:590px;max-width:100%}.home-content{padding-top:40px}}
@media(max-width:600px){.site-header{height:64px;padding:0 18px;gap:8px}.wordmark{font-size:14px;gap:7px;letter-spacing:-.2px}.brand-symbol{font-size:29px}.header-actions{gap:5px}.profile-button{width:44px;padding:0;justify-content:center;min-height:44px}.profile-button span:last-child{display:none}.icon-button{width:44px;height:44px;border-radius:11px}.language-button{width:44px;font-size:11px}#fullscreen-button{display:none}.wild-home,.home-content{min-height:calc(100dvh - 64px)}.home-content{padding:40px 22px 28px;justify-content:center}.hero-visual img{object-position:68% center;opacity:.55}.hero-shade{background:linear-gradient(90deg,#10101ca6,#10101c6b),linear-gradient(0deg,#10101c,transparent 100%)}.intro h1{font-size:clamp(46px,14.5vw,64px);letter-spacing:-1.8px;line-height:1.05}.intro h1 span:last-child{letter-spacing:-1.5px;margin-top:2px}.home-play-actions{margin-top:28px;flex-direction:column;align-items:stretch;gap:10px}.catalogue-button.primary{width:100%;min-width:0;min-height:52px;font-size:16px;padding:12px 17px}.resume-button{min-height:44px;font-size:13px}.featured{margin-top:34px;width:100%}.featured-heading{margin-bottom:14px}.featured-heading h2{font-size:14px}.featured-cards{gap:8px}.featured-card{border-radius:14px;padding:4px 9px 12px}.featured-card .mode-card-art{max-height:none;min-height:0}.featured-copy{gap:5px;margin-top:4px;grid-template-columns:1fr}.featured-copy strong{font-size:13px;line-height:1.3;min-height:2.6em;display:flex;align-items:center}.featured-copy small{font-size:10px;line-height:1.45;min-height:4.35em}.featured-copy svg{display:none}.home-bottom{font-size:11px;margin-top:22px;max-width:320px;line-height:1.6}.shell-dialog{padding:20px}.shell-dialog header{margin-bottom:18px}.shell-dialog header h2{font-size:22px}.shell-form{gap:12px}.shell-options{gap:10px}.shell-form label{font-size:12px}body.rules-active .site-header{height:58px}body.rules-active .game-app{padding:5px 13px 12px}.rules-header h1{font-size:21px!important}}
@media(max-width:600px) and (max-height:730px){.home-content{padding-top:24px;padding-bottom:22px}.intro h1{font-size:clamp(44px,13vw,56px)}.home-play-actions{margin-top:22px;gap:8px}.featured{margin-top:24px}.featured-card .mode-card-art{max-height:92px}.catalogue-button.primary{min-height:50px}.home-bottom{display:none}}
@media(max-width:360px){body[data-scene=home] .wordmark{width:44px;justify-content:center}body[data-scene=home] .wordmark [data-copy=brand]{display:none}}
@media(max-height:550px) and (min-width:600px){.site-header{height:58px}.wild-home,.home-content{min-height:calc(100dvh - 58px)}.home-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);align-items:center;padding:24px 32px;gap:28px}.intro{width:100%;min-width:0}.intro h1{font-size:48px;letter-spacing:-1.5px}.home-play-actions{margin-top:24px;flex-wrap:wrap;gap:8px}.catalogue-button.primary{min-width:0;min-height:48px;font-size:15px}.featured{margin-top:0;width:100%}.featured-cards{grid-template-columns:repeat(3,1fr);gap:8px}.featured-card{padding:4px 9px 12px;border-radius:14px}.featured-copy strong{font-size:12px;min-height:2.6em}.featured-copy small{font-size:10px}.featured-copy svg{display:none}.featured-card .mode-card-art{max-height:105px}.home-bottom{display:none}body.rules-active .site-header{height:52px}}
/* A portal banner can leave less than 300px for a landscape game. The board
   toolbar still opens settings; the home header returns through the menu. */
@media(min-width:600px) and (max-height:300px){
 body.rules-active .site-header{display:none}
 body.rules-active .game-app{padding:2px 10px 6px}
}
@keyframes art-arrive{from{opacity:0}to{opacity:1}}@keyframes content-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes piece-blink{0%,43%,45%,100%{transform:scaleY(1)}44%{transform:scaleY(.08)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.hero-visual img{transform:none}.featured-card:hover{transform:none}}
body[data-reduced=true] *,body[data-reduced=true] *::before,body[data-reduced=true] *::after{animation:none!important;transition:none!important}body[data-reduced=true] .hero-visual img,body[data-reduced=true] .featured-card:hover{transform:none}

.shell-toggle input[type=range]{width:150px;height:28px;accent-color:#bda2df;cursor:pointer}.shell-toggle input[type=range]:focus-visible{outline:2px solid #ffe4af;outline-offset:3px}
