:root{--font-display:"Playfair Display","Noto Serif KR",Georgia,serif;--font-body:"IBM Plex Sans","Pretendard",-apple-system,BlinkMacSystemFont,sans-serif;--font-mono:"JetBrains Mono","D2Coding","Fira Code",monospace;--text-xs:0.75rem;--text-sm:0.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:2rem;--text-4xl:2.5rem;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--ink-900:#0a0a0a;--ink-800:#1a1a1a;--ink-700:#2d2d2d;--ink-600:#404040;--ink-500:#525252;--ink-400:#737373;--ink-300:#a3a3a3;--ink-200:#d4d4d4;--ink-100:#e5e5e5;--ink-50:#f5f5f5;--paper-white:#fafafa;--paper-cream:#f8f6f3;--paper-warm:#f5f3ef;--accent-page:#2563eb;--accent-page-light:#3b82f6;--accent-page-dark:#1d4ed8;--accent-page-bg:rgba(37,99,235,.08);--accent-page-ring:rgba(37,99,235,.3);--accent-ui:#7c3aed;--accent-ui-light:#8b5cf6;--accent-ui-dark:#6d28d9;--accent-ui-bg:rgba(124,58,237,.08);--accent-ui-ring:rgba(124,58,237,.3);--accent-media:#db2777;--accent-media-light:#ec4899;--accent-media-dark:#be185d;--accent-media-bg:rgba(219,39,119,.08);--accent-media-ring:rgba(219,39,119,.3);--accent-resource:#059669;--accent-resource-light:#10b981;--accent-resource-dark:#047857;--accent-resource-bg:rgba(5,150,105,.08);--accent-resource-ring:rgba(5,150,105,.3);--duration-instant:100ms;--duration-fast:200ms;--duration-normal:300ms;--duration-slow:500ms;--duration-slower:700ms;--ease-out-expo:cubic-bezier(0.16,1,0.3,1);--ease-in-out-cubic:cubic-bezier(0.65,0,0.35,1);--ease-spring:cubic-bezier(0.34,1.56,0.64,1);--ease-smooth:cubic-bezier(0.4,0,0.2,1);--panel-left-width:260px;--panel-right-width:340px;--panel-left-width-collapsed:60px;--panel-right-width-collapsed:60px;--panel-left-wide:40%;--panel-right-wide:60%;--preview-section-height:70%;--selected-list-height:30%;--preview-aspect-ratio:16/9;--header-height:64px;--footer-height:48px;--tabs-height:56px;--space-1:0.25rem;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--radius-2xl:1.5rem;--radius-full:9999px;--shadow-panel:0 4px 6px -1px rgba(0,0,0,.05),0 2px 4px -2px rgba(0,0,0,.03);--shadow-floating:0 4px 6px -1px rgba(0,0,0,.05),0 10px 20px -5px rgba(0,0,0,.08),0 25px 50px -12px rgba(0,0,0,.1);--shadow-elevated:0 20px 40px rgba(0,0,0,.15);--shadow-drag:0 20px 40px rgba(0,0,0,.15),0 0 0 2px var(--accent-ui);--shadow-inner-left:inset -8px 0 16px -8px rgba(0,0,0,.04);--shadow-inner-right:inset 8px 0 16px -8px rgba(0,0,0,.04);--glass-bg:hsla(0,0%,100%,.8);--glass-border:hsla(0,0%,100%,.3);--glass-blur:12px;--z-base:0;--z-dropdown:100;--z-sticky:200;--z-fixed:300;--z-modal-backdrop:400;--z-modal:500;--z-popover:600;--z-tooltip:700;--z-toast:800;--z-drag:900;--z-max:9999}.dark{--ink-900:#fafafa;--ink-800:#e5e5e5;--ink-700:#d4d4d4;--ink-600:#a3a3a3;--ink-500:#737373;--ink-400:#525252;--ink-300:#404040;--ink-200:#2d2d2d;--ink-100:#1a1a1a;--ink-50:#0a0a0a;--paper-white:#0a0a0a;--paper-cream:#121212;--paper-warm:#171717;--accent-page-bg:rgba(59,130,246,.15);--accent-ui-bg:rgba(139,92,246,.15);--accent-media-bg:rgba(236,72,153,.15);--accent-resource-bg:rgba(16,185,129,.15);--shadow-panel:0 4px 6px -1px rgba(0,0,0,.2),0 2px 4px -2px rgba(0,0,0,.15);--shadow-floating:0 4px 6px -1px rgba(0,0,0,.2),0 10px 20px -5px rgba(0,0,0,.25),0 25px 50px -12px rgba(0,0,0,.3);--shadow-elevated:0 20px 40px rgba(0,0,0,.4);--glass-bg:hsla(0,0%,4%,.8);--glass-border:hsla(0,0%,100%,.1);--shadow-inner-left:inset -8px 0 16px -8px rgba(0,0,0,.2);--shadow-inner-right:inset 8px 0 16px -8px rgba(0,0,0,.2)}.builder-layout{display:grid;grid-template-rows:var(--header-height) var(--tabs-height) 1fr var(--footer-height);grid-template-columns:var(--panel-left-width) 1fr var(--panel-right-width);height:100vh;overflow:hidden;background:var(--paper-cream)}.builder-header{justify-content:space-between;background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));z-index:var(--z-sticky)}.builder-header,.builder-tabs{grid-column:1/-1;display:flex;align-items:center;padding:0 var(--space-6);border-bottom:1px solid var(--ink-100)}.builder-tabs{background:var(--paper-white)}.builder-left-panel{grid-row:3;grid-column:1;background:var(--paper-cream);border-right:1px solid var(--ink-100);box-shadow:var(--shadow-inner-left);overflow-y:auto;overflow-x:hidden}.builder-center-panel{grid-row:3;grid-column:2;padding:var(--space-6);background:url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E"),radial-gradient(ellipse at center,var(--paper-white) 0,var(--paper-cream) 100%);background-blend-mode:overlay;overflow-y:auto}.builder-right-panel{grid-row:3;grid-column:3;background:var(--paper-white);border-left:1px solid var(--ink-100);box-shadow:var(--shadow-inner-right);overflow-y:auto;overflow-x:hidden}.builder-footer{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:var(--space-6);padding:0 var(--space-6);background:var(--paper-white);border-top:1px solid var(--ink-100);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--ink-400)}.floating-canvas{background:var(--paper-white);border-radius:var(--radius-xl);border:1px solid var(--ink-100);box-shadow:var(--shadow-floating);transition:box-shadow var(--duration-normal) var(--ease-out-expo)}.floating-canvas:hover{box-shadow:var(--shadow-elevated)}.editorial-tab{position:relative;display:flex;flex-direction:column;align-items:center;padding:var(--space-3) var(--space-6);font-family:var(--font-display);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--ink-400);background:transparent;border:none;cursor:pointer;transition:all var(--duration-normal) var(--ease-out-expo)}.editorial-tab:hover{color:var(--ink-700)}.editorial-tab[data-state=active]{color:var(--ink-900)}.editorial-tab:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:currentColor;transform:translateX(-50%);transition:width var(--duration-normal) var(--ease-out-expo)}.editorial-tab[data-state=active]:after{width:80%}.editorial-tab-count{font-family:var(--font-body);font-size:var(--text-xs);font-weight:var(--font-normal);color:var(--ink-300);margin-top:var(--space-1)}.editorial-tab[data-accent=page][data-state=active]{color:var(--accent-page)}.editorial-tab[data-accent=ui][data-state=active]{color:var(--accent-ui)}.editorial-tab[data-accent=media][data-state=active]{color:var(--accent-media)}.editorial-tab[data-accent=resource][data-state=active]{color:var(--accent-resource)}.panel-section{padding:var(--space-4);border-bottom:1px solid var(--ink-100)}.panel-section:last-child{border-bottom:none}.panel-section-title{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--ink-500);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-3)}.option-card{position:relative;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--paper-white);border:1px solid var(--ink-100);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--duration-fast) var(--ease-out-expo)}.option-card:hover{border-color:var(--ink-200);transform:translateY(-1px);box-shadow:var(--shadow-panel)}.option-card[data-selected=true]{border-color:var(--accent-ui);background:var(--accent-ui-bg)}.option-card-radio{width:18px;height:18px;border:2px solid var(--ink-300);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out-expo)}.option-card[data-selected=true] .option-card-radio{border-color:var(--accent-ui);background:var(--accent-ui);box-shadow:inset 0 0 0 3px var(--paper-white)}.option-card-content{flex:1}.option-card-title{font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--ink-800)}.option-card-description{font-size:var(--text-xs);color:var(--ink-400);margin-top:var(--space-1)}.prompt-output{background:var(--ink-900);border-radius:var(--radius-lg);overflow:hidden}.prompt-output-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:var(--ink-800);border-bottom:1px solid var(--ink-700)}.prompt-output-title{font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--ink-200)}.prompt-output-actions{display:flex;gap:var(--space-2)}.prompt-output-content{padding:var(--space-4);font-family:var(--font-mono);font-size:var(--text-sm);line-height:1.6;color:var(--ink-100);white-space:pre-wrap;word-break:break-word}.kbd{justify-content:center;min-width:20px;height:20px;padding:0 var(--space-2);font-family:var(--font-mono);font-size:11px;font-weight:var(--font-medium);color:var(--ink-500);background:var(--paper-white);border:1px solid var(--ink-200);border-radius:var(--radius-sm);box-shadow:0 1px 0 var(--ink-200)}.kbd,.shortcut-hint{display:inline-flex;align-items:center}.shortcut-hint{gap:var(--space-1);font-size:var(--text-xs);color:var(--ink-400)}.draggable-item{touch-action:none;transition:transform var(--duration-fast) var(--ease-out-expo)}.draggable-item[data-dragging=true]{z-index:var(--z-drag);transform:scale(1.02);box-shadow:var(--shadow-drag)}.drop-zone{position:relative;min-height:60px;border:2px dashed var(--ink-200);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out-expo)}.drop-zone[data-over=true]{border-color:var(--accent-ui);background:var(--accent-ui-bg)}.drag-handle{display:flex;align-items:center;justify-content:center;width:24px;height:24px;color:var(--ink-300);cursor:grab;transition:color var(--duration-fast)}.drag-handle:hover{color:var(--ink-500)}.drag-handle:active{cursor:grabbing}.search-input{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--paper-white);border:1px solid var(--ink-100);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out-expo)}.search-input:focus-within{border-color:var(--accent-ui);box-shadow:0 0 0 3px var(--accent-ui-ring)}.search-input input{flex:1;border:none;background:transparent;font-family:var(--font-body);font-size:var(--text-sm);color:var(--ink-800);outline:none}.search-input input::placeholder{color:var(--ink-400)}.search-input-icon{color:var(--ink-400)}@media (max-width:1279px){.builder-layout{grid-template-columns:var(--panel-left-width) 1fr}.builder-right-panel{position:fixed;right:0;top:calc(var(--header-height) + var(--tabs-height));bottom:var(--footer-height);width:var(--panel-right-width);transform:translateX(100%);transition:transform var(--duration-normal) var(--ease-out-expo);z-index:var(--z-fixed)}.builder-right-panel[data-open=true]{transform:translateX(0)}}@media (max-width:767px){.builder-layout{grid-template-columns:1fr;grid-template-rows:var(--header-height) 1fr var(--tabs-height) var(--footer-height)}.builder-tabs{grid-row:3;justify-content:center}.builder-center-panel,.builder-left-panel,.builder-right-panel{position:absolute;inset:var(--header-height) 0 calc(var(--tabs-height) + var(--footer-height));grid-row:auto;grid-column:auto}.builder-left-panel,.builder-right-panel{width:100%;border:none;box-shadow:none}}