:root{--bg: #12121a;--panel: #1c1c28;--panel-2: #242434;--text: #e8e6f0;--muted: #8f8ca6;--mana: #5ab4ff;--accent: #d4a24c;--accent-2: #7c5cff;--danger: #d9534f;--ok: #4fc978;font-family:Segoe UI,system-ui,-apple-system,sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;background:radial-gradient(1200px 800px at 30% 20%,#1d1b2e 0%,var(--bg) 60%);color:var(--text);overflow:hidden}.hidden{display:none!important}.screen{height:100vh;width:100vw}#auth{display:flex;align-items:center;justify-content:center}#auth .panel{width:380px;background:var(--panel);border:1px solid #2f2f44;border-radius:14px;padding:28px 30px 20px;box-shadow:0 20px 60px #00000080}#auth h1{margin:0;font-size:44px;letter-spacing:1px}#auth h1 span{color:var(--accent)}#auth h1{margin-bottom:22px}label{display:block;font-size:13px;color:var(--muted);margin-bottom:14px}input{display:block;width:100%;margin-top:6px;padding:10px 12px;font-size:16px;background:var(--panel-2);border:1px solid #3a3a52;border-radius:8px;color:var(--text);outline:none}input:focus{border-color:var(--accent)}#code{text-transform:uppercase;letter-spacing:4px;font-weight:700;margin-top:0}button{padding:10px 16px;font-size:15px;font-weight:600;border-radius:8px;border:1px solid #3a3a52;background:var(--panel-2);color:var(--text);cursor:pointer}button:hover{filter:brightness(1.15)}button.primary{width:100%;background:var(--accent);color:#1a1408;border-color:var(--accent)}button.secondary{width:100%;margin-top:8px}button.danger{border-color:var(--danger);color:var(--danger)}.or{text-align:center;color:var(--muted);font-size:12px;margin:16px 0 10px}.row{display:flex;gap:8px}.error{color:var(--danger);font-size:13px;min-height:18px;margin:12px 0 0}.conn{color:var(--muted);font-size:12px;text-align:right;margin:8px 0 0}.providers{display:flex;flex-direction:column;gap:8px;margin-bottom:4px}.provider{display:block;text-align:center;padding:10px 14px;border-radius:8px;font-weight:600;text-decoration:none;color:#fff}.provider.google{background:#fff;color:#1f1f1f}.provider.facebook{background:#1877f2}.provider:hover{filter:brightness(1.08)}.switch{font-size:13px;color:var(--muted);margin:14px 0 0;text-align:center}.switch a{color:var(--accent)}#auth{gap:40px}.tagline{color:var(--muted);margin:-14px 0 22px;font-size:14px}.auth-art{display:flex;flex-direction:column;gap:24px;width:260px}.auth-art img{width:100%;image-rendering:pixelated;filter:drop-shadow(0 18px 30px rgba(0,0,0,.6))}.auth-art.left{align-items:flex-end}.auth-art.right{align-items:flex-start}@keyframes floaty{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-14px) rotate(1deg)}}.float{animation:floaty 6s ease-in-out infinite}.float.a{animation-delay:0s;width:240px}.float.b{animation-delay:-2s;width:180px;margin-right:40px}.float.c{animation-delay:-1s;width:200px;margin-left:30px}.float.d{animation-delay:-3.5s;width:240px}@media(max-width:1100px){.auth-art{display:none}}.hero-strip{display:flex;justify-content:center;gap:18px;margin:6px 0 4px;pointer-events:none}.hero-strip img{width:110px;height:110px;image-rendering:pixelated;filter:drop-shadow(0 10px 18px rgba(0,0,0,.6));opacity:.95;animation:floaty 7s ease-in-out infinite}.hero-strip img:nth-child(2n){animation-delay:-2.3s}.hero-strip img:nth-child(3n){animation-delay:-4.1s}.deck-pick{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;color:var(--muted)}.deck-pick select{padding:9px 10px;border-radius:8px;background:var(--panel-2);border:1px solid #3a3a52;color:var(--text);font-size:14px}.binder-btn{position:relative;border-color:var(--accent-2)}.pill{display:inline-block;min-width:18px;padding:1px 6px;border-radius:999px;background:var(--accent);color:#1a1408;font-size:11px;font-weight:800;margin-left:4px}.me-text{display:flex;flex-direction:column;gap:4px;color:var(--text)}.xp{display:flex;align-items:center;gap:8px}.level{font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;background:var(--accent-2);color:#fff}.xp-bar{width:120px;height:8px;border-radius:999px;background:#2a2a3a;overflow:hidden}#xp-fill{height:100%;width:0;background:linear-gradient(90deg,var(--accent-2),#b39cff);transition:width .4s ease}.xp-text{font-size:11px;color:var(--muted)}.push-banner{display:flex;align-items:center;gap:12px;padding:10px 14px;margin-bottom:14px;border-radius:12px;background:linear-gradient(90deg,#7c5cff40,#d4a24c2e);border:1px solid rgba(124,92,255,.5);font-size:14px}.push-banner span{flex:1}.push-banner .primary{width:auto;padding:8px 14px}.push-banner .x{border-color:transparent;color:var(--muted)}.home-body{display:grid;grid-template-columns:1fr 320px;gap:28px;align-items:start}.friends-panel{background:var(--panel);border:1px solid #2f2f44;border-radius:14px;padding:14px;position:sticky;top:0}.friends-panel .section-title{margin-top:0}.friend-code{font-size:12px;color:var(--muted);margin-bottom:10px}.friend-code b{color:var(--accent);letter-spacing:3px;margin-left:6px;font-size:14px}#friend-search{margin:0;flex:1}.friend-results{margin-top:8px}.friend-results:empty{display:none}.friend-row{display:flex;align-items:center;gap:10px;padding:8px 6px;border-bottom:1px solid #262636;font-size:14px}.friend-row:last-child{border-bottom:none}.friend-row .fdot{width:9px;height:9px;border-radius:50%;background:#555;flex:none}.friend-row .fdot.on{background:var(--ok);box-shadow:0 0 8px var(--ok)}.friend-row .fname{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.friend-row .flvl{font-size:11px;color:var(--muted)}.friend-row button{padding:5px 10px;font-size:12px}.friend-row button.x{border-color:transparent;color:var(--muted)}.friend-row button.go{background:var(--accent);color:#1a1408;border-color:var(--accent)}.sub-title{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:14px 0 4px}.friend-list:empty:after{content:"No friends yet. Find someone above, or share your friend code.";display:block;color:var(--muted);font-size:13px;padding:10px 0}.challenges{display:flex;flex-direction:column;gap:8px}.challenge{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--panel);border:2px solid var(--accent-2);box-shadow:0 0 0 3px #7c5cff33}.challenge.outgoing{border-color:#3a3a52;box-shadow:none}.challenge .ctext{flex:1}.challenge .ctext b{color:var(--accent)}.challenge .cwhen{font-size:11px;color:var(--muted)}#binder{overflow:hidden;display:flex;flex-direction:column;padding:16px 32px 24px}.binder-header{display:flex;align-items:center;gap:18px;margin-bottom:12px}.binder-header h1{margin:0;font-size:28px}.binder-stats{color:var(--muted);font-size:13px}.binder-body{flex:1;display:grid;grid-template-columns:1fr 380px;gap:20px;min-height:0}.collection,.deck-editor{background:var(--panel);border:1px solid #2f2f44;border-radius:14px;padding:14px;min-height:0;display:flex;flex-direction:column}.collection .section-title,.deck-editor .section-title{margin:0 0 10px}.muted{color:var(--muted);font-weight:400;text-transform:none;letter-spacing:0}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;overflow-y:auto;overflow-x:hidden;padding:10px 4px 4px 10px;align-content:start}.bcard{position:relative;border-radius:10px;border:2px solid #4a4a5c;background:#1f2740;padding:8px;display:flex;flex-direction:column;gap:6px;cursor:pointer;transition:transform .12s ease,border-color .12s ease;user-select:none}.bcard.summon{background:#3a1f2a}.bcard:hover{transform:translateY(-2px);border-color:var(--accent)}.bcard.disabled{opacity:.4;cursor:default}.bcard.disabled:hover{transform:none;border-color:#4a4a5c}.bcard .bname{font-weight:700;font-size:12.5px;display:flex;justify-content:space-between;gap:6px}.bcard .bart{position:relative;height:84px;border-radius:6px;background:#0000004d;display:flex;align-items:center;justify-content:center;font-size:40px;overflow:hidden}.bcard .bcost,.mana-gem{display:inline-block;min-width:26px;padding:1px 6px;border-radius:8px;background:#0b1020;border:1.5px solid var(--mana);color:var(--mana);font-size:11px;font-weight:900;text-align:center;line-height:1.3}.bcard .bcost{position:absolute;top:4px;left:4px}.zoom-cost{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;flex-wrap:wrap}.zoom-cost .mana-gem{font-size:13px}.zoom-cost .ok{color:var(--mana)}.zoom-cost .short{color:#e58a8a}.bcard .bart img{height:100%;image-rendering:pixelated}.bcard .btype{font-size:10px;color:#ffd9a0;text-transform:uppercase;letter-spacing:1px}.bcard .btext{font-size:10.5px;color:#d8d8e6;line-height:1.3;min-height:40px}.bcard .count{position:absolute;top:-8px;right:-8px;background:var(--accent);color:#1a1408;font-weight:800;font-size:12px;border-radius:999px;min-width:24px;height:24px;display:flex;align-items:center;justify-content:center;border:2px solid var(--panel)}.bcard .newtag{position:absolute;top:-8px;left:-8px;background:#ff5fa2;color:#fff;font-weight:800;font-size:10px;letter-spacing:1px;padding:3px 7px;border-radius:999px;border:2px solid var(--panel);animation:newpulse 1.4s ease-in-out infinite}@keyframes newpulse{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}.deck-tabs{display:flex;gap:6px;margin-bottom:10px}.deck-tabs button{flex:1;padding:8px;font-size:13px}.deck-tabs button.active{background:var(--accent-2);border-color:var(--accent-2);color:#fff}.deck-tabs button.invalid{border-color:var(--danger)}.deck-head{display:flex;gap:8px;align-items:center}.deck-head input{margin:0;flex:1}.deck-count{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap;color:var(--ok)}.deck-count.bad{color:var(--danger)}.deck-head .primary{width:auto}#deck-msg{min-height:16px;margin:8px 0}.deck-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:4px}.deck-row{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;background:var(--panel-2);font-size:13px}.deck-row .g{font-size:18px;width:26px;text-align:center}.deck-row .n{flex:1;font-weight:600}.deck-row .t{color:var(--muted);font-size:11px}.deck-row .x{font-variant-numeric:tabular-nums;color:var(--accent);font-weight:700}.deck-row button{padding:3px 9px;font-size:13px;line-height:1}.deck-list:empty:after{content:"Click cards in your collection to add them. A deck needs 25–40 cards, max 3 of each.";color:var(--muted);font-size:13px;padding:10px}.modal{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:20}.modal-card{background:linear-gradient(160deg,#2b2b3d,#1a1a26);border:2px solid var(--accent);border-radius:18px;padding:24px 28px;width:520px;text-align:center;box-shadow:0 30px 80px #000000b3,0 0 0 6px #d4a24c26;animation:chat-in .25s ease-out}.modal-card h2{margin:0 0 6px;font-size:26px}.modal-card p{color:var(--muted);margin:0 0 16px}.reward-cards{display:flex;justify-content:center;gap:14px;margin-bottom:18px}.reward-cards .bcard{width:170px;cursor:default;animation:reveal .6s cubic-bezier(.2,.8,.2,1)}@keyframes reveal{0%{transform:rotateY(90deg) scale(.8);opacity:0}to{transform:none;opacity:1}}.modal-card .primary{width:auto;padding:10px 28px}#editor{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;padding:16px 32px 24px;box-sizing:border-box}#editor>.binder-header{position:sticky;top:-16px;z-index:2;background:var(--bg);margin:-16px -32px 0;padding:16px 32px 10px}.editor-actions{display:flex;align-items:center;gap:10px;margin-left:auto}.editor-msg{margin:0;min-height:1.2em}.editor-msg.error{color:#ff8a8a}.editor-msg.ok{color:#9ef0bd}.editor-body{display:grid;grid-template-columns:260px 1fr;gap:18px;padding:12px 0 40px;align-items:start}.editor-list{position:sticky;top:60px;max-height:calc(100vh - 140px);overflow-y:auto;display:flex;flex-direction:column;gap:4px;background:var(--panel);border:1px solid #2f2f44;border-radius:12px;padding:10px}.editor-list input{margin-bottom:6px}.editor-section{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin:10px 4px 4px}.editor-item{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;text-align:left;padding:7px 10px;border-radius:8px;border:1px solid transparent;background:transparent;font-weight:500}.editor-item:hover{background:#ffffff0a}.editor-item.active{border-color:var(--accent);background:#f0c75e14}.editor-item .s{font-size:11px;color:var(--muted)}.editor-item .mod{color:var(--mana);font-size:10px}.editor-form{display:flex;flex-direction:column;gap:14px;min-width:0}.ehead{display:flex;align-items:center;gap:14px}.ehead .eart{width:72px;height:72px;border-radius:12px;background:#00000059;display:flex;align-items:center;justify-content:center;font-size:40px;overflow:hidden}.ehead .eart img{height:100%;image-rendering:pixelated}.ehead h2{margin:0}.ehead>button{margin-left:auto}.egroup{border:1px solid #2f2f44;border-radius:12px;padding:10px 14px 14px;background:var(--panel);display:flex;flex-wrap:wrap;gap:10px 22px}.egroup legend{padding:0 6px;color:var(--accent);font-weight:700;font-size:13px;letter-spacing:.5px}.egroup>.hint,.egroup>textarea,.egroup>button,.egroup>.emove,.egroup>.eeffect{flex-basis:100%}.efield{display:flex;flex-direction:column;gap:4px;min-width:150px}.efield .el{font-size:12px;color:#d8d4ea;display:flex;flex-direction:column}.efield .el small,.emove .el small,.eflags small{color:var(--muted);font-weight:400}.efield .ebox{display:flex;align-items:center;gap:6px}.efield input[type=number]{width:84px}.efield.changed input{border-color:var(--mana);color:var(--mana);font-weight:700}.edef{color:var(--muted);white-space:nowrap}.ereset{padding:2px 8px;font-size:14px;line-height:1.2}.ereset-mv{align-self:flex-start}.eeffect{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:flex-end;padding:8px 0;border-top:1px dashed #2f2f44}.eeffect .ek{flex-basis:100%;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}.emove{display:grid;grid-template-columns:auto 1fr;gap:14px 24px;align-items:start}.emove .epreview{grid-row:span 3;width:190px}.emove .epreview .minimap{width:190px}.emove .el{font-size:12px;color:#d8d4ea;display:flex;flex-direction:column;margin-bottom:6px}.egrid{display:grid;grid-template-columns:repeat(7,30px);gap:2px;width:max-content}.ecell{width:30px;height:30px;padding:0;border-radius:4px;border:1px solid transparent;font-size:16px;line-height:1}.ecell.l{background:#d6c9a8}.ecell.d{background:#7a5f45}.ecell.on{background:var(--mana);box-shadow:inset 0 0 0 2px #0b1020}.ecell.c{background:#2a2233;color:#fff;cursor:default}.eslide{display:flex;align-items:center;gap:10px;margin-bottom:8px}.ecompass{display:grid;grid-template-columns:repeat(3,26px);grid-template-areas:"a b c" "d . e" "f g h";gap:2px}.ecompass .edir:nth-child(1){grid-area:a}.ecompass .edir:nth-child(2){grid-area:b}.ecompass .edir:nth-child(3){grid-area:c}.ecompass .edir:nth-child(4){grid-area:d}.ecompass .edir:nth-child(5){grid-area:e}.ecompass .edir:nth-child(6){grid-area:f}.ecompass .edir:nth-child(7){grid-area:g}.ecompass .edir:nth-child(8){grid-area:h}.edir{width:26px;height:26px;padding:0;font-size:13px;line-height:1;border-radius:4px}.edir.on{background:var(--mana);color:#06101f;border-color:var(--mana)}.eslide input[type=number]{width:64px}.eflags{display:flex;flex-direction:column;gap:6px;font-size:13px}.editor-add .n{color:var(--accent)}.eimage{display:flex;gap:14px;align-items:flex-start;flex-basis:100%}.epreview-img{width:96px;height:96px;border-radius:10px;background:#00000059;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.epreview-img img{width:100%;height:100%;object-fit:contain}.eimage-col{display:flex;flex-direction:column;gap:6px}.eimage-col .el{font-size:12px;color:#d8d4ea;display:flex;flex-direction:column}.eimage-col .el small{color:var(--muted)}.eimage-row{display:flex;gap:8px;flex-wrap:wrap}.eknock,.eflag{font-size:12px;color:var(--muted)}.efield input:not([type=number]),.efield select{min-width:180px}.pstats{display:flex;flex-wrap:wrap;gap:10px}.pstat{background:var(--panel);border:1px solid #2f2f44;border-radius:12px;padding:10px 16px;min-width:110px;display:flex;flex-direction:column}.pstat b{font-size:22px;color:var(--accent)}.pstat span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}.ptable-wrap{overflow-x:auto;background:var(--panel);border:1px solid #2f2f44;border-radius:12px}.ptable{width:100%;border-collapse:collapse;font-size:13px}.ptable th,.ptable td{text-align:left;padding:8px 12px;border-bottom:1px solid #262636;white-space:nowrap}.ptable th{cursor:pointer;user-select:none;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:1px}.ptable th.desc:after{content:" ▾"}.ptable th.asc:after{content:" ▴"}.ptable tr:last-child td{border-bottom:none}.ptable .tag{font-size:10px;padding:1px 6px;border-radius:6px;background:#d4a24c26;color:var(--accent);vertical-align:middle}.ptable .ok{color:#9ef0bd}.devlist{display:flex;flex-direction:column;gap:6px;flex-basis:100%}.devrow{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:8px;background:#00000040}.devrow>button{margin-left:auto}.editor-form textarea{width:100%;resize:vertical;font:inherit;font-size:13px;padding:8px 10px;border-radius:8px;border:1px solid #2f2f44;background:#0e0e15;color:var(--text)}@media(max-width:899px){.editor-body{grid-template-columns:1fr}.editor-list{position:static;max-height:40vh}.emove{grid-template-columns:1fr}.emove .epreview{grid-row:auto}}.discard-card{width:460px}.discard-pos{margin-top:-4px}.discard-stage{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:10px;touch-action:pan-y}.discard-stage .nav{font-size:28px;line-height:1;padding:10px 14px;border-radius:50%}.discard-stage .nav:disabled{opacity:.25}.discard-view{width:220px;min-height:300px;display:flex;align-items:center;justify-content:center;user-select:none}.discard-view .bcard{width:210px;cursor:grab;animation:reveal .25s ease-out}.discard-view .bcard .bart{height:120px;font-size:56px}.discard-view .bcard .btext{font-size:12px}.discard-view .empty{color:var(--muted)}#home{overflow-y:auto;padding:24px 40px 60px;max-width:1400px;margin:0 auto}.home-header{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-bottom:8px}.home-header h1{margin:0;font-size:36px}.home-header h1 span{color:var(--accent)}.home-actions{display:flex;gap:10px;align-items:center;flex:1}.home-actions .row{margin:0}.home-actions .primary{width:auto}#join-code{width:110px;margin:0;text-transform:uppercase;letter-spacing:4px;font-weight:700}.me{display:flex;align-items:center;gap:10px;color:var(--muted)}.avatar{width:32px;height:32px;border-radius:50%}.section-title{font-size:13px;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);margin:26px 0 10px}.games-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:26px 0 10px}.games-head .section-title{margin:0}.tabs{display:flex;gap:4px;background:var(--panel);border:1px solid #2f2f44;border-radius:999px;padding:3px}.tabs button{border:none;background:transparent;color:var(--muted);padding:6px 14px;border-radius:999px;font-size:13px}.tabs button.active{background:var(--panel-2);color:var(--text)}.tab-count{color:var(--muted);font-weight:400;margin-left:2px}.tabs button.active .tab-count{color:var(--accent);font-weight:700}.games{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.games:empty:after{content:"No active games.";color:var(--muted);font-size:13px}.game-card.waiting{opacity:.55;filter:saturate(.7)}.game-card.waiting:hover{opacity:.85}.game-card .card-cancel{width:100%;padding:7px 10px;font-size:13px;font-weight:700;border-radius:8px;border:1px solid #3a2a2a;background:#ff6b6b14;color:#e58a8a;transition:background .15s ease,border-color .15s ease,color .15s ease}.game-card .card-cancel:hover{background:#ff6b6b2e;border-color:#ff6b6b;color:#ff9c9c}.finished-list{display:flex;flex-direction:column;gap:6px}.finished-list:empty:after{content:"No finished games yet.";color:var(--muted);font-size:13px}.finished-row{display:grid;grid-template-columns:1fr auto auto;gap:16px;align-items:center;padding:10px 14px;border-radius:10px;background:var(--panel);border:1px solid #2f2f44;cursor:pointer;font-size:14px}.finished-row:hover{border-color:#4a4a66}.finished-row .fr-opp{font-weight:600}.finished-row .fr-result{font-weight:700;font-size:12px;padding:3px 10px;border-radius:999px;background:#33334a;color:var(--muted)}.finished-row .fr-result.won{background:#3fbf6f33;color:#9ef0bd}.finished-row .fr-result.lost{background:#d9534f2e;color:#ffb3b0}.finished-row .fr-when{font-size:12px;color:var(--muted);white-space:nowrap}.game-card{background:var(--panel);border:2px solid #2f2f44;border-radius:14px;padding:12px;cursor:pointer;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;display:flex;flex-direction:column;gap:8px}.game-card:hover{transform:translateY(-3px);border-color:#4a4a66;box-shadow:0 14px 30px #00000073}.game-card.your-turn{border-color:var(--accent);box-shadow:0 0 0 3px #d4a24c40,0 10px 30px #d4a24c26}.game-card .opp{font-weight:700;font-size:15px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}.game-card .opp .badge{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--accent);color:#1a1408;text-transform:uppercase;letter-spacing:1px}.game-card .opp .badge.wait{background:#33334a;color:var(--muted)}.game-card .opp .badge.done{background:#33334a;color:#e8e6f0}.game-card canvas{width:100%;aspect-ratio:1;border-radius:8px;display:block;box-shadow:0 6px 16px #0006}.game-card .meta{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.game-card .meta .low{color:var(--danger);font-weight:700}.game-card .code-line{font-size:12px;color:var(--muted)}.game-card .code-line b{color:var(--accent);letter-spacing:3px}.player .clock{margin-left:auto;font-variant-numeric:tabular-nums;font-size:12px;color:var(--muted);font-weight:600}.player .clock.running{color:var(--ok)}.player .clock.low{color:var(--danger)}#game{display:flex;align-items:stretch;justify-content:center;gap:16px;padding:12px;--inspect-w: 280px;--side-w: 320px}#board-mount{display:flex;align-items:center;justify-content:center;min-width:0}.board-error{display:flex;flex-direction:column;align-items:center;gap:10px;padding:32px;max-width:420px;text-align:center;color:var(--muted)}.board-error b{color:var(--text);font-size:18px}#board-mount canvas{display:block;width:auto!important;height:auto!important;max-width:min(var(--canvas-w, 896px),calc(100vw - var(--inspect-w) - var(--side-w) - 24px - 32px));max-height:min(var(--canvas-h, 850px),calc(100vh - 24px))}@media(min-width:900px)and (max-width:1400px){#game{--inspect-w: 240px;--side-w: 270px}#inspect{width:var(--inspect-w)}#side{width:var(--side-w)}.zoom-name{font-size:17px}.minimap{max-width:200px;margin:0 auto}}#side{width:var(--side-w, 320px);display:flex;flex-direction:column;gap:12px;align-self:stretch;min-height:0;overflow-y:auto;scrollbar-width:thin}.side-block{background:var(--panel);border:1px solid #2f2f44;border-radius:12px;padding:12px 14px}.side-block.grow{flex:1;min-height:160px;display:flex;flex-direction:column}.label{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}.code{font-size:30px;font-weight:800;letter-spacing:6px;color:var(--accent);margin:2px 0}.hint{font-size:12px;color:var(--muted)}.players{display:flex;flex-direction:column;gap:10px}.player .who{display:flex;align-items:center;gap:8px;font-weight:600}.player .dot{width:10px;height:10px;border-radius:50%;background:#555;border:1px solid #888}.player.white .dot{background:#f2f2f2}.player.black .dot{background:#111}.player.offline .pname:after{content:" (disconnected)";color:var(--muted);font-weight:400;font-size:12px}.player .counts{font-size:12px;color:var(--muted);display:flex;gap:14px;margin-top:2px}.status{padding:10px 12px;border-radius:8px;background:var(--panel-2);font-size:14px;text-align:center;border-left:4px solid var(--muted)}.status.mine{border-left-color:var(--ok)}.status.check{border-left-color:var(--danger)}.status.over{border-left-color:var(--accent);font-weight:700}.turn-track{display:flex;gap:6px;flex-wrap:wrap}.track{font-size:11px;padding:3px 8px;border-radius:999px;background:#0000004d;color:var(--muted);border:1px solid #33334a}.track.ok{color:#9ef0bd;border-color:#4fc97866}.track.now{color:#9ef0bd;border-color:#4fc97880;background:#4fc97814}.track.used{color:#9ef0bd;border-color:#4fc9784d;opacity:.7}.track.skip{opacity:.55}.end-turn{font-size:16px;padding:12px}.end-turn:disabled{opacity:.4;cursor:default;filter:none}.end-turn.ready{box-shadow:0 0 0 3px #d4a24c59,0 8px 24px #d4a24c40;animation:endturn-pulse 2s ease-in-out infinite}@keyframes endturn-pulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.2)}}#log{flex:1;overflow-y:auto;font-size:12.5px;line-height:1.5;margin-top:6px;max-height:340px}#log .entry{padding:2px 0;border-bottom:1px solid #262636}#log .entry.white{color:#e8e6f0}#log .entry.black{color:#b8b4d0}#log .entry.important{color:var(--accent);font-weight:600}.actions{display:flex;gap:8px}.actions button{flex:1}#inspect{width:var(--inspect-w, 280px);align-self:stretch;display:flex;flex-direction:column;gap:10px;min-height:0}#inspect>#chat{position:static;width:auto;margin-top:auto;z-index:auto}#inspect>#chat .chat-log{max-height:22vh}#inspect>.zoom{flex:1 1 auto;min-height:240px;overflow-y:auto;scrollbar-width:thin}.zoom{position:relative;border-radius:16px;padding:14px;min-height:420px;background:linear-gradient(160deg,#2b2b3d,#1a1a26);border:2px solid #4a4a5c;box-shadow:0 16px 40px #0000008c;display:flex;flex-direction:column;gap:10px;transition:transform .18s ease,border-color .18s ease}.zoom.empty{align-items:center;justify-content:center;color:var(--muted);font-size:14px;text-align:center}.zoom.summon{background:linear-gradient(160deg,#4a2636,#2a1620);border-color:#8a4a5f}.zoom.basic{background:linear-gradient(160deg,#27314f,#171d33);border-color:#4a5a8a}.zoom.owner-white{box-shadow:0 16px 40px #0000008c,inset 0 0 0 1px #ffffff26}.zoom.fresh{transform:scale(1.03);border-color:var(--accent)}.zoom-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.zoom-name{font-size:20px;font-weight:800}.zoom-owner{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);white-space:nowrap}.zoom-type{font-size:12px;color:#d8c9a0}.zoom-art{height:130px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 40%,#ffffff1f,#00000059);border:1px solid rgba(255,255,255,.1)}.zoom-art .glyph{font-size:84px;line-height:1;filter:drop-shadow(0 6px 10px rgba(0,0,0,.6))}.zoom .glyph.chess.white{color:#f7f3ea;-webkit-text-stroke:1px #2b2420}.zoom .glyph.chess.black{color:#1c1b24;-webkit-text-stroke:1px #d8d2e6}.zoom-banner{height:120px;border-radius:10px;background:radial-gradient(circle at 50% 60%,#ffffff1a,#00000059);display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(255,255,255,.1)}.zoom-banner img{height:100%;image-rendering:pixelated}.minimap{display:grid;grid-template-columns:repeat(7,1fr);aspect-ratio:1;border-radius:8px;overflow:hidden;border:2px solid rgba(0,0,0,.45);box-shadow:0 6px 16px #0006}.minimap .cell{display:flex;align-items:center;justify-content:center}.minimap .cell.l{background:#d6c9a8}.minimap .cell.d{background:#7a5f45}.minimap .cell.c{box-shadow:inset 0 0 0 2px var(--accent)}.minimap .glyph{font-size:24px;line-height:1;filter:drop-shadow(0 2px 3px rgba(0,0,0,.5))}.minimap .dot,.map-legend .dot{display:inline-block;width:11px;height:11px;border-radius:50%;background:#111;box-shadow:0 1px 2px #00000080}.minimap .dot.atk,.map-legend .dot.atk{background:var(--danger)}.map-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:11px;color:var(--muted);margin-top:-4px}.map-legend span{display:inline-flex;align-items:center;gap:5px}.zoom-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.zoom-stats .stat{border-radius:8px;padding:6px 4px;text-align:center;font-size:11px;letter-spacing:1px;color:#fffc;background:#0000004d}.zoom-stats .stat b{display:block;font-size:20px;letter-spacing:0;margin-top:2px}.zoom-stats .atk b{color:#ff7b75}.zoom-stats .def b{color:#7fb2ff}.zoom-stats .hp b{color:#6fe09a}.zoom-stance{font-size:13px;font-weight:700;padding:6px 10px;border-radius:8px;text-align:center}.zoom-stance.attack{background:#d9534f33;color:#ffb3b0}.zoom-stance.defense{background:#4a8fe738;color:#b9d4ff}.zoom-text{font-size:12.5px;line-height:1.45;color:#e4e2ee;flex:1}.zoom-status{font-size:12px;color:#ffd9a0;border-top:1px solid rgba(255,255,255,.1);padding-top:8px}.zoom-status:empty{display:none}#stance{width:100%}#stance:disabled{opacity:.45;cursor:default}#stance.to-defense{border-color:#4a8fe7;color:#b9d4ff}#stance.to-attack{border-color:var(--danger);color:#ffb3b0}#stance-hint{text-align:center;min-height:16px}#chat{position:fixed;left:16px;bottom:16px;width:340px;display:flex;flex-direction:column;gap:6px;z-index:5;transition:opacity .2s ease}.chat-log{display:flex;flex-direction:column;justify-content:flex-end;gap:3px;padding:8px 10px;border-radius:10px;font-size:13px;line-height:1.4;overflow-y:auto;scrollbar-width:thin;cursor:pointer;transition:max-height .25s ease,background .25s ease,border-color .25s ease}.chat.faded .chat-log{max-height:150px;background:#14141e59;border:1px solid rgba(255,255,255,.06);mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.35) 35%,black 75%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.35) 35%,black 75%)}.chat.faded .chat-log:empty{display:none}.chat.expanded .chat-log{max-height:360px;background:#181824f5;border:1px solid #3a3a52;box-shadow:0 16px 40px #00000080;cursor:default}.chat-line{word-wrap:break-word;color:#e4e2ee}.chat-line .who{font-weight:700;margin-right:6px}.chat-line.white .who{color:#f7f3ea}.chat-line.black .who{color:#b8b4d0}.chat-line.me .who{color:var(--accent)}.chat-line .time{color:var(--muted);font-size:10.5px;margin-left:6px}.chat-form{margin:0}#chat-input{margin:0;padding:8px 12px;font-size:13px;background:#181824b3;border:1px solid rgba(255,255,255,.08)}.chat.faded #chat-input:not(:focus){opacity:.6}#chat-input:focus{background:#181824f2;border-color:var(--accent)}@keyframes chat-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.chat-line{animation:chat-in .18s ease-out}#toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%);background:#2a1b1b;border:1px solid var(--danger);color:#ffd9d7;padding:10px 16px;border-radius:8px;font-size:14px;box-shadow:0 10px 30px #00000080;z-index:10}#toast.info{background:#1d2a22;border-color:var(--ok);color:#d7f5e2}.mbar,.mtabs,.sheet-backdrop{display:none}#board-mount canvas{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}button,.bcard,.game-card,.friend-row button{touch-action:manipulation}@media(max-width:899px){html,body{overflow:auto;height:auto;min-height:100%}.screen{height:auto;min-height:100dvh;width:100%}#auth{flex-direction:column;justify-content:flex-start;padding:24px 16px 40px;gap:12px}.auth-art{display:flex;flex-direction:row;width:100%;justify-content:center;gap:8px}.auth-art.right{display:none}.auth-art img,.float.a,.float.b{width:120px;margin:0}#auth .panel{width:100%;max-width:420px;padding:22px 20px 16px}#home{padding:14px 14px 40px}.home-header{gap:12px}.home-header h1{font-size:30px}.home-actions{flex-wrap:wrap;width:100%;gap:8px}.home-actions .primary,.home-actions>button,.home-actions form{flex:1 1 auto}.home-actions .row{flex:1 1 100%}#join-code{flex:1;width:auto}.me{width:100%;justify-content:space-between}.hero-strip{gap:6px;overflow:hidden}.hero-strip img{width:56px;height:56px}.home-body{grid-template-columns:1fr;gap:18px}.friends-panel{position:static}.games{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}#binder{padding:12px;overflow:auto;height:auto}.binder-body{grid-template-columns:1fr}.deck-editor{order:-1}.card-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));max-height:none;overflow:visible}.bcard .btext{font-size:10px}.deck-list{max-height:40vh}.modal-card{width:calc(100vw - 32px);padding:18px}#game{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:0 0 72px;gap:0}#board-mount{justify-content:center;background:#0e0e15}#board-mount canvas{width:min(100vw,520px)!important;height:auto!important;max-width:none!important;max-height:none!important}.mbar{display:flex;flex-direction:column;gap:6px;padding:8px 12px;position:sticky;top:0;z-index:6;background:#12121af5;border-bottom:1px solid #2a2a3c;backdrop-filter:blur(8px)}.mrow{display:flex;align-items:center;justify-content:space-between;gap:10px}.mback{padding:4px 10px;font-size:18px;line-height:1;border-color:#3a3a52;flex:none}.mwho{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mwho b{color:var(--text)}.mwho.turn b{color:var(--accent)}.mstatus{flex:1;font-size:13px;line-height:1.3}.mstatus.check{color:#ffb3b0;font-weight:700}#m-end{width:auto;padding:9px 16px;font-size:14px;white-space:nowrap}#m-end.ready{animation:endturn-pulse 2s ease-in-out infinite;box-shadow:0 0 0 3px #d4a24c59}#inspect,#side,#chat{position:fixed;left:0;right:0;bottom:64px;width:auto;max-height:72vh;overflow-y:auto;margin:0;padding:14px 14px 18px;background:var(--panel);border-top:2px solid #3a3a52;border-radius:18px 18px 0 0;box-shadow:0 -20px 50px #0009;transform:translateY(110%);transition:transform .22s ease;z-index:8;align-self:auto}#inspect.open,#side.open,#chat.open{transform:none}#inspect:before,#side:before,#chat:before{content:"";display:block;width:44px;height:4px;border-radius:2px;background:#4a4a5c;margin:-4px auto 10px}#inspect.peek{max-height:44vh;box-shadow:0 -12px 30px #00000080}#inspect.peek .zoom-text,#inspect.peek .map-legend{font-size:12px}#inspect.peek .minimap{width:150px}#side{gap:10px;max-height:72vh}#side .side-block.grow{min-height:120px}#log{max-height:30vh}#chat.faded .chat-log,#chat.expanded .chat-log{mask-image:none;-webkit-mask-image:none;max-height:40vh;min-height:120px;background:var(--panel-2);border:1px solid #3a3a52;cursor:default}#chat.faded #chat-input:not(:focus){opacity:1}.zoom,.zoom>*,#inspect>*{flex-shrink:0}.zoom{min-height:0}.minimap{width:240px;max-width:100%;margin:0 auto}.mtabs{display:flex;position:fixed;left:0;right:0;bottom:0;height:64px;background:#12121afa;border-top:1px solid #2a2a3c;z-index:9;padding-bottom:env(safe-area-inset-bottom)}.mtabs button{flex:1;border:none;border-radius:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:13px;color:var(--muted)}.mtabs button small{font-size:10px;color:var(--muted);max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mtabs button.active{color:var(--accent)}.mtabs button.attention small{color:var(--accent);font-weight:700}.sheet-backdrop{display:block;position:fixed;inset:0;background:#00000073;z-index:7}.sheet-backdrop.hidden{display:none}}