:root{--color-gray-0: #0e0e10;--color-gray-100: #121214;--color-gray-200: #1a1a1c;--color-gray-300: #242426;--color-gray-400: #2e2e31;--color-gray-500: #3a3a3e;--color-gray-600: #8a8a8a;--color-gray-700: #c8c8c8;--color-gray-800: #ededed;--color-gray-900: #ffffff;--color-teal-400: #5cc0c0;--color-teal-500: #3aa8a8;--color-ink: #1a1a1a;--color-tool-600: #2e7a7a;--color-link-400: #6b9fd4;--color-warning-400: #f2a126;--color-success-400: #5cb86a;--color-neutral-600: #4a4a52;--color-selection-bg: #1e3333;--bg-app: var(--color-gray-0);--bg-viewport: var(--color-gray-100);--bg-chrome: var(--color-gray-200);--bg-surface: var(--color-gray-300);--bg-elevated: var(--color-gray-400);--bg-selected: var(--color-selection-bg);--bg-input: var(--color-gray-200);--border-subtle: var(--color-gray-500);--text-primary: var(--color-gray-800);--text-muted: var(--color-gray-600);--text-on-accent: var(--color-ink);--accent-primary: var(--color-teal-400);--accent-tool: var(--color-tool-600);--accent-link: var(--color-link-400);--accent-warning: var(--color-warning-400);--accent-success: var(--color-success-400);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-sm: var(--space-1);--space-md: var(--space-2);--space-lg: var(--space-3);--space-xl: var(--space-4);--radius-1: 2px;--radius-2: 4px;--radius-3: 6px;--radius-4: 8px;--radius-control: var(--radius-2);--radius-panel: var(--radius-4);--control-h: 28px;--bg-darkest: var(--bg-app);--bg-darker: var(--bg-chrome);--bg-panel: var(--bg-surface);--border-dark: var(--border-subtle);--border-light: var(--color-neutral-600);--accent-secondary: var(--accent-link);--accent-danger: #ff5555;--accent-danger-alt: #e74c3c;--text-muted-dark: #666;--text-muted-light: #999;--text-secondary: var(--color-gray-700);--text-bright: var(--color-gray-800);--text-brighter: #f5f5f5;--text-white: var(--color-gray-900);--bg-hover: rgba(255, 255, 255, .05);--bg-active-light: rgba(92, 192, 192, .18);--bg-active-hover: rgba(92, 192, 192, .28);--shadow-accent: rgba(92, 192, 192, .3);--bg-dark-overlay: rgba(0, 0, 0, .2);--border-overlay: rgba(255, 255, 255, .05);--shadow-primary: rgba(107, 159, 212, .3);--bg-hover-light: rgba(255, 255, 255, .03);--font-size-xs: 10px;--font-size-sm: 11px;--font-size-md: 12px;--font-size-lg: 13px;--font-size-xl: 14px;--font-weight-normal: 400;--font-weight-semibold: 600;--font-weight-bold: bold}body{font-family:Inter,Segoe UI,sans-serif;color:var(--text-white);background-color:var(--bg-darker);font-size:var(--font-size-md);font-weight:var(--font-weight-normal);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{margin:0;font-weight:var(--font-weight-bold);color:var(--text-white);line-height:1.2}h1{font-size:24px;letter-spacing:-.5px}h2{font-size:20px;letter-spacing:-.3px}h3{font-size:18px;letter-spacing:-.2px}h4{font-size:16px}h5{font-size:var(--font-size-xl)}h6{font-size:var(--font-size-lg)}h1 span{color:var(--accent-success)}p{margin:0 0 1rem;color:var(--text-secondary)}small,.text-small{font-size:var(--font-size-sm);color:var(--text-muted)}a{color:var(--accent-primary);text-decoration:none;transition:color .2s ease}a:hover{color:var(--text-white)}label{font-size:var(--font-size-md);color:var(--text-primary);font-weight:var(--font-weight-semibold)}.section-divider{margin-top:0;padding:8px;border:none;border-radius:var(--radius-panel, 8px);background:var(--bg-surface, #242426)}.section-title{color:var(--text-muted, #8a8a8a);font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;line-height:14px;margin:0 0 8px;display:block}.section-subtitle{color:#ddd;font-size:11px;font-weight:700;letter-spacing:.5px;display:block;margin-bottom:8px;text-transform:uppercase}.help-text{font-size:10px;color:#bbb;display:block;margin-bottom:6px}.grid-3,.grid-2{display:flex;gap:10px}.grid-col{flex:1}.grid-col-label{display:block;margin-bottom:5px;font-size:11px;font-weight:600;color:#eee}.prop-grid{display:grid;grid-template-columns:repeat(var(--cols, 2),1fr);gap:10px;margin-top:5px;min-width:0}@container props (max-width: 260px){.prop-grid{grid-template-columns:1fr!important}}.form-group{display:flex;flex-direction:column;gap:6px}label{font-size:13px;font-weight:600;color:#eee}input,select{background:#00000080;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:10px 12px;color:#fff;font-size:14px;font-family:Inter,sans-serif;transition:border .3s ease;width:100%}input:focus,select:focus{outline:none;border-color:#0f8}select option{background:#1a1a1a;color:#fff}input[type=number],select{background:#1a1a1a;color:#fff;border:1px solid #333;padding:8px;border-radius:4px;outline:none;transition:all .2s ease}input[type=number]:focus,select:focus{border-color:var(--accent-primary);box-shadow:0 0 5px var(--shadow-accent)}input.mixed-values{border-color:#f90!important;box-shadow:0 0 8px #f906!important}input[type=checkbox]{width:16px!important;height:16px!important;border-radius:var(--radius-control)!important;cursor:pointer;accent-color:var(--accent-primary);background:var(--bg-input)!important;border:1px solid var(--border-subtle)!important}.checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px}.checkbox-label input{margin:0}.checkbox-group{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px;background:#111;padding:10px;border-radius:6px}.radio-group{display:flex;gap:16px;margin-top:8px}.radio-label{display:flex;align-items:center;gap:6px;font-size:12px;color:#ccc;cursor:pointer}.radio-label input[type=radio]{margin:0;padding:0;appearance:none;width:14px;height:14px;border:1px solid #555;border-radius:50%;background:#222;position:relative;transition:all .2s}.radio-label input[type=radio]:checked{border-color:var(--accent-primary)}.radio-label input[type=radio]:checked:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:6px;height:6px;border-radius:50%;background:var(--accent-primary)}.radio-label:hover input[type=radio]{border-color:#777}.form-select{width:100%;background:#111;color:#fff;border:1px solid #333;padding:5px;border-radius:4px;margin-top:5px}.form-input{width:100%;box-sizing:border-box;height:var(--control-h, 28px);padding:0 8px;background:var(--bg-input, #1a1a1c);border:1px solid var(--border-subtle, #3a3a3e);color:var(--text-primary, #ededed);font-size:var(--font-size-sm, 11px);border-radius:var(--radius-control, 4px)}.form-input-readonly{background:#222;border:1px solid #333;color:#888;cursor:not-allowed}.form-input-center{text-align:center}.form-input-dark{background:#222;border:1px solid #444;color:#fff;padding:6px;border-radius:4px;width:100%}.form-input-error{border-color:#e33!important;box-shadow:0 0 5px #e3333366!important}.form-input-linked{border-color:var(--accent-primary)!important;box-shadow:0 0 0 1px var(--shadow-accent)!important}.prop-field-link-badge{display:block;font-size:10px;font-family:Courier New,monospace;color:var(--accent-primary);cursor:help;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.prop-field-input-wrap{position:relative;width:100%;display:block}.form-input-has-var-picker,.form-input-has-unit{padding-right:28px!important}.prop-field-unit{position:absolute;top:50%;right:8px;transform:translateY(-50%);pointer-events:none;color:var(--text-muted, #8a8a8a);font-size:var(--font-size-sm, 11px);font-variant-numeric:tabular-nums;line-height:1;z-index:1}.prop-field-input-wrap:has(.prop-field-var-btn) .prop-field-unit{right:28px}.prop-field-var-btn{appearance:none;position:absolute;top:0;right:0;bottom:0;width:26px;height:auto;margin:0!important;padding:0!important;border:none!important;border-radius:0 var(--radius-control, 4px) var(--radius-control, 4px) 0!important;background:transparent!important;color:var(--accent-primary, #5cc0c0)!important;font-size:11px;font-weight:700;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-style:italic;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:none!important;transform:none!important;z-index:1}.prop-field-var-btn:hover,.prop-field-var-btn[aria-expanded=true]{color:var(--text-primary, #ededed)!important;background:var(--bg-active-light)!important;box-shadow:none!important;transform:none!important}.prop-field-var-dropdown{position:absolute;z-index:40;left:0;right:0;top:calc(100% + 2px);margin:0;padding:4px 0;list-style:none;max-height:180px;overflow-y:auto;background:var(--bg-chrome, #1a1a1c);border:1px solid var(--border-subtle, #3a3a3e);border-radius:var(--radius-control, 4px);box-shadow:0 6px 16px #0000008c}.prop-field-var-dropdown-caption{padding:4px 10px 6px;font-size:10px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:#8a8a8a;border-bottom:1px solid #333;margin-bottom:2px;cursor:default}.prop-field-var-dropdown-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;font-size:12px;color:#f0f0f0;cursor:pointer}.prop-field-var-dropdown-row:hover{background:#5bc0be2e}.prop-field-var-name{display:inline-flex;align-items:center;gap:4px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f0f0f0;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:11px}.prop-field-var-value{flex-shrink:0;color:#9a9a9a;font-variant-numeric:tabular-nums;font-size:11px}.prop-field-var-warn{color:#e6a23c;font-size:10px}.prop-field-inline{display:block;position:relative}.prop-field-input-wrap--inline{display:flex;align-items:center;gap:8px;height:28px;min-height:28px;padding:0 8px;border:1px solid var(--border-subtle, #3a3a3e);border-radius:6px;background:var(--bg-surface, #242426);box-sizing:border-box;cursor:text}.prop-field-inline--linked .prop-field-input-wrap--inline{border-color:var(--accent-primary)}.prop-field-inline-label{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:20px;font-size:12px;line-height:14px;color:var(--text-muted, #8a8a8a);pointer-events:none;z-index:1}.prop-field-inline-input{flex:1 1 auto;min-width:0;height:16px;margin:0;padding:0 0 0 28px;border:none;background:transparent;color:var(--text-primary, #ededed);font:inherit;font-size:12px;line-height:16px;outline:none}.prop-field-inline-input[readonly]{color:var(--text-muted, #8a8a8a);cursor:default}.prop-field-inline-input.form-input-error{color:#e33}.prop-field-input-wrap--inline .prop-field-unit,.prop-field-input-wrap--inline:has(.prop-field-var-btn) .prop-field-unit{position:static;transform:none;order:2}.prop-field-input-wrap--inline .prop-field-var-btn{position:static;order:3;width:22px;height:100%;border-radius:4px!important}.prop-field-var-dropdown-row.is-active{background:var(--bg-active-light)}.prop-field-inline-link{flex:0 1 auto;order:1;max-width:55%;padding:1px 6px;border-radius:4px;background:var(--shadow-accent, rgba(92, 192, 192, .18));color:var(--accent-primary, #5cc0c0);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:10px;line-height:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:help}.prop-field-link-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.prop-field-inline-link{display:inline-flex;align-items:center;gap:4px}.prop-field-link-badge{display:flex;align-items:center;gap:4px}.prop-field-unlink{flex:0 0 auto;width:14px;height:14px;margin:0!important;padding:0!important;border:none!important;border-radius:50%!important;background:transparent!important;color:inherit!important;font-size:12px;line-height:14px;cursor:pointer;box-shadow:none!important;transform:none!important}.prop-field-unlink:hover{background:#e3333340!important;color:#e33!important}button{appearance:none;background:var(--bg-surface, #242426);color:var(--text-primary, #ededed);border:1px solid var(--border-subtle, #3a3a3e);border-radius:var(--radius-control, 4px);padding:8px 12px;font-size:12px;font-weight:400;line-height:14px;cursor:pointer;margin:0;box-shadow:none;transition:background .15s ease,border-color .15s ease,color .15s ease}button:hover:not(:disabled){background:var(--bg-elevated, #2e2e31);color:var(--text-primary, #ededed);transform:none;box-shadow:none}button:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}.btn-add{background:var(--bg-surface)!important;color:var(--accent-primary)!important;border:1px solid var(--accent-tool)!important;box-shadow:none!important;padding:6px 10px!important;transition:all .15s ease!important;border-radius:var(--radius-control)!important;margin:0;font-size:var(--font-size-md);font-weight:600}.btn-add:hover{background:var(--bg-active-light)!important;border-color:var(--accent-primary)!important;color:var(--text-primary)!important;transform:none!important}.btn-delete{background:transparent!important;color:#f44!important;padding:4px!important;margin:0!important;border:none!important;font-size:14px!important;opacity:.7;transition:opacity .2s ease,transform .2s ease!important}.btn-delete:hover{background:transparent!important;color:#f22!important;opacity:1;transform:scale(1.1)!important;box-shadow:none}.btn-group{display:flex;gap:10px;margin-top:10px}.btn-group .btn-add{flex:1;padding:4px;font-size:11px;margin-top:0}.btn-secondary{background:#2a2a2a!important;color:#ddd!important;border:1px solid #444!important;box-shadow:none!important;padding:4px 8px!important;transition:all .2s ease!important;border-radius:4px!important;margin:0!important;font-size:12px}.btn-secondary:hover{background:#333!important;color:#fff!important;border-color:#555!important;transform:none!important}.btn-back{background:transparent;color:var(--accent-primary);border:1px solid var(--accent-primary);padding:4px 8px;font-size:var(--font-size-sm);border-radius:var(--radius-control);cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:4px;margin:0}.btn-back:hover{background:var(--bg-active-light);color:var(--text-white)}.duplicate-btn{width:100%;padding:10px;margin-top:15px;background:#2a2a2a;color:#fff;border:1px solid #444;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}.delete-btn-full{width:100%;padding:8px;margin-top:15px;background:#2a2a2a!important;color:#f44!important;border:1px solid #444!important;border-radius:4px!important}.tabs-header{display:flex;gap:4px;background:transparent;border:none;border-radius:0;padding:0;margin:0;box-shadow:none}.tab-btn{flex:0 0 auto;appearance:none;background:var(--bg-surface, #242426)!important;color:var(--text-muted, #8a8a8a)!important;border:none!important;padding:8px 12px!important;margin:0!important;font-size:13px;font-weight:400;letter-spacing:0;text-transform:none;line-height:14px;border-radius:var(--radius-control, 4px);cursor:pointer;transition:color .15s,background .15s;box-shadow:none!important;transform:none!important}.tab-btn:hover{color:var(--text-secondary, #c8c8c8)!important;background:var(--bg-elevated, #2e2e31)!important}.tab-btn.active{background:var(--accent-primary, #5cc0c0)!important;color:var(--text-on-accent, #1a1a1a)!important;border:none!important;box-shadow:none!important}.tab-content{display:flex;flex-direction:column;gap:8px}.tab-content>*:first-child,.tab-content>*:first-child .section-divider{margin-top:0}.list-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:#1e1e1e;border-radius:6px;margin-bottom:6px;cursor:pointer;border:1px solid #333;transition:all .2s ease}.list-item:hover{background:#252525;border-color:#555}.list-item.selected{border-color:#5bc0be;background:#5bc0be1a}.list-item-content{display:flex;flex-direction:column;flex:1}.item-name{font-size:13px;font-weight:600;color:#eee;margin-bottom:4px}.item-meta{font-size:11px;color:#aaa}.empty-state{padding:12px;text-align:center;font-size:12px;color:#777;background:#111;border-radius:6px;border:1px dashed #333;margin-top:5px}.shelf-item-row{display:flex;align-items:center;gap:10px;padding:8px 12px!important;background:#1e1e1e!important;border-radius:6px!important;margin-bottom:6px!important;cursor:pointer;border:1px solid #333;transition:all .2s ease}.shelf-item-row:hover{background:#252525!important;border-color:#555}.shelf-item-row.selected{border-color:#5bc0be!important;background:#5bc0be1a!important}.shelf-item-name{font-size:13px!important;font-weight:600!important;color:#eee!important;flex:1}.shelf-item-delete{background:transparent!important;color:#f44!important;padding:4px!important;margin:0!important;border:none!important;font-size:14px!important;opacity:.7;transition:opacity .2s ease,transform .2s ease!important}.shelf-item-delete:hover{background:transparent!important;color:#f22!important;opacity:1;transform:scale(1.1)!important;box-shadow:none!important}.shelf-item-delete{box-shadow:none!important}.spatial-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-control);padding:var(--space-md);margin-top:var(--space-md);box-shadow:none;border-left:1px solid var(--border-subtle)}.spatial-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.spatial-header-title{display:flex;align-items:center;gap:8px}.spatial-icon{font-size:14px;opacity:1}.spatial-title-text{font-size:var(--font-size-sm, 11px);font-weight:600;color:var(--text-muted, #8a8a8a);text-transform:none;letter-spacing:0;margin:0}.spatial-card .form-input{background:#181818!important;border:1px solid #666!important;color:#fff!important}.spatial-card .form-input:focus{border-color:var(--accent-primary)!important;background:var(--bg-app)!important;box-shadow:none!important}.panel-card{margin-bottom:var(--space-lg);padding:var(--space-md);background:var(--bg-surface);border-radius:var(--radius-control);border:1px solid var(--border-subtle)}.panel-card>.panel-header{display:flex;align-items:center;margin-bottom:12px;gap:10px}.sidebar.right .panel-body .panel-header{display:flex;align-items:center;margin-bottom:12px;gap:10px;height:auto;padding:0;border-bottom:none}.mate-card{background:#1a2228;border:1px solid #4a6a80;border-radius:5px;padding:10px;margin-top:10px;display:flex;align-items:center;justify-content:space-between}.mate-card-left{display:flex;align-items:center;gap:8px}.mate-icon{font-size:16px}.mate-info{display:flex;flex-direction:column}.mate-title{color:#7eb8e8;font-size:12px;font-weight:700}.mate-desc{color:#ddd;font-size:11px}.mate-delete{background:none;border:none;color:#e74c3c;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:4px}.mate-edit{background:none;border:none;color:var(--accent-primary);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:4px}.mate-edit:hover{background:#5bc0be26}.mate-edit.is-open{color:var(--accent-primary, #5cc0c0);background:#5bc0be26}.mate-offset-section{background:#1a2228;border:1px solid #4a6a80;border-top:none;border-radius:0 0 5px 5px;padding:8px 10px 10px;margin-top:-1px}.mate-offset-label{display:block;font-size:10px;color:#7eb8e8;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100vw;height:100vh;overflow:hidden;background:var(--bg-app);color:var(--text-primary)}:root{--app-content-inset-top: 100px;--app-content-inset-bottom: 24px}.render-container{position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:1}.sidebar,.glass-panel{position:absolute;z-index:10;display:flex;flex-direction:column;gap:0;padding:12px;border-radius:var(--radius-panel, 8px);background:var(--bg-chrome, #1a1a1c);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--border-subtle, #3a3a3e);box-shadow:0 1px #00000040;pointer-events:auto}.sidebar.left{top:var(--app-content-inset-top);left:12px;width:248px;height:calc(100vh - var(--app-content-inset-top) - var(--app-content-inset-bottom) - 8px)}
