*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f0f0f;--bg-raised: #1a1a1a;--bg-surface:#222222;--border: #333333;--border-hl: #555555;--text: #e8e8e8;--text-dim: #888888;--accent: #c8b560;--accent-hl: #e0cc78;--btn-ghost: #2a2a2a;--font-mono: "JetBrains Mono", "Fira Mono", ui-monospace, monospace;--font-ui: system-ui, -apple-system, sans-serif;font-family:var(--font-ui);font-size:13px;color:var(--text);background:var(--bg)}.astral-app{display:flex;flex-direction:column;height:100vh;overflow:hidden}.astral-header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;height:48px;background:var(--bg-raised);border-bottom:1px solid var(--border);flex-shrink:0;gap:12px}.astral-header__left{display:flex;align-items:center;gap:8px}.astral-header__glyph{font-size:16px;color:var(--accent);line-height:1}.astral-header__title{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.astral-header__divider{color:var(--text-dim)}.astral-header__sub{font-size:11px;color:var(--text-dim);letter-spacing:.04em}.astral-header__right{display:flex;align-items:center;gap:8px}.astral-header__canvas-label{font-size:11px;color:var(--text-dim);letter-spacing:.04em}.astral-header__canvas-select{background:var(--bg-surface);border:1px solid var(--border);color:var(--text);font-size:12px;padding:4px 8px;border-radius:3px;cursor:pointer}.astral-header__canvas-select:focus{outline:none;border-color:var(--border-hl)}.astral-body{display:flex;flex:1;overflow:hidden}.astral-sidebar{width:240px;flex-shrink:0;display:flex;flex-direction:column;background:var(--bg-raised);border-right:1px solid var(--border);overflow-y:auto;overflow-x:hidden}.astral-sidebar__section{padding:12px;border-top:1px solid var(--border)}.astral-sidebar__section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.astral-sidebar__section-label{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}.astral-picker{display:flex;flex-direction:column;padding:8px;gap:2px}.astral-picker__btn{display:flex;align-items:center;gap:8px;padding:7px 10px;background:transparent;border:1px solid transparent;border-radius:4px;color:var(--text-dim);cursor:pointer;text-align:left;font-size:12px;transition:color .1s,background .1s}.astral-picker__btn:hover{background:var(--bg-surface);color:var(--text)}.astral-picker__btn--active{background:var(--bg-surface);border-color:var(--border-hl);color:var(--accent)}.astral-picker__glyph{font-size:14px;width:18px;text-align:center;line-height:1}.astral-picker__label{font-size:12px;font-weight:500}.astral-controls{display:flex;flex-direction:column;gap:10px}.astral-control{display:flex;flex-direction:column;gap:4px}.astral-control__label{display:flex;justify-content:space-between;font-size:11px;color:var(--text-dim)}.astral-control__value{color:var(--text);font-family:var(--font-mono);font-size:11px}.astral-control__range{width:100%;accent-color:var(--accent);cursor:pointer}.astral-control__input,.astral-control__select{background:var(--bg-surface);border:1px solid var(--border);color:var(--text);font-size:12px;padding:4px 6px;border-radius:3px;width:100%}.astral-control__input:focus,.astral-control__select:focus{outline:none;border-color:var(--border-hl)}.astral-send-panel{display:flex;flex-direction:column;gap:6px;padding:12px;border-top:1px solid var(--border);margin-top:auto}.astral-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 12px;border:1px solid transparent;border-radius:4px;font-size:12px;font-weight:500;cursor:pointer;transition:background .1s,border-color .1s;white-space:nowrap}.astral-btn:disabled{opacity:.35;cursor:not-allowed}.astral-btn--primary{background:var(--accent);color:#000;border-color:var(--accent);font-weight:700}.astral-btn--primary:hover:not(:disabled){background:var(--accent-hl);border-color:var(--accent-hl)}.astral-btn--send{background:var(--bg-surface);color:var(--text);border-color:var(--border-hl)}.astral-btn--send:hover:not(:disabled){background:#2e2e2e}.astral-btn--ghost{background:transparent;color:var(--text-dim);border-color:var(--border)}.astral-btn--ghost:hover:not(:disabled){background:var(--btn-ghost);color:var(--text)}.astral-btn--tiny{padding:2px 7px;font-size:10px;background:transparent;border-color:var(--border);color:var(--text-dim)}.astral-btn--tiny:hover{background:var(--btn-ghost);color:var(--text)}.astral-main{flex:1;display:flex;align-items:center;justify-content:center;background:var(--bg);overflow:hidden;padding:24px}.astral-preview{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.astral-preview--empty{border:1px dashed var(--border);border-radius:4px}.astral-preview__hint{color:var(--text-dim);font-size:12px;text-align:center;max-width:200px;line-height:1.6}.astral-preview__img{max-width:100%;max-height:100%;object-fit:contain;border:1px solid var(--border);background:#fff;border-radius:2px}