:root{--canvas:#ffffff;--canvas-soft:#f6f7f9;--surface:#ffffff;--surface-raised:#fbfcfe;--ink:#17181c;--ink-muted:#6e7480;--ink-faint:#9aa1ad;--line-soft:#edf0f4;--hairline:#dfe4ea;--primary:#2563eb;--primary-hover:#1d4ed8;--primary-soft:#eff5ff;--primary-ring:#93b4ff;--ai:#6d5dfc;--ai-soft:#f2f0ff;--starlight:#c7ccd8;--radius:10px}*{box-sizing:border-box}body,html{margin:0;min-height:100%;background:var(--canvas-soft);color:var(--ink);font-family:Pretendard,SUIT,Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}.app-shell{min-height:100vh;padding:24px}.workflow-frame{display:flex;min-height:calc(100vh - 48px);overflow:hidden;flex-direction:column;border:1px solid var(--line-soft);border-radius:18px;background:var(--canvas);box-shadow:0 24px 80px rgba(25,31,44,.08)}.topbar{justify-content:space-between;gap:24px;padding:18px 24px;border-bottom:1px solid var(--line-soft)}.account-control,.topbar{display:flex;align-items:center}.account-control{gap:10px;flex:0 0 auto}.account-state{max-width:180px;overflow:hidden;color:var(--ink-faint);font-size:12px;font-weight:650;text-overflow:ellipsis;white-space:nowrap}.account-state.ready{color:var(--primary)}.brand{display:flex;align-items:center;min-width:210px;gap:10px;font-weight:720}.brand-kicker{display:block;margin-bottom:2px;color:var(--ink-faint);font-size:12px;font-weight:650}.brand-mark{display:grid;width:28px;height:28px;place-items:center;flex:0 0 auto;border:1px solid var(--hairline);border-radius:8px;background:var(--surface-raised);color:var(--primary)}.stepper{display:flex;gap:8px;overflow-x:auto;color:var(--ink-faint);font-size:13px;white-space:nowrap}.step,.stepper{align-items:center}.step{display:inline-flex;gap:6px;padding:6px 8px;border:0;border-radius:999px;background:transparent;color:inherit}.step-dot{display:grid;width:16px;height:16px;place-items:center;border:1px solid;border-radius:999px}.step.active{background:var(--primary-soft);color:var(--primary);font-weight:700}.step.done{color:var(--ink-muted)}.workspace{display:grid;flex:1 1;grid-template-columns:minmax(0,1fr);grid-gap:24px;gap:24px;padding:32px}.main-panel{min-width:0}.side-panel{align-self:start;padding:20px;border:1px solid var(--line-soft);border-radius:14px;background:var(--surface-raised)}.eyebrow{margin:0 0 10px;color:var(--primary);font-size:13px;font-weight:700}.page-title{margin:0;max-width:760px;font-size:36px;font-weight:720;line-height:1.16}.lead{margin:12px 0 0;max-width:680px;color:var(--ink-muted);font-size:16px;line-height:1.6}.genre-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:16px;gap:16px;margin-top:28px}.candidate-card,.genre-card{min-width:0;padding:14px;border:1px solid var(--line-soft);border-radius:var(--radius);background:var(--surface);color:var(--ink);text-align:left}.genre-card{min-height:180px}.candidate-card.selected,.genre-card.selected{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}.candidate-specimen,.specimen{display:grid;min-height:102px;place-items:center;border-radius:8px;background:linear-gradient(135deg,rgba(244,247,251,.9),rgba(255,255,255,.9)),var(--surface-raised);color:var(--ink);font-size:24px;font-weight:820}.genre-preview{display:block;aspect-ratio:2/1;min-height:112px;background-position:50%;background-repeat:no-repeat;background-size:cover;box-shadow:inset 0 0 0 1px rgba(223,228,234,.7)}.genre-preview-romance{background-image:url(/visuals/genre-romance.png)}.genre-preview-modern{background-image:url(/visuals/genre-modern.png)}.genre-preview-fantasy{background-image:url(/visuals/genre-fantasy.png)}.genre-preview-wuxia{background-image:url(/visuals/genre-wuxia.png)}.genre-preview-healing{background-image:url(/visuals/genre-healing.png)}.candidate-card span,.candidate-card strong,.genre-desc,.genre-name{display:block}.candidate-card strong,.genre-name{margin:12px 0 4px;font-weight:740}.candidate-card span,.genre-desc{color:var(--ink-muted);font-size:13px}.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:12px;font-weight:700}.ai-chip{background:var(--ai-soft);color:var(--ai)}.side-title{display:flex;align-items:center;justify-content:space-between;margin:0 0 16px;font-size:17px;font-weight:720}.inspector-list{display:grid;grid-gap:12px;gap:12px}.inspector-row{min-width:0;padding:12px;border:1px solid var(--line-soft);border-radius:9px;background:var(--surface)}.inspector-label{margin:0 0 4px;color:var(--ink-faint);font-size:12px}.inspector-value{overflow:hidden;margin:0;font-weight:650;text-overflow:ellipsis;white-space:nowrap}.privacy-note{margin:16px 0 0;color:var(--ink-muted);font-size:13px;line-height:1.5}.remote-card{display:grid;grid-gap:12px;gap:12px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line-soft)}.remote-actions,.remote-title{display:flex;align-items:center;gap:8px}.remote-title{justify-content:space-between;font-size:13px;font-weight:740}.remote-state{overflow:hidden;max-width:160px;color:var(--ink-faint);font-size:12px;font-weight:650;text-overflow:ellipsis;white-space:nowrap}.remote-state.ready{color:var(--primary)}.job-id,.remote-copy,.remote-error{margin:0;font-size:12px;line-height:1.5}.job-id,.remote-copy{color:var(--ink-muted)}.remote-error{color:#b42318}.remote-actions{flex-wrap:wrap}.candidate-grid,.cover-grid,.generation-stage,.layout-stage{display:grid;grid-gap:16px;gap:16px;margin-top:28px}.cover-grid,.layout-stage{grid-template-columns:minmax(0,1fr) 280px}.upload-zone{display:grid;min-height:360px;place-items:center;align-content:center;grid-gap:10px;gap:10px;border:1px dashed var(--hairline);border-radius:14px;background:var(--surface-raised);color:var(--ink-muted);text-align:center}.upload-zone strong{color:var(--ink)}.file-input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.cover-preview{position:relative;display:grid;aspect-ratio:2/1;min-height:0;place-items:center;overflow:hidden;border:1px solid var(--line-soft);border-radius:14px;background:var(--surface)}.cover-preview img{width:100%;height:100%;object-fit:cover}.cover-preview p{position:absolute;right:12px;bottom:12px;left:12px;overflow:hidden;margin:0;padding:8px 10px;border:1px solid var(--line-soft);border-radius:8px;background:rgba(255,255,255,.9);color:var(--ink-muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.empty-cover{display:grid;width:100%;height:100%;place-items:center;border-radius:10px;background:#ffffff;color:var(--ink-muted);text-align:center}.empty-cover-visual{display:block;width:100%;height:100%;overflow:hidden;background:url(/visuals/cover-placeholder-wide.png) 50%/cover no-repeat}.icon-button{position:absolute;top:12px;right:12px;display:grid;width:34px;height:34px;place-items:center;border:1px solid var(--line-soft);border-radius:999px;background:rgba(255,255,255,.94);color:var(--ink)}.input-stage,.style-stage{max-width:760px;margin-top:28px}.field-label{display:block;margin-bottom:8px;color:var(--ink-muted);font-size:13px;font-weight:700}.style-input,.title-input{width:100%;border:1px solid var(--hairline);border-radius:12px;background:var(--surface);color:var(--ink);outline:none}.style-input:focus,.title-input:focus{border-color:var(--primary-ring);box-shadow:0 0 0 3px var(--primary-soft)}.title-input{height:64px;padding:0 18px;font-size:22px;font-weight:700}.field-help{margin:10px 0 0;color:var(--ink-muted);font-size:13px}.proof-board{position:relative;display:grid;aspect-ratio:2/1;container-type:size;min-height:0;place-items:center;overflow:hidden;border:1px solid var(--line-soft);border-radius:16px;background:linear-gradient(90deg,rgba(223,228,234,.38) 1px,transparent 0),linear-gradient(180deg,rgba(223,228,234,.38) 1px,transparent 0),#ffffff;background-size:40px 40px}.layout-word{position:absolute;padding:0;border:0;background:transparent;color:#101114;font-size:54px;font-weight:860;line-height:1}.generated-word{display:grid;place-items:center;overflow:visible;white-space:nowrap;touch-action:none;cursor:-webkit-grab;cursor:grab;transform-origin:50% 50%}.generated-word:active{cursor:-webkit-grabbing;cursor:grabbing}.generated-word.selected{z-index:20;color:#000000;filter:drop-shadow(0 0 0 var(--primary))}.generated-word.selected:after{position:absolute;inset:-8px;border:1px solid var(--primary-ring);border-radius:8px;content:"";pointer-events:none}.transform-handle{position:absolute;z-index:40;width:22px;height:22px;border:2px solid #ffffff;border-radius:50%;background:var(--primary);box-shadow:0 4px 12px rgba(13,23,38,.18)}.resize-handle{right:-20px;bottom:-20px;cursor:nwse-resize}.rotate-handle{top:-44px;left:50%;transform:translateX(-50%);cursor:-webkit-grab;cursor:grab}.rotate-handle:before{position:absolute;top:20px;left:50%;width:1px;height:26px;background:var(--primary-ring);content:""}.generated-word:not(.selected)>.transform-handle{display:none}.layout-loading{position:relative;z-index:1;display:grid;grid-gap:8px;gap:8px;place-items:center;padding:18px 22px;border:1px solid var(--line-soft);border-radius:8px;background:rgba(255,255,255,.86);color:var(--ink-muted);font-size:13px}.layout-loading:before{position:relative;display:block;width:min(260px,60vw);aspect-ratio:2/1;height:auto;overflow:hidden;border:1px dashed rgba(37,99,235,.34);border-radius:10px;background:radial-gradient(circle at 50% 50%,rgba(37,99,235,.16) 0 5px,transparent 6px),linear-gradient(22deg,transparent 26%,rgba(15,17,20,.1) 27% 34%,transparent 35%),linear-gradient(-14deg,transparent 48%,rgba(15,17,20,.15) 49% 58%,transparent 59%),linear-gradient(90deg,rgba(37,99,235,.14) 0 9px,transparent 9px 18px),#ffffff;content:"";animation:loadingPanelPulse 1.25s ease-in-out infinite}.layout-loading:after{display:block;width:64px;height:8px;border-radius:999px;background:radial-gradient(circle,var(--primary) 0 3px,transparent 4px) 0 50% /18px 8px repeat-x;content:"";animation:loadingDots 1s steps(4) infinite}.layout-loading strong{color:var(--ink);font-size:15px}.word-1{transform:translate(-46px,-54px) rotate(-4deg)}.word-2{transform:translate(34px,4px) rotate(2deg)}.word-3{transform:translate(-22px,64px) rotate(-1deg)}.selection-box{position:absolute;width:230px;height:150px;border:1px solid var(--primary-ring);border-radius:10px}.selection-box:after,.selection-box:before{position:absolute;width:9px;height:9px;border:1px solid var(--primary);border-radius:999px;background:white;content:""}.selection-box:before{top:-5px;right:-5px}.selection-box:after{right:-5px;bottom:-5px}.compact-controls{display:grid;align-self:start;grid-gap:10px;gap:10px}.inline-controls{margin-top:14px}.control-row{display:flex;align-items:center;justify-content:space-between;padding:14px;border:1px solid var(--line-soft);border-radius:10px;background:var(--surface-raised);color:var(--ink-muted)}.control-row strong{color:var(--ink)}.layout-edit-controls{display:grid;grid-gap:10px;gap:10px;padding-top:4px}.style-input{min-height:180px;resize:vertical;padding:16px;line-height:1.6}.resolved-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.result-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:12px;gap:12px;margin-top:16px}.empty-state,.prompt-preview,.result-list{min-width:0;padding:14px;border:1px solid var(--line-soft);border-radius:10px;background:var(--surface-raised)}.empty-state strong,.prompt-preview strong,.result-list strong{display:block;margin-bottom:8px;font-size:13px}.empty-state span,.prompt-preview p,.result-list p{margin:0;color:var(--ink-muted);font-size:13px;line-height:1.5}.prompt-preview{margin-top:12px}.generation-stage{grid-template-columns:repeat(3,minmax(0,1fr))}.generation-toolbar{display:flex;align-items:center;grid-column:1/-1;justify-content:space-between;gap:14px;padding:14px;border:1px solid var(--line-soft);border-radius:12px;background:var(--surface)}.generation-status{display:grid;grid-gap:4px;gap:4px;text-align:right}.generation-slot{position:relative;display:grid;min-height:236px;place-items:center;align-content:center;grid-gap:10px;gap:10px;border:1px solid var(--line-soft);border-radius:14px;background:var(--surface-raised);color:var(--ink);text-align:center}.generation-slot.status-waiting{opacity:.76}.generation-slot.status-image_downloaded,.generation-slot.status-postprocessing,.generation-slot.status-queued,.generation-slot.status-running,.generation-slot.status-submitted_to_comfy,.generation-slot.status-uploading_input{border-color:rgba(37,99,235,.28);background:linear-gradient(180deg,rgba(37,99,235,.045),rgba(255,255,255,0)),var(--surface-raised)}.generation-slot.selected,.generation-slot:not(:disabled):hover{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}.candidate-media,.slot-preview{display:grid;width:100%;aspect-ratio:2/1;place-items:center;overflow:hidden;border-radius:8px;background:white}.slot-preview{min-height:0}.candidate-media img,.slot-preview img{display:block;width:100%;height:100%;object-fit:contain}.slot-index{display:grid;width:30px;height:30px;place-items:center;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-weight:800}.slot-loader{color:var(--starlight)}.candidate-loading-visual{position:relative;display:grid;width:100%;aspect-ratio:2/1;min-height:0;place-items:center;overflow:hidden;border:1px solid var(--line-soft);border-radius:8px;background:radial-gradient(circle at 18% 22%,rgba(37,99,235,.16) 0 5px,transparent 6px),radial-gradient(circle at 82% 72%,rgba(18,165,148,.13) 0 7px,transparent 8px),linear-gradient(90deg,rgba(223,228,234,.46) 1px,transparent 0),linear-gradient(180deg,rgba(223,228,234,.46) 1px,transparent 0),#ffffff;background-size:auto,auto,28px 28px,28px 28px,auto}.candidate-loading-visual:before{position:absolute;inset:10px;border:1px dashed rgba(37,99,235,.34);border-radius:8px;content:"";animation:loadingFramePulse 1.25s ease-in-out infinite}.candidate-loading-visual:after{position:absolute;width:34px;height:34px;border:3px solid rgba(37,99,235,.14);border-top:3px solid var(--primary);border-radius:50%;content:"";animation:spin .9s linear infinite}.candidate-loading-visual span{position:absolute;display:block;border-radius:999px;background:#111318;opacity:.18;transform-origin:center;animation:loadingStroke 1.15s ease-in-out infinite}.candidate-loading-visual span:first-child{width:58%;height:16px;transform:translateY(-26px) rotate(-5deg)}.candidate-loading-visual span:nth-child(2){width:46%;height:14px;animation-delay:.12s;transform:translate(12px,12px) rotate(4deg)}.candidate-loading-visual span:nth-child(3){width:34%;height:10px;animation-delay:.24s;transform:translate(-16px,38px) rotate(-2deg)}.spin{animation:spin .9s linear infinite}.candidate-asset-id,.slot-error{display:block;max-width:100%;overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.candidate-asset-id{color:var(--ink-faint)}.slot-error{color:#b42318}.generation-note{grid-column:1/-1;margin:0;color:var(--ink-muted);font-size:13px}.candidate-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.candidate-card{min-height:260px}.candidate-media{min-height:0}.candidate-specimen{display:grid;min-height:170px;place-items:center;padding:20px;color:var(--ink);text-align:center}@keyframes loadingPanelPulse{0%{opacity:.72;transform:scale(.985)}50%{opacity:1;transform:scale(1)}to{opacity:.72;transform:scale(.985)}}@keyframes loadingFramePulse{0%,to{opacity:.32}50%{opacity:.84}}@keyframes loadingDots{0%,to{opacity:.32;transform:scaleX(.68)}50%{opacity:1;transform:scaleX(1)}}@keyframes loadingStroke{0%,to{opacity:.12;filter:blur(.4px)}50%{opacity:.28;filter:blur(0)}}.empty-state{display:grid;grid-gap:4px;gap:4px;max-width:620px;margin-top:28px}.effects-stage,.export-stage{display:grid;grid-template-columns:minmax(0,1fr) 280px;grid-gap:16px;gap:16px;margin-top:28px}.effect-side-panel{display:grid;align-self:start;grid-gap:14px;gap:14px}.effect-edit-controls{display:grid;grid-gap:12px;gap:12px;padding:12px}.advanced-panel,.effect-edit-controls{border:1px solid var(--line-soft);border-radius:8px;background:var(--surface-raised)}.advanced-panel summary{cursor:pointer;padding:12px;color:var(--ink);font-size:13px;font-weight:760}.angle-control{display:flex;align-items:center;gap:12px;padding:0 12px 12px}.angle-dial{position:relative;width:72px;height:72px;border:1px solid var(--line-soft);border-radius:50%;background:radial-gradient(circle,#ffffff 0 46%,transparent 47%),conic-gradient(from -90deg,var(--primary-soft),var(--primary),var(--primary-soft));cursor:-webkit-grab;cursor:grab}.angle-dial span{position:absolute;top:50%;left:50%;width:28px;height:2px;background:var(--primary);transform:rotate(var(--angle)) translateX(8px);transform-origin:left center}.advanced-grid{display:grid;grid-gap:10px;gap:10px;max-height:360px;overflow:auto;padding:0 12px 12px}.effect-field{display:grid;grid-gap:6px;gap:6px;color:var(--ink-muted);font-size:12px}.effect-field input[type=color],.effect-field input[type=range]{width:100%}.toggle-field{grid-template-columns:1fr auto;align-items:center}.effect-preview,.export-preview{position:relative;display:grid;aspect-ratio:2/1;min-height:420px;place-items:center;overflow:hidden;border:1px solid var(--line-soft);border-radius:8px;background:#ffffff}.effect-preview:before{position:absolute;inset:0;background:linear-gradient(90deg,rgba(223,228,234,.34) 1px,transparent 0),linear-gradient(180deg,rgba(223,228,234,.34) 1px,transparent 0);background-size:40px 40px;content:""}.typo-effector-frame{position:relative;z-index:1;display:grid;width:min(92%,860px);place-items:center}.typo-effector-frame.editable{cursor:-webkit-grab;cursor:grab;touch-action:none}.typo-effector-frame.editable:active{cursor:-webkit-grabbing;cursor:grabbing}.typo-effector-frame canvas{display:block;width:auto;max-width:100%;height:auto;max-height:520px;object-fit:contain}.typo-effector-frame>span{position:absolute;padding:8px 12px;border:1px solid var(--line-soft);border-radius:999px;background:rgba(255,255,255,.82);color:var(--ink-muted);font-size:13px}.effect-transform-box{position:absolute;z-index:2;border:1px solid var(--primary-ring);border-radius:8px;cursor:move;transform-origin:50% 50%;touch-action:none}.effect-transform-box .resize-handle{right:-8px;bottom:-8px}.effect-presets{display:grid;align-self:start;grid-gap:10px;gap:10px}.effect-preset{display:grid;grid-template-columns:42px 1fr;grid-gap:2px 10px;gap:2px 10px;align-items:center;min-height:58px;padding:10px;border:1px solid var(--line-soft);border-radius:10px;background:var(--surface);color:var(--ink);text-align:left}.effect-preset.selected{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}.effect-swatch{grid-row:span 2;width:42px;height:42px;border-radius:8px}.effect-preset span:not(.effect-swatch),.effect-preset strong{display:block}.effect-preset span:not(.effect-swatch){color:var(--ink-muted);font-size:12px}.export-preview img{display:block;width:100%;height:100%;object-fit:contain}.specimen-2{font-size:22px;text-shadow:0 8px 18px rgba(23,24,28,.14)}.specimen-3{font-size:20px;font-weight:760}.footerbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;border-top:1px solid var(--line-soft);background:rgba(255,255,255,.92)}.button-row{display:flex;gap:10px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;gap:8px;padding:0 18px;border:1px solid transparent;border-radius:999px;font-weight:700}.button.primary{background:var(--primary);color:white}.button.primary:hover:not(:disabled){background:var(--primary-hover)}.button.secondary{border-color:var(--line-soft);background:white;color:var(--ink)}.button.ai-recommend{min-height:42px;border-color:rgba(109,93,252,.18);background:var(--ai-soft);color:var(--ai);border-radius:10px}.button.compact{min-height:34px;padding:0 12px;font-size:12px}.button.ai-action{width:100%;min-height:38px;padding:0 12px;border-radius:10px}.note{color:var(--ink-muted);font-size:13px}.control-error,.control-note{margin:0;font-size:12px;line-height:1.5}.control-note{color:var(--ink-muted)}.control-error{color:#b42318}@keyframes spin{to{transform:rotate(1turn)}}@media (max-width:1080px){.cover-grid,.layout-stage,.workspace{grid-template-columns:1fr}.side-panel{align-self:stretch}}@media (max-width:780px){.app-shell{padding:12px}.workflow-frame{min-height:calc(100vh - 24px);border-radius:14px}.footerbar,.topbar{align-items:flex-start;flex-direction:column}.account-control{width:100%;justify-content:space-between}.workspace{padding:24px 16px}.page-title{font-size:30px}.candidate-grid,.generation-stage,.genre-grid,.result-columns{grid-template-columns:1fr}.generation-toolbar{align-items:stretch;flex-direction:column}.generation-status{text-align:left}.button-row{width:100%}.button{flex:1 1}}