:root{--rail: #111315;--nav: #171a1f;--nav-text: #c9d0d8;--nav-muted: #8b949e;--accent: #1aa37a;--selected: #243044;--page: #eef1f4;--card: #ffffff;--line: #e3e7ec;--text: #1f2933;--muted: #6b7280;--danger: #d64545;--warn: #d97706;--green-border: #b7e0c8}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;font-family:Segoe UI,system-ui,sans-serif;color:var(--text);background:var(--page)}button,select,textarea,input{font:inherit}.app{display:flex;height:100%}.rail,.nav{color:var(--nav-text);background:var(--nav)}.rail{width:56px;background:var(--rail);display:flex;flex-direction:column;align-items:center;padding:12px 0;gap:8px}.rail button{width:36px;height:36px;border:0;border-radius:8px;background:transparent;color:var(--nav-muted);cursor:pointer}.rail button.active{background:var(--accent);color:#fff}.rail .spacer{flex:1}.avatar{width:32px;height:32px;border-radius:8px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:700;font-size:13px}.auth-page{min-height:100%;display:grid;grid-template-columns:minmax(280px,.9fr) minmax(360px,440px);gap:72px;align-items:center;justify-content:center;padding:48px 7vw;background:radial-gradient(circle at 18% 20%,#d9f1e6 0,transparent 34%),var(--page)}.auth-intro{max-width:430px}.auth-logo{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:var(--accent);color:#fff;font-weight:800;font-size:22px;margin-bottom:28px;box-shadow:0 10px 24px #1aa37a33}.auth-intro h1{font-size:clamp(36px,5vw,58px);line-height:1.02;letter-spacing:-2px;margin:10px 0 18px}.auth-intro>p:not(.eyebrow){color:var(--muted);font-size:18px;line-height:1.6;max-width:360px}.auth-orbit{display:flex;gap:10px;margin-top:34px;color:var(--accent)}.auth-orbit span{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--green-border);border-radius:50%;background:#ffffffa6}.auth-card{width:100%;padding:40px;background:#fffffff0;border:1px solid var(--line);border-radius:20px;box-shadow:0 20px 60px #1f29331a}.auth-card h2{margin:8px 0;font-size:30px;letter-spacing:-.7px}.auth-subtitle{color:var(--muted);margin:0 0 28px}.auth-card label{display:block;margin:16px 0;color:var(--text);font-size:13px;font-weight:600}.auth-card input{display:block;width:100%;margin-top:7px;padding:12px 13px;border:1px solid #d8dee5;border-radius:9px;background:#fbfcfd;outline:none}.auth-card input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #1aa37a1f}.auth-submit{width:100%;margin-top:10px;padding:13px;border:0;border-radius:9px;background:var(--accent);color:#fff;font-weight:700;cursor:pointer}.auth-submit:disabled{opacity:.65;cursor:wait}.auth-switch{margin:24px 0 0;text-align:center;color:var(--muted);font-size:14px}.auth-switch a{color:var(--accent);font-weight:700;text-decoration:none}@media (max-width: 760px){.auth-page{grid-template-columns:1fr;gap:24px;padding:28px 20px}.auth-intro{max-width:none}.auth-intro h1{font-size:38px}.auth-orbit{display:none}.auth-card{padding:28px 22px}}.nav{width:220px;padding:16px 12px;display:flex;flex-direction:column;gap:6px}.nav h1{margin:0 8px 8px;font-size:18px}.new-ticket{margin:0 8px 12px;height:34px;border:0;border-radius:8px;background:#2a3038;color:#fff;cursor:pointer}.nav button.item{display:flex;align-items:center;gap:8px;width:100%;border:0;background:transparent;color:var(--nav-text);padding:8px;border-radius:8px;cursor:pointer;text-align:left}.nav .item.nav-link{display:block;color:var(--nav-text);padding:8px;border-radius:8px;text-decoration:none;font-size:13px}.nav .item.nav-link:hover{background:var(--selected)}.nav button.item .count{margin-left:auto;color:var(--nav-muted)}.nav button.item.active{background:var(--selected);color:#8ec8ff}.webhook-link{display:block;margin:0 8px 8px;padding:8px;border-radius:8px;color:var(--nav-text);font-size:13px;text-decoration:none}.webhook-link:hover{background:var(--selected)}.list,.thread,.details{display:flex;flex-direction:column;min-width:0;min-height:0}.list{width:320px;background:#f7f8fa;border-right:1px solid var(--line)}.list-header,.thread-header,.details-card h3{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.list-header h2,.thread-header h2{margin:0;font-size:16px}.tickets{overflow:auto}.ticket{width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:transparent;padding:14px 16px;cursor:pointer}.ticket.active{background:#fff;box-shadow:inset 3px 0 0 var(--accent)}.ticket .meta{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.ticket .subject{margin:6px 0 4px;font-weight:600}.ticket .preview{margin:0;color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ticket .badges{margin-top:8px;display:flex;gap:8px;font-size:12px}.badge.danger{color:var(--danger)}.badge.warn{color:var(--warn)}.thread{flex:1;background:var(--page)}.thread-header p{margin:4px 0 0;color:var(--muted);font-size:13px}.messages{flex:1;overflow:auto;padding:16px}.message{background:#fff;border:1px solid var(--green-border);border-radius:10px;padding:16px;margin-bottom:12px}.message.ai{border-color:var(--green-border);background:#f3fbf7}.message .cite{margin:8px 0 0;font-size:12px;color:var(--muted)}.message header{display:flex;justify-content:space-between;margin-bottom:10px;font-size:13px;color:var(--muted)}.generate-bar{padding:8px 16px 0}.generate-bar .generate{height:36px;padding:0 14px;border:0;border-radius:18px;background:var(--accent);color:#fff;cursor:pointer}.generate-bar .generate:disabled{opacity:.6;cursor:wait}.composer{padding:12px 16px 16px;display:flex;gap:8px;align-items:flex-end}.composer textarea{flex:1;min-height:44px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;resize:vertical}.composer button{height:40px;padding:0 16px;border:0;border-radius:20px;background:#111827;color:#fff;cursor:pointer}.details{width:280px;background:#f3f5f7;border-left:1px solid var(--line);overflow:auto}.details-card{background:#fff;margin:12px;border:1px solid var(--line);border-radius:10px}.shopify-context h3{margin:0;padding:14px 16px;border-bottom:1px solid var(--line)}.context-muted,.context-alert{margin:12px 16px;color:var(--muted);font-size:13px;line-height:1.45}.context-alert{color:#9a5b08}.order-context{display:grid;gap:6px;padding:12px 16px;border-top:1px solid var(--line);font-size:13px}.order-context>span,.line-items,.tracking{color:var(--muted)}.tracking{display:flex;gap:6px;flex-wrap:wrap}.tracking a{color:var(--accent);text-decoration:none}.settings-page{min-height:100%;padding:48px clamp(20px,7vw,112px);background:radial-gradient(circle at top right,#d7f3e8,transparent 34%),var(--page)}.settings-header,.settings-card{max-width:760px;margin:0 auto}.settings-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}.settings-header h1{margin:0;font-size:36px}.settings-header p:last-child,.integration-heading p{color:var(--muted)}.settings-card{display:grid;gap:18px;padding:24px;border:1px solid var(--line);border-radius:12px;background:var(--card);box-shadow:0 8px 20px #1f29330d}.integration-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:4px}.integration-heading h2,.integration-heading p{margin:0}.integration-heading p{margin-top:6px;font-size:14px}.connection-state{padding:5px 9px;border-radius:999px;background:#eaf8ef;color:#15703b;font-size:12px;font-weight:700}.settings-card label{display:grid;gap:7px;color:var(--text);font-size:14px;font-weight:600}.settings-card input,.settings-card select{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;font-weight:400}.input-hint{color:var(--muted);font-size:12px;font-weight:400}.settings-actions{display:flex;gap:10px;flex-wrap:wrap}.primary-button,.secondary-button,.danger-button{min-height:38px;padding:0 14px;border-radius:8px;cursor:pointer;font-weight:600}.primary-button{border:0;background:var(--accent);color:#fff}.secondary-button{border:1px solid var(--line);background:#fff;color:var(--text)}.danger-button{border:1px solid #f1c4c4;background:#fff7f7;color:var(--danger)}.primary-button:disabled,.secondary-button:disabled,.danger-button:disabled{cursor:wait;opacity:.6}.settings-error,.settings-notice{margin:0;font-size:13px}.settings-error{color:var(--danger)}.settings-notice{color:#15703b}.message-attachments{display:grid;gap:10px;margin-top:12px}.workspace-switcher{display:grid;gap:5px;margin:12px;color:var(--muted);font-size:12px}.workspace-switcher select{padding:8px;border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--text)}.video-attachment{max-width:560px;margin:0}.video-attachment video{display:block;width:100%;max-height:360px;border-radius:8px;background:#111}.video-attachment figcaption,.image-attachment span{display:block;margin-top:6px;color:var(--muted);font-size:12px}.video-attachment figcaption a{color:var(--accent);font-weight:600}.video-attachment .attachment-open{margin-left:12px}.image-attachment,.file-attachment{color:inherit;text-decoration:none}.image-attachment img{display:block;max-width:280px;max-height:220px;border-radius:8px;object-fit:contain}.file-attachment{display:flex;align-items:center;gap:10px;width:fit-content;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--card)}.file-attachment small{display:block;margin-top:2px;color:var(--muted)}.webhook-page{min-height:100%;padding:48px clamp(20px,7vw,112px);background:radial-gradient(circle at top right,#d7f3e8,transparent 34%),var(--page)}.webhook-header,.webhook-feed{max-width:920px;margin:0 auto}.webhook-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:32px}.webhook-header h1{margin:0;font-size:36px}.webhook-header p:last-child{margin:10px 0 0;color:var(--muted)}.webhook-header code{color:var(--text)}.webhook-feed{display:grid;gap:12px}.feed-status{color:var(--muted);font-size:13px}.live-dot{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:var(--accent)}.received-email{padding:18px 20px;border:1px solid var(--line);border-radius:10px;background:var(--card);box-shadow:0 8px 20px #1f29330d}.received-email header,.received-email footer{display:flex;justify-content:space-between;gap:16px}.received-email header div{display:grid;gap:4px}.received-email header span,.received-email time,.received-email footer{color:var(--muted);font-size:12px}.received-email>p{margin:16px 0;white-space:pre-wrap;line-height:1.55}.webhook-empty{display:grid;gap:8px;padding:56px 20px;border:1px dashed var(--line);text-align:center;color:var(--muted)}@media (max-width: 720px){.webhook-page{padding:28px 16px}.webhook-header,.received-email header,.received-email footer{align-items:flex-start;flex-direction:column}}.field{padding:10px 14px;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}.field select,.field span{color:var(--text)}.empty,.error{padding:24px;color:var(--muted)}.gmail-pill{margin:0 8px 10px;padding:8px 10px;border-radius:8px;background:#2a3038;color:var(--nav-text);font-size:12px;display:flex;flex-direction:column;gap:6px}.gmail-pill.link{text-decoration:none;color:#8ec8ff}.text-btn{border:0;background:transparent;color:#8ec8ff;padding:0;cursor:pointer;text-align:left}.watch-state{color:var(--nav-muted);font-size:11px}.emails-page{min-height:100%;padding:48px clamp(20px,7vw,112px);background:radial-gradient(circle at top right,#d7f3e8,transparent 34%),var(--page)}.emails-header{max-width:920px;margin:0 auto 32px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.eyebrow{margin:0 0 8px;color:var(--accent);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.emails-header h1{margin:0;font-size:36px;line-height:1}.emails-header p:last-child{margin:10px 0 0;color:var(--muted)}.back-link{color:var(--accent);font-weight:600;white-space:nowrap}.email-trail{max-width:920px;margin:0 auto;position:relative}.email-trail:before{content:"";position:absolute;top:10px;bottom:10px;left:8px;border-left:1px solid #b7e0c8}.email-entry{position:relative;display:flex;gap:20px;margin-bottom:16px}.email-marker{width:17px;height:17px;flex:0 0 17px;margin-top:20px;border:4px solid var(--page);border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent);z-index:1}.email-entry-body{flex:1;min-width:0;padding:18px 20px;border:1px solid var(--line);border-radius:10px;background:var(--card);box-shadow:0 8px 20px #1f29330d}.email-entry-body header,.email-entry-body footer{display:flex;align-items:center;justify-content:space-between;gap:16px}.email-entry-body header div{display:flex;flex-direction:column;gap:4px}.email-entry-body header span,.email-entry-body time{color:var(--muted);font-size:12px}.email-entry-body>p{margin:16px 0;color:var(--text);line-height:1.55;white-space:pre-wrap}.email-entry-body footer{justify-content:flex-start;color:var(--muted);font-size:12px}.email-entry-body footer a{color:var(--accent);text-decoration:none}.trail-status,.trail-priority{padding:3px 7px;border-radius:4px;background:#eef1f4;text-transform:capitalize}.trail-status.open{color:var(--danger)}.trail-status.closed{color:var(--accent)}.latest-reply{display:flex;gap:8px;margin-top:14px;align-items:flex-end}.latest-reply textarea{flex:1;min-height:42px;border:1px solid var(--line);border-radius:7px;padding:9px 10px;resize:vertical}.latest-reply button{height:38px;padding:0 12px;border:0;border-radius:7px;background:var(--accent);color:#fff;cursor:pointer}.latest-reply button:disabled{opacity:.6;cursor:wait}@media (max-width: 720px){.emails-page{padding:28px 16px}.emails-header{align-items:flex-start;flex-direction:column}.emails-header h1{font-size:30px}.email-entry{gap:10px}.email-entry-body{padding:14px}.email-entry-body header,.email-entry-body footer{align-items:flex-start;flex-direction:column;gap:8px}.latest-reply{align-items:stretch;flex-direction:column}}.onboard{min-height:100%;display:grid;place-items:center;padding:32px 16px;background:linear-gradient(180deg,#111315,#171a1f 40%,#eef1f4 40%)}.onboard-card{width:min(560px,100%);background:#fff;border-radius:16px;padding:32px;box-shadow:0 16px 40px #1113152e}.onboard-mark{width:44px;height:44px;border-radius:12px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:700}.onboard-kicker{margin:16px 0 0;color:var(--accent);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}.onboard-card h1{margin:8px 0 12px;font-size:28px;line-height:1.2}.onboard-lead,.onboard-note,.onboard-hint{color:var(--muted);line-height:1.5}.onboard-perms{margin:20px 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}.onboard-perms li{padding:12px 14px;border:1px solid var(--line);border-radius:10px}.onboard-perms strong{display:block;color:var(--text)}.onboard-perms span{display:block;margin-top:4px;color:var(--muted);font-size:13px}.onboard-error{color:var(--danger)}.onboard-hint code{font-size:12px;background:#f3f5f7;padding:1px 4px;border-radius:4px}.google-btn{display:flex;align-items:center;justify-content:center;height:44px;border-radius:10px;background:#1a73e8;color:#fff;text-decoration:none;font-weight:600}.google-btn.disabled{opacity:.45;cursor:not-allowed}.onboard-skip{display:block;margin-top:16px;text-align:center;color:var(--muted);font-size:13px}.setup-card{max-width:560px}.setup-field{display:grid;gap:7px;margin:18px 0;color:var(--text);font-size:13px;font-weight:600}.setup-field span{color:var(--muted);font-weight:400}.setup-field input{width:100%;box-sizing:border-box;padding:12px 13px;border:1px solid var(--line);border-radius:8px;background:#fff;font:inherit;font-weight:400}.setup-submit{margin-top:10px}.setup-actions{display:flex;justify-content:space-between;gap:10px;margin-top:22px}.setup-page{min-height:100%;display:grid;place-items:center;padding:32px 16px;background:var(--page)}.setup-panel{width:min(680px,100%);padding:36px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 16px 40px #1f293314}.checklist{display:grid;gap:10px;margin:24px 0}.checklist-item{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--line);border-radius:10px}.checklist-item>div{display:grid;gap:3px;flex:1}.checklist-item>div span,.checklist-soon{color:var(--muted);font-size:12px}.checkmark{color:var(--muted);font-size:20px}.checkmark.done{color:#15703b}.setup-inbox{display:inline-flex;align-items:center;text-decoration:none}
