:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#edf0f7;background:#101a30;font-synthesis:none;--gold:#ebc986;--mint:#98dfd3;--muted:#a5b3cc;--line:#ffffff16;--panel:#ffffff05;--ink:#101a30;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(ellipse at 85% 12%,#34326455,transparent 54%),linear-gradient(135deg,#101b30,#14213a 65%,#171e38);min-height:100vh}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--mint);outline-offset:4px}button{color:inherit}svg{display:block}button svg{width:19px;height:19px}button{touch-action:manipulation}button:hover:not(:disabled){filter:brightness(1.12)}.ambient{position:fixed;pointer-events:none;border-radius:50%;z-index:-1;filter:blur(80px);opacity:.2}.ambient-one{width:350px;height:350px;background:#6b52bd;right:0;top:40px}.ambient-two{width:280px;height:280px;background:#137c8b;bottom:0;left:-150px}#app{max-width:1376px;padding:34px 64px 26px;margin:0 auto}header{display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:13px;background:none;border:0;padding:0;text-align:left}.brand img{width:46px;height:46px;border-radius:13px;border:1px solid #e9c4813d}.brand b{font-size:17px;letter-spacing:3.2px}.brand small{display:block;color:var(--muted);font-size:10px;letter-spacing:.5px;margin-top:5px}nav{display:flex;align-items:center;gap:14px}.nav-link{background:none;border:0;color:var(--muted);padding:12px 16px;font-size:13px}.nav-link.current{color:var(--gold)}.icon-button{border:1px solid var(--line);background:#ffffff04;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:13px}.platform-pill{font-size:10px;letter-spacing:1px;border:1px solid var(--line);border-radius:50px;padding:8px 12px;color:var(--muted)}main{padding-top:64px}.eyebrow{color:var(--mint);font-size:10px;letter-spacing:2.8px;font-weight:700}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:25px;align-items:center;min-height:350px}.hero h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(48px,5.1vw,72px);line-height:1.06;font-weight:400;letter-spacing:-2.5px;margin:21px 0 22px;color:#f6f0e4}.hero h1 em{font-style:normal;color:var(--gold)}.hero p{font-size:14px;line-height:1.85;color:var(--muted);margin:0}.tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}.tag{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#ffffff04;border-radius:8px;padding:10px 12px;font-size:9px;letter-spacing:1.2px;color:#c7d1e4}.tag svg{width:13px;height:13px;color:var(--gold)}.hero-art{height:350px;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}.orbit{position:absolute;width:318px;height:318px;border:1px solid #e9c48128;border-radius:50%;transform:rotate(-25deg)}.orbit:after{content:'';position:absolute;top:47px;right:40px;width:7px;height:7px;background:var(--gold);box-shadow:0 0 20px #e9c481;border-radius:50%}.orbit.second{width:260px;height:260px;transform:rotate(38deg);border-style:dashed;border-color:#a8abe524}.hero-tile{position:absolute;width:205px;height:205px;background:linear-gradient(135deg,#7082be,#2b3e68);border-radius:42px;transform:rotate(-13deg);border:1px solid #ffffff35;box-shadow:12px 25px 50px #03091766,inset 2px 2px 1px #ffffff12}.hero-piece{width:245px;height:260px;filter:drop-shadow(15px 24px 15px #0005);transform:rotate(4deg);position:relative}.art-caption{position:absolute;bottom:4px;display:flex;gap:9px;align-items:center;font-size:11px;color:#e5e4f3;padding:12px 18px;border-radius:40px;background:#ffffff09;border:1px solid var(--line);backdrop-filter:blur(12px)}.art-caption svg{width:15px;height:15px;color:var(--mint)}.spark{position:absolute;color:#e3d5a6;font-size:19px}.spark.a{top:40px;left:16%}.spark.b{right:9%;bottom:80px;font-size:11px}.section-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:54px 0 20px}.section-heading h2{font-size:23px;font-weight:500;margin:0;letter-spacing:-.5px}.section-heading span{color:var(--muted);font-size:11px}.modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.glass{border:1px solid var(--line);background:linear-gradient(135deg,#ffffff0a,#ffffff03);border-radius:22px;backdrop-filter:blur(16px);box-shadow:0 12px 30px #050c1b12}.mode-card{padding:26px;position:relative;overflow:hidden}.mode-card.featured{border-color:#e9c48138;background:linear-gradient(140deg,#e9c4810d,#ffffff03)}.mode-icon{width:46px;height:46px;display:flex;align-items:center;justify-content:center;background:#a395ea17;color:#bcaaf4;border-radius:14px}.mode-icon svg{width:25px;height:25px}.featured .mode-icon{background:#e9c48117;color:var(--gold)}.card-kicker{position:absolute;top:29px;right:23px;font-size:8px;color:var(--gold);letter-spacing:1.5px}.mode-card h3{font-size:21px;font-weight:500;margin:23px 0 12px;letter-spacing:-.4px}.mode-card p{font-size:12px;color:var(--muted);line-height:1.8;margin:0;min-height:45px}.primary,.secondary{display:inline-flex;justify-content:center;align-items:center;gap:10px;border-radius:12px;min-height:48px;padding:12px 20px;font-size:12px;font-weight:600;text-decoration:none}.primary{border:1px solid transparent;background:linear-gradient(135deg,#f0d39b,#dfb66e);color:#182238;box-shadow:0 6px 20px #caaa6412}.secondary{background:#ffffff02;border:1px solid #91a4cb42}.mode-card button{width:100%;margin-top:26px}.mode-card button svg{width:15px;height:15px}.text-button{display:inline-flex;align-items:center;gap:8px;border:0;background:none;color:var(--gold);padding:10px 0;font-size:12px;min-height:42px}.text-button svg{width:16px;height:16px}.invitation{display:flex;align-items:center;gap:16px;margin-top:20px;font-size:12px;color:var(--muted)}.home-note{margin-top:29px;display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding-top:24px;color:#93a5c0;font-size:11px}.home-note svg{width:17px;height:17px;color:var(--mint)}footer{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:48px;padding-top:20px;border-top:1px solid #ffffff08;font-size:9px;letter-spacing:1.5px;color:#74849e}.server-state{display:flex;align-items:center;gap:7px;font-size:10px;letter-spacing:.3px;color:var(--mint)}.dot{width:5px;height:5px;background:var(--mint);border-radius:50%}.server-state.offline{color:var(--gold)}.offline .dot{background:var(--gold)}.error-banner{background:#69364555;border:1px solid #db89953b;padding:14px 18px;border-radius:12px;display:flex;align-items:center;gap:12px;font-size:13px;line-height:1.5;margin-top:24px}.error-banner button{margin-left:auto;flex-shrink:0;width:32px;height:32px;background:none;border:0}.match{padding-top:32px}.back-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.back-row small{color:var(--muted);font-size:10px;letter-spacing:1.3px}.match-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(290px,1fr);gap:30px;align-items:start;max-width:1100px;margin:0 auto}.board-column{min-width:0}.player-card{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:15px;min-height:63px}.avatar{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#d9cfb6;color:#283750}.avatar.black{background:#344767;color:#d9cfb6}.avatar svg{width:21px;height:21px}.player-card b{font-size:12px;font-weight:600}.player-card small{font-size:10px;display:block;color:var(--muted);margin-top:4px}.player-card small.inherited{color:var(--gold)}.turn-pill{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--mint);font-size:8px;letter-spacing:1.2px}.board-frame{padding:9px;background:linear-gradient(145deg,#3d5271,#202f4d);border:1px solid #dfc79466;border-radius:17px;box-shadow:0 18px 35px #030a1b66;margin:15px 0;position:relative}.board-grid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));border-radius:9px;overflow:hidden;aspect-ratio:1;touch-action:manipulation}.board-row{display:contents}.cell{aspect-ratio:1;min-width:0;min-height:0;position:relative}.square{display:flex;justify-content:center;align-items:center;position:relative;border:0;border-radius:0;margin:0;padding:3px;width:100%;height:100%;background:#e5e6e7;color:#293c58;transition:background .12s}.square.dark{background:#8a9dbb}.square.last{background:#e7d7ae}.square.dark.last{background:#acae9f}.square.selected{background:#e8c57b;box-shadow:inset 0 0 0 3px #7a6b4c88}.square:hover{filter:none!important;box-shadow:inset 0 0 0 2px #fff9}.square:focus-visible{outline:3px solid #148782;outline-offset:-3px;z-index:2}.square .piece{width:96%;height:96%;pointer-events:none;filter:drop-shadow(1px 2px 1px #0002);transition:transform .14s}.square.selected .piece{transform:translateY(-2px) scale(1.04)}.file,.rank{position:absolute;font-size:9px;font-weight:650;z-index:2;line-height:1}.file{right:3px;bottom:2px}.rank{left:3px;top:3px}.move-dot{position:absolute;width:18%;height:18%;background:#24465d77;border-radius:50%;pointer-events:none}.capture-ring{position:absolute;inset:3px;border:3px solid #ad596c;border-radius:50%;pointer-events:none}.square.inheriting{animation:inherit 1.5s ease-out}.board-hint{min-height:29px;font-size:11px;line-height:1.6;color:var(--mint);margin:12px 4px 0}.match-panel{padding:25px}.panel-head{display:flex;align-items:center;justify-content:space-between}.panel-head .eyebrow{font-size:9px;letter-spacing:2px}.connection{display:flex;align-items:center;gap:6px;color:var(--mint);font-size:9px}.connection svg{width:14px;height:14px}.connection.offline{color:var(--gold)}.match-panel h2{font-family:Georgia,serif;font-size:29px;font-weight:400;line-height:1.25;margin:20px 0 8px}.match-meta{font-size:11px;color:var(--muted);line-height:1.7}.room-block{margin-top:24px;background:#ffffff03;border:1px solid var(--line);border-radius:12px;padding:13px 15px}.room-block small{color:var(--muted);font-size:8px;letter-spacing:2px}.room-code{display:flex;align-items:center;justify-content:space-between;gap:12px}.room-code b{font-size:25px;letter-spacing:6px;color:var(--gold);font-weight:500;margin-top:6px}.room-code .icon-button{border:0;width:32px;height:32px}.room-code svg{width:15px;height:15px}.journal-head{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:25px;padding-top:23px}.journal-head h3{font-size:14px;font-weight:500;margin:0}.journal-head small{font-size:9px;color:var(--muted)}.journal{height:230px;overflow:auto;padding:13px 0 6px;scrollbar-width:thin;scrollbar-color:#66769333 transparent}.journal-empty{padding:30px 0;line-height:1.8;font-size:12px;color:#8596b2}.move-row{display:grid;grid-template-columns:24px 1fr 1fr;gap:8px;padding:10px 7px;border-radius:5px;font-size:11px;min-height:32px}.move-row:nth-child(even){background:#ffffff03}.move-row small{color:#8091ad;font-size:10px}.move-row span{white-space:nowrap}.panel-actions{display:flex;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:12px;margin-top:10px}.panel-actions .text-button{font-size:10px}.danger{color:#e1a1ab}.draw-offer{font-size:11px;line-height:1.8;color:var(--gold);padding:10px 0}.result-banner{margin-top:18px;display:flex;flex-direction:column;gap:12px}.tiny-note{color:#71839f;font-size:10px;line-height:1.7;margin-top:18px}.loading-screen{min-height:70vh;display:grid;place-content:center;text-align:center;gap:20px;color:var(--gold)}.loading-screen img{margin:auto}dialog{width:min(520px,calc(100% - 32px));max-height:85vh;overflow:auto;border:1px solid #7184ae55;border-radius:22px;padding:30px;background:linear-gradient(135deg,#293653,#1d2a43);color:#edf0f7;box-shadow:0 30px 80px #0008}dialog::backdrop{background:#060d20aa;backdrop-filter:blur(8px)}dialog h2{font-family:Georgia,serif;font-size:28px;font-weight:400;margin:0 0 20px}dialog p,dialog li{font-size:13px;color:#bec9dd;line-height:1.8}dialog b{color:var(--gold)}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}dialog label{font-size:12px;color:var(--muted)}dialog input[type=text]{display:block;margin-top:10px;width:100%;padding:16px;border:1px solid #ffffff25;background:#101c33;border-radius:10px;color:var(--gold);font-size:24px;letter-spacing:5px;text-transform:uppercase}dialog input[type=checkbox]{width:22px;height:22px;accent-color:#e9c481}.setting{display:flex;align-items:center;gap:18px;cursor:pointer;line-height:1.6}.setting strong{display:block;color:#edf0f7;font-size:14px;font-weight:500}.setting small{font-size:11px}.promotion-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.promotion-choices button{background:#ffffff08;border:1px solid #ffffff20;border-radius:12px;padding:12px 5px;font-size:10px;text-transform:capitalize}.promotion-choices svg{width:70px;max-width:100%;height:75px;margin:auto}.confirm-move{display:flex;align-items:center;justify-content:center;font-size:35px;gap:18px;padding:20px 0;color:var(--gold);letter-spacing:1px}.confirm-move svg{width:72px;height:80px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;background:#34466a;border:1px solid #ffffff25;border-radius:12px;padding:12px 22px;font-size:12px;z-index:5;box-shadow:0 12px 40px #0006;max-width:90vw;line-height:1.6}.toast.visible{opacity:1;transform:translate(-50%,0)}body.reduced .glass{background:#202e48;backdrop-filter:none}body.reduced dialog::backdrop{backdrop-filter:none}body.reduced *,body.reduced *:before,body.reduced *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.spinner{width:14px;height:14px;border:2px solid #ffffff25;border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}@keyframes inherit{0%{box-shadow:inset 0 0 35px #fae6aa}100%{box-shadow:inset 0 0 0 transparent}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(min-width:1550px){#app{padding-top:45px}.hero{min-height:410px}.hero-art{height:390px}.section-heading{margin-top:60px}}@media(max-width:1000px){#app{padding:28px 34px}.hero h1{font-size:58px}.hero-art{transform:scale(.9);transform-origin:center}.mode-card{padding:22px}.match-layout{gap:22px;grid-template-columns:minmax(0,1.5fr) minmax(270px,1fr)}.match-panel{padding:22px}.platform-pill{display:none}.journal{height:180px}}@media(max-width:760px){#app{padding:22px 20px}.brand b{font-size:15px;letter-spacing:2px}.brand small{font-size:9px}.brand img{width:40px;height:42px}.nav-link{display:none}nav{gap:8px}.icon-button{width:40px;height:40px;border-radius:11px}main{padding-top:43px}.hero{grid-template-columns:1fr;gap:6px}.hero h1{font-size:52px;letter-spacing:-1.8px;margin-top:17px}.hero p{font-size:13px}.hero-art{height:245px;transform:scale(.8);margin:-12px 0 -16px}.section-heading{margin:30px 0 18px}.section-heading span{display:none}.modes{grid-template-columns:1fr}.mode-card{padding:23px}.mode-card p{min-height:auto}.mode-card h3{margin-top:18px}.mode-card button{margin-top:22px}.card-kicker{top:27px}.home-note{line-height:1.8;align-items:flex-start}.home-note svg{flex-shrink:0;margin-top:3px}.invitation{gap:12px;flex-wrap:wrap;margin-top:14px}footer{flex-direction:column;align-items:flex-start;gap:14px;margin-top:30px;font-size:8px}.match{padding-top:23px}.match-layout{grid-template-columns:1fr;gap:20px}.board-frame{padding:6px;border-radius:13px;margin:12px 0}.board-grid{border-radius:7px}.square{padding:1px}.file,.rank{font-size:7px}.file{right:2px;bottom:1px}.rank{left:2px;top:2px}.player-card{padding:11px 13px;min-height:58px}.match-panel{padding:23px}.journal{height:170px}.match-panel h2{font-size:26px}.board-hint{font-size:10px;min-height:31px}.back-row{margin-bottom:14px}.back-row small{font-size:8px}.hero .tags{gap:7px}.tag{font-size:8px;padding:9px 10px;letter-spacing:1px}.board-column{scroll-margin-top:15px}}@media(max-width:370px){#app{padding:20px 14px}.brand b{font-size:13px}.brand small{font-size:8px}.brand{gap:9px}.hero h1{font-size:46px}.eyebrow{font-size:9px}.hero-art{margin-left:-20px;margin-right:-20px}.tag{font-size:7px}}@media(orientation:landscape) and (max-width:760px){.hero{grid-template-columns:1.1fr 1fr}.hero-art{height:210px}.hero h1{font-size:42px}.modes{grid-template-columns:repeat(3,minmax(0,1fr))}.mode-card{padding:16px}.mode-card h3{font-size:17px}.mode-card p{font-size:10px}.card-kicker{display:none}}

.hero-art{min-width:0;overflow:clip}.hero-piece>.piece{width:100%;height:100%}