html,body,#root{height:100%;margin:0;padding:0;overflow:hidden;overscroll-behavior:none;background:#14181c;color:#cfd8dc;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;user-select:none;-webkit-user-select:none}.map-container{position:fixed;top:0;right:0;bottom:0;left:0;touch-action:none;cursor:grab}.map-container.panning{cursor:grabbing}.chrome-badge{position:fixed;top:8px;left:8px;z-index:10;padding:4px 10px;border-radius:6px;background:#14181cbf;font-size:12px;line-height:1.5;pointer-events:none}.chrome-badge .fallback-note{color:#ffb74d}.chrome-badge .role-note{color:#90a4ae}.page{height:100%;overflow-y:auto;display:flex;flex-direction:column;align-items:center;gap:20px;padding:48px 16px;box-sizing:border-box}.panel{width:min(420px,100%);background:#1c2228;border:1px solid #2c353d;border-radius:10px;padding:24px;box-sizing:border-box}.panel h1{margin:0 0 16px;font-size:20px}.panel h2{margin:0 0 12px;font-size:16px}.panel form{display:flex;flex-direction:column;gap:14px}.panel label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#90a4ae}.panel input{padding:8px 10px;border-radius:6px;border:1px solid #37424b;background:#14181c;color:#eceff1;font-size:16px}.panel input:focus{outline:none;border-color:#5c8aa8}.panel .hint{margin:0;font-size:12px;color:#78909c}.panel .error-note{margin:0;font-size:13px;color:#ef5350}.panel .warn-note{font-size:14px;color:#ffb74d}button.primary{padding:10px 14px;border:none;border-radius:6px;background:#3d7ea6;color:#fff;font-size:15px;cursor:pointer}button.primary:disabled{opacity:.5;cursor:default}.recovery-key{display:block;margin:12px 0 20px;padding:12px;border-radius:6px;background:#14181c;border:1px dashed #5c8aa8;font-size:15px;word-break:break-all;user-select:text;-webkit-user-select:text}.room-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.room-link{width:100%;display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #2c353d;border-radius:6px;background:#14181c;color:#cfd8dc;font-size:14px;cursor:pointer;text-align:left}.room-link:hover{border-color:#5c8aa8}.room-link .room-visited{color:#78909c;font-size:12px;white-space:nowrap}.toolbar{position:fixed;bottom:calc(16px + env(safe-area-inset-bottom,0px));left:50%;transform:translate(-50%);z-index:10;display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:10px;background:#14181cd9;border:1px solid #2c353d}.toolbar .tool{padding:6px 14px;border:1px solid #37424b;border-radius:6px;background:#1c2228;color:#cfd8dc;font-size:14px;cursor:pointer}.toolbar .tool.active{background:#3d7ea6;border-color:#3d7ea6;color:#fff}.toolbar-sep{width:1px;height:22px;background:#37424b}.toolbar .swatch{width:24px;height:24px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}.toolbar .swatch.active{border-color:#fff}.toolbar{max-width:calc(100vw - 16px);flex-wrap:wrap;justify-content:center}@media(max-width:640px){.toolbar{left:8px;right:140px;transform:none;max-width:none;gap:6px;padding:6px 8px}.toolbar .tool{padding:6px 9px;font-size:13px}.chrome-badge{max-width:calc(100vw - 220px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}}.toolbar .tool.danger{background:#7a2f2f;border-color:#a33;color:#fff}.toolbar .width-dot{display:inline-block;border-radius:50%;background:currentColor}.layer-panel{position:fixed;top:42px;right:8px;z-index:10;display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-radius:10px;background:#14181cd9;border:1px solid #2c353d;font-size:13px}.layer-panel .layer-row{display:flex;align-items:center;gap:10px}.layer-panel .layer-toggle{display:flex;align-items:center;gap:6px;width:78px;cursor:pointer}.layer-panel input[type=range]{width:90px;cursor:pointer}.text-entry{position:absolute;z-index:15;min-width:120px;padding:4px 6px;border:1px solid #40c4ff;border-radius:4px;background:#14181cf2;color:#eceff1;font-family:system-ui,sans-serif;font-size:15px;resize:none;outline:none}.map-container.drawing{cursor:crosshair}.map-container.selecting{cursor:default}.reconnect-banner{position:fixed;top:8px;left:50%;transform:translate(-50%);z-index:20;padding:6px 14px;border-radius:6px;background:#ffb34deb;color:#1c1400;font-size:13px;font-weight:600;pointer-events:none}.callout-tool{position:fixed;bottom:calc(16px + env(safe-area-inset-bottom,0px));right:calc(16px + env(safe-area-inset-right,0px));z-index:10;display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:10px;border:1px solid #2c353d;background:#14181cd9;color:#cfd8dc;font-size:14px;cursor:pointer}.callout-tool.active{background:#3d7ea6;border-color:#3d7ea6;color:#fff}.callout-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30}.radial-menu{position:absolute;width:0;height:0}.radial-center{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:#ffffffd9;box-shadow:0 0 0 2px #00000080}.radial-item{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;border-radius:50%;border:2px solid rgba(255,255,255,.85);box-shadow:0 2px 8px #00000080;padding:0;cursor:pointer}.radial-item:hover{border-color:#fff;filter:brightness(1.15)}.callout-actions{position:absolute;transform:translate(-50%,calc(-100% - 12px));display:flex;flex-direction:column;gap:4px;padding:6px;border-radius:8px;border:1px solid #2c353d;background:#14181cf2;box-shadow:0 4px 16px #00000080}.callout-action{padding:8px 16px;border:none;border-radius:6px;background:#1c2228;color:#cfd8dc;font-size:14px;text-align:left;cursor:pointer;white-space:nowrap}.callout-action:hover{background:#2c353d}.callout-action.danger{color:#ef5350}.callout-action.danger:hover{background:#3a2626}.top-right-controls{position:fixed;top:calc(8px + env(safe-area-inset-top,0px));right:calc(8px + env(safe-area-inset-right,0px));z-index:15;display:flex;gap:6px}.members-toggle,.hexes-toggle{padding:6px 12px;border:1px solid #37424b;border-radius:6px;background:#1c2228e6;color:#cfd8dc;font-size:13px;cursor:pointer}.members-toggle[aria-pressed=true]{background:#3d7ea6;border-color:#3d7ea6;color:#fff}.hex-picker{display:block;width:100%;max-height:55vh;-webkit-user-select:none;user-select:none}.hex-pick{cursor:pointer;outline:none}.hex-pick polygon{fill:#232c33;stroke:#37424b;stroke-width:40}.hex-pick text{fill:#78909c;font-size:300px;pointer-events:none}.hex-pick:hover polygon,.hex-pick:focus-visible polygon{stroke:#5c8aa8;fill:#2a3640}.hex-pick.selected polygon{fill:#3d7ea6;stroke:#7fb2d1}.hex-pick.selected text{fill:#eaf3f8}.hex-fieldset{margin:0;padding:10px;border:1px solid #2c353d;border-radius:8px}.hex-fieldset legend{padding:0 6px;font-size:12px;color:#90a4ae}.hex-edit-panel{width:min(560px,100%);max-height:calc(100dvh - 32px);overflow-y:auto}.member-panel{position:fixed;top:44px;right:8px;z-index:15;width:min(360px,calc(100% - 16px));max-height:calc(100% - 60px);overflow-y:auto;padding:14px 16px;border-radius:10px;background:#1c2228f7;border:1px solid #2c353d;box-sizing:border-box}.member-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.member-panel-head h2{margin:0;font-size:15px}.icon-btn{border:none;background:transparent;color:#90a4ae;font-size:15px;cursor:pointer;padding:2px 6px}.member-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.member-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:6px 8px;border-radius:6px;background:#14181c;font-size:13px}.online-dot{width:8px;height:8px;border-radius:50%;background:#455a64;flex:none}.online-dot.online{background:#66bb6a}.member-name{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.you-tag{color:#78909c}.role-tag{flex:none;padding:1px 7px;border-radius:10px;font-size:11px;font-weight:600}.role-tag.role-owner{background:#7e57c2;color:#fff}.role-tag.role-command{background:#3d7ea6;color:#fff}.role-tag.role-member{background:#37424b;color:#cfd8dc}.member-actions{flex:1 1 100%;display:flex;gap:6px;flex-wrap:wrap}.mini-btn{padding:4px 10px;border:1px solid #37424b;border-radius:6px;background:#1c2228;color:#cfd8dc;font-size:12px;cursor:pointer}.mini-btn:hover:not(:disabled){border-color:#5c8aa8}.mini-btn:disabled{opacity:.5;cursor:default}.mini-btn.danger{border-color:#a1443f;color:#ef9a9a}.member-panel-admin{margin-top:14px;padding-top:12px;border-top:1px solid #2c353d;display:flex;flex-direction:column;gap:8px}.dialog-actions{display:flex;gap:10px;align-items:center}.rotate-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:16px;background:#0a0c0eb3}.role-toast{position:fixed;top:44px;left:50%;transform:translate(-50%);z-index:25;padding:8px 16px;border-radius:6px;background:#3d7ea6;color:#fff;font-size:13px;font-weight:600;pointer-events:none}