:root{color:#17211c;background:#f5f7f2;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{align-items:center;background:#fff;border:1px solid #d9dfd8;border-radius:8px;color:#17211c;cursor:pointer;display:inline-flex;gap:8px;justify-content:center;min-height:38px;padding:8px 12px}button:hover{border-color:#2f9d62}.shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.sidebar{background:#16231c;color:#f4f7f0;padding:20px}.brand{align-items:center;display:flex;gap:12px;margin-bottom:28px}.brandIcon{align-items:center;background:#25d366;border-radius:8px;color:#122118;display:flex;height:40px;justify-content:center;width:40px}.brand strong,.brand span{display:block}.brand span{color:#b7c6bc;font-size:13px}nav{display:grid;gap:8px}nav button{background:transparent;border-color:transparent;color:#dce7de;justify-content:flex-start}nav button.active,nav button:hover{background:#25362d;border-color:#385143}.workspace{padding:24px}.topbar{align-items:center;display:flex;gap:16px;justify-content:space-between;margin-bottom:20px}.topActions{display:flex;gap:8px}.topbar p,.topbar h1{margin:0}.topbar p{color:#637268;font-size:13px}.topbar h1{font-size:24px;font-weight:700}.stats{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:16px}.stats div,.panel,.notice{background:#fff;border:1px solid #dce2da;border-radius:8px}.stats div{display:grid;gap:6px;padding:14px}.stats span{color:#6d7b71;font-size:12px}.stats strong{font-size:20px}code{background:#edf5ee;border-radius:6px;color:#1d6b41;overflow:hidden;padding:4px 6px;text-overflow:ellipsis}.notice{border-color:#a7dcc0;color:#1c6b3e;margin-bottom:16px;padding:12px 14px}.grid{display:grid;gap:16px;grid-template-columns:minmax(280px,1fr) minmax(320px,1fr)}.singleGrid{display:grid;gap:16px;grid-template-columns:minmax(280px,720px)}.landingShell{display:grid;gap:28px;grid-template-columns:minmax(0,1.25fr) minmax(360px,420px);min-height:100vh;padding:32px}.landingContent{display:grid;gap:18px;max-width:860px}.landingContent h1{font-size:clamp(40px,6vw,72px);letter-spacing:0;line-height:.96;margin:0;max-width:760px}.landingLead{color:#4e5d54;font-size:18px;line-height:1.55;margin:0;max-width:650px}.heroPreview{background:#fff;border:1px solid #dce2da;border-radius:8px;box-shadow:0 24px 80px #16231c1f;max-width:720px;overflow:hidden}.previewTop{align-items:center;background:#16231c;display:flex;gap:7px;height:38px;padding:0 14px}.previewTop span{background:#89a393;border-radius:50%;height:9px;width:9px}.previewBody{display:grid;gap:16px;grid-template-columns:220px 1fr;padding:18px}.previewPhone{align-items:center;background:#f5f8f3;border:1px solid #dfe7de;border-radius:8px;display:grid;gap:12px;justify-items:center;min-height:210px;padding:16px;text-align:center}.previewFlow{display:grid;gap:10px}.previewFlow div{align-content:center;background:#fbfcfa;border:1px solid #e0e7df;border-radius:8px;display:grid;gap:8px;padding:14px}.previewFlow small{color:#69776e;font-weight:700}.landingPlans{display:grid;gap:8px;grid-template-columns:repeat(5,minmax(0,1fr));max-width:720px}.landingPlan{align-items:start;display:grid;gap:4px;min-height:74px}.landingPlan span{color:#1e7b49;font-size:13px}.selectedLandingPlan{border-color:#20a85a;box-shadow:0 0 0 3px #dff4e7}.authPanel{align-self:center;background:#fff;border:1px solid #dce2da;border-radius:8px;max-width:420px;padding:22px;width:100%}.authBrand{color:#17211c;margin-bottom:0}.segmented{background:#eef4ef;border-radius:8px;display:grid;gap:4px;grid-template-columns:1fr 1fr;margin-bottom:16px;padding:4px}.segmented button{background:transparent;border-color:transparent}.segmented .activeSegment{background:#fff;border-color:#cfdbd2}.panel{padding:16px}.panelHeader{align-items:center;display:flex;justify-content:space-between;margin-bottom:14px}.panelHeader h2{font-size:16px;margin:0}.addRow{display:grid;gap:8px;grid-template-columns:1fr 42px;margin-bottom:12px}input,select,textarea{background:#fbfcfa;border:1px solid #d8dfd7;border-radius:8px;min-height:40px;padding:9px 10px;width:100%}textarea{min-height:112px;resize:vertical}label{color:#59675e;display:grid;font-size:13px;gap:6px;margin-bottom:12px}.numberList{display:grid;gap:8px;margin-bottom:12px}.number{justify-content:space-between;min-height:64px;text-align:left}.number strong,.number span{display:block}.number span{color:#6a776e;font-size:12px}.activeNumber{border-color:#25a65b;box-shadow:0 0 0 3px #dff4e7}em{border-radius:99px;font-size:12px;font-style:normal;padding:4px 8px;white-space:nowrap}em[data-status=connected],em[data-status=sent],em[data-status=received]{background:#def7e7;color:#15643a}em[data-status=qr],em[data-status=queued],em[data-status=connecting]{background:#fff4ce;color:#7a5600}em[data-status=failed],em[data-status=error],em[data-status=disconnected]{background:#ffe4df;color:#8e2f1d}.wide{width:100%}.primary{background:#22b45f;border-color:#1ea457;color:#fff}.qr{aspect-ratio:1;border:1px solid #d8dfd7;border-radius:8px;display:block;margin:12px auto 0;max-width:240px;padding:8px;width:100%}.tablePanel{margin-top:16px}.planGrid{display:grid;gap:10px;grid-template-columns:repeat(5,minmax(0,1fr))}.plan{background:#fbfcfa;border:1px solid #e3e8e1;border-radius:8px;display:grid;gap:5px;min-height:116px;padding:12px}.plan span{color:#1e7b49;font-weight:700}.plan p,.plan small{color:#66756b;margin:0}.apiGuide{display:grid;gap:12px}.apiGuide div,.apiGuide pre{background:#fbfcfa;border:1px solid #e3e8e1;border-radius:8px;margin:0;padding:14px}.apiGuide p{color:#66756b;margin:6px 0 0}.apiGuide pre{overflow:auto}.table{display:grid;gap:8px}.row{align-items:center;background:#fbfcfa;border:1px solid #e3e8e1;border-radius:8px;display:grid;gap:10px;grid-template-columns:90px 150px 1fr 80px;min-height:48px;padding:10px}.row p{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.empty{color:#6c786f;padding:18px 0;text-align:center}@media(max-width:860px){.landingShell{grid-template-columns:1fr;padding:18px}.landingContent h1{font-size:42px}.previewBody,.landingPlans,.shell{grid-template-columns:1fr}.sidebar{padding:14px}nav{grid-template-columns:repeat(2,minmax(0,1fr))}nav button{justify-content:center}.topbar,.stats,.grid,.singleGrid,.planGrid{grid-template-columns:1fr}.topbar{align-items:stretch;display:grid}.topActions{display:grid;grid-template-columns:1fr 1fr}.row{align-items:start;grid-template-columns:1fr}}
