:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f6f4ef;color:#1e2320;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}.app-header{display:flex;align-items:end;justify-content:space-between;gap:24px;padding:28px clamp(16px,5vw,56px) 18px;background:#252a24;color:#fffaf1;border-bottom:4px solid #c45f35}.eyebrow{margin:0 0 6px;color:#f3c675;font-size:.78rem;font-weight:700;text-transform:uppercase}h1,h2,p,dl{margin:0}h1{font-size:clamp(2rem,6vw,4.5rem);line-height:.95;letter-spacing:0}h2{font-size:1rem;line-height:1.2}.protocol{display:grid;grid-template-columns:auto auto;gap:16px;font-size:.85rem;text-align:right}dt{color:#6d756f;font-size:.74rem;font-weight:700;text-transform:uppercase}.app-header dt{color:#f3c675}dd{margin:3px 0 0;font-weight:700}.layout{display:grid;grid-template-columns:minmax(280px,380px) minmax(320px,1fr);gap:16px;padding:18px clamp(16px,5vw,56px) 32px}.panel{border:1px solid #d7d2c5;border-radius:8px;background:#fffdf8;box-shadow:0 1px #252a2414}.controls-panel,.status-panel{padding:16px}.controls-panel{display:grid;gap:14px}.url-field{display:grid;gap:7px;font-weight:700}.url-field span{color:#4f5a52;font-size:.82rem}input,.url-field select{width:100%;min-width:0;border:1px solid #b8b2a6;border-radius:6px;padding:10px 11px;color:#1e2320;background:#fff}button{min-height:38px;border:1px solid #2f4436;border-radius:6px;padding:8px 12px;color:#fff;background:#2f4436;cursor:pointer}button:hover{background:#3f5a48}.button-row{display:flex;flex-wrap:wrap;gap:8px}.debug-details{border-top:1px solid #e5dfd3;padding-top:12px}.debug-details summary{cursor:pointer;font-size:.86rem;font-weight:800}.debug-details .button-row{margin-top:10px}.debug-details button{border-color:#89472e;background:#89472e}.debug-details button:hover{background:#a25736}.login-panel{display:grid;gap:14px;align-content:start;padding:16px}.status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.login-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.login-grid dd{overflow-wrap:anywhere;font-size:.85rem}#login-status[data-state=accepted]{color:#2f6b45}#login-status[data-state=rejected]{color:#a3332b}.world-panel{display:grid;gap:14px;align-content:start;padding:16px}.join-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.join-grid dd{overflow-wrap:anywhere;font-size:.85rem}#join-status[data-state=joined]{color:#2f6b45}#join-status[data-state=rejected]{color:#a3332b}.presence-header{padding:0;border-bottom:none}.presence-list{display:grid;gap:6px;max-height:220px;margin:0;padding:0;overflow:auto;list-style:none}.presence-entry{display:flex;align-items:baseline;justify-content:space-between;gap:8px;border:1px solid #e0dacd;border-left:3px solid #c45f35;border-radius:6px;padding:7px 10px;background:#fbf8f0;font-size:.85rem}.presence-entry[data-self=true]{border-left-color:#2f6b45;font-weight:700}.presence-name{overflow-wrap:anywhere}.presence-id{color:#6d756f;font-size:.75rem;overflow-wrap:anywhere}.world-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.world-grid dd{overflow-wrap:anywhere;font-size:.85rem}#world-map{border:1px solid #d7d2c5;border-radius:6px;background:#fbf8f0;max-width:100%}.map-hint{margin:0;color:#6d756f;font-size:.78rem;font-style:italic}.hud-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hud-grid dd{overflow-wrap:anywhere;font-size:.85rem}.interaction-panel{display:grid;gap:14px;align-content:start;padding:16px}.inventory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.place-row{display:flex;gap:8px}.place-row select{flex:1 1 auto;min-width:0;border:1px solid #d7d2c5;border-radius:6px;padding:7px 9px;background:#fffdf8}.interaction-line{margin:0;overflow-wrap:anywhere;font-size:.85rem;min-height:1.1em}.interaction-line.error{color:#a3332b;font-weight:700}.mutation-list{display:flex;flex-direction:column;gap:5px;max-height:200px;margin:0;padding:0;overflow-y:auto;list-style:none}.mutation-entry{display:flex;flex-direction:column;gap:2px;border:1px solid #e0dacd;border-left:3px solid #417a91;border-radius:6px;padding:6px 10px;background:#fbf8f0;font-size:.82rem}.mutation-meta{color:#6d756f;font-size:.72rem;font-weight:700}.mutation-text{overflow-wrap:anywhere}.chat-list{display:flex;flex-direction:column;gap:5px;max-height:240px;margin:0 0 10px;padding:0;overflow-y:auto;list-style:none}.chat-entry{display:flex;flex-direction:column;gap:2px;border:1px solid #e0dacd;border-left:3px solid #c45f35;border-radius:6px;padding:6px 10px;background:#fbf8f0;font-size:.85rem}.chat-entry[data-self=true]{border-left-color:#2f6b45}.chat-entry.system{border-left-color:#b08300;font-style:italic}.chat-meta{color:#6d756f;font-size:.72rem;font-weight:700}.chat-text{overflow-wrap:anywhere;white-space:pre-wrap}.chat-controls{display:flex;gap:8px}.chat-controls #chat-input{flex:1 1 auto;min-width:0}.chat-controls select,.chat-controls input,.chat-controls button{border:1px solid #d7d2c5;border-radius:6px;padding:7px 9px;background:#fffdf8}.chat-controls button{cursor:pointer;background:#c45f35;color:#fffaf1;border-color:#c45f35;font-weight:700}.status-grid div{min-width:0;border-left:3px solid #c45f35;padding-left:10px}#state[data-state=connected]{color:#2f6b45}#state[data-state=error]{color:#a3332b}.log-panel,.error-panel{grid-column:span 1;overflow:hidden}.section-header{padding:12px 14px;border-bottom:1px solid #e5dfd3}.log{display:grid;gap:10px;max-height:46vh;min-height:240px;margin:0;padding:12px;overflow:auto;list-style:none}.log-entry{border:1px solid #e0dacd;border-radius:6px;background:#fbf8f0;overflow:hidden}.log-entry.out{border-left:4px solid #2f4436}.log-entry.in{border-left:4px solid #417a91}.log-entry.error{border-left:4px solid #a3332b}.log-meta{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;padding:7px 9px;color:#4f5a52;font-size:.75rem;font-weight:800;text-transform:uppercase;background:#f0eadc}pre{margin:0;padding:10px;overflow:auto;color:#18211b;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.8rem;white-space:pre-wrap;word-break:break-word}@media(max-width:900px){.app-header{align-items:start;flex-direction:column}.protocol{grid-template-columns:1fr;text-align:left}.layout{grid-template-columns:1fr}.status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.status-grid{grid-template-columns:1fr}button{flex:1 1 140px}}
