:root {
  --bg: #f4f7f9;
  --surface: #ffffff;
  --surface-2: #f8fafb;
  --text: #14211d;
  --muted: #66746f;
  --line: #dde6e2;
  --dark: #10241d;
  --accent: #16a374;
  --accent-dark: #0c815b;
  --accent-soft: #e7f7f0;
  --warning-soft: #fff5d9;
  --warning: #8b6515;
  --shadow: 0 18px 50px rgba(19, 49, 39, .12);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font-size: 16px; }
button, input, select { font: inherit; }
button { cursor: pointer; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 248px minmax(0, 1fr); }
.sidebar { background: var(--dark); color: #d8e5df; padding: 24px 16px; display: flex; flex-direction: column; position: fixed; inset: 0 auto 0 0; width: 248px; z-index: 10; }
.brand { display: flex; align-items: center; gap: 12px; padding: 3px 10px 28px; font-weight: 700; font-size: 1.18rem; color: white; }
.brand-mark { width: 29px; height: 29px; border-radius: 9px; background: var(--accent); display: flex; align-items: flex-end; justify-content: center; gap: 3px; padding: 7px; }
.brand-mark i { display: block; width: 3px; border-radius: 3px; background: white; }.brand-mark i:nth-child(1){height:8px}.brand-mark i:nth-child(2){height:15px}.brand-mark i:nth-child(3){height:11px}
.nav { display: grid; gap: 6px; }
.nav-item { border: 0; color: #9eb2aa; background: transparent; border-radius: 9px; display: flex; gap: 12px; align-items: center; width: 100%; padding: 12px 13px; font-weight: 500; text-align: left; }
.nav-item:hover { background: rgba(255,255,255,.06); color: white; }.nav-item.active { background: rgba(30, 181, 128, .16); color: #65e0b5; }
.nav-icon { width: 20px; font-size: 1.15rem; text-align: center; }
.sidebar-foot { margin-top: auto; }.demo-label { display:flex;align-items:center;gap:8px;color:#8ea59c;font-size:.78rem;padding:10px 13px}.demo-label span{width:7px;height:7px;border-radius:50%;background:#f2b84b}
.user-card { border-top: 1px solid rgba(255,255,255,.1); padding: 18px 10px 0; display:flex;align-items:center;gap:10px}.avatar{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:#28473b;font-size:.75rem;color:#9be2c8}.user-card strong,.user-card small{display:block}.user-card strong{font-size:.83rem;color:white}.user-card small{font-size:.72rem;color:#8ea59c;margin-top:3px}
.main { grid-column: 2; min-width: 0; }.topbar { height: 68px; padding: 0 36px; background: rgba(255,255,255,.85); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:5}.crumb{color:var(--muted);font-size:.85rem}.crumb span{margin:0 7px;color:#aab5b1}.crumb strong{color:var(--text)}
.top-actions{display:flex;align-items:center;gap:18px}.system-state{font-size:.8rem;color:var(--muted);display:flex;gap:8px;align-items:center}.system-state i{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.icon-button,.mobile-menu{border:1px solid var(--line);background:white;border-radius:9px;width:34px;height:34px;color:var(--muted)}.mobile-menu{display:none}
.view { display: none; padding: 40px 44px 70px; max-width: 1500px; margin: auto; }.view.active { display:block; }.page-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:30px}.page-head h1{font-size:1.75rem;letter-spacing:-.03em;margin:0 0 7px}.page-head p{margin:0;color:var(--muted);font-size:.92rem}
.primary,.secondary,.ghost{border-radius:9px;padding:10px 15px;font-weight:600;border:1px solid transparent}.primary{background:var(--accent);color:white;box-shadow:0 4px 12px rgba(22,163,116,.18)}.primary:hover{background:var(--accent-dark)}.secondary{background:white;border-color:var(--line);color:var(--text)}.secondary:hover{background:var(--surface-2)}.ghost{background:transparent;color:var(--muted)}.ghost:hover{background:var(--surface-2)}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:22px}.stat-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:20px}.stat-card small,.stat-card span{display:block;color:var(--muted)}.stat-card small{font-size:.78rem;font-weight:600}.stat-card strong{display:block;font-size:1.35rem;margin:12px 0 7px;letter-spacing:-.02em}.stat-card span{font-size:.75rem}.stat-card .good{color:var(--accent-dark)}
.toolbar{display:flex;justify-content:space-between;margin:22px 0 12px;gap:12px}.search{display:flex;align-items:center;gap:8px;background:white;border:1px solid var(--line);border-radius:9px;padding:0 12px;width:310px;color:#8b9692}.search input{border:0;outline:0;height:39px;width:100%;background:transparent}.toolbar select,.setting-row select,.field select{border:1px solid var(--line);background:white;border-radius:9px;padding:9px 34px 9px 12px;color:var(--text)}
.table-card{background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden}table{width:100%;border-collapse:collapse}th{text-align:left;font-size:.72rem;color:#7c8984;text-transform:uppercase;letter-spacing:.04em;background:var(--surface-2);padding:13px 16px;border-bottom:1px solid var(--line)}td{padding:17px 16px;border-bottom:1px solid #edf1ef;font-size:.82rem;color:var(--muted)}tr:last-child td{border-bottom:0}td strong{color:var(--text);font-weight:600}td small{display:block;margin-top:4px;color:#85918c}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-weight:600;font-size:.7rem}.badge.success{background:var(--accent-soft);color:var(--accent-dark)}.badge.paused{background:#f0f2f1;color:#65726d}.row-menu{border:0;background:transparent;color:#7d8a85;font-weight:bold;padding:8px}.mobile-export-list{display:none}
.notice{border:1px solid #cde9dd;background:#f0faf6;border-radius:12px;padding:16px 18px;display:flex;gap:13px;align-items:flex-start;margin-bottom:24px}.notice>span{flex:none;border:1px solid #8bcdb4;color:var(--accent-dark);border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:.75rem;font-weight:700}.notice strong{font-size:.85rem}.notice p{margin:4px 0 0;font-size:.8rem;color:#557068;line-height:1.5}.connection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.connection-card{background:white;border:1px solid var(--line);border-radius:14px;padding:22px;position:relative}.service-icon{position:absolute;right:22px;top:22px;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-weight:700;font-size:1.3rem}.service-icon.meta{color:#0d6efd;background:#e8f1ff}.service-icon.sheets{color:#15855b;background:#e7f7f0}.connection-title{display:flex;gap:10px;align-items:center}.connection-title h2{font-size:1rem;margin:0}.connection-card>p{color:var(--muted);font-size:.82rem;margin:12px 0 24px}.connection-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:15px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.75rem}.connection-meta span{color:var(--muted)}.connection-meta strong{text-align:right;font-size:.75rem}.card-actions{display:flex;justify-content:space-between;margin-top:16px}.more{border:0;background:transparent;color:var(--muted)}
.settings-card{background:white;border:1px solid var(--line);border-radius:12px}.setting-row{display:flex;justify-content:space-between;align-items:center;padding:22px;border-bottom:1px solid var(--line);gap:30px}.setting-row:last-child{border:0}.setting-row strong{font-size:.9rem}.setting-row p{font-size:.78rem;color:var(--muted);margin:5px 0 0}.setting-row input[type="time"]{border:1px solid var(--line);border-radius:9px;padding:9px 11px}.switch input{display:none}.switch span{display:block;width:44px;height:25px;border-radius:20px;background:#b9c4c0;position:relative}.switch span:after{content:"";width:19px;height:19px;border-radius:50%;background:white;position:absolute;left:3px;top:3px;transition:.2s}.switch input:checked+span{background:var(--accent)}.switch input:checked+span:after{transform:translateX(19px)}
.modal{position:fixed;inset:0;display:none;z-index:30}.modal.open{display:block}.modal-backdrop{position:absolute;inset:0;background:rgba(10,26,20,.55);backdrop-filter:blur(3px)}.wizard-panel{position:absolute;right:0;top:0;bottom:0;width:min(760px,100%);background:white;box-shadow:-20px 0 60px rgba(0,0,0,.18);display:flex;flex-direction:column;animation:slide .25s ease-out}@keyframes slide{from{transform:translateX(50px);opacity:.6}}
.wizard-head{display:flex;justify-content:space-between;align-items:center;padding:24px 30px 18px}.wizard-head small{color:var(--muted);font-weight:600}.wizard-head h2{margin:5px 0 0;font-size:1.35rem}.close{border:0;background:var(--surface-2);font-size:1.5rem;width:36px;height:36px;border-radius:9px;color:var(--muted)}.steps{display:grid;grid-template-columns:repeat(6,1fr);padding:0 30px 18px;border-bottom:1px solid var(--line);gap:7px}.step-line{height:4px;border-radius:3px;background:#e5ebe8}.step-line.done,.step-line.active{background:var(--accent)}
#wizardForm{overflow:auto;flex:1}.step-panel{display:none;padding:28px 30px}.step-panel.active{display:block}.field{display:grid;gap:8px;margin-bottom:20px}.field>span,.section-label{font-size:.76rem;font-weight:700;color:#596761}.field input,.field select{width:100%;border:1px solid var(--line);border-radius:9px;padding:11px 12px;outline:none;color:var(--text);background:white}.field input:focus,.field select:focus{border-color:#6fcbaa;box-shadow:0 0 0 3px var(--accent-soft)}.section-label{margin:22px 0 10px;text-transform:uppercase;letter-spacing:.04em}.select-card,.check-list label,.radio-line{display:flex;align-items:center;gap:13px;padding:14px;border:1px solid var(--line);border-radius:10px;margin-bottom:9px;cursor:pointer}.select-card.active{border-color:#68c8a5;background:#f3fbf8}.select-card input{display:none}.select-card .service-icon{position:static;flex:none}.service-icon.small{width:36px;height:36px;font-size:1rem}.select-card span:nth-of-type(2){flex:1}.select-card strong,.select-card small,.check-list strong,.check-list small,.radio-line strong,.radio-line small{display:block}.select-card strong,.check-list strong,.radio-line strong{font-size:.83rem}.select-card small,.check-list small,.radio-line small{font-size:.72rem;color:var(--muted);margin-top:4px}.select-card b{color:var(--accent)}.check-list label:has(input:checked),.radio-line:has(input:checked){border-color:#8bd4b9;background:#f6fcfa}.check-list input,.radio-line input{accent-color:var(--accent);width:17px;height:17px}.compact{margin-top:22px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}.compact-note{align-items:center;padding:13px 15px}.compact-note p{margin:0}
.field-layout{display:grid;grid-template-columns:1fr 1fr;gap:22px}.field-options{display:grid;gap:8px}.field-option{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:8px;font-size:.8rem}.field-option input{accent-color:var(--accent)}.selected-fields{margin:0;padding:0;list-style:none;counter-reset:item;display:grid;gap:8px}.selected-fields li{display:flex;gap:9px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:8px;font-size:.8rem;background:var(--surface-2)}.selected-fields li:before{counter-increment:item;content:counter(item);width:22px;height:22px;border-radius:6px;display:grid;place-items:center;background:white;border:1px solid var(--line);font-size:.7rem;color:var(--muted)}
.wizard-footer{display:flex;justify-content:space-between;align-items:center;padding:17px 30px;border-top:1px solid var(--line);background:white}.wizard-footer>div{display:flex;gap:8px}.summary{display:grid;grid-template-columns:1fr 1fr;gap:12px}.summary-item{border:1px solid var(--line);border-radius:10px;padding:14px}.summary-item small{display:block;color:var(--muted);font-size:.7rem;margin-bottom:6px}.summary-item strong{font-size:.82rem}.preview-box{margin-top:22px;border:1px solid var(--line);border-radius:11px;padding:17px;background:var(--surface-2)}.preview-box>div:first-child{display:flex;justify-content:space-between;gap:10px}.preview-box span{font-size:.8rem;font-weight:700}.preview-box small{font-size:.7rem;color:var(--muted)}.column-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:15px}.column-chips span{background:white;border:1px solid var(--line);border-radius:6px;padding:7px 9px;font-size:.7rem;font-weight:500}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);background:var(--dark);color:white;padding:12px 17px;border-radius:9px;font-size:.82rem;opacity:0;pointer-events:none;transition:.2s;z-index:50;box-shadow:var(--shadow)}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){.app-shell{grid-template-columns:1fr}.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:translateX(0)}.main{grid-column:1}.mobile-menu{display:block}.topbar{padding:0 20px}.crumb{display:none}.view{padding:28px 20px 55px}.stats-grid{grid-template-columns:1fr}.connection-grid{grid-template-columns:1fr}}
@media(max-width:680px){.page-head{align-items:flex-start;flex-direction:column}.page-head .primary{width:100%}.toolbar{align-items:stretch;flex-direction:column}.search{width:100%}.table-card>table:not(.history-table){display:none}.mobile-export-list{display:grid}.mobile-export{padding:17px;border-bottom:1px solid var(--line)}.mobile-export:last-child{border:0}.mobile-export>div{display:flex;justify-content:space-between}.mobile-export small{display:block;color:var(--muted);margin-top:7px;font-size:.75rem}.history-table th:nth-child(2),.history-table td:nth-child(2),.history-table th:nth-child(3),.history-table td:nth-child(3){display:none}.wizard-head,.steps,.step-panel,.wizard-footer{padding-left:20px;padding-right:20px}.wizard-footer{gap:8px}.wizard-footer .ghost{display:none}.field-layout,.two-col,.summary{grid-template-columns:1fr}.setting-row{align-items:flex-start;flex-direction:column}.preview-box>div:first-child{flex-direction:column}}