@font-face{font-family:"Ark Pixel";src:url("/fonts/ark-pixel-zh-cn.woff2") format("woff2");font-display:swap}
:root{--terminal-size:16px;--bg:#050706;--panel:#0b0f0c;--line:#223127;--text:#c8d2c5;--muted:#66756a;--green:#69d17d;--bright:#a8ffb5;--yellow:#e6c568;--red:#e66b61}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%;overflow:hidden}
body{margin:0;background:var(--bg);color:var(--text);font-family:"Ark Pixel","Microsoft YaHei",monospace}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.mud-app{height:100dvh;display:grid;grid-template-rows:52px minmax(0,1fr) auto auto;background:#020302}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;border-bottom:1px solid var(--line);background:#080b09}
.role-control{display:flex;align-items:center;gap:8px;min-width:0}
.topbar select{min-width:150px;max-width:55vw;height:36px;padding:0 34px 0 10px;color:var(--bright);background:#0e1410;border:1px solid #2b3c30;border-radius:3px}
.pause-game{height:36px;padding:0 12px;border:1px solid #6d312c;border-radius:3px;background:#4a1715;color:#efaaa4;font-size:12px}
.pause-game:hover{background:#5b1d1a}.pause-game.paused{background:#281211;color:#a86a65}.pause-game:disabled{opacity:.4;cursor:not-allowed}
.top-actions{display:flex;align-items:center;gap:12px}
#connectionState{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
#connectionState i{width:7px;height:7px;border-radius:50%;background:#556158}
#connectionState.online{color:var(--green)}
#connectionState.online i{background:var(--green);box-shadow:0 0 8px #69d17d88}
.gear{width:36px;height:36px;border:1px solid #2b3c30;border-radius:3px;background:#0e1410;color:#aeb9b0;font-size:20px;line-height:1}
.terminal{min-height:0;overflow:auto;scrollbar-color:#304336 #050706;overscroll-behavior:contain;background:#020302}
.terminal-output{min-height:100%;padding:18px 20px 28px;white-space:pre-wrap;overflow-wrap:break-word;font-family:"Ark Pixel","Microsoft YaHei",monospace;font-size:var(--terminal-size);line-height:1.5;color:#c8d2c5;font-variant-ligatures:none;text-rendering:geometricPrecision}
.terminal-output .command{color:#6cc7d9}
.terminal-output .system{color:#59665d}
.terminal-output .error{color:var(--red)}
.os-panel{max-height:132px;overflow:hidden;padding:9px 12px 10px;border-top:1px solid var(--line);background:#0b0f0c}
.os-panel>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;color:#8fd49b;font-size:11px}
.os-panel>header i{color:#4f5e53;font-style:normal}
.os-feed{max-height:86px;overflow:auto;scrollbar-color:#304336 #0b0f0c}
.os-feed p{margin:0 0 5px;color:#aab5ac;font-size:13px;line-height:1.45}
.os-feed p:last-child{margin-bottom:0}
.os-feed time{margin-right:8px;color:#536158;font-size:10px}
.os-feed .empty-os{color:#536158}
.composer{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:10px max(10px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));border-top:1px solid var(--line);background:#080b09}
.composer textarea{resize:none;min-height:44px;max-height:120px;padding:11px 12px;color:#e2e9df;background:#0e1410;border:1px solid #2b3c30;border-radius:3px;outline:none;line-height:1.35}
.composer textarea:focus{border-color:#50745b;box-shadow:0 0 0 1px #50745b}
.composer button{min-width:70px;border:0;border-radius:3px;background:#2e6840;color:#eaffed;padding:0 16px}
.composer button:disabled,.composer textarea:disabled{opacity:.45}
#sendState{position:absolute;right:10px;top:-23px;padding:3px 7px;background:#0b0f0c;color:var(--green);font-size:11px}
.settings-layer{position:fixed;inset:0;z-index:20}
.settings-backdrop{position:absolute;inset:0;width:100%;border:0;background:#000a}
.settings{position:absolute;top:0;right:0;width:min(460px,100%);height:100%;overflow:auto;padding-bottom:30px;background:#0b0f0c;border-left:1px solid var(--line);box-shadow:-20px 0 60px #0008}
.settings>header{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid var(--line)}
.settings h2,.settings h3{margin:0;font-weight:400}
.settings h2{color:#e4ebe1;font-size:20px}
.settings h3{color:#cbd6cd;font-size:15px;margin-bottom:13px}
.settings>header button{border:0;background:none;color:#92a096;font-size:28px}
.settings-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line)}
.settings-tabs button{border:0;background:none;color:var(--muted);padding:14px 5px}
.settings-tabs button.active{color:var(--green);box-shadow:inset 0 -2px var(--green)}
.settings-pane{padding:20px}
.settings-pane>section{padding:0 0 22px;margin-bottom:22px;border-bottom:1px solid var(--line)}
.inline-form{display:grid;grid-template-columns:1fr auto;gap:8px}
.inline-form input{min-width:0;padding:11px;color:#dce5dd;background:#070a08;border:1px solid #2b3c30;outline:none}
.inline-form button,.token-box button,.copy-prompt{border:1px solid #426049;background:#15231a;color:#a9e7b4;padding:10px 13px}
.token-box{margin-top:14px;padding:13px;border:1px solid #4d5733;background:#15170b}
.token-box small{color:var(--yellow)}
.token-box code{display:block;margin:10px 0;padding:10px;background:#020302;color:#baffc5;overflow-wrap:anywhere;user-select:all}
.token-box>div{display:flex;gap:8px}
.agent-list{margin-top:16px;border-top:1px solid var(--line)}
.agent-list article{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 0;border-bottom:1px solid var(--line)}
.agent-list b,.agent-list small{display:block}
.agent-list b{color:#dbe4dc;font-weight:400}
.agent-list small{margin-top:5px;color:var(--muted);font-size:11px}
.agent-list button{border:1px solid #4b3531;background:none;color:#cb7d75;padding:7px 9px}
.form-state{min-height:18px;margin-top:10px;color:var(--yellow);font-size:12px}
.range-title{display:flex;align-items:center;justify-content:space-between}
.range-title output{color:var(--green)}
#fontSize{width:100%;accent-color:#4a9a5d}
.logout{width:100%;padding:12px;border:1px solid #563a35;background:none;color:#d47f76}
.plugin-card small{color:var(--green);letter-spacing:.12em}
.plugin-card h3{font-size:22px;margin:8px 0}
.plugin-card p{color:#8b998e;line-height:1.7;font-size:13px}
.plugin-card a{display:block;padding:13px;text-align:center;text-decoration:none;background:#2e6840;color:#eaffed}
#promptText{max-height:330px;overflow:auto;white-space:pre-wrap;padding:14px;background:#020302;border:1px solid var(--line);color:#aebaae;font:12px/1.65 "Ark Pixel",monospace}
.copy-prompt{width:100%}
.auth-gate{height:100dvh;display:grid;place-items:center;padding:20px;background:#020302}
.auth-box{width:min(370px,100%);padding:24px;border:1px solid var(--line);background:#080b09}
.wordmark{color:var(--bright);font-size:34px;letter-spacing:.15em}
.auth-box>p{margin:8px 0 26px;color:#536058;font-size:11px;letter-spacing:.12em}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;margin-bottom:18px;border-bottom:1px solid var(--line)}
.auth-tabs button{border:0;background:none;color:var(--muted);padding:11px}
.auth-tabs button.active{color:var(--green);box-shadow:inset 0 -2px var(--green)}
.auth-box form{display:grid;gap:14px}
.auth-box label{color:#7e8c81;font-size:12px}
.auth-box input{display:block;width:100%;margin-top:7px;padding:12px;color:#e4ebe1;background:#020302;border:1px solid #2b3c30;outline:none}
.auth-box form>button{min-height:44px;border:0;background:#2e6840;color:#eaffed}
@media(max-width:600px){
  .topbar{height:50px}.topbar select{min-width:0;max-width:38vw}.pause-game{padding:0 8px;font-size:11px}
  #connectionState{font-size:10px}.terminal-output{padding:13px 12px 22px;line-height:1.45}
  .os-panel{max-height:116px}.os-feed{max-height:72px}.os-feed p{font-size:12px}
  .composer{padding-top:8px}.composer textarea{font-size:16px}.composer button{min-width:60px;padding:0 10px}
  .settings{border-left:0}.settings-pane{padding:17px}
  .inline-form{grid-template-columns:1fr}.inline-form button{min-height:42px}
}