.type-tool-workspace{height:100vh;min-height:0;max-height:100vh;padding-top:var(--topbar-height);padding-bottom:var(--statusbar-height);grid-template-columns:minmax(320px,.88fr) 10px minmax(360px,1.12fr);gap:0;display:grid;overflow:hidden}.type-input-panel{border-right:0}.type-output-panel{grid-template-rows:auto minmax(0,1fr);display:grid}.type-controls{min-height:var(--panel-bar-height);border-bottom:1px solid var(--border);background:var(--panel-bar-bg);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:10px 16px;display:flex}.type-field{color:var(--brand-strong);align-items:center;gap:10px;font-size:.82rem;font-weight:700;display:flex}.type-field input,.type-field select{border:1px solid var(--border);background:var(--surface);width:min(220px,44vw);min-height:32px;color:var(--code-text);border-radius:8px;outline:0;padding:0 12px}.type-field input:focus,.type-field select:focus{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent)}.type-mode{border:1px solid var(--border);background:var(--surface-muted);border-radius:10px;gap:4px;padding:4px;display:inline-flex}.type-mode-btn{min-height:28px;color:var(--brand-strong);background:0 0;border:0;border-radius:7px;padding:0 14px;font-size:.78rem;font-weight:800}.type-mode-btn.active{background:var(--brand);color:var(--brand-contrast)}.type-code-view{min-height:100%}@media (max-width:1100px){.type-tool-workspace{grid-template-columns:1fr;height:auto;max-height:none;padding-top:0;padding-bottom:0}.type-input-panel{border-right:0;border-bottom:1px solid var(--border)}.type-resize-handle{display:none}}@media (max-width:720px){.type-controls{flex-direction:column;align-items:stretch;padding:10px 12px}.type-field{flex-direction:column;align-items:stretch;gap:6px}.type-field input,.type-field select,.type-mode{width:100%}.type-mode-btn{flex:1}}.type-tool-workspace{padding:calc(var(--topbar-height) + 16px) 14px calc(var(--statusbar-height) + 12px);grid-template-columns:minmax(320px,.88fr) 8px minmax(360px,1.12fr);gap:10px}.type-resize-handle{height:calc(100vh - var(--topbar-height) - var(--statusbar-height) - 28px);max-height:calc(100vh - var(--topbar-height) - var(--statusbar-height) - 28px)}.type-controls{background:var(--panel-bar-bg);-webkit-backdrop-filter:blur(18px)saturate(140%);backdrop-filter:blur(18px)saturate(140%)}.type-mode{border-color:var(--border);background:color-mix(in srgb, var(--surface) 68%, transparent);box-shadow:0 8px 20px color-mix(in srgb, var(--brand-strong) 8%, transparent), inset 0 1px 0 #ffffff8a;border-radius:12px}.type-mode-btn{border-radius:9px;transition:transform .15s,background-color .15s}.type-mode-btn:hover{transform:translateY(-1px)}.type-mode-btn.active{background:linear-gradient(135deg, var(--brand), var(--brand-gradient-end));box-shadow:0 8px 18px color-mix(in srgb, var(--brand) 22%, transparent)}@media (max-width:1100px){.type-tool-workspace{grid-template-columns:1fr;gap:12px;padding:12px}.type-input-panel{border-bottom:1px solid var(--border)}}