*{margin:0;padding:0;box-sizing:border-box}:root{--csstools-color-scheme--light: ;color-scheme:dark;font-family:Trebuchet MS,Avenir Next,Segoe UI,Helvetica Neue,sans-serif;font-family:var(--font-body);line-height:1.45;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 18% 14%,rgba(108,242,255,.16),transparent 24%),radial-gradient(circle at 82% 12%,rgba(255,141,84,.2),transparent 24%),radial-gradient(circle at 50% 100%,rgba(255,224,130,.11),transparent 34%),linear-gradient(180deg,#180d20,#0d1121 46%,#050814);background:var(--page-background);color:#fff8f1;color:var(--text-on-brand-strong);overflow-x:hidden}#root{min-height:100vh;isolation:isolate}button{font-family:inherit;cursor:pointer;outline:none}a{-webkit-text-decoration:none;text-decoration:none;color:inherit}input,button{font-size:inherit}input[type=range]{cursor:pointer}code,pre{font-family:SFMono-Regular,Consolas,Liberation Mono,Courier New,monospace;font-family:var(--font-mono)}::-moz-selection{background:#ffb55c4d;color:#fff8f1;color:var(--text-on-brand-strong)}::selection{background:#ffb55c4d;color:#fff8f1;color:var(--text-on-brand-strong)}:root{--font-body: "Trebuchet MS", "Avenir Next", "Segoe UI", "Helvetica Neue", sans-serif;--font-display: "Arial Rounded MT Bold", "Avenir Next Condensed", "Trebuchet MS", "Segoe UI", sans-serif;--font-mono: "SFMono-Regular", "Consolas", "Liberation Mono", "Courier New", monospace;--brand-gradient-start: #ffd36f;--brand-gradient-end: #ff7a66;--gradient-brand: linear-gradient( 135deg, #fff1be 0%, #ffb56f 46%, #ff7a66 70%, #99f2ff 100% );--gradient-player: linear-gradient( 135deg, rgba(255, 179, 98, .94), rgba(90, 200, 255, .92) );--page-background: radial-gradient( circle at 18% 14%, rgba(108, 242, 255, .16), transparent 24% ), radial-gradient( circle at 82% 12%, rgba(255, 141, 84, .2), transparent 24% ), radial-gradient( circle at 50% 100%, rgba(255, 224, 130, .11), transparent 34% ), linear-gradient(180deg, #180d20 0%, #0d1121 46%, #050814 100%);--page-background-soft: radial-gradient(circle at top, rgba(110, 239, 255, .08), transparent 32%), linear-gradient(180deg, rgba(24, 13, 32, .96), rgba(5, 8, 20, 1));--text-on-brand-strong: #fff8f1;--text-on-brand-muted: rgba(244, 233, 243, .82);--text-on-brand-subtle: rgba(244, 233, 243, .62);--surface-glass: rgba(16, 21, 40, .72);--surface-glass-strong: rgba(22, 28, 51, .82);--surface-glass-intense: rgba(29, 36, 62, .92);--surface-glass-background: rgba(9, 13, 28, .88);--surface-code-bg: rgba(12, 15, 31, .92);--panel-bg: linear-gradient( 180deg, rgba(38, 29, 56, .82), rgba(12, 17, 33, .92) );--panel-bg-strong: linear-gradient( 180deg, rgba(47, 36, 68, .9), rgba(15, 19, 37, .96) );--panel-bg-muted: linear-gradient( 180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .025) );--panel-highlight: linear-gradient( 135deg, rgba(255, 181, 92, .18), rgba(110, 239, 255, .14) );--border-glass: rgba(255, 224, 171, .18);--border-glass-strong: rgba(110, 239, 255, .28);--panel-border: var(--border-glass);--panel-border-strong: rgba(255, 181, 92, .34);--chip-bg: rgba(255, 255, 255, .08);--chip-border: rgba(255, 228, 176, .2);--chip-text: var(--text-on-brand-strong);--status-info-bg: rgba(110, 239, 255, .16);--status-info-border: rgba(110, 239, 255, .32);--status-info-text: #b7f8ff;--status-warning-bg: rgba(255, 191, 102, .18);--status-warning-border: rgba(255, 191, 102, .34);--status-warning-text: #ffe5a8;--button-primary-bg: linear-gradient( 135deg, #ffd36f 0%, #ff8c63 52%, #ff5c7a 100% );--button-primary-bg-hover: linear-gradient( 135deg, #ffe08f 0%, #ff9b73 50%, #ff6e8b 100% );--button-primary-text: #221228;--button-primary-border: 1px solid rgba(255, 243, 210, .28);--button-primary-shadow: 0 16px 34px rgba(255, 116, 94, .24);--button-primary-shadow-hover: 0 22px 42px rgba(255, 116, 94, .34);--button-ghost-bg: rgba(255, 255, 255, .05);--button-ghost-bg-hover: rgba(255, 255, 255, .1);--button-ghost-border: rgba(255, 224, 171, .2);--button-ghost-text: var(--text-on-brand-strong);--surface-panel-muted: var(--panel-bg-muted);--surface-panel: var(--panel-bg);--surface-panel-strong: var(--panel-bg-strong);--surface-panel-accent: linear-gradient( 180deg, rgba(61, 45, 88, .94), rgba(16, 20, 38, .98) );--surface-inset: linear-gradient( 180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .03) );--badge-bg: rgba(255, 255, 255, .1);--badge-border: rgba(255, 245, 224, .16);--badge-text: var(--text-on-brand-strong);--button-secondary-bg: rgba(255, 255, 255, .08);--button-secondary-bg-hover: rgba(255, 255, 255, .12);--button-secondary-border: rgba(255, 224, 171, .28);--button-secondary-text: var(--text-on-brand-strong);--button-secondary-shadow: 0 14px 28px rgba(4, 6, 14, .18);--button-secondary-shadow-hover: 0 18px 34px rgba(4, 6, 14, .24);--helper-link-text: var(--text-on-brand-muted);--helper-link-text-hover: var(--text-on-brand-strong);--helper-link-border: rgba(255, 224, 171, .22);--scroll-track: rgba(255, 255, 255, .04);--scroll-thumb: rgba(255, 224, 171, .18);--scroll-thumb-hover: rgba(255, 224, 171, .28);--radius-panel-lg: 26px;--radius-panel-md: 20px;--radius-panel-sm: 18px;--blur-panel: 18px;--blur-panel-strong: 20px;--shadow-header: 0 18px 38px rgba(4, 6, 14, .42);--shadow-card: 0 24px 52px rgba(4, 6, 14, .28);--shadow-card-strong: 0 34px 76px rgba(4, 6, 14, .42);--shadow-elevated: 0 32px 72px rgba(4, 6, 14, .44);--shadow-floating: 0 26px 52px rgba(4, 6, 14, .34);--shadow-player: 0 -12px 28px rgba(4, 6, 14, .42);--header-height: 102px;--layout-gap: 20px;--panel-spacing: 1.5rem;--panel-spacing-sm: 1rem;--panel-radius-xl: 32px;--panel-radius-lg: 26px;--panel-radius-md: 20px;--control-radius: 18px;--shell-inline-gutter: 1rem;--shell-padding-top: 7.25rem;--shell-padding-bottom: 4rem;--shell-viewport-width: calc(100% - (var(--shell-inline-gutter) * 2));--shell-max-width-frame: 900px;--shell-max-width-public: var(--shell-max-width-frame);--shell-max-width-live: var(--shell-max-width-frame)}body{background:radial-gradient(circle at 18% 14%,rgba(108,242,255,.16),transparent 24%),radial-gradient(circle at 82% 12%,rgba(255,141,84,.2),transparent 24%),radial-gradient(circle at 50% 100%,rgba(255,224,130,.11),transparent 34%),linear-gradient(180deg,#180d20,#0d1121 46%,#050814);background:var(--page-background)}
