:root{--bg: #1a1512;--bg-raised: #221b15;--bg-raised-2: #2b2219;--bg-raised-3: #332a1d;--border: #3a2e22;--border-strong: #4a3b2b;--text: #e8dfd5;--text-dim: #a6968a;--accent: #fc901e;--accent-hover: #f7a53c;--ok: #3fb950;--danger: #f85149;--err: var(--danger);--warn: #d29922;--mono: "JetBrains Mono", "Fira Code", "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--radius-sm: 4px;--radius: 6px;--radius-lg: 12px;--sidebar-width: 260px;--sidebar-width-collapsed: 56px}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}body{background:var(--bg);color:var(--text);font-family:var(--mono);font-size:13px}#app{height:100vh;width:100vw}.shell{display:flex;height:100%;width:100%}.main-column{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;height:100%}.header{display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-4);height:52px;flex:0 0 auto;background:var(--bg-raised);border-bottom:1px solid var(--border)}.header .brand{display:inline-flex;align-items:center;gap:6px;font-weight:700;letter-spacing:.5px;color:var(--text)}.header .brand-diamond{color:var(--accent)}.header .brand-word{background:linear-gradient(90deg,var(--accent-hover),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}.header .spacer{flex:1 1 auto}.header-script-name{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--text-dim);background:none;border:1px solid transparent;border-radius:var(--radius-sm);padding:4px 8px;cursor:text}.header-script-name:hover{color:var(--text);border-color:var(--border);background:var(--bg-raised-2)}.header-script-rename{font-family:var(--mono);font-size:13px;color:var(--text);background:var(--bg);border:1px solid var(--accent);border-radius:var(--radius-sm);padding:4px 8px;width:220px}.header-toast{font-size:12px;color:var(--text-dim);white-space:nowrap}.header-toast.ok{color:var(--ok)}.header-toast.error{color:var(--danger)}.status{display:flex;align-items:center;gap:8px;color:var(--text-dim);white-space:nowrap}.status .dot{width:10px;height:10px;border-radius:50%;background:var(--text-dim);box-shadow:0 0 6px currentColor}.status.connecting .dot,.status.auth .dot{background:var(--warn);color:var(--warn)}.status.open .dot{background:var(--ok);color:var(--ok)}.status.closed .dot{background:var(--text-dim);color:var(--text-dim)}.status.error .dot{background:var(--err);color:var(--err)}.btn{font-family:var(--mono);font-size:13px;color:var(--text);background:var(--bg-raised-2);border:1px solid var(--border);border-radius:6px;padding:7px 14px;cursor:pointer;transition:background .12s,border-color .12s}.btn:hover{background:var(--bg-raised-3);border-color:var(--border-strong)}.btn:active{transform:translateY(1px)}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--bg)}.btn.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.tab-bar-host{flex:0 0 auto}.tab-bar{display:flex;align-items:stretch;gap:4px;padding:4px 8px 0;background:var(--bg-raised);border-bottom:1px solid var(--border);overflow-x:auto;min-height:34px}.tab-bar .tab{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:12px;color:var(--text-dim);background:var(--bg-raised-2);border:1px solid var(--border);border-bottom:none;border-radius:6px 6px 0 0;padding:5px 10px;cursor:pointer;white-space:nowrap;max-width:220px}.tab-bar .tab:hover{color:var(--text);background:var(--bg-raised-3)}.tab-bar .tab.active{color:var(--text);background:var(--bg-raised);border-color:var(--accent)}.tab-bar .tab-label{overflow:hidden;text-overflow:ellipsis}.tab-bar .tab-badge{width:8px;height:8px;border-radius:50%;background:var(--err);box-shadow:0 0 5px var(--err);flex:0 0 auto}.tab-bar .tab-close{color:var(--text-dim);font-size:14px;line-height:1;border-radius:4px;padding:0 3px;visibility:hidden}.tab-bar .tab:hover .tab-close,.tab-bar .tab.active .tab-close{visibility:visible}.tab-bar .tab-close:hover{color:var(--err);background:#f8514922}.tab-bar .tab-rename{font-family:var(--mono);font-size:12px;color:var(--text);background:var(--bg);border:1px solid var(--accent);border-radius:6px 6px 0 0;padding:5px 8px;width:140px}.tab-bar .tab.dragging{opacity:.4}.tab-bar .tab.drop-before,.tab-bar .tab.drop-after{position:relative}.tab-bar .tab.drop-before:before,.tab-bar .tab.drop-after:after{content:"";position:absolute;top:2px;bottom:2px;width:2px;border-radius:1px;background:var(--accent);box-shadow:0 0 4px var(--accent)}.tab-bar .tab.drop-before:before{left:-3px}.tab-bar .tab.drop-after:after{right:-3px}.tab-bar .tab.drop-target{color:var(--text);background:#fc901e33;border-color:var(--accent);box-shadow:0 0 6px var(--accent)}.tab-bar .tab-add{font-family:var(--mono);font-size:16px;line-height:1;color:var(--text-dim);background:none;border:1px solid var(--border);border-bottom:none;border-radius:6px 6px 0 0;padding:2px 10px;cursor:pointer;flex:0 0 auto}.tab-bar .tab-add:hover{color:var(--text);background:var(--bg-raised-3)}.tab-chooser{position:fixed;z-index:200;display:flex;flex-direction:column;min-width:160px;max-width:260px;max-height:320px;overflow-y:auto;padding:4px;background:var(--bg-raised-2);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px #0009}.tab-chooser-item{font-family:var(--mono);font-size:12px;text-align:left;color:var(--text);background:none;border:none;border-radius:5px;padding:7px 10px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tab-chooser-item:hover{background:var(--bg-raised-3)}.editor-area{position:relative;flex:1 1 auto;min-height:0}#blocklyDiv{position:absolute;top:0;right:0;bottom:0;left:0}.log-panel{flex:0 0 auto;display:flex;flex-direction:column;background:var(--bg-raised);border-top:1px solid var(--border);height:220px;transition:height .15s ease}.log-panel.collapsed{height:34px}.log-header{display:flex;align-items:center;gap:8px;height:34px;flex:0 0 auto;padding:0 12px;border-bottom:1px solid var(--border)}.log-panel.collapsed .log-header{border-bottom:none}.log-toggle{background:none;border:none;color:var(--text);font-family:var(--mono);font-size:13px;cursor:pointer;padding:4px 6px}.log-clear{margin-left:auto;background:none;border:1px solid var(--border);border-radius:5px;color:var(--text-dim);font-family:var(--mono);font-size:12px;cursor:pointer;padding:3px 10px}.log-clear:hover{color:var(--text);border-color:var(--border-strong)}.log-list{flex:1 1 auto;overflow-y:auto;padding:6px 0}.log-panel.collapsed .log-list{display:none}.log-row{display:flex;gap:10px;padding:3px 14px;align-items:baseline;border-left:3px solid transparent;white-space:pre-wrap;word-break:break-word}.log-row.log-error{border-left-color:var(--err);background:#f8514911}.log-row .log-time{color:var(--text-dim);flex:0 0 auto;font-size:11px}.log-row .log-blockid{color:var(--accent);flex:0 0 auto;font-size:11px}.log-row.log-error .log-msg{color:#ff9d97}.log-clickable{cursor:pointer}.log-clickable:hover{background:#ffffff0a}.fullpage{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--bg)}.fullpage .card{max-width:560px;text-align:center;background:var(--bg-raised);border:1px solid var(--border);border-radius:12px;padding:36px 40px}.fullpage .icon{font-size:42px;margin-bottom:12px}.fullpage h1{margin:0 0 12px;font-size:20px;color:var(--text)}.fullpage p{margin:0;color:var(--text-dim);line-height:1.5}.fullpage.error h1{color:var(--err)}.reconnect-banner{background:#d2992222;border-bottom:1px solid var(--warn);color:#f0d08a;padding:8px 16px;text-align:center;font-size:12px;flex:0 0 auto}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:24px;background:#0009}.modal{display:flex;flex-direction:column;width:min(860px,100%);max-height:80vh;background:var(--bg-raised);border:1px solid var(--border);border-radius:12px;overflow:hidden}.modal-header{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--border)}.modal-title{font-weight:700;font-size:15px;color:var(--text);flex:1 1 auto}.modal-body{display:flex;flex-direction:column;gap:12px;padding:16px 18px;overflow:hidden;min-height:0}.tr-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.tr-default{display:flex;align-items:center;gap:6px;margin-left:auto;color:var(--text-dim);font-size:12px}.tr-select{font-family:var(--mono);font-size:12px;color:var(--text);background:var(--bg-raised-2);border:1px solid var(--border);border-radius:6px;padding:5px 8px}.tr-scroll{overflow:auto;min-height:0;border:1px solid var(--border);border-radius:8px}.tr-empty{margin:0;padding:24px;text-align:center;color:var(--text-dim)}.tr-table{border-collapse:collapse;width:100%;font-size:12px}.tr-table th,.tr-table td{border:1px solid var(--border);padding:4px 6px;text-align:left;vertical-align:middle}.tr-table thead th{position:sticky;top:0;background:var(--bg-raised-2);color:var(--text);white-space:nowrap}.tr-col-del,.tr-row-del{margin-left:6px;color:var(--text-dim);background:none;border:none;cursor:pointer;font-size:13px;line-height:1}.tr-col-del:hover,.tr-row-del:hover{color:var(--err)}.tr-key-cell{white-space:nowrap}.tr-key-name{color:var(--accent)}.tr-cell{width:100%;min-width:120px;font-family:var(--mono);font-size:12px;color:var(--text);background:var(--bg);border:1px solid transparent;border-radius:4px;padding:4px 6px}.tr-cell:focus{outline:none;border-color:var(--accent)}.tr-cell-warn{border-color:var(--warn);background:color-mix(in srgb,var(--warn) 12%,var(--bg))}.tr-key-placeholders{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.tr-placeholder-chip{font-family:var(--mono);font-size:10px;color:var(--text-dim);background:var(--bg-raised-2);border:1px solid var(--border);border-radius:4px;padding:1px 5px}.gs-modal{width:min(520px,100%)}.gs-body{overflow-y:auto}.gs-field{display:flex;align-items:center;gap:12px}.gs-label{flex:1 1 auto;color:var(--text);font-size:13px}.gs-input,.gs-select{flex:0 0 auto;width:180px;font-size:13px;color:var(--text);background:var(--bg-raised-2);border:1px solid var(--border);border-radius:6px;padding:6px 8px}.gs-input:focus,.gs-select:focus{outline:none;border-color:var(--accent)}.gs-input:disabled{opacity:.5}.gs-toggle{flex:0 0 auto;width:18px;height:18px;accent-color:var(--accent)}.gs-hint{margin:-4px 0 4px;color:var(--text-dim);font-size:12px}.var-modal-form{display:flex;flex-direction:column;gap:12px}.var-modal-error{margin:0;color:var(--danger, #e05252);font-size:12px}.var-modal-actions{display:flex;justify-content:flex-end;gap:8px}.sidebar-host{flex:0 0 auto;height:100%}.sidebar{display:flex;flex-direction:column;width:var(--sidebar-width);height:100%;background:var(--bg-raised);border-right:1px solid var(--border);transition:width .15s ease;overflow:hidden}.sidebar.collapsed{width:var(--sidebar-width-collapsed)}.sidebar-toggle-row{display:flex;justify-content:flex-end;align-items:center;height:32px;padding:0 var(--space-2);flex:0 0 auto}.sidebar.collapsed .sidebar-toggle-row{justify-content:center;padding:0}.sidebar-header{display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:0 var(--space-3) var(--space-3);border-bottom:1px solid var(--border);flex:0 0 auto}.sidebar-header .sidebar-player{justify-content:flex-start}.sidebar.collapsed .sidebar-header{padding:0 0 var(--space-2)}.sidebar-player{display:flex;align-items:center;gap:var(--space-2);min-width:0;flex:1 1 auto}.sidebar.collapsed .sidebar-player{flex:0 0 auto}.sidebar-avatar{width:40px;height:40px;border-radius:var(--radius);image-rendering:pixelated;background:var(--bg-raised-2);border:1px solid var(--border);flex:0 0 auto}.sidebar-player-info{display:flex;flex-direction:column;min-width:0;gap:2px}.sidebar-player-name{font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-player-room{font-size:11px;color:var(--text-dim)}.sidebar-toggle{flex:0 0 auto;width:24px;height:24px;font-family:var(--mono);color:var(--text-dim);background:none;border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer}.sidebar-toggle:hover{color:var(--text);background:var(--bg-raised-2)}.sidebar-scroll{flex:1 1 auto;overflow-y:auto;min-height:0}.sidebar-section{padding:var(--space-3);border-bottom:1px solid var(--border)}.sidebar.collapsed .sidebar-section{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-2)}.sidebar-section-title{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--text-dim);margin-bottom:var(--space-2)}.sidebar-script-list{display:flex;flex-direction:column;gap:var(--space-1)}.sidebar-empty{margin:0;padding:var(--space-3) 0;color:var(--text-dim);font-size:12px}.sidebar-script-row{display:flex;align-items:stretch;gap:4px}.sidebar-script-open{flex:1 1 auto;display:flex;align-items:center;gap:var(--space-2);min-width:0;font-family:var(--mono);font-size:12px;text-align:left;color:var(--text-dim);background:none;border:1px solid transparent;border-radius:var(--radius-sm);padding:6px 8px;cursor:pointer;transition:background .12s,border-color .12s,color .12s}.sidebar-script-open:hover{color:var(--text);background:var(--bg-raised-2)}.sidebar-script-row.active .sidebar-script-open{color:var(--text);background:#fc901e22;border-color:var(--accent)}.sidebar-script-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.script-badge{flex:0 0 auto;font-size:10px;line-height:1.4;border-radius:10px;padding:0 6px;white-space:nowrap}.script-badge.published{color:var(--ok);border:1px solid var(--ok)}.script-badge.unlisted{color:var(--warn);border:1px solid var(--warn)}.sidebar-script-action{flex:0 0 auto;width:24px;color:var(--text-dim);background:none;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:12px;visibility:hidden}.sidebar-script-row:hover .sidebar-script-action{visibility:visible}.sidebar-script-action:hover{color:var(--text);background:var(--bg-raised-2)}.sidebar-script-action.danger:hover{color:var(--danger);background:#f8514922}.sidebar-script-rename{flex:1 1 auto;font-family:var(--mono);font-size:12px;color:var(--text);background:var(--bg);border:1px solid var(--accent);border-radius:var(--radius-sm);padding:6px 8px}.sidebar-create-btn{width:100%;margin-top:var(--space-2);font-family:var(--mono);font-size:12px;color:var(--text-dim);background:none;border:1px dashed var(--border);border-radius:var(--radius-sm);padding:6px 8px;cursor:pointer}.sidebar-create-btn:hover{color:var(--text);border-color:var(--accent)}.sidebar-create-form{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-2)}.sidebar-create-input{font-family:var(--mono);font-size:12px;color:var(--text);background:var(--bg);border:1px solid var(--accent);border-radius:var(--radius-sm);padding:6px 8px}.sidebar-create-actions{display:flex;gap:var(--space-2)}.sidebar-publish-btn{width:100%;margin-bottom:var(--space-2);font-family:var(--mono);font-size:12px;color:var(--text);background:var(--bg-raised-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 8px;cursor:pointer}.sidebar-publish-btn:hover{border-color:var(--accent)}.sidebar-tool-btn{width:100%;text-align:left;font-family:var(--mono);font-size:12px;color:var(--text-dim);background:none;border:1px solid transparent;border-radius:var(--radius-sm);padding:6px 8px;cursor:pointer;margin-bottom:var(--space-1)}.sidebar-tool-btn:hover{color:var(--text);background:var(--bg-raised-2)}.sidebar-icon-btn{width:32px;height:32px;font-family:var(--mono);font-size:13px;font-weight:700;color:var(--text-dim);background:none;border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer}.sidebar-icon-btn:hover{color:var(--text);background:var(--bg-raised-2)}.sidebar-footer{flex:0 0 auto;padding:var(--space-3);border-top:1px solid var(--border)}.sidebar-tagline{font-style:italic;font-size:11px;font-weight:600;margin-bottom:var(--space-1);background:linear-gradient(90deg,#a54f2e,#5e2919);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.6}.sidebar.collapsed .sidebar-footer{display:flex;justify-content:center}.picker-dropdown{padding:6px;width:260px;color:#241c15}.picker-filter{width:100%;box-sizing:border-box;padding:4px 6px;margin-bottom:6px;font-family:inherit}.picker-list{max-height:260px;overflow-y:auto}.picker-row{padding:3px 6px;cursor:pointer;border-radius:3px;font-size:12px}.picker-row:hover{background:#fce4c6}.picker-count{margin-top:4px;font-size:10px;color:#666}.picker-fallback-input{width:100%;box-sizing:border-box;padding:4px 6px;font-family:inherit}
