:root{--bg-from:#1a2a3a;--bg-to:#0d1b2a;--panel:rgba(15, 23, 30, 0.7);--panel-2:rgba(26, 42, 58, 0.8);--panel-3:rgba(26, 42, 58, 0.5);--line:rgba(255, 255, 255, 0.1);--line-strong:rgba(255, 255, 255, 0.18);--gold:#e8c589;--gold-dark:#d4b177;--text:#e8e6e3;--muted:#a9b7c6;--ok:#2ecc71;--warn:#f1c40f;--err:#e74c3c;--radius:8px}*{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif}body{background:linear-gradient(135deg,var(--bg-from),var(--bg-to));color:var(--text);min-height:100vh;padding-bottom:40px}a{color:var(--gold);text-decoration:none}a:hover{color:var(--gold-dark);text-decoration:underline}header{background:rgba(15,23,30,.9);backdrop-filter:blur(10px);min-height:70px;padding:10px 3%;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:100}.logo{display:flex;align-items:center;gap:12px;font-weight:700;font-size:1.35rem;white-space:nowrap}.logo i{color:var(--gold)}.logo .page-name{color:var(--muted);font-size:1rem;font-weight:600}.header-user{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.header-actions{display:flex;gap:10px;flex-wrap:wrap}.status-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;font-size:.85rem;font-weight:600;border:1px solid var(--line-strong);background:rgba(0,0,0,.25);color:var(--muted);white-space:nowrap}.status-pill::before{content:'';width:9px;height:9px;border-radius:50%;background:currentColor;flex-shrink:0}.status-pill.is-online{color:var(--ok);border-color:rgba(46,204,113,.6);background:rgba(46,204,113,.1)}.status-pill.is-connecting{color:var(--warn);border-color:rgba(241,196,15,.6);background:rgba(241,196,15,.1)}.status-pill.is-offline{color:var(--err);border-color:rgba(231,76,60,.6);background:rgba(231,76,60,.1)}.page{max-width:1600px;margin:24px auto 0;padding:0 20px;display:flex;flex-direction:column;gap:18px}.layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:18px;align-items:start}.sidebar,.workspace{display:flex;flex-direction:column;gap:18px;min-width:0}.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px;backdrop-filter:blur(10px);animation:fadeIn .4s ease-out}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.card>h2,.card>h3{color:var(--gold);font-size:1.05rem;margin-bottom:12px;display:flex;align-items:center;gap:8px}.card>h2 i,.card>h3 i{color:var(--gold)}.card-subtitle{color:var(--muted);font-size:.85rem;margin:-4px 0 12px;line-height:1.45}.section-hint{color:var(--muted);font-size:.8rem;line-height:1.4;margin-top:8px}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.row.tight{gap:8px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 16px;border-radius:6px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:1px solid transparent;background:0 0;color:var(--text);white-space:nowrap}.btn:disabled,.btn[aria-disabled=true]{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--gold);border-color:var(--gold);color:#1a2a3a}.btn-primary:not(:disabled):hover{background:var(--gold-dark);border-color:var(--gold-dark)}.btn-outline{border-color:var(--gold);color:var(--gold)}.btn-outline:not(:disabled):hover{background:rgba(232,197,137,.12)}.btn-ghost{border-color:var(--line-strong);color:var(--muted)}.btn-ghost:not(:disabled):hover{border-color:var(--gold);color:var(--gold);background:rgba(232,197,137,.08)}.btn-danger{border-color:var(--err);color:var(--err)}.btn-danger:not(:disabled):hover{background:rgba(231,76,60,.12)}.btn-sm{padding:5px 10px;font-size:.8rem}.btn-block{width:100%}label{font-size:.85rem;color:var(--muted);display:block;margin-bottom:5px}input[type=number],input[type=text],select,textarea{width:100%;padding:8px 10px;border-radius:6px;border:1px solid var(--line-strong);background:rgba(0,0,0,.28);color:var(--text);font-size:.9rem;outline:0;transition:border-color .2s ease}input[type=number]:focus,input[type=text]:focus,select:focus,textarea:focus{border-color:var(--gold)}input[type=number]{width:90px}select{cursor:pointer}option{background:#16232f;color:var(--text)}textarea{font-family:Consolas,'Courier New',monospace;font-size:.82rem;line-height:1.45;resize:vertical;white-space:pre}.field{margin-bottom:12px}.field:last-child{margin-bottom:0}.checkbox{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--muted);cursor:pointer;user-select:none}.checkbox input{width:16px;height:16px;accent-color:var(--gold);cursor:pointer}.notice{border-radius:8px;padding:12px 14px;font-size:.88rem;line-height:1.5;border:1px solid var(--line-strong);background:var(--panel-3);color:var(--muted)}.notice strong{color:var(--text)}.notice.info{border-color:rgba(232,197,137,.45);background:rgba(232,197,137,.08)}.notice.warn{border-color:rgba(241,196,15,.5);background:rgba(241,196,15,.08);color:#f4dda0}.notice.error{border-color:rgba(231,76,60,.55);background:rgba(231,76,60,.1);color:#f3b6b0}.notice.success{border-color:rgba(46,204,113,.5);background:rgba(46,204,113,.1);color:#b6e9c9}.notice+.notice{margin-top:10px}.notice .btn{margin-top:10px}.auth-gate{max-width:560px;margin:8vh auto 0;text-align:center}.auth-gate h2{justify-content:center;font-size:1.4rem}.auth-gate p{color:var(--muted);margin-bottom:16px;line-height:1.6}.hidden{display:none!important}.palette{display:grid;grid-template-columns:1fr 1fr;gap:8px}.palette-btn{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:6px;border:1px solid var(--line-strong);background:var(--panel-3);color:var(--text);cursor:pointer;text-align:left;font-size:.82rem;transition:all .15s ease}.palette-btn:hover{border-color:var(--gold);background:rgba(232,197,137,.1)}.palette-btn.selected{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold);background:rgba(232,197,137,.16)}.palette-btn .swatch{width:22px;height:22px;border-radius:4px;flex-shrink:0;border:1px solid rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;color:rgba(0,0,0,.6)}.palette-btn .p-name{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.palette-players{display:grid;grid-template-columns:repeat(auto-fill,minmax(34px,1fr));gap:6px}.player-btn{height:32px;border-radius:6px;border:1px solid var(--line-strong);background:var(--panel-3);font-weight:700;font-size:.9rem;cursor:pointer;transition:all .15s ease;text-shadow:0 0 2px rgba(0,0,0,.8)}.player-btn:hover{border-color:var(--gold)}.player-btn.selected{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold);background:rgba(232,197,137,.16)}.terrain-0{background-color:#f0d9b5}.terrain-0.dark{background-color:#b58863}.terrain-1{background-color:#a44328;background-image:linear-gradient(45deg,#1a1a1a 25%,transparent 25%),linear-gradient(-45deg,#1a1a1a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#1a1a1a 75%),linear-gradient(-45deg,transparent 75%,#1a1a1a 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0}.terrain-2{background-color:#e0c9a6;background-image:radial-gradient(#c2a87f 20%,transparent 20%);background-size:6px 6px}.terrain-3{background-color:#7a7a7a;background-image:linear-gradient(rgba(255,255,255,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.3) 1px,transparent 1px);background-size:5px 5px}.terrain-4{background-color:#f0a830;background-image:linear-gradient(45deg,rgba(255,215,0,.3) 25%,transparent 25%),linear-gradient(-45deg,rgba(255,215,0,.3) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(255,215,0,.3) 75%),linear-gradient(-45deg,transparent 75%,rgba(255,215,0,.3) 75%);background-size:10px 10px;background-position:0 0,0 5px,5px -5px,-5px 0}.terrain-5{background-color:#e6d8a8;background-image:linear-gradient(45deg,#d4c9a1 25%,transparent 25%),linear-gradient(-45deg,#d4c9a1 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d4c9a1 75%),linear-gradient(-45deg,transparent 75%,#d4c9a1 75%);background-size:6px 6px}.terrain-6{background-color:#d5e8d5;background-image:linear-gradient(0deg,#c0d8c0 1px,transparent 1px),linear-gradient(90deg,#c0d8c0 1px,transparent 1px);background-size:4px 4px}.terrain-7{background-color:#e5e0d0;background-image:radial-gradient(#d5d0c0 1px,transparent 1px),radial-gradient(#d5d0c0 1px,transparent 1px);background-size:10px 10px;background-position:0 0,2px 2px}.terrain-8{background-color:#e8d5d5;background-image:linear-gradient(45deg,#d9c2c2 1px,transparent 1px),linear-gradient(-45deg,#d9c2c2 1px,transparent 1px);background-size:6px 6px}.terrain-9{background-color:#d5d5e8;background-image:linear-gradient(0deg,#c2c2d9 1px,transparent 1px),linear-gradient(90deg,#c2c2d9 1px,transparent 1px),linear-gradient(45deg,#c2c2d9 1px,transparent 1px),linear-gradient(-45deg,#c2c2d9 1px,transparent 1px);background-size:8px 8px}.player-a{color:red}.player-b{color:#00f}.player-c{color:#0a0}.player-d{color:#f0f}.player-e{color:orange}.player-f{color:#0ff}.player-g{color:purple}.player-h{color:#ff69b4}.player-i{color:brown}.player-j{color:teal}.player-k{color:gold}.player-l{color:#7cfc00}.player-m{color:navy}.player-n{color:#ff4500}.player-o{color:#9400d3}.player-p{color:#006400}.player-q{color:#8b0000}.player-r{color:#4682b4}.player-s{color:#d2691e}.player-t{color:indigo}.player-u{color:#2e8b57}.player-v{color:#9932cc}.player-w{color:#8b4513}.player-x{color:#dc143c}.player-y{color:#20b2aa}.board-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:.85rem}.board-toolbar .coord{font-family:Consolas,'Courier New',monospace;color:var(--gold)}.board-scroll{overflow:auto;max-height:68vh;padding:4px;border-radius:10px;background:rgba(0,0,0,.25);border:1px solid var(--line)}.map-board{display:grid;gap:1px;background:rgba(0,0,0,.45);width:max-content;margin:0 auto;touch-action:none}.map-cell{width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;cursor:crosshair;user-select:none;position:relative;text-shadow:0 0 2px rgba(0,0,0,.75)}.map-cell.terrain-cell{color:rgba(0,0,0,.55);text-shadow:none}.map-cell:hover{outline:1px solid var(--gold);outline-offset:-1px;z-index:2}.map-list{display:flex;flex-direction:column;gap:8px;max-height:340px;overflow-y:auto}.map-item{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:8px;background:var(--panel-3);border:1px solid var(--line)}.map-item-main{flex:1;min-width:0}.map-item-name{font-weight:600;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.map-item-meta{font-size:.76rem;color:var(--muted);margin-top:3px}.map-item-actions{display:flex;gap:6px;flex-shrink:0}.badge{display:inline-block;padding:1px 7px;border-radius:999px;font-size:.7rem;font-weight:600;border:1px solid var(--line-strong);color:var(--muted);vertical-align:middle}.badge.ok{color:var(--ok);border-color:rgba(46,204,113,.5)}.log{display:flex;flex-direction:column;gap:5px;max-height:220px;overflow-y:auto;font-size:.82rem}.log-entry{display:flex;gap:8px;line-height:1.45}.log-time{color:rgba(169,183,198,.65);font-family:Consolas,'Courier New',monospace;flex-shrink:0}.log-info{color:var(--muted)}.log-ok{color:#9fe0b6}.log-warn{color:#f4dda0}.log-err{color:#f3a9a2}.legend{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:7px;font-size:.8rem;color:var(--muted)}.legend .legend-item{display:flex;align-items:center;gap:8px}.legend .legend-item .swatch{width:18px;height:18px;border-radius:4px;border:1px solid rgba(0,0,0,.5);flex-shrink:0}@media (max-width:1100px){.layout{grid-template-columns:minmax(0,1fr)}.board-scroll{max-height:55vh}}@media (max-width:768px){header{padding:10px 3%}.logo{font-size:1.1rem}.page{padding:0 12px}.palette{grid-template-columns:1fr}.palette-players{grid-template-columns:repeat(auto-fill,minmax(30px,1fr))}}