:root{--ink:#25263d;--muted:#76798d;--purple:#6554c0;--line:#e8e7ef;--bg:#f6f6fa;--soft:#eeeafa;--green:#177c61;--radius:14px;font-family:'Noto Sans KR Variable',Inter,system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--bg);font-size:14px}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}button{cursor:pointer;border:1px solid var(--line);border-radius:9px;padding:11px 16px;color:var(--ink);background:white;transition:background .15s}button:hover{background:var(--soft)}button:disabled{opacity:.5;cursor:wait}button.primary{color:white;background:var(--purple);border-color:var(--purple)}button.danger{color:#b1354a}button.ghost{border-color:transparent;background:transparent}input,select,textarea{display:block;width:100%;border:1px solid #dedee8;background:#fff;color:var(--ink);border-radius:8px;padding:12px;margin-top:7px}textarea{min-height:104px;resize:vertical;line-height:1.8}label{display:block;font-weight:600;font-size:13px;margin-bottom:18px}label small{font-weight:400;color:var(--muted)}a{color:var(--purple)}h1,h2,h3,p{margin-top:0}h1{font-size:30px;letter-spacing:-1px;line-height:1.4}h2{font-size:20px;letter-spacing:-.5px}h3{font-size:15px}p{line-height:1.8}small,.muted{color:var(--muted)}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--purple);margin-bottom:14px}.brand{font-weight:800;letter-spacing:1px;line-height:1.5}.brand span{font-size:10px;display:block;color:var(--muted);letter-spacing:2px}.logo{display:inline-grid;place-items:center;background:var(--purple);color:#fff;width:32px;height:32px;border-radius:10px;margin-right:10px}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.between{justify-content:space-between}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card{border:1px solid var(--line);background:#fff;border-radius:var(--radius);padding:25px;min-width:0;margin-bottom:20px}.card p:last-child{margin-bottom:0}.chip{display:inline-block;padding:5px 10px;border-radius:30px;background:var(--soft);color:var(--purple);font-size:11px;font-weight:600}.chip.green{color:var(--green);background:#e4f3ed}.chip.orange{color:#986029;background:#fff2df}.shell{display:grid;grid-template-columns:202px minmax(0,1fr);min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:202px;background:white;border-right:1px solid var(--line);padding:30px 18px;display:flex;flex-direction:column;z-index:20}.sidebar .brand{padding:0 10px 35px}.nav{display:grid;gap:8px}.nav button{text-align:left;border:0;background:transparent;font-weight:600;padding:14px}.nav button.active{background:var(--soft);color:var(--purple)}.sidebar .foot{margin-top:auto;border-top:1px solid var(--line);padding-top:18px;color:var(--muted);font-size:12px}.main{grid-column:2;min-width:0}.topbar{min-height:77px;padding:16px 34px;border-bottom:1px solid var(--line);display:flex;gap:20px;align-items:center;justify-content:space-between;background:#fff}.topbar .projectname{font-size:15px;font-weight:700}.content{max-width:1450px;margin:auto;padding:32px 38px 80px}.intro{margin-bottom:26px}.intro p{color:var(--muted);margin-bottom:0}.tabs{display:flex;gap:26px;border-bottom:1px solid var(--line);margin:0 0 28px;overflow:auto;white-space:nowrap}.tabs button{border:0;background:transparent;padding:15px 0;border-radius:0;color:var(--muted);font-weight:600}.tabs button.active{border-bottom:3px solid var(--purple);color:var(--purple)}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px}.workspace>aside .card{padding:22px}.prose{white-space:pre-wrap;line-height:2.05;font-size:15px;overflow-wrap:anywhere}.hint{padding:14px 18px;background:var(--soft);border-radius:10px;color:#615480;font-size:13px;line-height:1.7;margin-bottom:22px}.empty{padding:48px 22px;text-align:center;border:1px dashed #d5d0e8;border-radius:14px;color:var(--muted);margin-bottom:22px}.empty h3{color:var(--ink);font-size:19px}.metric{font-size:30px;font-weight:700;letter-spacing:-1px}.projectcard{display:flex;flex-direction:column;min-height:220px;transition:transform .2s}.projectcard:hover{transform:translateY(-3px)}.projectcard .bottom{margin-top:auto;padding-top:24px}.bookline{height:5px;background:linear-gradient(90deg,#6554c0,#b9a6e5);border-radius:8px;margin-bottom:26px}.modecard{position:relative;border:1px solid var(--line);border-radius:12px;padding:22px;background:#fff;text-align:left}.modecard.selected{border-color:var(--purple);background:#f6f3ff}.modecard p{font-size:13px;color:var(--muted);margin:12px 0 0}.branch{position:relative;border-left:2px solid #dcd6ee;margin-left:8px;padding:0 0 22px 24px}.branch:before{content:'';position:absolute;left:-6px;top:7px;width:10px;height:10px;background:var(--purple);border:2px solid white;border-radius:100%}.branch .card{margin:0}.branch.selected .card{border-color:var(--purple)}.compare{display:grid;grid-template-columns:1fr 1fr;gap:18px}.reader{max-width:760px;margin:0 auto;padding:30px 16px 100px}.reader .chapter{padding:35px;background:white;margin-bottom:25px;border-radius:12px}.toon-panel{position:relative;overflow:hidden;isolation:isolate;min-height:200px;background:#eae9ee;margin:0 auto 28px;width:100%;border:1px solid #dddce7}.panel-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.panel-placeholder{height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(155deg,#e7e2f4,#b6bad6);color:#59637d;font-size:12px}.foreground{position:absolute;object-fit:contain;transform:translate(-50%,-50%);z-index:2}.motion-layer{position:absolute;inset:0;will-change:transform}.bubble{position:absolute;z-index:5;max-width:72%;padding:13px 20px;background:white;color:#25263d;border:2px solid #25263d;border-radius:22px;box-shadow:2px 4px 0 #25263d22;white-space:pre-wrap;font-size:15px;line-height:1.55;overflow-wrap:anywhere}.bubble:after{content:'';position:absolute;width:14px;height:14px;background:white;border-right:2px solid #25263d;border-bottom:2px solid #25263d;bottom:-9px;left:28px;transform:rotate(35deg)}.caption{position:absolute;z-index:6;bottom:0;left:0;right:0;background:linear-gradient(transparent,#182237e8);color:white;padding:35px 22px 20px;white-space:pre-wrap;line-height:1.8;max-height:45%;overflow:auto}.anim-breathe{animation:breathe var(--duration,4s) ease-in-out infinite alternate}.anim-float{animation:float var(--duration,4s) ease-in-out infinite alternate}.anim-pan{animation:pan var(--duration,4s) ease-in-out infinite alternate}.anim-shake{animation:shake var(--duration,4s) linear infinite}.anim-fade{animation:fade var(--duration,4s) ease-in-out infinite alternate}.paused [class*="anim-"]{animation-play-state:paused!important}@keyframes breathe{from{transform:scale(1)}to{transform:scale(calc(1 + var(--intensity,8)*.002))}}@keyframes float{to{transform:translateY(calc(var(--intensity,8)*-1px))}}@keyframes pan{from{transform:scale(1.1) translateX(-2%)}to{transform:scale(1.1) translateX(2%)}}@keyframes shake{0%,85%,100%{transform:translateX(0)}90%{transform:translateX(calc(var(--intensity,8)*-1px))}95%{transform:translateX(calc(var(--intensity,8)*1px))}}@keyframes fade{from{opacity:.5}to{opacity:1}}@media(prefers-reduced-motion:reduce){[class*="anim-"]{animation:none!important}}.panel-editor{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px}.panel-editor .preview{position:sticky;top:20px;align-self:start}.panel-editor .toon-panel{max-width:680px}.listitem{padding:16px 0;border-bottom:1px solid var(--line)}.listitem:last-child{border-bottom:0}.assetgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.assetgrid img{width:100%;height:140px;object-fit:contain;background:var(--bg)}.login{max-width:450px;margin:9vh auto;padding:36px}.login h1{font-size:28px;margin-top:35px}.login p{color:var(--muted)}.login button.primary{width:100%}.error{color:#ae324b;background:#fff0f2;padding:14px;border-radius:8px;line-height:1.6;margin-bottom:20px}.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.savebar{position:sticky;bottom:12px;padding:14px;background:#fffffff2;border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 28px #25263d10;z-index:10}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#25263d;color:white;border-radius:10px;padding:14px 24px;z-index:100;max-width:90%;display:none;line-height:1.6}#toast.show{display:block}.note{font-size:12px;color:var(--muted);line-height:1.7}.choicecard{padding:18px;border:1px solid var(--line);border-radius:10px;margin-bottom:14px}.choicecard .grid{gap:14px}.choicecard label{margin-bottom:12px}.divider{height:1px;background:var(--line);margin:22px 0}.loading{padding:80px;text-align:center;color:var(--purple)}.check{display:flex;align-items:center;gap:8px}.check input{width:auto;margin:0}.modal{position:fixed;inset:0;background:#25263d88;display:grid;place-items:center;z-index:60;padding:20px}.modal>.card{max-width:750px;width:100%;max-height:90vh;overflow:auto}.versionlist{max-height:400px;overflow:auto}code{font-size:12px;overflow-wrap:anywhere}audio{max-width:100%}
@media(max-width:1150px){.workspace{grid-template-columns:1fr}.workspace>aside{display:grid;grid-template-columns:1fr 1fr;gap:18px}.panel-editor{grid-template-columns:1fr 300px}.content{padding:26px}.grid.three{grid-template-columns:1fr 1fr}}
@media(max-width:720px){:root{font-size:14px}.shell{display:block}.sidebar{top:auto;width:100%;height:66px;flex-direction:row;padding:5px 8px;border-top:1px solid var(--line)}.sidebar .brand,.sidebar .foot{display:none}.sidebar .nav{display:flex;justify-content:space-around;width:100%}.sidebar .nav button{text-align:center;font-size:12px;padding:10px}.main{width:100%}.topbar{padding:14px 16px;gap:10px}.topbar .row{gap:5px}.content{padding:23px 16px 100px}.grid,.grid.three,.workspace>aside,.panel-editor,.compare{grid-template-columns:1fr}.card{padding:20px}.tabs{gap:22px}.panel-editor .preview{position:static}.assetgrid{grid-template-columns:1fr 1fr}h1{font-size:26px}.savebar{bottom:72px}.login{margin:4vh 16px}.bubble{font-size:14px}.caption{font-size:13px}input,textarea,select{font-size:16px}.topbar button{padding:9px}.reader .chapter{padding:22px}button{min-height:44px}.modal{padding:12px}.brand{font-size:13px}}
.sample-banner{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 32px;margin-bottom:28px;border-radius:18px;background:linear-gradient(120deg,#202f4e,#5c6581);color:#fff}.sample-banner p{color:#e0e6f3}.sample-banner .eyebrow{color:#dfc09a}.chat-card{border:1px solid #cfc7f1;background:linear-gradient(135deg,#fff,#f6f3ff);margin-bottom:26px}.chat-card textarea[name=message]{min-height:100px}.chat-history{max-height:280px;overflow:auto}.chat-user,.chat-assistant{padding:14px 18px;margin:12px 0;border-radius:12px;white-space:pre-wrap}.chat-user{background:#ebe6fa;margin-left:8%}.chat-assistant{background:#fff;border:1px solid #e4dfef;margin-right:5%}#chat-apply fieldset{border:1px solid #ded8ed;border-radius:12px;padding:18px;margin:20px 0}#chat-apply legend{font-weight:700;color:#6554c0}#chat-apply textarea{min-height:90px}#chat-status,#connection-result{margin:14px 0;color:#6554c0}.production-steps{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0 24px}.production-steps>*{background:#eee9f8;border-radius:20px;padding:10px 18px}#connections-slot{margin-bottom:24px}.sample-banner h2{margin:8px 0}#release-checks{margin-top:18px}@media(max-width:620px){.sample-banner{display:block;padding:24px}.sample-banner button{margin-top:16px}.chat-card{padding:18px}.chat-card .row{align-items:stretch}.chat-user{margin-left:0}.chat-assistant{margin-right:0}.production-steps{font-size:12px;gap:6px}.production-steps>*{padding:8px 10px}}

.quality-candidates{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:16px 0}.quality-candidates img{width:100%;height:230px;object-fit:contain;background:#eee;border-radius:8px}.quality-region{position:relative;max-width:500px;margin:auto;overflow:hidden}.quality-region img{width:100%;display:block}#quality-region-box{position:absolute;border:3px solid #e55487;background:#e554872b;pointer-events:none}#quality-studio textarea{min-height:80px}#quality-studio .toolbar{flex-wrap:wrap}@media(max-width:600px){.quality-candidates{grid-template-columns:1fr 1fr}.quality-candidates .card{padding:10px}.quality-candidates img{height:160px}}@media(prefers-reduced-motion:reduce){.motion-layer{animation:none!important}}

.bubble-thought{border-radius:50%;border:2px dashed #444}.bubble-shout{border:3px solid #111;border-radius:3px;font-weight:800}.bubble{overflow-wrap:anywhere}

/* Connection settings: clear section hierarchy without changing form behavior. */
.card:has(> #routing-slot){padding:28px;border:1px solid #dcd8ed;box-shadow:0 8px 30px #29204f08}
.card:has(> #routing-slot)>h2{font-size:24px;color:#44318a;margin-bottom:12px}
#routing-slot{counter-reset:connection-section}
#routing-slot>h3{--section-color:#16634d;--section-bg:#e9f7ef;counter-increment:connection-section;display:flex;align-items:center;gap:12px;padding:17px 20px;margin:30px 0 16px;border-left:5px solid var(--section-color);border-radius:10px;background:var(--section-bg);color:var(--section-color);font-size:20px;line-height:1.5;font-weight:800}
#routing-slot>h3::before{content:counter(connection-section,decimal-leading-zero);display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:9px;background:var(--section-color);color:#fff;font-size:15px;font-weight:800}
#routing-slot>h3:nth-of-type(2){--section-color:#194f9b;--section-bg:#eaf2ff}
#routing-slot>h3:nth-of-type(3){--section-color:#6540a5;--section-bg:#f1ebfb}
#routing-slot>h3:nth-of-type(4){--section-color:#914b12;--section-bg:#fff2e3}
#routing-slot>hr{border:0;border-top:1px solid #dfddea;margin:32px 0 0}
#routing-slot>details.card,.card:has(> #routing-slot)>details.card{background:#f7f8fc;border:1px solid #dce1ec;box-shadow:none;padding:16px 20px;margin-bottom:14px}
#routing-slot details>summary,.card:has(> #routing-slot)>details>summary{cursor:pointer;color:#35476b;font-size:14px;line-height:1.6;font-weight:600}
#routing-slot details[open]>summary,.card:has(> #routing-slot)>details[open]>summary{border-bottom:1px solid #dce1ec;padding-bottom:12px;margin-bottom:14px}
#routing-slot details p,#routing-slot details li,.card:has(> #routing-slot)>details p,.card:has(> #routing-slot)>details li{line-height:1.9;color:#41475c}
#routing-slot details li{margin:7px 0}
#routing-slot>p.note{color:#555d72;line-height:1.8}
#routing-slot>form:not(#stages-form){padding:20px;border:1px solid #dce3ef;background:#fafbff;border-radius:12px;margin:16px 0}
#routing-slot label{color:#3b425a;font-weight:600}
#routing-slot input,#routing-slot select,#routing-slot textarea{border-color:#bfc8db;font-weight:400}
#routing-slot input:focus,#routing-slot select:focus,#routing-slot textarea:focus{outline:2px solid #6554c0;border-color:#6554c0}
#routing-slot a{color:#235db0;text-underline-offset:3px}
#routing-slot button{font-weight:650;border-color:#c4cbe0}
#google-connect{background:#16634d;border-color:#16634d!important;color:white}
#account-form>button:first-of-type{background:#194f9b;color:white;border-color:#194f9b}
#mcp-form>button:first-of-type{background:#914b12;color:white;border-color:#914b12}
#stages-form{counter-reset:creation-stage}
#stages-form .stage-row{--stage-color:#6540a5;--stage-bg:#f7f3fd;counter-increment:creation-stage;position:relative;padding:20px;margin:18px 0;border:1px solid #ddd6ed;border-left:5px solid var(--stage-color);border-radius:12px;background:var(--stage-bg);gap:16px}
#stages-form .stage-row::before{content:'제작 단계 ' counter(creation-stage,decimal-leading-zero);grid-column:1/-1;font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--stage-color)}
#stages-form .stage-row>label:first-of-type{color:var(--stage-color);font-size:16px;font-weight:800}
#stages-form .stage-row:nth-child(3n+2){--stage-color:#245797;--stage-bg:#f1f6fd;border-color:#d4e1f2}
#stages-form .stage-row:nth-child(3n){--stage-color:#176654;--stage-bg:#f0f8f5;border-color:#cde6dc}
#stages-form .stage-row button{justify-self:start;min-width:132px;color:var(--stage-color);background:white;border-color:var(--stage-color)}
#stages-form>button.primary{padding:14px 26px;font-size:16px;box-shadow:0 4px 12px #6554c026}
#routing-result:not(:empty){padding:14px 18px;background:#edf7ef;border:1px solid #bfddc5;color:#245936;border-radius:10px;font-weight:600}
@media(max-width:600px){.card:has(> #routing-slot){padding:16px}.card:has(> #routing-slot)>h2{font-size:20px}#routing-slot>h3{font-size:18px;padding:14px 12px;gap:10px}#stages-form .stage-row{padding:15px;gap:13px}#routing-slot>form:not(#stages-form){padding:14px}#routing-slot>details.card,.card:has(> #routing-slot)>details.card{padding:14px}}
/* Editable sample gallery and story board */
.reuse-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#eeeafa;border:1px solid #dbd2ee;padding:14px 18px;border-radius:12px;margin-bottom:20px}.sample-grid,.sample-preview-panels,.story-board-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.sample-tile{border-top:5px solid var(--sample-color);overflow:hidden}.sample-tile>img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;margin-bottom:16px}.sample-tile h2{color:var(--sample-color)}.copy-options{background:#f7f6fc;border:1px solid #e3dfed;padding:16px;border-radius:10px;margin:14px 0}.copy-options h3{margin:18px 0 8px}.copy-options input[type=checkbox]{width:auto;display:inline-block;margin-right:8px}.sample-motion{position:relative;overflow:hidden;border-radius:10px}.sample-motion img{width:100%;display:block}.sample-bubble{position:absolute;bottom:12px;left:8%;max-width:84%;padding:10px 16px;border-radius:16px;background:#fffffff2;color:#25263d;box-shadow:0 3px 12px #0002}.sample-motion.motion-pan img{animation:sample-pan 8s ease-in-out infinite alternate}.sample-motion.motion-breathe img,.sample-motion.motion-float img{animation:sample-breathe 6s ease-in-out infinite alternate}.sample-motion.motion-fade img{animation:sample-fade 7s ease-in-out infinite alternate}@keyframes sample-pan{to{transform:scale(1.08) translateX(2%)}}@keyframes sample-breathe{to{transform:scale(1.04) translateY(-1%)}}@keyframes sample-fade{from{opacity:.7}to{opacity:1}}.board-card{border-top:4px solid #6554c0}.board-card>label{margin:12px 0}.board-preview{padding:18px;background:#f4f5f8;border:1px solid #dfe1e9;border-radius:10px;margin-top:16px}.board-preview.changed{background:#edf7f1;border-color:#71ac8c}.board-preview strong{color:#256043}.board-card textarea{min-height:110px}.story-board-grid{align-items:start}.story-board-grid .grid{grid-template-columns:1fr 1fr}.sample-preview-panels{margin-top:20px}#sample-preview{scroll-margin-top:20px}@media(max-width:760px){.sample-grid,.sample-preview-panels,.story-board-grid{grid-template-columns:1fr}.reuse-bar{padding:12px}.story-board-grid .grid{grid-template-columns:1fr}.sample-tile .row button{width:100%}}@media(prefers-reduced-motion:reduce){.sample-motion img{animation:none!important}}