:root{--font-display: "Fraunces", Georgia, serif;--font-body: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "IBM Plex Mono", "SF Mono", Consolas, monospace;--color-ink: #15171B;--color-slate: #1C1F24;--color-slate-raised: #23262C;--color-paper: #ECE8DE;--color-muted: #8B8F96;--color-signet: #B08D4F;--color-signet-dim: #8A6E3E;--color-correction: #BE5B3D;--color-confirmed: #7A9471;--bg-app: #15171B;--bg-surface: #1C1F24;--bg-surface-elevated: #23262C;--bg-surface-hover: #2C3038;--bg-card: rgba(28, 31, 36, .92);--bg-glass: rgba(21, 23, 27, .88);--border-subtle: rgba(236, 232, 222, .08);--border-strong: rgba(236, 232, 222, .16);--border-focus: #B08D4F;--text-primary: #ECE8DE;--text-secondary: #8B8F96;--text-muted: #666A73;--text-disabled: #464A53;--primary: #B08D4F;--primary-hover: #8A6E3E;--primary-light: #D4B679;--primary-subtle: rgba(176, 141, 79, .14);--primary-border: rgba(176, 141, 79, .32);--success: #7A9471;--success-bg: rgba(122, 148, 113, .14);--success-border: rgba(122, 148, 113, .3);--danger: #BE5B3D;--danger-bg: rgba(190, 91, 61, .14);--danger-border: rgba(190, 91, 61, .3);--warning: #C28B38;--warning-bg: rgba(194, 139, 56, .14);--warning-border: rgba(194, 139, 56, .3);--info: #8A6E3E;--info-bg: rgba(138, 110, 62, .14);--info-border: rgba(138, 110, 62, .3);--diff-add-bg: rgba(122, 148, 113, .18);--diff-add-text: #96B58C;--diff-del-bg: rgba(190, 91, 61, .18);--diff-del-text: #D97E63;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .4), 0 0 0 1px rgba(236, 232, 222, .04);--shadow-md: 0 4px 16px rgba(0, 0, 0, .5), 0 0 0 1px rgba(236, 232, 222, .06);--shadow-lg: 0 12px 36px rgba(0, 0, 0, .65), 0 0 0 1px rgba(236, 232, 222, .08);--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px}[data-theme=light]{--color-ink: #F6F4EE;--color-slate: #FFFFFF;--color-slate-raised: #EDE7DC;--color-paper: #15171B;--color-muted: #6B707C;--color-signet: #946E2D;--color-signet-dim: #73541F;--color-correction: #A33E23;--color-confirmed: #3F6838;--bg-app: #F6F4EE;--bg-surface: #FFFFFF;--bg-surface-elevated: #EDE7DC;--bg-surface-hover: #E3DDD0;--bg-card: rgba(255, 255, 255, .98);--bg-glass: rgba(246, 244, 238, .92);--border-subtle: rgba(21, 23, 27, .09);--border-strong: rgba(21, 23, 27, .18);--border-focus: #946E2D;--text-primary: #15171B;--text-secondary: #4E535E;--text-muted: #747985;--text-disabled: #A6ABB6;--primary: #946E2D;--primary-hover: #73541F;--primary-light: #B08D4F;--primary-subtle: rgba(148, 110, 45, .12);--primary-border: rgba(148, 110, 45, .28);--success: #3F6838;--success-bg: rgba(63, 104, 56, .12);--success-border: rgba(63, 104, 56, .28);--danger: #A33E23;--danger-bg: rgba(163, 62, 35, .12);--danger-border: rgba(163, 62, 35, .28);--warning: #8F5E16;--warning-bg: rgba(143, 94, 22, .12);--warning-border: rgba(143, 94, 22, .28);--info: #73541F;--info-bg: rgba(115, 84, 31, .12);--info-border: rgba(115, 84, 31, .28);--diff-add-bg: rgba(63, 104, 56, .14);--diff-add-text: #2B5824;--diff-del-bg: rgba(163, 62, 35, .14);--diff-del-text: #94321A;--shadow-sm: 0 1px 3px rgba(21, 23, 27, .06), 0 1px 2px rgba(21, 23, 27, .04);--shadow-md: 0 4px 14px rgba(21, 23, 27, .08), 0 1px 3px rgba(21, 23, 27, .05);--shadow-lg: 0 12px 32px rgba(21, 23, 27, .12), 0 2px 6px rgba(21, 23, 27, .05)}html,body{width:100%;max-width:100vw;overflow-x:hidden;margin:0;padding:0;box-sizing:border-box}*,*:before,*:after{box-sizing:border-box}body{font-family:var(--font-body);background-color:var(--bg-app);color:var(--text-primary);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .2s ease,color .2s ease}::selection{background-color:#b08d4f59;color:var(--text-primary)}.font-display{font-family:var(--font-display)}.font-body{font-family:var(--font-body)}.font-mono{font-family:var(--font-mono)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.touch-scroll-x{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;display:flex;flex-wrap:nowrap}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulseSubtle{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.02)}}.animate-fade-in{animation:fadeIn .18s cubic-bezier(.16,1,.3,1) forwards}.animate-slide-down{animation:slideDown .2s cubic-bezier(.16,1,.3,1) forwards}.animate-spin{animation:spin .8s linear infinite}.premium-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:border-color .15s ease,box-shadow .15s ease,background-color .2s ease;max-width:100%}.premium-card:hover{border-color:var(--border-strong)}.glass-panel{background:var(--bg-card);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);max-width:100%;transition:background-color .2s ease,border-color .2s ease}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:6px;background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:999px;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--color-signet);border:2px solid var(--bg-surface);box-shadow:var(--shadow-sm);cursor:pointer;transition:transform .1s ease,background-color .1s ease}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2);background:var(--color-signet-dim)}*,*:before,*:after,html,body{scrollbar-width:none!important;-ms-overflow-style:none!important}::-webkit-scrollbar,*::-webkit-scrollbar{display:none!important;width:0!important;height:0!important;background:transparent!important}.studio-container{flex:1;display:flex;flex-direction:column;padding:10px 20px 14px;gap:10px;width:100%;max-width:100vw;box-sizing:border-box}.studio-grid{display:grid;grid-template-columns:1fr;gap:14px;width:100%;max-width:100%;min-width:0;box-sizing:border-box}.studio-pane{min-height:480px;height:auto;width:100%;max-width:100%;min-width:0;box-sizing:border-box;overflow:hidden!important}@media(min-width:1024px){html,body,#root,.app-root{height:100vh!important;max-height:100vh!important;overflow:hidden!important}.app-main{flex:1;height:calc(100vh - 52px);max-height:calc(100vh - 52px);min-height:0;overflow:hidden!important}.studio-container{height:100%;max-height:100%;overflow:hidden!important;padding:8px 20px 10px;gap:8px}.studio-grid{flex:1;min-height:0;height:100%;max-height:100%;overflow:hidden!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.studio-pane{height:100%;max-height:100%;min-height:0;overflow:hidden!important;display:flex;flex-direction:column}.studio-pane textarea,.studio-textarea,.studio-tab-body{flex:1;min-height:0!important;height:100%;overflow-y:auto}}@media(max-width:1023px){.studio-container{height:auto;min-height:calc(100vh - 58px);overflow:visible;padding:12px}.studio-grid{grid-template-columns:1fr;height:auto;overflow:visible}.studio-pane{height:auto;min-height:320px;overflow:visible}}.diff-split-grid{display:grid;gap:16px;height:100%}@media(min-width:768px){.diff-split-grid{grid-template-columns:1fr 1fr}}@media(max-width:767px){.diff-split-grid{grid-template-columns:1fr}}@media(max-width:767px){.hide-on-mobile{display:none!important}.show-on-mobile{display:flex!important}.touch-target{min-height:44px!important;min-width:44px!important}.btn-touch-44{min-height:44px;padding-top:10px;padding-bottom:10px}}@media(min-width:768px){.hide-on-desktop{display:none!important}.show-on-desktop{display:block!important}}