:root{--bg:#f3f5f4;--panel:#fff;--panel2:#f7f9f8;--line:#e2e7e4;--line2:#d2d9d5;--text:#14231b;--muted:#56665d;--dim:#8a978f;--hover:#eef2f0;--brand:#0a301e;--accent:#139a5f;--accent-ink:#fff;--accent-soft:#139a5f1c;--warn:#b26a00;--danger:#c8372d;--claude:#c2603f;--env-draft:#b26a00;--env-draft-soft:#fff4e0;--env-stage:#2459d6;--env-stage-soft:#e9f0ff;--env-prod:#139a5f;--env-prod-soft:#e4f6ed;--r:10px}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:14px/1.45 Inter,system-ui,sans-serif;overflow:hidden}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}.mono{font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px}.top{border-bottom:1px solid var(--line);background:var(--panel);align-items:center;gap:12px;height:56px;padding:0 14px;display:flex}.brand{letter-spacing:-.01em;white-space:nowrap;align-items:center;gap:9px;font-weight:700;display:flex}.cdlogo{width:auto;display:block}.brand .div{background:var(--line2);width:1px;height:22px}.brand .prod{color:var(--brand);font-size:14px;font-weight:600}.brand small{color:var(--muted);font-weight:500}.sep{background:var(--line);width:1px;height:24px}.dd{position:relative}.dd-btn{background:var(--panel2);border:1px solid var(--line);white-space:nowrap;border-radius:8px;align-items:center;gap:8px;padding:6px 10px;display:flex}.dd-btn:hover{border-color:var(--line2)}.dd-btn .lbl{color:var(--dim);font-size:12px}.dd-btn svg{opacity:.6}.dd-menu{background:var(--panel2);border:1px solid var(--line2);z-index:50;border-radius:10px;min-width:220px;padding:5px;display:none;position:absolute;top:calc(100% + 6px);left:0;box-shadow:0 12px 32px #0a301e21}.dd.open .dd-menu{display:block}.dd-menu button{text-align:left;background:0 0;border:0;border-radius:7px;align-items:center;gap:8px;width:100%;padding:8px 10px;display:flex}.dd-menu button:hover{background:var(--hover)}.dd-menu button .sub{color:var(--dim);margin-left:auto;font-size:12px}.dd-menu button.on:before{content:"";background:var(--accent);border-radius:50%;width:6px;height:6px;margin-right:2px}.dd-menu hr{border:0;border-top:1px solid var(--line);margin:5px 0}.spacer{flex:1}.pill{border:1px solid var(--line);white-space:nowrap;background:var(--panel2);border-radius:999px;align-items:center;gap:7px;padding:5px 10px;font-size:12.5px;display:flex}.dot{background:var(--dim);border-radius:50%;width:8px;height:8px}.pill.ok .dot{background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.pill.off .dot{background:var(--warn)}.btn{border:1px solid var(--line2);background:var(--panel2);white-space:nowrap;border-radius:8px;padding:7px 12px;font-weight:500}.btn:hover{background:var(--hover)}.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}.btn.stage{background:var(--env-stage);border-color:var(--env-stage);color:#fff;font-weight:600}.btn.prod{background:var(--env-prod);border-color:var(--env-prod);color:#fff;font-weight:600}.btn.stage:hover,.btn.prod:hover{filter:brightness(1.08);background-color:inherit}.btn.stage:hover{background:var(--env-stage)}.btn.prod:hover{background:var(--env-prod)}.btn.primary:hover{filter:brightness(1.07)}.btn.ghost{color:var(--muted);background:0 0;border-color:#0000}.btn.ghost:hover{color:var(--text);background:var(--panel2)}.btn:disabled{opacity:.45;cursor:not-allowed}.badge{background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:2px 7px;font-size:11px;font-weight:600}.badge.warn{color:var(--warn);background:#f5b84a21}.main{grid-template-columns:var(--chatW,400px) 6px 1fr;grid-template-rows:minmax(0,1fr);height:calc(100% - 56px);display:grid}.chat,.stage{min-height:0;overflow:hidden}.log{min-height:0}.chat{background:var(--panel);flex-direction:column;min-width:0;display:flex}.gutter{background:var(--line);cursor:col-resize}.gutter:hover,.gutter.drag{background:var(--brand)}.stage{background:#e9edeb;flex-direction:column;min-width:0;display:flex}.chat-head{border-bottom:1px solid var(--line);align-items:center;gap:8px;padding:10px 12px;display:flex}.chat-head h2{margin:0;font-size:13px;font-weight:600}.log{flex-direction:column;flex:1;gap:12px;padding:14px 14px 6px;display:flex;overflow:auto}.msg{white-space:pre-wrap;word-wrap:break-word;border-radius:12px;max-width:92%;padding:10px 12px}.msg.user{background:var(--brand);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}.msg.bot{background:var(--panel2);border:1px solid var(--line);border-bottom-left-radius:4px;align-self:flex-start}.msg.sys{color:var(--dim);align-self:center;padding:2px;font-size:12px}.who{color:var(--dim);align-items:center;gap:6px;margin-bottom:4px;font-size:11.5px;display:flex}.change{white-space:normal;border:1px solid var(--line2);background:#fff;border-radius:9px;margin-top:9px;font-size:12.5px;overflow:hidden}.change .ch-h{border-bottom:1px solid var(--line);align-items:center;gap:8px;padding:7px 10px;display:flex}.change .ch-h b{font-weight:600}.change .ch-b{gap:3px;padding:7px 10px;display:grid}.del{color:#b8392f;opacity:.8;text-decoration:line-through}.add{color:#0f7a4a;font-weight:500}.change .ch-f{border-top:1px solid var(--line);gap:6px;padding:7px 10px;display:flex}.change .ch-f button{padding:4px 9px;font-size:12px}.typing span{background:var(--muted);border-radius:50%;width:6px;height:6px;margin-right:3px;animation:1s infinite b;display:inline-block}.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}@keyframes b{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}.empty{gap:12px;margin:auto 0;padding:6px 2px;display:grid}.empty h3{letter-spacing:-.01em;margin:0;font-size:17px}.empty p{color:var(--muted);margin:0}.card{border:1px solid var(--line);background:var(--panel2);border-radius:var(--r);padding:12px}.steps{counter-reset:s;gap:9px;margin:0;padding:0;list-style:none;display:grid}.steps li{counter-increment:s;grid-template-columns:24px 1fr;gap:8px;display:grid}.steps li:before{content:counter(s);width:22px;height:22px;color:var(--muted);background:#e7ece9;border-radius:50%;place-items:center;font-size:12px;font-weight:600;display:grid}.steps li b{font-weight:600;display:block}.steps li span{color:var(--muted);font-size:13px}.link{color:var(--accent);text-underline-offset:2px;background:0 0;border:0;padding:0;text-decoration:underline}.sugg{flex-wrap:wrap;gap:6px;padding:0 12px 8px;display:flex}.sugg button{border:1px solid var(--line2);color:var(--muted);background:0 0;border-radius:999px;padding:5px 10px;font-size:12px}.sugg button:hover{color:var(--text);border-color:var(--accent)}.composer{border:1px solid var(--line2);background:var(--panel2);border-radius:12px;margin:0 12px 12px;transition:border-color .15s}.composer:focus-within{border-color:var(--accent)}.composer textarea{resize:none;background:0 0;border:0;outline:0;width:100%;min-height:44px;max-height:160px;padding:10px 12px 4px}.composer .bar{align-items:center;gap:6px;padding:6px 8px;display:flex}.composer .bar .dd-btn{background:0 0;padding:4px 8px;font-size:12px}.composer .bar .dd-menu{top:auto;bottom:calc(100% + 6px)}.iconbtn{width:30px;height:30px;color:var(--muted);background:0 0;border:0;border-radius:8px;place-items:center;display:grid}.iconbtn:hover{background:var(--hover);color:var(--text)}.send{background:var(--brand);color:#fff}.send:hover{background:var(--brand);filter:brightness(1.2);color:#fff}.send:disabled{color:var(--dim);background:#e2e7e4}.scope{color:var(--dim);align-items:center;gap:6px;padding:0 14px 10px;font-size:11.5px;display:flex}.toolbar{border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap;align-items:center;gap:8px;padding:8px 12px;display:flex}.seg{background:var(--panel2);border:1px solid var(--line);border-radius:9px;gap:2px;padding:3px;display:flex}.seg button{color:var(--muted);background:0 0;border:0;border-radius:6px;align-items:center;gap:6px;padding:5px 10px;font-size:12.5px;display:flex}.seg button:hover{color:var(--text)}.seg button.on{color:var(--text);background:#fff;box-shadow:0 1px 2px #0a301e1f}.wbox{background:var(--panel2);border:1px solid var(--line);border-radius:8px;align-items:center;gap:4px;padding:3px 4px 3px 8px;display:flex}.wbox input{text-align:right;background:0 0;border:0;outline:0;width:56px}.wbox span{color:var(--dim);font-size:12px}.url{background:var(--panel2);border:1px solid var(--line);min-width:120px;color:var(--muted);white-space:nowrap;border-radius:8px;flex:1;align-items:center;gap:8px;padding:6px 10px;display:flex;overflow:hidden}.url b{color:var(--text);font-weight:500}.canvas{background-image:radial-gradient(#cfd6d2 1px,#0000 1px);background-size:18px 18px;flex:1;justify-content:center;min-height:0;padding:22px 16px 30px;display:flex;position:relative;overflow:hidden}.frameWrap{transform-origin:top;transition:width .25s;position:relative}.frameWrap.nodrag{transition:none}.device{background:#fff;border-radius:6px;height:100%;overflow:hidden;box-shadow:0 0 0 1px #d2d9d5,0 20px 50px #0a301e24}.frameWrap.phone .device{border-radius:28px;box-shadow:0 0 0 10px #1c2420,0 0 0 11px #3a443f,0 24px 50px #0a301e38}.frameWrap.tab .device{border-radius:16px;box-shadow:0 0 0 9px #1c2420,0 0 0 10px #3a443f,0 24px 50px #0a301e38}iframe{background:#fff;border:0;width:100%;height:100%;display:block}.handle{cursor:ew-resize;background:#fff;border:1px solid #c9d1cc;border-radius:7px;place-items:center;width:14px;height:64px;margin-top:-32px;display:grid;position:absolute;top:50%}.handle:after{content:"";border-left:2px solid #9aa79f;border-right:2px solid #9aa79f;width:6px;height:24px}.handle.r{right:-26px}.handle.l{left:-26px}.handle:hover{background:var(--brand);border-color:var(--brand)}.sizeTag{color:var(--dim);white-space:nowrap;font-size:11px;position:absolute;top:-20px;left:50%;transform:translate(-50%)}.status{border-top:1px solid var(--line);color:var(--dim);background:var(--panel);align-items:center;gap:10px;padding:6px 12px;font-size:12px;display:flex}.status .badge{font-size:11px}.envdot{border-radius:50%;flex:none;width:8px;height:8px;display:inline-block}.envdot.draft{background:var(--env-draft)}.envdot.staging{background:var(--env-stage)}.envdot.prod{background:var(--env-prod)}.ribbon{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:7px 14px;font-size:12.5px;display:flex}.ribbon b{letter-spacing:.06em;font-size:11.5px}.ribbon.draft{background:var(--env-draft-soft);color:#7a4a00}.ribbon.staging{background:var(--env-stage-soft);color:#1b3f99}.ribbon.prod{background:var(--env-prod-soft);color:#0c5c39}.ribbon .r-url{opacity:.85;font-family:JetBrains Mono,monospace;font-size:12px}.pipeline{border-top:1px solid var(--line);background:var(--panel);grid-template-columns:1fr auto 1fr auto 1fr;align-items:stretch;gap:8px;padding:10px 12px;display:grid}.env{border:1px solid var(--line);cursor:pointer;background:var(--panel);text-align:left;border-radius:10px;gap:2px;min-width:0;padding:8px 11px;display:grid}.env:hover{border-color:var(--line2)}.env .eh{align-items:center;gap:7px;font-size:13px;font-weight:600;display:flex}.env .eh .tag{text-transform:uppercase;letter-spacing:.05em;border-radius:5px;margin-left:auto;padding:2px 6px;font-size:10.5px;font-weight:700}.env .eu{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-family:JetBrains Mono,monospace;font-size:11.5px;overflow:hidden}.env .es{color:var(--dim);font-size:12px}.env.draft.on{border-color:var(--env-draft);box-shadow:0 0 0 3px var(--env-draft-soft)}.env.staging.on{border-color:var(--env-stage);box-shadow:0 0 0 3px var(--env-stage-soft)}.env.prod.on{border-color:var(--env-prod);box-shadow:0 0 0 3px var(--env-prod-soft)}.env.draft .tag{background:var(--env-draft-soft);color:var(--env-draft)}.env.staging .tag{background:var(--env-stage-soft);color:var(--env-stage)}.env.prod .tag{background:var(--env-prod-soft);color:var(--env-prod)}.arrow{place-items:center;gap:4px;display:grid}.arrow .btn{padding:6px 10px;font-size:12px}.arrow svg{color:var(--dim)}.checklist{gap:8px;margin:14px 0;display:grid}.checklist label{border:1px solid var(--line);cursor:pointer;border-radius:9px;align-items:flex-start;gap:9px;padding:9px 11px;display:flex}.checklist input{accent-color:var(--env-prod);margin-top:3px}.modal.small-modal{width:min(560px,100%)}.small-modal .m-main{padding:18px 20px}.scrim{z-index:100;background:#0a201652;justify-content:center;align-items:center;padding:16px;display:none;position:fixed;inset:0}.scrim.open{display:flex}.modal{background:var(--panel);border:1px solid var(--line2);border-radius:14px;flex-direction:column;width:min(860px,100%);max-height:calc(100vh - 32px);display:flex;overflow:hidden;box-shadow:0 30px 80px #0a301e40}.m-head{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:14px 18px;display:flex}.m-head h2{margin:0;font-size:16px}.m-body{flex:1;grid-template-columns:230px 1fr;min-height:0;display:grid}.m-nav{border-right:1px solid var(--line);flex-direction:column;gap:3px;padding:10px;display:flex;overflow:auto}.m-nav .h{text-transform:uppercase;letter-spacing:.06em;color:var(--dim);padding:8px 8px 4px;font-size:11px}.m-nav button{text-align:left;color:var(--muted);background:0 0;border:0;border-radius:8px;align-items:center;gap:9px;padding:8px 9px;display:flex}.m-nav button:hover{background:var(--panel2);color:var(--text)}.m-nav button.on{background:var(--panel2);color:var(--text);box-shadow:inset 2px 0 0 var(--accent)}.logo{border-radius:6px;flex:none;place-items:center;width:22px;height:22px;font-size:11px;font-weight:800;display:grid}.m-main{padding:18px 20px;overflow:auto}.m-main h3{letter-spacing:-.01em;margin:0 0 4px;font-size:18px}.m-main .lead{color:var(--muted);margin:0 0 16px}.tabs{border-bottom:1px solid var(--line);gap:4px;margin-bottom:16px;display:flex}.tabs button{color:var(--muted);background:0 0;border:0;border-bottom:2px solid #0000;margin-bottom:-1px;padding:8px 12px}.tabs button.on{color:var(--text);border-color:var(--accent)}.rec{color:var(--accent);margin-left:6px;font-size:11px}.copyrow{border:1px solid var(--line2);background:#fff;border-radius:8px;align-items:center;gap:6px;margin:6px 0;padding:6px 6px 6px 10px;display:flex}.copyrow code{white-space:nowrap;color:#0f6a41;flex:1;font-family:JetBrains Mono,monospace;font-size:12.5px;overflow:auto}.field{gap:5px;margin-bottom:12px;display:grid}.field label{color:var(--muted);font-size:12.5px}.input{border:1px solid var(--line2);background:#fff;border-radius:8px;outline:0;width:100%;padding:8px 10px}.input:focus{border-color:var(--accent)}.row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.note{background:var(--panel2);border:1px solid var(--line);color:var(--muted);border-radius:9px;padding:10px 12px;font-size:13px}.note b{color:var(--text)}.note.green{background:#3ddc970f;border-color:#3ddc9759}.ext{color:var(--accent)}.m-foot{border-top:1px solid var(--line);align-items:center;gap:10px;padding:12px 18px;display:flex}.compare{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;display:grid}.compare .card h4{margin:0 0 4px;font-size:14px}.compare .card p{color:var(--muted);margin:0;font-size:13px}.compare .card.pick{border-color:#3ddc9773}.ok-line{color:var(--accent);align-items:center;gap:8px;font-size:13px;display:none}.ok-line.show{display:flex}.toast{background:var(--brand);color:#fff;border:1px solid var(--brand);opacity:0;z-index:200;pointer-events:none;border-radius:9px;padding:9px 14px;transition:all .25s;position:fixed;top:68px;left:50%;transform:translate(-50%)translateY(-10px)}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}@media (width<=900px){.main{grid-template-rows:46% 1fr;grid-template-columns:1fr}.gutter,.brand small,.hide-sm{display:none}.m-body{grid-template-columns:1fr}.m-nav{border-right:0;border-bottom:1px solid var(--line);flex-direction:row;overflow:auto}.m-nav .h{display:none}.compare,.row{grid-template-columns:1fr}}#root{height:100%}body.resizing iframe{pointer-events:none}.cdlogo{height:26px}.msg.sys{white-space:normal;text-align:center}.sugg button:disabled,.dd-btn:disabled{opacity:.5;cursor:default}.url .updating{color:var(--env-draft);margin-left:auto;font-size:12px}.frame-empty{height:100%;color:var(--dim);place-items:center;font-size:14px;display:grid}.ch-f span[title]{display:inline-flex}.centered{place-items:center;height:100%;padding:16px;display:grid}.centered .card{background:var(--panel);gap:12px;width:min(420px,100%);padding:24px;display:grid}.centered h3{margin:6px 0 0;font-size:18px}.centered p{color:var(--muted);margin:0}.signin .brand{margin-bottom:6px}.signin .btn.primary{justify-self:start}#ddHistory .dd-menu{min-width:340px!important}.dd-menu button .sub{white-space:nowrap;padding-left:12px}@media (width<=900px){.top{gap:8px;overflow:auto hidden}.top::-webkit-scrollbar{display:none}.top .pill{display:none}.top .dd-menu{position:fixed;top:56px}}.consent{width:min(480px,100%)!important}.consent-list{color:var(--muted);gap:8px;margin:0;padding-left:18px;font-size:14px;display:grid}.consent-list b{color:var(--text)}.consent-actions{justify-content:flex-end;gap:10px;margin-top:4px;display:flex}.consent .btn{text-decoration:none}.connrow{justify-content:space-between;align-items:center;gap:10px;margin-top:8px;display:flex}.connector-banner{margin:0 12px 8px}.steps li span strong{color:var(--text);font-weight:600}.admin{background:var(--bg);flex-direction:column;height:100%;display:flex}.admin .top{position:static}.admin-body{flex:1;grid-template-columns:200px 1fr;min-height:0;display:grid}.admin-nav{border-right:1px solid var(--line);background:var(--panel);flex-direction:column;gap:2px;padding:16px 10px;display:flex}.admin-nav button{text-align:left;color:var(--muted);background:0 0;border:0;border-radius:8px;padding:8px 12px}.admin-nav button.on{background:var(--panel2);color:var(--text);font-weight:600}.admin-main{padding:22px 28px 60px;overflow:auto}.admin-head{align-items:center;gap:12px;margin-bottom:14px;display:flex}.admin-head h2{margin:0;font-size:20px}.admin-table{border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:10px;width:100%;overflow:hidden}.admin-table th{text-align:left;color:var(--muted);border-bottom:1px solid var(--line);background:var(--panel2);padding:9px 12px;font-size:12px;font-weight:600}.admin-table td{border-bottom:1px solid var(--line);vertical-align:top;padding:10px 12px}.admin-table tbody tr:last-child td{border-bottom:0}.admin-table tbody tr:hover{background:var(--panel2)}.admin-table tbody tr{cursor:default}.admin-table .sub,.admin .sub{color:var(--muted);font-size:12.5px}.admin-table .nowrap{white-space:nowrap}.admin-form{max-width:860px}.admin-form h3{margin:22px 0 6px;font-size:15px}.admin .hint{color:var(--muted);margin:2px 0 8px;font-size:12.5px;display:block}.admin .badge.ok{color:#137a4f;background:#3ddc9726}.admin .check{align-items:center;gap:6px;font-size:14px;display:flex}.admin textarea.input{resize:vertical;font:inherit}.admin .danger{border-top:1px solid var(--line);margin-top:34px;padding-top:6px}@media (width<=760px){.admin-body{grid-template-columns:1fr}.admin-nav{border-right:0;border-bottom:1px solid var(--line);flex-direction:row;overflow-x:auto}.admin-main{padding:16px}.admin .row{grid-template-columns:1fr}}.admin .field{align-content:start}.refs{flex-wrap:wrap;gap:6px;padding:8px 10px 0;display:flex}.refs.in-msg{padding:0 0 6px}.ref-chip{color:#1f4f9e;white-space:nowrap;text-overflow:ellipsis;background:#1f6feb1a;border:1px solid #1f6feb40;border-radius:999px;align-items:center;gap:4px;max-width:100%;padding:2px 8px;font-size:12px;display:inline-flex;overflow:hidden}.msg.user .ref-chip{color:inherit;background:#ffffff2e;border-color:#ffffff4d}.ref-chip:before{content:"📍";font-size:11px}.ref-chip button{color:inherit;cursor:pointer;background:0 0;border:0;padding:0 0 0 2px;font-size:14px;line-height:1}.pick-hint{color:#1f4f9e;padding:8px 10px 0;font-size:12.5px}.iconbtn.on{color:#1f4f9e;background:#1f6feb1f}.thumbs{flex-wrap:wrap;gap:8px;padding:8px 10px 0;display:flex}.thumbs.in-msg{padding:0 0 6px}.thumbs img{object-fit:cover;border:1px solid var(--line2);border-radius:6px;width:64px;height:48px;display:block}.thumb{position:relative}.thumb button{border:1px solid var(--line2);cursor:pointer;background:#fff;border-radius:50%;width:18px;height:18px;padding:0;font-size:12px;line-height:1;position:absolute;top:-6px;right:-6px}.thumb.loading{border:1px dashed var(--line2);width:64px;height:48px;color:var(--muted);border-radius:6px;place-items:center;font-size:11px;display:grid}.ch-img{border-radius:6px;max-width:100%;max-height:120px;display:block}.del .ch-img{opacity:.55}
