:root{color:#24343d;font-synthesis:none;background:#eef5f8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input,textarea,select{font:inherit}.app{grid-template-columns:250px 1fr;min-height:100vh;display:grid}.sidebar{background:#f9fcfd;border-right:1px solid #d9e5ea;flex-direction:column;padding:22px 14px;display:flex}.logo{align-items:center;gap:10px;padding:5px 10px 30px;font-size:22px;font-weight:750;display:flex}.brand-mark{color:#fff;background:#209ab6;border-radius:16px;place-items:center;width:50px;height:50px;font-size:24px;font-weight:800;display:grid;box-shadow:0 10px 30px #209ab640}.brand-mark.small{border-radius:12px;width:34px;height:34px;font-size:16px}.sidebar nav{flex-direction:column;gap:6px;display:flex}.sidebar button{color:#42545d;cursor:pointer;text-align:left;background:0 0;border:0;border-radius:14px;align-items:center;gap:12px;padding:12px 14px;display:flex}.sidebar nav button:hover,.sidebar nav button.active{color:#04617a;background:#d9eef6}.logout{margin-top:auto}main{width:100%;max-width:1500px;padding:36px 44px}header{justify-content:space-between;align-items:center;margin-bottom:28px;display:flex}h1,h2,p{margin:0}header h1{font-size:32px}header p,.panel-title p{color:#6b7c85;margin-top:7px}.server-pill{background:#fff;border:1px solid #d9e5ea;border-radius:24px;padding:10px 14px;font-size:14px}.server-pill span{background:#20be8b;border-radius:50%;width:9px;height:9px;margin-right:8px;display:inline-block}.stats{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px;display:grid}.stats div,.panel{background:#fff;border:1px solid #d8e4e8;border-radius:18px;box-shadow:0 10px 30px #3854600d}.stats div{padding:20px}.stats span{color:#6b7c85;font-size:14px;display:block}.stats strong{margin-top:8px;font-size:30px;display:block}.content-grid{grid-template-columns:minmax(420px,.9fr) minmax(500px,1.1fr);gap:18px;display:grid}.panel{padding:22px}.panel-title{justify-content:space-between;align-items:flex-start;margin-bottom:20px;display:flex}.panel-title h2{font-size:20px}.form label{margin-bottom:14px;font-size:13px;font-weight:650;display:block}.form input,.form textarea,.form select{background:#fbfdfe;border:1px solid #cbd9df;border-radius:11px;outline:none;width:100%;margin-top:7px;padding:11px 12px}.form input:focus,.form textarea:focus,.form select:focus{border-color:#31a7c2;box-shadow:0 0 0 3px #31a7c21a}.grid2{grid-template-columns:1fr 1fr;gap:12px;display:grid}.hint{color:#7b8a91;margin-top:5px;font-size:12px;font-weight:400;display:block}.primary,.mini{color:#fff;cursor:pointer;background:#2089a5;border:0;border-radius:11px;padding:11px 16px}.primary{width:100%;font-weight:700}.campaign-list{flex-direction:column;gap:10px;display:flex}.campaign{border:1px solid #e0eaee;border-radius:14px;grid-template-columns:40px 1fr auto auto;align-items:center;gap:12px;padding:13px;display:grid}.channel-icon{color:#147d98;background:#e7f4f8;border-radius:11px;place-items:center;width:38px;height:38px;display:grid}.campaign-info{min-width:0}.campaign-info strong,.campaign-info span{display:block}.campaign-info span{color:#788990;margin-top:4px;font-size:12px}.status{background:#edf1f3;border-radius:20px;padding:6px 9px;font-size:12px}.status.done{color:#128462;background:#dff7ef}.status.running,.status.queued{color:#8a6500;background:#fff2cf}.status.failed{color:#b13a30;background:#ffe6e4}.status.draft{color:#65747b;background:#edf1f3}.mini{padding:7px 10px;font-size:12px}.empty{color:#7c8b91;text-align:center;padding:30px}.error{color:#9f2e25;background:#fff0ee;border:1px solid #ffd1cc;border-radius:10px;padding:10px;font-size:13px}.banner{margin-bottom:16px}.login-shell{background:linear-gradient(135deg,#edf6f9,#f9fcfd);place-items:center;min-height:100vh;padding:20px;display:grid}.login-card{background:#fff;border:1px solid #d7e4e9;border-radius:22px;width:min(420px,100%);padding:34px;box-shadow:0 20px 60px #2648561a}.login-card .brand-mark{margin-bottom:18px}.login-card h1{font-size:26px}.login-card p{color:#74858c;margin:8px 0 22px}.login-card input{border:1px solid #ccdbe0;border-radius:11px;width:100%;margin-bottom:12px;padding:12px}.login-card button{color:#fff;cursor:pointer;background:#2089a5;border:0;border-radius:11px;width:100%;padding:12px;font-weight:700}@media (width<=980px){.app{grid-template-columns:76px 1fr}.sidebar{padding:18px 8px}.logo span,.sidebar button span{display:none}.logo{justify-content:center;padding-left:0;padding-right:0}.sidebar button{justify-content:center}.content-grid{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}main{padding:26px 20px}}@media (width<=620px){.app{display:block}.sidebar{display:none}.stats{grid-template-columns:1fr 1fr}.grid2{grid-template-columns:1fr}header{flex-direction:column;align-items:flex-start;gap:12px}.content-grid{display:block}.panel{margin-bottom:16px}}.single-page{grid-template-columns:1fr}.device-card{background:#fff;border:1px solid #dce6eb;border-radius:14px;justify-content:space-between;align-items:center;margin-top:20px;padding:20px;display:flex}.device-card p{color:#6b7b83;margin:5px 0 0}.device-details{grid-template-columns:repeat(2,1fr);gap:14px;margin-top:20px;display:grid}.device-details>div{border:1px solid #e0e8ec;border-radius:12px;padding:16px}.device-details span{color:#71828b;margin-bottom:6px;font-size:13px;display:block}.device-details strong{font-size:15px}.panel hr{border:0;border-top:1px solid #e3eaee;margin:28px 0}@media (width<=800px){.device-details{grid-template-columns:1fr}}.success.banner{color:#157a55;background:#e9faf3;border:1px solid #bcebd8;border-radius:10px;margin-bottom:18px;padding:12px 16px}.test-box{background:#f9fcfd;border:1px solid #dce6eb;border-radius:12px;margin-top:22px;padding:18px}.test-box h3{margin-top:0}.test-action{align-items:end;display:flex}.test-action .primary{width:100%;min-height:44px}.contact-table-wrap{margin-top:20px;overflow-x:auto}.contact-table{border-collapse:collapse;width:100%}.contact-table th,.contact-table td{text-align:left;border-bottom:1px solid #e1e8ec;padding:12px}.contact-table th{color:#61727c;font-size:13px}.contact-table td{font-size:14px}.recipient-source-box{background:#f9fcfd;border:1px solid #dce6eb;border-radius:12px;margin-bottom:16px;padding:16px}.recipient-summary{grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px;display:grid}.recipient-summary>div{background:#fff;border:1px solid #dfe8ec;border-radius:10px;padding:14px}.recipient-summary span{color:#71828b;margin-bottom:5px;font-size:12px;display:block}.recipient-summary strong{font-size:18px}@media (width<=900px){.recipient-summary{grid-template-columns:1fr}}.campaign-media{background:#f9fcfd;border:1px solid #dce6eb;border-radius:14px;margin-bottom:18px;padding:16px}.campaign-media-title{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.campaign-media-title strong{font-size:13px;display:block}.media-upload{cursor:pointer;text-align:center;background:#fff;border:2px dashed #c7dce4;border-radius:13px;flex-direction:column;justify-content:center;align-items:center;gap:6px;min-height:150px;transition:all .2s;margin:0!important;display:flex!important}.media-upload:hover{background:#f4fbfd;border-color:#31a7c2}.media-upload input,.media-change input{display:none}.media-upload-icon{color:#1685a0;background:#e2f3f8;border-radius:50%;place-items:center;width:42px;height:42px;font-size:26px;font-weight:400;display:grid}.media-upload strong{font-size:14px}.media-upload>span:last-of-type{color:#71828b;font-size:12px;font-weight:400}.media-preview{background:#fff;border:1px solid #dbe6ea;border-radius:13px;overflow:hidden}.media-preview img{object-fit:contain;background:#eef4f6;width:100%;max-height:320px;display:block}.media-preview-info{align-items:center;gap:10px;padding:12px 14px;display:flex}.media-preview-info strong{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:13px;overflow:hidden}.media-preview-info>span{color:#71828b;white-space:nowrap;font-size:12px}.media-change,.media-remove{cursor:pointer;border:0;border-radius:9px;padding:7px 10px;font-size:12px;font-weight:650}.media-change{color:#147d98;white-space:nowrap;background:#e7f4f8;margin:0!important}.media-remove{color:#a43b32;background:#fff0ee}@media (width<=620px){.media-preview-info{flex-direction:column;align-items:flex-start}.media-change{text-align:center;width:100%}}
