:root{color:#112133;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#eef3f8;font-family:Segoe UI,Inter,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;margin:0}button,input,select,textarea{font:inherit}img{max-width:100%;display:block}#root{min-height:100vh}.sms-app-shell{--shadow-lg:0 24px 60px #0f2b4629;--shadow-md:0 16px 32px #0f2b4614;--shadow-sm:0 10px 24px #0f2b460f;min-height:100vh;color:var(--text-color);font-size:var(--font-size);background:radial-gradient(circle at top left, #0f6cbd29, transparent 28%), radial-gradient(circle at top right, #1b9c851f, transparent 22%), linear-gradient(180deg, #f7fafc 0%, var(--app-bg) 48%, #edf3f9 100%);padding:16px;position:relative}.sms-app-backdrop{pointer-events:none;background-image:linear-gradient(#ffffff8f 1px,#0000 1px),linear-gradient(90deg,#ffffff8f 1px,#0000 1px);background-size:42px 42px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000000e6,#0000 92%);mask-image:linear-gradient(#000000e6,#0000 92%)}.hero-panel,.top-nav,.content-grid,.inbox-layout,.settings-grid{z-index:1;position:relative}.hero-panel{border-radius:calc(var(--base-radius) + 12px);color:#f6fbff;box-shadow:var(--shadow-lg);background:linear-gradient(145deg,#0a192cf5,#154268e6);border:1px solid #ffffffa6;grid-template-columns:minmax(0,1.7fr) minmax(280px,.9fr);gap:10px;padding:12px 14px;display:grid}.eyebrow,.panel-kicker{letter-spacing:.12em;text-transform:uppercase;align-items:center;gap:8px;font-size:.74rem;font-weight:700;display:inline-flex}.eyebrow{color:#8fd2ff}.hero-copy h1{letter-spacing:-.06em;max-width:12ch;margin:4px 0 3px;font-size:clamp(1.2rem,1.85vw,2rem);line-height:.9}.hero-copy p{color:#f6fbffc7;max-width:40ch;margin:0;font-size:.76rem;line-height:1.28}.hero-metrics,.stats-grid,.composer-grid,.appearance-grid,.settings-grid{display:grid}.hero-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:8px}.metric-chip,.stat-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffff14;border:1px solid #ffffff1f;border-radius:24px}.metric-chip{padding:7px 8px}.metric-chip strong,.stat-card strong{font-size:.92rem;display:block}.metric-chip span,.stat-card span,.preview-meta span,.preview-meta small,.route-row span,.reply-actions span,.panel-summary span,.progress-copy span,.conversation-main span,.settings-copy,.hero-status-card p{color:var(--muted-text)}.metric-chip span{color:#f6fbffb8;font-size:.74rem}.hero-brand{flex-direction:column;justify-content:space-between;gap:8px;display:flex}.hero-logo,.logo-placeholder{object-fit:contain;background:#ffffff14;border:1px solid #ffffff24;border-radius:16px;align-self:flex-end;width:min(104px,100%);height:60px}.logo-placeholder{color:#8fd2ff;place-items:center;font-size:1.45rem;font-weight:800;display:grid}.hero-status-card,.panel,.notice-banner{border-radius:calc(var(--base-radius) + 4px);box-shadow:var(--shadow-md)}.hero-status-card{color:#112133;background:#fffffff0;gap:10px;padding:7px 9px;display:flex}.status-dot{background:#27c281;border-radius:999px;width:10px;height:10px;margin-top:6px;box-shadow:0 0 0 6px #27c28129}.top-nav{justify-content:space-between;align-items:center;gap:12px;margin:8px 0;display:flex}.tab-group{flex-wrap:wrap;gap:8px;display:flex}.tab-button,.primary-button,.secondary-button,.conversation-item{transition:transform .2s,box-shadow .2s,background-color .2s}.tab-button,.primary-button,.secondary-button{cursor:pointer;font:inherit;border:0}.tab-button{color:var(--text-color);box-shadow:var(--shadow-sm);background:#ffffffa8;border-radius:999px;align-items:center;gap:8px;padding:8px 12px;display:inline-flex}.tab-button.is-active{background:var(--text-color);color:#fff}.tab-badge,.conversation-badge{color:#fff;background:#d43b45;border-radius:999px;justify-content:center;align-items:center;min-width:22px;height:22px;padding:0 6px;font-size:.74rem;font-weight:700;display:inline-flex}.notice-banner,.nav-spacer{min-height:36px}.notice-banner{background:#ffffffdb;border:1px solid #ffffffbf;align-items:center;padding:0 10px;font-size:.82rem;display:flex}.nav-spacer{flex:1}.content-grid{grid-template-columns:minmax(0,1.65fr) minmax(320px,.9fr);gap:12px;display:grid}.main-column,.side-column{gap:12px;display:grid}.panel{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffd6;border:1px solid #ffffffb8;padding:14px}.panel-head{justify-content:space-between;align-items:start;gap:10px;margin-bottom:10px;display:flex}.panel-head h2{color:var(--text-color);margin:2px 0 0;font-size:1.04rem;line-height:1.15}.panel-head p{color:var(--muted-text);margin:4px 0 0;font-size:.8rem}.panel-kicker{color:#0f6cbd}.panel-summary{flex-wrap:wrap;gap:10px;display:flex}.composer-grid,.appearance-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.field{gap:5px;font-size:.88rem;font-weight:600;display:grid}.field span{color:var(--text-color)}.input-control,textarea,select{border:1px solid var(--border-color);border-radius:calc(var(--base-radius) - 6px);background:var(--input-bg);width:100%;min-width:0;color:var(--input-text);box-sizing:border-box}.input-control{min-height:38px;font:inherit;padding:8px 10px}.file-input{padding-top:10px}.message-editor{resize:vertical;min-height:88px}.template-bar,.send-toolbar,.reply-actions,.settings-actions{justify-content:space-between;align-items:center;gap:10px;display:flex}.template-bar{margin:10px 0 8px}.personalization-options{flex-wrap:wrap;gap:8px;margin:0 0 10px;display:flex}.composer-highlights{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 10px;display:grid}.highlight-card{border:1px solid var(--border-color);border-radius:calc(var(--base-radius) - 6px);background:linear-gradient(#fbfdff,#f4f8fc);gap:2px;padding:10px;display:grid}.highlight-card span,.highlight-card small{color:var(--muted-text)}.highlight-card strong{color:var(--text-color);font-size:1rem}.checkbox-chip{border:1px solid var(--border-color);color:var(--text-color);background:#f8fbfd;border-radius:999px;align-items:center;gap:8px;padding:7px 10px;font-size:.84rem;font-weight:600;display:inline-flex}.checkbox-chip input{width:16px;height:16px;margin:0}.token-hint{border:1px dashed var(--border-color);border-radius:calc(var(--base-radius) - 6px);color:var(--muted-text);background:#f4f8fc;align-self:end;padding:8px 10px;font-size:.78rem}.token-hint code{color:#0f6cbd;background:#0f6cbd1f;border-radius:999px;padding:2px 7px}.primary-button,.secondary-button{border-radius:999px;padding:8px 12px;font-size:.88rem;font-weight:700}.primary-button{background:var(--primary-color);color:var(--primary-text);box-shadow:0 12px 24px #0f6cbd3d}.secondary-button{color:#0c3a61;background:#eef4fb}.primary-button:hover,.secondary-button:hover,.tab-button:hover,.conversation-item:hover{transform:translateY(-1px)}.primary-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.progress-copy{gap:4px;font-size:.84rem;display:grid}.table-shell,.conversation-list,.message-thread{overflow:auto}.table-shell{border:1px solid var(--border-color);border-radius:calc(var(--base-radius) - 2px);max-height:240px}.contacts-table{border-collapse:collapse;width:100%}.contacts-table th,.contacts-table td{text-align:left;border-bottom:1px solid #d7e1ecb3;padding:8px 10px}.contacts-table th{background:var(--table-header-bg);text-transform:uppercase;letter-spacing:.08em;color:var(--muted-text);font-size:.72rem}.contacts-table tbody tr:hover{background:#0f6cbd08}.empty-row,.empty-state{text-align:center;color:var(--muted-text);padding:18px 12px;font-size:.84rem}.status-pill{border-radius:999px;justify-content:center;align-items:center;padding:5px 8px;font-size:.7rem;font-weight:700;display:inline-flex}.status-pill.success{color:#12805c;background:#e6f8ef}.status-pill.warning{color:#8f6400;background:#fff4d6}.status-pill.danger{color:#b42318;background:#fee8e8}.status-pill.neutral{color:#556575;background:#edf2f7}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.stat-card{color:#f6fbff;background:#0a192cf2;padding:10px}.stat-card span{color:#f6fbffb8;margin-bottom:4px;font-size:.76rem;display:block}.preview-card{border-radius:calc(var(--base-radius) - 4px);color:#f5fbff;background:linear-gradient(#0f1f33,#173859);gap:8px;padding:10px;display:grid}.preview-card p{white-space:pre-wrap;margin:0;font-size:.84rem;line-height:1.38}.preview-meta{gap:4px;display:grid}.preview-meta span,.preview-meta small{color:#f5fbffb8}.route-list,.template-settings{gap:8px;display:grid}.route-row{border-bottom:1px solid #d7e1ecb3;justify-content:space-between;gap:12px;padding:8px 0;display:flex}.route-row:last-child{border-bottom:0;padding-bottom:0}.route-row strong,.conversation-main strong,.message-bubble strong{margin-bottom:4px;display:block}.route-microstats{color:var(--muted-text);flex-wrap:wrap;justify-content:flex-end;gap:8px;font-size:.74rem;display:flex}.inbox-layout{grid-template-columns:280px minmax(0,1fr);gap:12px;display:grid}.conversations-panel,.thread-panel{min-height:58vh}.conversation-list{gap:6px;max-height:calc(58vh - 70px);display:grid}.conversation-item{border:1px solid var(--border-color);border-radius:calc(var(--base-radius) - 6px);text-align:left;cursor:pointer;background:#f9fbfd;gap:6px;padding:10px;display:grid;position:relative}.conversation-item.is-active{box-shadow:var(--shadow-sm);background:#edf5ff;border-color:#0f6cbd6b}.conversation-item p{color:var(--muted-text);margin:0}.conversation-badge{position:absolute;top:8px;right:8px}.message-thread{align-content:start;gap:8px;max-height:calc(58vh - 150px);padding-right:4px;display:grid}.message-row{display:flex}.message-row.inbound{justify-content:flex-start}.message-row.outbound{justify-content:flex-end}.message-bubble{border-radius:calc(var(--base-radius) - 2px);border:1px solid var(--border-color);max-width:min(78%,720px);box-shadow:var(--shadow-sm);background:#f8fbfd;padding:10px}.message-row.outbound .message-bubble{background:#eaf4ff}.message-bubble p{white-space:pre-wrap;margin:0;font-size:.86rem;line-height:1.34}.message-bubble span{color:var(--muted-text);margin-top:6px;font-size:.72rem;display:block}.reply-box{border-top:1px solid #d7e1eccc;gap:8px;margin-top:10px;padding-top:10px;display:grid}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.panel-span-two{grid-column:span 2}.color-input{min-height:38px;padding:6px}@media (width<=1100px){.content-grid,.inbox-layout,.settings-grid,.hero-panel{grid-template-columns:1fr}.hero-copy h1{max-width:none}.hero-logo,.logo-placeholder{align-self:start}}@media (width<=760px){.sms-app-shell,.hero-panel,.panel{padding:18px}.hero-metrics,.composer-grid,.composer-highlights,.appearance-grid,.stats-grid,.settings-grid{grid-template-columns:1fr}.top-nav,.template-bar,.send-toolbar,.reply-actions,.settings-actions,.panel-head,.route-row{flex-direction:column;align-items:stretch}.route-microstats{justify-content:flex-start}.message-bubble{max-width:100%}}
