:root{--navy:#07223a;--yellow:#f8a809;--ink:#172b3d;--muted:#6d7d8d;--line:#e4e9ee;--bg:#f3f5f7;--white:#fff;font-family:Cabin,Arial,sans-serif;color:var(--ink);font-size:14px}*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,textarea,select{font:inherit}button,a.button,a.primary{cursor:pointer}button{border:0;background:none;color:inherit}button:disabled{opacity:.45;cursor:not-allowed}a{color:var(--navy)}.shell{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:100vh}.sidebar{background:var(--navy);color:#fff;padding:36px 24px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.wordmark{display:flex;gap:12px;align-items:center;font-size:16px;font-weight:800;letter-spacing:1px}.wordmark span:not(.brand-symbol){display:block;font-size:24px;letter-spacing:5px;margin-top:3px}.brand-symbol{border:2px solid var(--yellow);color:var(--yellow);border-radius:50%;width:42px;height:42px;display:grid;place-items:center;font-size:23px}.rail-label{font-size:9px;color:#91a5b7;letter-spacing:1.4px;margin:56px 0 14px}.nav{display:flex;gap:12px;align-items:center;width:100%;padding:14px 12px;text-align:left;color:#b6c7d6;border-radius:6px;margin-bottom:6px}.nav span{font-size:21px;width:20px}.nav.active{color:#fff;background:#18364f;border-left:3px solid var(--yellow)}.rail-bottom{margin-top:auto;border-top:1px solid #254056;padding-top:22px;display:flex;align-items:center;gap:10px}.avatar{width:34px;height:34px;border-radius:50%;background:var(--yellow);color:var(--navy);display:grid;place-items:center;font-weight:bold}.rail-bottom small{display:block;color:#b6c7d6;font-size:10px;margin-top:6px}main{padding:0 42px 40px;max-width:1700px}header{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.breadcrumb{font-size:10px;letter-spacing:1.5px;color:var(--muted)}.breadcrumb span{color:var(--navy);font-weight:bold}.quiet{color:var(--muted);font-size:12px;padding:8px}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:32px 0 26px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:#a76d00;margin:0 0 12px}h1{font-size:32px;letter-spacing:-.8px;margin:0 0 10px;line-height:1.15}p{line-height:1.6}h2{font-size:19px;margin:0 0 8px}h3{font-size:15px}small,.fine{font-size:11px;line-height:1.6;color:var(--muted)}.page-heading p:not(.eyebrow){margin:0;color:var(--muted);max-width:620px}.badge{padding:8px 12px;font-size:11px;border:1px solid #d8e1e9;border-radius:50px;background:#fff;white-space:nowrap}.badge.connected{border-color:#a8d6bf;color:#23794c;background:#f0fbf4}.workspace{display:grid;grid-template-columns:minmax(340px,1.04fr) minmax(340px,1fr);gap:28px;align-items:start}.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:26px}.editor{padding:0}.card-heading{padding:25px 26px 18px;display:flex;justify-content:space-between;align-items:start}.card-heading p{font-size:12px;margin:0;color:var(--muted)}.muted{font-size:12px;color:var(--muted)}.tabs{display:flex;border-bottom:1px solid var(--line);padding:0 26px;gap:20px}.tab{padding:14px 0;color:var(--muted);font-size:12px;border-bottom:2px solid transparent}.tab.selected{color:var(--navy);border-color:var(--yellow);font-weight:bold}.panel{padding:25px 26px 20px;min-height:425px}label{display:block;font-size:12px;font-weight:600;margin-bottom:18px}input,textarea,select{display:block;margin-top:8px;border:1px solid #d8e0e7;border-radius:5px;padding:11px 12px;width:100%;color:var(--ink);background:#fff;outline:none;font-size:13px}input:focus,textarea:focus,select:focus,.rich-editor:focus{border-color:#9daebb;box-shadow:0 0 0 3px #f8a80922}input[readonly]{background:#f5f7f9;color:var(--muted)}label small{display:block;margin-top:6px;font-weight:400}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}.editor-actions{padding:20px 26px;background:#fbfcfd;border-top:1px solid var(--line);border-radius:0 0 10px 10px;display:flex;align-items:center;gap:16px}.primary,.button{display:inline-block;text-decoration:none;font-weight:bold;border-radius:5px;padding:12px 17px;line-height:1.2;text-align:center}.primary{background:var(--yellow);color:var(--navy)}.primary:hover{background:#f6b82f}.button{border:1px solid #d8e1e9;background:#fff;color:var(--navy);font-size:12px}.text-link{color:var(--navy);font-weight:bold;padding:0}.preview-caption{display:flex;align-items:center;justify-content:space-between;font-size:9px;font-weight:bold;letter-spacing:1.7px;margin:4px 0 17px}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#57a37c;margin-right:6px}.device-switch{display:flex;border:1px solid #d9e1e8;border-radius:5px;background:#fff;padding:3px;letter-spacing:0}.device-switch button{font-size:10px;padding:6px 10px;border-radius:3px}.device-switch .selected{background:var(--navy);color:#fff}.email-paper{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;max-width:100%;transition:max-width .2s}.email-paper.mobile{max-width:375px;margin:auto}.email-head{border-bottom:1px solid var(--line);padding:20px 23px;display:flex;align-items:center;gap:12px}.email-icon{background:#f0f4f7;color:var(--navy);padding:8px;border-radius:5px;font-size:21px}.email-head strong{font-size:12px}.email-head small{display:block;margin-top:5px;font-size:10px}.html-pill{margin-left:auto;background:#f4f6f8;font-size:9px;padding:5px 7px;border-radius:3px;color:var(--muted)}.email-body{padding:28px;font-family:Arial,sans-serif;font-size:13px;min-height:360px}.email-body p{margin:0 0 18px}.email-body iframe{width:100%;height:200px;border:0;margin-top:6px}.preview-note{display:flex;gap:12px;padding:20px 4px;color:var(--muted);font-size:11px}.preview-note>span{color:#458662}.preview-note strong{color:var(--ink);font-size:12px}.preview-note p{margin:5px 0;max-width:380px}.next-step{border-top:1px solid #dce4eb;padding-top:24px;margin-top:6px}.next-step p:not(.eyebrow){font-size:12px;color:var(--muted);max-width:400px}.notice{background:#fff6df;border:1px solid #f2d394;padding:15px 18px;border-radius:6px;font-size:12px;line-height:1.6;margin-bottom:22px}.toast{position:fixed;bottom:25px;right:25px;background:var(--navy);color:#fff;padding:15px 22px;border-radius:7px;z-index:20;max-width:480px;box-shadow:0 8px 32px #07223a20}.toast.error{background:#a83232}.upload-area{display:flex;gap:20px;align-items:center;padding:20px;background:#f7f9fb;border:1px dashed #c5d1dc;border-radius:6px;margin-bottom:25px}.upload-area img{width:90px;height:75px;object-fit:contain}.upload-area p{font-size:11px;color:var(--muted);margin:5px 0 12px}.upload-area label{margin:0;display:inline-block}.link-row{display:grid;grid-template-columns:1fr 1.6fr auto;gap:8px;align-items:center;margin-bottom:10px}.link-row input{margin:0}.link-row button{font-size:19px;padding:8px}.footer-label{margin:26px 0 10px}.format-toolbar{background:#f5f7f9;border:1px solid #d8e0e7;border-bottom:0;padding:6px;border-radius:5px 5px 0 0}.format-toolbar button{padding:5px 9px}.rich-editor{border:1px solid #d8e0e7;border-radius:0 0 5px 5px;min-height:95px;padding:12px;outline:none;font-size:13px;margin-bottom:8px}.rich-editor p{margin:0 0 8px}.email-workspace{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(380px,1.1fr);gap:26px}.email-workspace label:first-of-type{margin-top:24px}#message-preview{width:100%;height:400px;border:0;margin-top:20px}.email-actions{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap}#email-result{font-size:12px;line-height:1.6;margin-top:18px}.connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.step{display:inline-block;font-weight:bold;font-size:13px;color:#a76d00;background:#fff3d6;padding:10px;border-radius:50%;margin-bottom:22px}.mailbox{padding:13px 16px;background:#f4f7fa;border:1px solid #e0e6ec;border-radius:5px;margin:20px 0;font-size:13px}.prompt-example{padding:17px;background:#f4f7fa;border-left:3px solid var(--yellow);font-size:12px;line-height:1.6;margin-top:22px}.connection-list{margin-top:25px}.list-row{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-top:1px solid var(--line);gap:20px}.list-row:first-child{margin-top:15px}.list-row small{display:block;margin-top:5px}.gate{display:grid;place-items:center;min-height:100vh;background:var(--navy);padding:30px}.gate-card{max-width:560px;padding:45px;background:#fff;border-radius:10px;border-top:5px solid var(--yellow)}.brand-label{font-weight:bold;font-size:11px;letter-spacing:2px;color:#987000;margin-bottom:25px}.gate-card h1{font-size:38px}.gate-card p{color:var(--muted)}.gate-card li{margin:12px 0;line-height:1.5}.gate-card form button{margin:10px 10px 0 0}dialog{border:1px solid var(--line);border-radius:10px;padding:30px;max-width:520px;color:var(--ink)}dialog::backdrop{background:#07223a88}dialog p{font-size:13px;line-height:1.6}#send-summary{white-space:pre-line;background:#f4f7fa;padding:16px;font-size:13px;line-height:1.7}[hidden]{display:none!important}@media(min-width:1500px){main{padding-right:65px;padding-left:65px}.workspace{gap:36px}.panel{min-height:430px}}@media(max-width:1100px){.shell{grid-template-columns:185px minmax(0,1fr)}.sidebar{padding:30px 17px}.wordmark{font-size:12px}.wordmark span:not(.brand-symbol){font-size:19px}.brand-symbol{width:34px;height:34px}main{padding:0 25px 30px}.workspace,.email-workspace{grid-template-columns:1fr}.preview-column{max-width:700px}.page-heading{align-items:start}.badge{margin-top:20px}}@media(max-width:700px){.shell{display:block}.sidebar{height:auto;position:static;padding:18px 20px}.wordmark{font-size:13px}.wordmark span:not(.brand-symbol){display:inline;font-size:13px;letter-spacing:1px;margin-left:6px}.rail-label,.rail-bottom{display:none}.sidebar nav{display:flex;gap:8px;margin-top:18px}.nav{font-size:11px;padding:9px 7px;margin:0;justify-content:center}.nav span{display:none}.nav.active{border-left:0;border-bottom:2px solid var(--yellow)}main{padding:0 16px 25px}header{height:58px}.page-heading{display:block;padding:26px 0 20px}h1{font-size:28px}.badge{display:inline-block;margin-top:15px}.two-col,.connection-grid{grid-template-columns:1fr}.two-col{gap:0}.card-heading,.panel{padding-left:20px;padding-right:20px}.tabs{padding:0 20px;gap:16px}.editor-actions{display:block;padding:18px 20px}.editor-actions .muted{display:block;margin-top:12px}.panel{min-height:0}.workspace{gap:30px}.card{padding:20px}.editor{padding:0}.gate-card{padding:30px}.gate-card h1{font-size:32px}.toast{left:16px;right:16px;bottom:16px}.link-row{grid-template-columns:1fr auto}.link-row input:nth-child(2){grid-column:1}.link-row button{grid-column:2;grid-row:1/3}}
/* Keep promotional artwork readable without changing its proportions. */
.banner-upload{margin-bottom:20px;padding:18px;border:1px dashed #ccd5dc;border-radius:12px;background:#f8fafc}.banner-upload img{display:block;max-width:100%;max-height:200px;object-fit:contain;margin-bottom:14px}.tabs{flex-wrap:wrap}
