:root{--font-thai:var(--font-legacy-body);--font-display:var(--font-legacy-display);--agent-blue:#164ea6;--agent-navy:#0d1f3c;--agent-orange:#f59d18;--agent-ink:#172033;--agent-muted:#667085;--agent-line:#dce3ed;--agent-paper:#f1f5fa}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.studio-page{min-height:100vh;color:var(--agent-ink);font-family:var(--font-legacy-body),sans-serif;background:radial-gradient(circle at 8% 0,#1d5bb81a,#0000 28%),#eef3f9;padding:40px 0 80px;line-height:1.6}.studio-shell{width:min(1440px,100% - 36px);margin-inline:auto}.studio-top{justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:24px;display:flex}.studio-top h1{font-family:var(--font-legacy-display),sans-serif;letter-spacing:-.04em;margin:4px 0;font-size:clamp(2.4rem,5vw,4.6rem);line-height:1}.studio-top p{color:var(--agent-muted);margin:0}.studio-top-actions{align-items:center;gap:9px;display:flex}.studio-badge{color:var(--agent-blue);background:#dce9ff;border-radius:999px;align-items:center;padding:9px 14px;font-size:.82rem;font-weight:700;text-decoration:none;display:inline-flex}.agent-kicker{color:var(--agent-blue);font-family:var(--font-legacy-display),sans-serif;letter-spacing:.13em;align-items:center;gap:7px;font-size:.72rem;font-weight:700;display:inline-flex}.panel{border:1px solid var(--agent-line);background:#fff;border-radius:24px;box-shadow:0 18px 55px #1d365b14}.agent-loading{text-align:center;min-height:420px;color:var(--agent-muted);place-content:center;display:grid}.agent-loading svg{color:var(--agent-blue);margin:auto}.agent-login{max-width:580px;margin:35px auto 0;padding:34px}.login-mascot{text-align:center;height:125px}.login-mascot img{object-fit:contain;filter:drop-shadow(0 16px 20px #0e234426);transform:translateY(-35px)}.agent-login h2{font-family:var(--font-legacy-display),sans-serif;margin:6px 0;font-size:2rem}.agent-login>p{color:var(--agent-muted);margin:0 0 22px}.agent-login form{gap:14px;display:grid}.agent-login label,.studio-form label{gap:6px;font-size:.82rem;font-weight:600;display:grid}.password-field{border:1px solid var(--agent-line);border-radius:12px;grid-template-columns:1fr auto;display:grid;overflow:hidden}.password-field input{border:0!important}.password-field button{width:48px;color:var(--agent-muted);background:#fff;border:0}.primary-action,.generate-button{background:var(--agent-navy);color:#fff;border:0;border-radius:12px;justify-content:center;align-items:center;gap:8px;min-height:52px;font-weight:700;display:flex}.token-help{background:var(--agent-paper);border-radius:14px;margin-top:22px;padding:16px 18px;font-size:.84rem}.token-help ol{margin:8px 0 0;padding-left:20px}.token-help code{background:#fff;border-radius:4px;padding:2px 5px}.agent-session{color:#257244;background:#edfbf2;border:1px solid #bde4cc;border-radius:12px;justify-content:space-between;align-items:center;margin-bottom:12px;padding:9px 13px;font-size:.8rem;display:flex}.agent-session span{align-items:center;gap:7px;display:flex}.agent-session i{background:#20a758;border-radius:50%;width:8px;height:8px}.agent-session button{color:#257244;background:0 0;border:0;align-items:center;gap:5px;font-weight:700;display:flex}.studio-grid{grid-template-columns:minmax(430px,.84fr) minmax(620px,1.16fr);align-items:start;gap:18px;display:grid}.studio-control{padding:26px}.studio-mascot{border-bottom:1px solid var(--agent-line);align-items:center;gap:5px;padding-bottom:18px;display:flex}.studio-mascot img{object-fit:contain}.studio-mascot span{color:var(--agent-blue);font-family:var(--font-legacy-display),sans-serif;letter-spacing:.12em;align-items:center;gap:6px;font-size:.68rem;font-weight:700;display:flex}.studio-mascot h2{font-family:var(--font-legacy-display),sans-serif;margin:4px 0;font-size:1.45rem;line-height:1.25}.studio-mascot p{color:var(--agent-muted);margin:0;font-size:.78rem}.studio-form{gap:16px;margin-top:18px;display:grid}.form-section{border:1px solid var(--agent-line);background:#fbfcfe;border-radius:16px;gap:11px;padding:16px;display:grid}.form-section>span{color:var(--agent-blue);font-family:var(--font-legacy-display),sans-serif;align-items:center;gap:7px;font-size:.85rem;font-weight:700;display:flex}.form-section>span svg{width:17px}.form-grid{gap:10px;display:grid}.form-grid.two{grid-template-columns:1fr 1fr}.studio-form input,.studio-form select,.studio-form textarea,.agent-login input{border:1px solid var(--agent-line);width:100%;color:var(--agent-ink);background:#fff;border-radius:10px;outline:none;padding:11px 12px}.studio-form textarea{resize:vertical}.studio-form input:focus,.studio-form select:focus,.studio-form textarea:focus,.agent-login input:focus{border-color:#4d86d8;box-shadow:0 0 0 3px #164ea61a}.generate-button{background:linear-gradient(135deg,#1554b8,#0f306a);box-shadow:0 12px 25px #1554b838}.generate-button:disabled,.primary-action:disabled{opacity:.55}.studio-notice{color:#745200;background:#fff5d9;border-radius:10px;margin:14px 0 0;padding:11px 13px;font-size:.82rem}.studio-notice.error{color:#9e2e2e;background:#fff0f0}.draft-panel{min-height:780px;padding:28px}.empty-draft{text-align:center;min-height:720px;color:var(--agent-muted);place-content:center;display:grid}.empty-draft svg{width:48px;height:48px;color:var(--agent-blue);margin:auto}.empty-draft h2{font-family:var(--font-legacy-display),sans-serif;color:var(--agent-ink);margin:12px 0 3px}.empty-draft p{max-width:520px;margin:0}.draft-head{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.draft-head>div:first-child{gap:6px;display:grid}.draft-head small{color:var(--agent-muted)}.status{color:#855c00;width:max-content;font-family:var(--font-legacy-display),sans-serif;text-transform:uppercase;background:#fff0c7;border-radius:999px;padding:5px 10px;font-size:.68rem;font-weight:700}.status.approved{color:#1a723d;background:#ddf7e7}.status.published{color:#164ea6;background:#dceaff}.draft-actions{gap:7px;display:flex}.draft-actions button{border:1px solid var(--agent-line);color:var(--agent-ink);background:#fff;border-radius:9px;align-items:center;gap:5px;padding:8px 10px;font-size:.76rem;display:flex}.draft-actions svg{width:14px}.result-tabs{background:var(--agent-paper);border-radius:12px;gap:5px;margin:22px 0;padding:5px;display:flex;overflow:auto}.result-tabs button{min-width:max-content;color:var(--agent-muted);background:0 0;border:0;border-radius:9px;flex:1;padding:9px 11px;font-size:.78rem;font-weight:700}.result-tabs button.active{color:var(--agent-blue);background:#fff;box-shadow:0 4px 12px #22365514}.result-section{animation:.2s agentFade}.result-label{color:var(--agent-blue);font-family:var(--font-legacy-display),sans-serif;letter-spacing:.09em;align-items:center;gap:6px;margin-bottom:8px;font-size:.7rem;font-weight:700;display:flex}.result-label svg{width:15px}.result-section>h2{font-family:var(--font-legacy-display),sans-serif;margin:5px 0 18px;font-size:1.75rem;line-height:1.3}.result-section>h3{font-family:var(--font-legacy-display),sans-serif}.strategy-cards{grid-template-columns:1fr 1fr;gap:9px;margin-bottom:22px;display:grid}.strategy-cards article{border:1px solid var(--agent-line);background:#fbfcfe;border-radius:12px;grid-template-columns:auto 1fr;gap:2px 8px;padding:13px;display:grid}.strategy-cards svg{width:19px;color:var(--agent-blue);grid-row:1/3}.strategy-cards b{font-size:.8rem}.strategy-cards p{color:var(--agent-muted);margin:0;font-size:.76rem}.post-preview{border-left:4px solid var(--agent-orange);background:#fff9ee;border-radius:0 16px 16px 0;padding:22px}.post-preview h3{font-family:var(--font-legacy-display),sans-serif;margin:0 0 13px;font-size:1.2rem}.post-preview p{white-space:pre-wrap;color:#384357}.post-preview blockquote{color:#793f00;background:#fff;border-radius:10px;margin:18px 0;padding:13px 15px;font-weight:600}.hashtags{color:var(--agent-blue);font-weight:600}.proof-note,.plan-box,.alt-box,.warning-box,.seo-details{background:var(--agent-paper);border-radius:13px;margin-top:14px;padding:16px}.proof-note p,.plan-box p,.alt-box p,.warning-box p,.seo-details p{color:var(--agent-muted);margin:5px 0}.warning-box{color:#923a24;background:#fff1ed}.idea-list{gap:9px;display:grid}.idea-list article{border:1px solid var(--agent-line);border-radius:13px;grid-template-columns:42px 1fr;gap:12px;padding:14px;display:grid}.idea-list article>span{width:42px;height:42px;color:var(--agent-blue);font-family:var(--font-legacy-display),sans-serif;background:#e6efff;border-radius:11px;place-items:center;font-weight:700;display:grid}.idea-list h3{font-family:var(--font-legacy-display),sans-serif;margin:0;font-size:1rem}.idea-list p{color:var(--agent-muted);margin:3px 0;font-size:.82rem}.idea-list small{color:#9a6205}.plan-box ul{margin-bottom:0}.visual-spec{border:1px solid var(--agent-line);border-radius:13px;grid-template-columns:120px 1fr;gap:9px 16px;padding:16px;display:grid}.visual-spec p{color:var(--agent-muted);margin:0}.check-list{gap:8px;padding-left:24px;display:grid}.check-list li{color:#3c4758;padding-left:5px}.keyword-list{flex-wrap:wrap;gap:7px;display:flex}.keyword-list span{color:var(--agent-blue);background:#e7effc;border-radius:999px;padding:6px 10px;font-size:.78rem}.seo-details{gap:7px;display:grid}.seo-details code{background:#fff;border-radius:6px;width:max-content;padding:5px 8px}.lead-columns{grid-template-columns:1fr 1fr;gap:16px;display:grid}.lead-columns>div{border:1px solid var(--agent-line);border-radius:14px;padding:16px}.lead-columns h3{font-family:var(--font-legacy-display),sans-serif;margin-top:0;font-size:1rem}.approval-bar{border-top:1px solid var(--agent-line);gap:9px;margin-top:22px;padding-top:20px;display:flex}.approval-bar button{border-radius:10px;flex:1;justify-content:center;align-items:center;gap:7px;min-height:46px;font-weight:700;display:flex}.approval-bar .approve{color:#1d7742;background:#e9f9ef;border:1px solid #2a9d5b}.approval-bar .publish{background:var(--agent-blue);color:#fff;border:0}.approval-bar button:disabled{opacity:.42;cursor:not-allowed}.safety-note{text-align:center;color:var(--agent-muted);margin-top:10px;display:block}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes agentFade{0%{opacity:0;transform:translateY(3px)}}@media (max-width:1100px){.studio-grid{grid-template-columns:1fr}.draft-panel{min-height:auto}.empty-draft{min-height:380px}}@media (max-width:680px){.studio-page{padding:22px 0 55px}.studio-shell{width:min(100% - 22px,1440px)}.studio-top{flex-direction:column;align-items:flex-start}.studio-top h1{font-size:2.55rem}.studio-grid{grid-template-columns:1fr}.panel,.studio-control,.draft-panel{border-radius:18px;padding:18px}.studio-mascot img{width:88px;height:88px}.studio-mascot h2{font-size:1.15rem}.form-grid.two,.strategy-cards,.lead-columns{grid-template-columns:1fr}.draft-head{flex-direction:column}.draft-actions{width:100%}.draft-actions button{flex:1;justify-content:center}.result-tabs button{flex:none}.visual-spec{grid-template-columns:1fr}.agent-login{margin-top:20px}.agent-session{align-items:flex-start;gap:8px}.agent-session button{white-space:nowrap}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.spin,.result-section{animation:none}}