:root{--ink:#172235;--muted:#758196;--line:#e7ebf1;--bg:#f5f7fa;--nav:#111c2d;--blue:#315fe8;--blue2:#244dc7;--green:#15966b;--red:#c24141}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14px}.shell{min-height:100vh;display:flex}.sidebar{width:238px;background:var(--nav);color:#fff;padding:27px 17px;display:flex;flex-direction:column;flex-shrink:0}.brand{display:flex;align-items:center;gap:11px;padding:0 10px 38px}.brand-mark{width:36px;height:36px;border-radius:11px;background:#315fe8;display:grid;place-items:center;font-weight:800;font-size:21px}.brand strong{display:block;font-size:16px;letter-spacing:-.4px}.brand span{display:block;color:#8d9bb2;font-size:9px;letter-spacing:2px;margin-top:3px}.side-caption,.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.5px;color:#91a0b7}.side-caption{padding:0 11px 12px}.nav-item{border:0;background:transparent;color:#b9c4d4;text-align:left;padding:12px 13px;border-radius:8px;margin:2px 0;font:inherit;cursor:pointer}.nav-item.active,.nav-item:hover{background:#24334b;color:#fff}.nav-icon{display:inline-block;width:25px;font-size:17px}.side-bottom{margin-top:auto;border-top:1px solid #2a384d;padding:20px 10px 0;color:#c3ccda;font-size:12px;line-height:1.8}.side-bottom small{padding-left:16px;color:#8190a6}.status-dot{display:inline-block;width:7px;height:7px;background:#32c48d;border-radius:50%;margin-right:7px}.main{flex:1;min-width:0;padding:0 42px;display:flex;flex-direction:column}.topbar{height:105px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.topbar .eyebrow{color:#8b96a8}.topbar h1{font-size:23px;margin:7px 0 0;letter-spacing:-.6px}.top-actions{display:flex;align-items:center;gap:20px}.api-status{font-size:12px;color:#66758a}.api-status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#23ad7c;margin-right:7px}.ghost,.secondary,.text-button,.page-button{background:#fff;border:1px solid var(--line);border-radius:7px;padding:9px 13px;color:#45546a;font-weight:600;cursor:pointer}.hidden{display:none!important}.intro{display:flex;justify-content:space-between;align-items:center;margin:29px 0 20px}.intro h2{font-size:19px;margin:0 0 5px;letter-spacing:-.4px}.intro p,.panel-heading p{margin:0;color:var(--muted);font-size:12px}.pill{font-size:9px;letter-spacing:1px;font-weight:700;color:#315fe8;background:#edf2ff;padding:7px 10px;border-radius:20px}.content-grid{display:grid;grid-template-columns:minmax(450px,1.2fr) minmax(290px,.8fr);gap:20px;align-items:start}.panel{background:#fff;border:1px solid var(--line);border-radius:11px;box-shadow:0 2px 8px #17223508}.form-panel{padding:23px 25px}.panel-heading{display:flex;align-items:center;gap:12px;margin-bottom:23px}.step{width:32px;height:32px;border-radius:9px;background:#edf2ff;color:#315fe8;display:grid;place-items:center;font-weight:800;font-size:11px}.muted-step{background:#f0f2f5;color:#8490a1}.panel-heading h3{font-size:14px;margin:0 0 4px}.text-button{margin-left:auto;border:0;color:#315fe8;background:transparent;font-size:11px;padding:7px}.field{display:flex;flex-direction:column;gap:7px;margin-bottom:17px}.field label,form label{font-size:12px;font-weight:650;color:#354258}.optional{font-weight:400;color:#99a3b1}.field input,.field select,form input{width:100%;height:41px;border:1px solid #dfe5ed;border-radius:7px;padding:0 12px;background:#fff;color:#243147;font:inherit;outline:none}.field input:focus,.field select:focus,form input:focus{border-color:#7894f3;box-shadow:0 0 0 3px #315fe814}.field small{font-size:10px;color:#98a2b0}.template-meta{font-size:11px;color:#738198}.parameters-area{border-top:1px solid var(--line);padding-top:15px;margin-top:2px}.parameters-area:empty{display:none}.parameters-area h4{font-size:12px;margin:0 0 13px}.parameters-area .field{margin-bottom:12px}.form-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:18px;margin-top:21px}.required-note{font-size:10px;color:#9aa4b2}.primary{border:0;background:var(--blue);color:#fff;border-radius:7px;padding:12px 17px;font-weight:650;cursor:pointer;box-shadow:0 3px 7px #315fe82b}.primary:hover{background:var(--blue2)}.primary:disabled{opacity:.45;cursor:not-allowed}.primary span{padding-left:10px}.full{width:100%;margin-top:18px}.right-column{display:grid;gap:15px}.preview-panel{padding:23px 21px;min-height:290px}.preview-panel .panel-heading{margin-bottom:20px}.preview-empty{height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#9aa5b5;gap:8px}.preview-bubble{width:43px;height:43px;border-radius:13px;background:#f1f4f8;display:grid;place-items:center;font-size:22px}.preview-empty strong{font-size:12px;color:#68758a}.preview-empty span{font-size:11px}.preview-message{background:#eaf7ef;border-radius:10px 10px 10px 2px;padding:14px;max-width:100%;font-size:12px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}.preview-label{font-size:10px;color:#8b97a7;margin-bottom:10px}.info-card{display:flex;gap:12px;background:#eef3ff;border:1px solid #e0e9ff;border-radius:10px;padding:16px}.info-symbol{font-size:17px;color:#315fe8}.info-card strong{font-size:12px}.info-card p{font-size:11px;color:#63718a;line-height:1.55;margin:6px 0 0}.notice{margin-top:15px;padding:12px 14px;border-radius:8px;font-size:12px;line-height:1.5}.notice.success{background:#eaf8f1;color:#16764f;border:1px solid #cdeedc}.notice.error{background:#fff0f0;color:#a53737;border:1px solid #f5d6d6}.login-wrap{min-height:calc(100vh - 170px);display:grid;place-items:center}.login-card{width:min(420px,100%);background:#fff;border:1px solid var(--line);border-radius:13px;padding:35px;box-shadow:0 10px 35px #18243a0a}.login-icon{width:43px;height:43px;border-radius:12px;background:#edf2ff;color:#315fe8;display:grid;place-items:center;font-size:22px;margin-bottom:22px}.login-card .eyebrow{color:#8491a5}.login-card h2{font-size:22px;margin:9px 0}.login-card p{font-size:12px;line-height:1.6;color:var(--muted);margin:0 0 25px}.login-card form label{display:block;margin-bottom:8px}.login-card input{margin-bottom:2px}.secure-note{font-size:10px;color:#8b96a7;margin-top:18px;text-align:center}.history-panel{padding:20px 22px}.filters{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.filters .field{flex:1;min-width:130px;margin:0 0 18px}.filters .field input,.filters .field select{height:37px}.filter-button{height:37px;margin-bottom:18px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;font-size:9px;letter-spacing:.8px;color:#8793a4;padding:14px 12px;border-bottom:1px solid var(--line)}td{font-size:11px;color:#47556a;padding:14px 12px;border-bottom:1px solid #f0f2f5}.empty-cell{text-align:center;color:#98a2b1;padding:38px}.state{display:inline-block;border-radius:20px;padding:5px 8px;font-size:9px;font-weight:700;text-transform:uppercase}.state-delivered,.state-read{background:#e8f7ef;color:#168458}.state-sent,.state-accepted{background:#edf2ff;color:#315fe8}.state-failed{background:#fff0f0;color:#b33d3d}.table-bottom{display:flex;align-items:center;justify-content:space-between;padding-top:15px;font-size:10px;color:#8994a4}.table-bottom>div{display:flex;align-items:center;gap:10px}.page-button{padding:5px 10px}.page-button:disabled{opacity:.35;cursor:not-allowed}footer{margin-top:auto;padding:23px 0 17px;border-top:1px solid var(--line);color:#99a3b1;font-size:10px;display:flex;justify-content:space-between}footer span{color:#b0b8c3}
@media(max-width:1000px){.main{padding:0 25px}.content-grid{grid-template-columns:1fr}.right-column{grid-template-columns:1fr 1fr}.preview-panel{min-height:240px}.preview-empty{height:135px}}@media(max-width:680px){.sidebar{width:62px;padding:20px 8px}.brand{padding:0 5px 30px}.brand>div:last-child,.side-caption,.nav-item:not(.active),.side-bottom{display:none}.nav-item{font-size:0;padding:13px 9px}.nav-icon{font-size:19px;width:auto}.main{padding:0 15px}.topbar{height:85px}.topbar h1{font-size:19px}.api-status{display:none}.intro{margin-top:22px}.content-grid{display:block}.right-column{display:grid;grid-template-columns:1fr;margin-top:15px}.form-panel{padding:18px 15px}.filters .field{min-width:calc(50% - 8px)}.history-panel{padding:15px 10px}.login-card{padding:25px 20px}.pill{display:none}}
