*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{-webkit-font-smoothing:antialiased;background:#e8edf3;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;font-size:14px;line-height:1.5}:root{--brand:#0057a8;--brand-dark:#004a92;--brand-deeper:#003b78;--brand-bg:#ebf3fc;--brand-mid:#c9dff5;--bg:#fff;--surface:#fff;--surface-alt:#f5f7fa;--surface-inset:#eff2f6;--border:#d8dce4;--border-light:#ebeef4;--text:#1a1a1a;--text-sec:#3d4454;--text-muted:#6b7385;--text-subtle:#9ca3af;--text-white:#fff;--success:#1a7f3c;--success-bg:#e6f4ec;--success-mid:#b7dfca;--warn:#b45309;--warn-bg:#fef3e2;--warn-mid:#fcd28a;--danger:#b91c1c;--danger-bg:#fef2f2;--danger-mid:#fecaca;--map-bg:#0d1f3c;--map-grid:#142848;--space-xs:4px;--space-sm:8px;--space-md:12px;--space-lg:16px;--space-xl:24px;--space-2xl:32px;--r-sm:3px;--r-md:5px;--r-lg:8px;--r-pill:20px;--shadow-sm:0 1px 3px #00000014, 0 1px 2px #0000000f;--shadow-md:0 4px 12px #0000001a, 0 2px 6px #0000000f;--shadow-lg:0 12px 32px #00000024, 0 4px 12px #00000014;--ease:.15s ease}#root{background:#d6dce5;justify-content:center;min-height:100vh;padding:16px;display:flex}.app-screen{background:var(--surface-alt);border-radius:var(--r-lg);width:100%;max-width:430px;min-height:calc(100vh - 32px);box-shadow:var(--shadow-lg);flex-direction:column;display:flex;position:relative;overflow:hidden}.topbar{background:var(--brand);color:var(--text-white);padding:0 var(--space-lg);align-items:center;gap:var(--space-sm);flex-shrink:0;height:54px;display:flex;box-shadow:0 2px #00000026}.topbar-title{letter-spacing:-.01em;flex:1;font-size:.9375rem;font-weight:600}.topbar-back{color:#ffffffd9;cursor:pointer;transition:color var(--ease);background:0 0;border:none;margin-right:2px;padding:4px;font-size:1.25rem;line-height:1}.topbar-back:hover{color:#fff}.topbar-action{color:#fff;border-radius:var(--r-sm);cursor:pointer;letter-spacing:.01em;transition:background var(--ease);background:#ffffff29;border:1px solid #ffffff47;padding:5px 12px;font-family:inherit;font-size:.75rem;font-weight:500}.topbar-action:hover{background:#ffffff3d}.topbar-action.green{background:var(--success);border-color:var(--success)}.topbar-xp{border-radius:var(--r-pill);color:#d0e8ff;letter-spacing:.02em;background:#0000002e;padding:3px 10px;font-size:.6875rem;font-weight:600}.sec-hdr{background:var(--surface-alt);border-top:1px solid var(--border-light);border-bottom:1px solid var(--border);padding:6px var(--space-lg);letter-spacing:.08em;color:var(--text-muted);text-transform:uppercase;justify-content:space-between;align-items:center;font-size:.6875rem;font-weight:700;display:flex}.sec-hdr span{letter-spacing:0;color:var(--text-subtle);text-transform:none;font-size:.6875rem;font-weight:400}.btn{border-radius:var(--r-sm);cursor:pointer;transition:background var(--ease), border-color var(--ease), color var(--ease);letter-spacing:-.005em;border:none;justify-content:center;align-items:center;gap:6px;padding:10px 18px;font-family:inherit;font-size:.875rem;font-weight:500;line-height:1.25;text-decoration:none;display:inline-flex}.btn-primary{background:var(--brand);color:#fff}.btn-primary:hover{background:var(--brand-dark)}.btn-primary:active{background:var(--brand-deeper)}.btn-success{background:var(--success);color:#fff}.btn-success:hover{filter:brightness(1.08)}.btn-warn{background:var(--warn-bg);color:var(--warn);border:1px solid var(--warn-mid)}.btn-danger{background:var(--danger-bg);color:var(--danger);border:1px solid var(--danger-mid)}.btn-ghost{background:var(--bg);color:var(--text-sec);border:1px solid var(--border)}.btn-ghost:hover{background:var(--surface-alt);border-color:#b0b8c8}.btn-full{width:100%}.btn-sm{padding:6px 12px;font-size:.8125rem}.btn-lg{padding:13px 22px;font-size:.9375rem;font-weight:600}.tag{border-radius:var(--r-sm);letter-spacing:.01em;border:1px solid;align-items:center;padding:2px 7px;font-size:.6875rem;font-weight:600;display:inline-flex}.tag-mandatory{background:var(--brand-bg);color:var(--brand);border-color:var(--brand-mid)}.tag-needsApproval{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-mid)}.tag-urgent,.tag-overdue{background:var(--danger-bg);color:var(--danger);border-color:var(--danger-mid)}.tag-text{background:var(--brand-bg);color:var(--brand);border-color:var(--brand-mid)}.tag-link{color:var(--warn);border-color:var(--warn-mid);background:#fff7ed}.tag-form{background:var(--success-bg);color:var(--success);border-color:var(--success-mid)}.mission-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md);cursor:pointer;transition:background var(--ease), border-color var(--ease);display:flex;overflow:hidden}.mission-card:hover{background:var(--brand-bg);border-color:var(--brand-mid)}.mission-card.done{background:var(--success-bg);border-color:var(--success-mid)}.mission-card.done:hover{background:#d4eddf}.mission-accent{flex-shrink:0;width:3px}.mission-accent.text{background:var(--brand)}.mission-accent.link{background:var(--warn)}.mission-accent.form{background:var(--success)}.mission-body{flex:1;min-width:0;padding:10px 12px}.mission-title{color:var(--text);margin-bottom:5px;font-size:.875rem;font-weight:500;line-height:1.3}.mission-meta{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.mission-xp{color:var(--text-muted);font-size:.6875rem;font-weight:500}.mission-check{align-items:center;padding:10px 12px;font-size:1rem;display:flex}.stars{gap:2px;display:flex}.star{font-size:.75rem}.star.on{color:#e0a020}.star.off{color:var(--border)}.pbar{background:var(--border);border-radius:2px;height:4px;overflow:hidden}.pbar-fill{border-radius:2px;height:100%;transition:width .35s}.pbar-fill.primary{background:var(--brand)}.pbar-fill.success{background:var(--success)}.pbar-fill.warn{background:var(--warn)}.input{border:1px solid var(--border);border-radius:var(--r-sm);background:var(--bg);width:100%;color:var(--text);transition:border-color var(--ease), box-shadow var(--ease);outline:none;padding:9px 11px;font-family:inherit;font-size:.875rem;line-height:1.4}.input:focus{border-color:var(--brand);box-shadow:0 0 0 2px #0057a81f}.input::placeholder{color:var(--text-subtle)}textarea.input{resize:vertical;min-height:80px}.divider{background:var(--border);height:1px}.avatar{background:var(--brand-bg);color:var(--brand);letter-spacing:-.01em;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-weight:700;display:flex}.avatar.sm{width:30px;height:30px;font-size:.6875rem}.avatar.md{width:40px;height:40px;font-size:.875rem}.avatar.lg{width:52px;height:52px;font-size:1rem}.overlay-backdrop{z-index:10;background:#0a142880;align-items:flex-end;display:flex;position:absolute;inset:0}.overlay-panel{background:var(--bg);border-radius:var(--r-lg) var(--r-lg) 0 0;width:100%;max-height:92%;animation:.22s slideUp;overflow-y:auto;box-shadow:0 -8px 32px #0000002e}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.panel-hdr{padding:var(--space-lg) var(--space-lg) var(--space-md);border-bottom:1px solid var(--border);background:var(--bg);z-index:1;justify-content:space-between;align-items:flex-start;display:flex;position:sticky;top:0}.panel-close{background:var(--surface-inset);cursor:pointer;color:var(--text-muted);width:28px;height:28px;transition:background var(--ease);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.9rem;line-height:1;display:flex}.panel-close:hover{background:var(--border);color:var(--text)}.fullscreen{z-index:20;flex-direction:column;animation:.15s fadeIn;display:flex;position:absolute;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.scroll{-webkit-overflow-scrolling:touch;background:var(--surface-alt);flex:1;overflow-y:auto}.p16{padding:var(--space-lg);gap:var(--space-md);flex-direction:column;flex:1;display:flex}.row{align-items:center;gap:10px;display:flex}.row.sb{justify-content:space-between}.col{flex-direction:column;gap:5px;display:flex}.flex1{flex:1;min-width:0}.gap4{gap:4px}.gap8{gap:8px}.gap12{gap:12px}.mt4{margin-top:4px}.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}.map-canvas{background:var(--map-bg);aspect-ratio:16/10;width:100%;position:relative;overflow:hidden}.map-canvas:before{content:"";background:var(--brand);z-index:1;height:2px;position:absolute;top:0;left:0;right:0}.map-svg{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.map-hint{color:#ffffff2e;pointer-events:none;letter-spacing:.04em;font-size:.625rem;position:absolute;top:8px;left:10px}.ms-node{cursor:pointer;flex-direction:column;align-items:center;gap:4px;display:flex;position:absolute;transform:translate(-50%,-50%)}.ms-room{width:50px;height:28px;transition:transform var(--ease), box-shadow var(--ease);letter-spacing:.02em;border:1.5px solid;border-radius:3px;justify-content:center;align-items:center;font-size:.625rem;font-weight:700;display:flex;position:relative;overflow:hidden}.ms-room:hover{transform:scale(1.12);box-shadow:0 0 0 3px #ffffff40}.ms-room-fill{opacity:.3;height:100%;transition:width .4s;position:absolute;top:0;left:0}.ms-lbl{color:#fff6;text-align:center;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;max-width:68px;font-size:.5625rem;overflow:hidden}.ms-node.completed .ms-room{color:#5cc189;background:#162e22;border-color:#2d7a4f}.ms-node.inProgress .ms-room{border-color:var(--brand);color:#7ab8e8;background:#0d2040}.ms-node.upcoming .ms-room{color:#4a7098;background:0 0;border-color:#2d4b6e}.ms-node.locked .ms-room{color:#374151;cursor:default;background:#111827;border-color:#1f2d3d}.ms-node.active .ms-room{box-shadow:0 0 0 3px #0071d480,0 0 12px #0071d44d}.you-here{background:var(--brand);color:#fff;white-space:nowrap;letter-spacing:.04em;text-transform:uppercase;border-radius:2px;padding:2px 7px;font-size:.5625rem;font-weight:700;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%)}.you-here:after{content:"";border:3px solid #0000;border-top-color:var(--brand);position:absolute;top:100%;left:50%;transform:translate(-50%)}.map-legend{pointer-events:none;gap:10px;display:flex;position:absolute;bottom:8px;left:10px}.leg-item{color:#ffffff4d;align-items:center;gap:3px;font-size:.5625rem;display:flex}.leg-dot{border-radius:50%;width:6px;height:6px}.ms-strip{background:var(--bg);border-bottom:1px solid var(--border);padding:7px var(--space-lg);color:var(--text-muted);justify-content:space-between;align-items:center;gap:8px;font-size:.75rem;display:flex}.ms-pips{align-items:center;gap:4px;display:flex}.ms-pip{border-radius:50%;width:8px;height:8px}.buddy-card{background:var(--brand-deeper);border-radius:var(--r-md);padding:13px var(--space-lg);align-items:center;gap:var(--space-md);display:flex}.buddy-info .label{letter-spacing:.08em;color:#96c8ff99;text-transform:uppercase;margin-bottom:3px;font-size:.625rem;font-weight:700}.buddy-name{color:#fff;font-size:.9375rem;font-weight:600}.buddy-meta{color:#96c8ffb3;margin-top:2px;font-size:.75rem}.buddy-btn{color:#fff;border-radius:var(--r-sm);cursor:pointer;white-space:nowrap;transition:background var(--ease);background:#ffffff1a;border:1px solid #fff3;padding:6px 12px;font-family:inherit;font-size:.75rem;font-weight:500}.buddy-btn:hover{background:#ffffff2e}.res-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md);cursor:pointer;transition:background var(--ease), border-color var(--ease);align-items:center;gap:10px;padding:10px 13px;text-decoration:none;display:flex}.res-card:hover{background:var(--brand-bg);border-color:var(--brand-mid)}.res-icon{text-align:center;flex-shrink:0;width:24px;font-size:.9rem}.res-title{color:var(--text);font-size:.875rem;font-weight:500}.res-type{color:var(--text-muted);text-transform:capitalize;font-size:.6875rem}.qr-screen{background:#081424;flex-direction:column;flex:1;align-items:center;gap:18px;padding:0 24px 24px;display:flex}.qr-banner{color:#7ab8e8;text-align:center;letter-spacing:.01em;background:#0d2040;border-bottom:1px solid #1a3a6a;width:100%;padding:13px 16px;font-size:.875rem;font-weight:500}.qr-box{border-radius:var(--r-md);background:#fff;border:3px solid #fff;justify-content:center;align-items:center;width:200px;height:200px;margin-top:8px;display:flex;position:relative;box-shadow:0 0 0 1px #0071d44d,0 8px 24px #00000080}.qr-grid{opacity:.12;grid-template-columns:repeat(9,1fr);gap:2px;width:150px;height:150px;display:grid}.qr-cell{background:#000}.qr-info{text-align:center}.qr-title{color:#7ab8e8;font-size:.9375rem;font-weight:600}.qr-meta{color:#3a5a7a;margin-top:4px;font-size:.75rem}.sse-bar{border-radius:var(--r-sm);text-align:center;color:#7ab8e8;background:#0d2040;border:1px solid #1a3a6a;width:100%;padding:11px 14px;font-size:.8125rem}.sse-dot{background:var(--brand);border-radius:50%;width:7px;height:7px;margin-right:7px;animation:1.4s infinite blink;display:inline-block}@keyframes blink{0%,to{opacity:1}50%{opacity:.25}}.tutorial-bg{z-index:30;background:#081424b8;align-items:flex-end;display:flex;position:absolute;inset:0}.tutorial-card{background:var(--brand);border-radius:var(--r-lg) var(--r-lg) 0 0;color:#fff;width:100%;padding:22px 20px 18px;box-shadow:0 -4px 24px #0000004d}.tutorial-step{opacity:.6;letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px;font-size:.6875rem}.tutorial-title{letter-spacing:-.01em;margin-bottom:8px;font-size:1.0625rem;font-weight:700}.tutorial-body{opacity:.85;margin-bottom:20px;font-size:.875rem;line-height:1.55}.tutorial-footer{justify-content:space-between;align-items:center;display:flex}.tutorial-dots{gap:5px;display:flex}.t-dot{background:#ffffff47;border-radius:50%;width:6px;height:6px}.t-dot.on{background:#fff}.tutorial-next{color:#fff;border-radius:var(--r-sm);cursor:pointer;background:#ffffff29;border:1px solid #ffffff4d;padding:8px 18px;font-family:inherit;font-size:.875rem;font-weight:500}.tutorial-next:hover{background:#ffffff3d}.tutorial-skip{color:#ffffff80;cursor:pointer;background:0 0;border:none;font-family:inherit;font-size:.8125rem}.tabs{border-bottom:1px solid var(--border);background:var(--bg);flex-shrink:0;display:flex}.tab{text-align:center;cursor:pointer;color:var(--text-muted);transition:color var(--ease), border-color var(--ease);background:0 0;border:none;border-bottom:2px solid #0000;flex:1;padding:10px 6px;font-family:inherit;font-size:.8125rem;font-weight:500}.tab:hover{color:var(--text-sec)}.tab.on{color:var(--brand);border-bottom-color:var(--brand)}.player-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md);cursor:pointer;transition:background var(--ease), border-color var(--ease);align-items:center;gap:12px;padding:12px 13px;display:flex}.player-card:hover{background:var(--brand-bg);border-color:var(--brand-mid)}.player-name{color:var(--text);font-size:.9rem;font-weight:600}.player-role{color:var(--text-muted);font-size:.78rem}.ms-row{border-bottom:1px solid var(--border-light);align-items:center;gap:10px;padding:7px 0;display:flex}.ms-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px}.ms-row-name{flex:1;font-size:.875rem}.ms-row-xp{font-size:.6875rem;font-weight:600}.land-hero{background:var(--brand);text-align:center;background-image:linear-gradient(135deg,#ffffff0a 25%,#0000 25% 75%,#ffffff0a 75%);background-size:24px 24px;flex-direction:column;align-items:center;gap:8px;padding:36px 24px 30px;display:flex}.land-logo{color:#fff;letter-spacing:-.03em;font-size:2rem;font-weight:800;line-height:1.1}.land-logo-sub{color:#ffffff8c;letter-spacing:.06em;text-transform:uppercase;margin-top:2px;font-size:.75rem;font-weight:400}.land-tag{color:#fffc;font-size:.9rem;line-height:1.4}.drag-hint{color:#fff3;text-align:center;margin-top:4px;font-size:.6875rem}.empty{text-align:center;color:var(--text-muted);padding:28px 16px;font-size:.875rem;line-height:1.5}.text-muted{color:var(--text-muted)}.text-subtle{color:var(--text-subtle)}.text-primary{color:var(--brand)}.text-success{color:var(--success)}.text-warn{color:var(--warn)}.text-danger{color:var(--danger)}.text-white{color:#fff}.text-sm{font-size:.8125rem}.text-xs{font-size:.75rem}.bold{font-weight:600}.uppercase{text-transform:uppercase;letter-spacing:.06em}