/* Shared primitives that predate appshell.css. Tokens, reset and base element
   styles live in design-tokens.css; nothing here restates them. */

button{font-family:var(--sans)}
img,svg{display:block}
h1,h2,h3,p{margin:0}

.dv-scroll::-webkit-scrollbar{width:10px;height:10px}
.dv-scroll::-webkit-scrollbar-thumb{background:#cfd4cf;border-radius:8px;border:3px solid transparent;background-clip:padding-box}
.dv-scroll::-webkit-scrollbar-thumb:hover{background:#b7bdb7;background-clip:padding-box}

@keyframes dvmarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes dvblink{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}

.fade{animation:dvfade .4s ease both}
.wrap{max-width:1200px;margin:0 auto}
.mono{font-family:var(--mono)}
.tnum{font-variant-numeric:tabular-nums}

.btn{height:40px;padding:0 18px;border:none;border-radius:9px;font-size:14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;color:#fff;background:var(--accent);box-shadow:0 1px 2px rgba(14,110,140,.35);transition:background .15s}
.btn:hover{background:var(--accent-700)}
.btn .arrow{opacity:.7}
.btn-secondary{color:var(--ink);background:var(--surface);border:1px solid var(--bd-2);box-shadow:none}
.btn-secondary:hover{background:var(--surface-2);border-color:var(--ink-4)}
.btn-ghost{color:var(--accent-700);background:transparent;box-shadow:none;padding:0 14px}
.btn-ghost:hover{background:var(--accent-50)}
.btn-dark{background:var(--ink);border:1px solid var(--ink);box-shadow:none}
.btn-dark:hover{background:#000}
.btn-lg{height:48px;padding:0 24px;font-size:15px;border-radius:9px;box-shadow:0 3px 10px -2px rgba(14,110,140,.4)}
.btn-link{height:48px;padding:0 6px;border:none;background:transparent;color:var(--ink);font-size:15px;font-weight:600;cursor:pointer;border-bottom:2px solid var(--ink)}
.btn-link:hover{color:var(--accent-700);border-color:var(--accent)}
.btn-meta{background:#1877f2;border:none;box-shadow:none}
.btn-meta:hover{background:#0f63d2}

.logo{display:flex;align-items:center;gap:9px}
.logo .mark{width:26px;height:26px;border-radius:7px;background:var(--accent);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:15px}
.logo .name{font-weight:700;font-size:19px;letter-spacing:-.02em}

.badge{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px;border-radius:20px;font-size:11.5px;font-weight:700;white-space:nowrap}
.badge .dot{width:7px;height:7px;border-radius:50%}
.badge-live{background:var(--accent-50);color:var(--accent-700)}
.badge-live .dot{background:var(--accent)}
.badge-scheduled{background:#eef2fb;color:var(--blue)}
.badge-scheduled .dot{background:var(--blue)}
.badge-draft{background:var(--bg);color:var(--ink-3)}
.badge-draft .dot{background:var(--ink-4)}

.ticks{color:var(--accent)}

.bubble{max-width:82%;padding:9px 12px 6px;box-shadow:0 1px 2px rgba(23,28,31,.05)}
.bubble .txt{font-size:13px;line-height:1.45}
.bubble .time{font-family:var(--mono);font-size:9px;color:var(--ink-4);text-align:right;margin-top:3px}
.bubble-them{align-self:flex-start;background:var(--surface);border:1px solid var(--bd);border-radius:15px 15px 15px 5px}
.bubble-me{align-self:flex-end;background:linear-gradient(180deg,#eef6f1,#e1efe7);border:1px solid var(--accent-100);border-radius:15px 15px 5px 15px;box-shadow:0 1px 2px rgba(14,110,140,.08)}
.bubble-me .txt{color:var(--ink)}
.bubble-me .time{color:var(--ink-3)}
.bubble .rcpt{display:flex;align-items:center;justify-content:flex-end;gap:5px;margin-top:3px}
.paper{background-color:var(--surface-2);background-image:radial-gradient(rgba(23,28,31,.055) .5px,transparent .5px);background-size:15px 15px}

.typing{display:inline-flex;gap:3px;align-items:flex-end}
.typing span{width:5px;height:5px;border-radius:50%;background:var(--ink-4);animation:dvblink 1.3s infinite}
.typing span:nth-child(2){animation-delay:.2s}
.typing span:nth-child(3){animation-delay:.4s}

.avatar{border-radius:50%;color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none}

.marquee{background:var(--ink);overflow:hidden}
.marquee-track{display:flex;width:max-content;animation:dvmarquee 34s linear infinite}
.marquee-row{display:flex;align-items:center;flex:none;padding:12px 0}
.marquee-row span.ch{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:rgba(255,255,255,.82);padding:0 20px}
.marquee-row span.sep{width:4px;height:4px;border-radius:50%;background:var(--accent);flex:none}

.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--ink-3)}
.eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;color:var(--accent-700)}

.inbox-list{border-right:1px solid var(--bd);display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--surface)}
.inbox-tabs{display:flex;gap:18px;padding:14px 16px 0}
.inbox-tabs span{font-size:13px;font-weight:600;padding-bottom:10px;color:var(--ink-3)}
.inbox-tabs span.active{border-bottom:2px solid var(--accent);color:var(--ink)}
.inbox-search{padding:10px 12px;border-top:1px solid var(--bd);border-bottom:1px solid var(--bd)}
.inbox-search .pill{display:flex;align-items:center;gap:9px;height:var(--field-height);padding:0 var(--field-padding-x);background:var(--field-background);border:1px solid var(--field-border);border-radius:var(--radius-field);color:var(--field-placeholder);font-size:var(--field-font-size)}
.inbox-rows{flex:1;overflow-y:auto;min-height:0}
.thread-row{display:flex;gap:11px;padding:13px 16px;border-bottom:1px solid var(--bd);cursor:pointer;border-left:3px solid transparent}
.thread-row.active{background:var(--accent-50);border-left-color:var(--accent)}
.thread-row .body{flex:1;min-width:0}
.thread-row .l1{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.thread-row .nm{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thread-row .tm{font-size:10.5px;color:var(--ink-4);flex:none;font-family:var(--mono)}
.thread-row .l2{display:flex;align-items:center;gap:6px;margin-top:3px}
.thread-row .pv{flex:1;min-width:0;font-size:12.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thread-row .un{width:18px;height:18px;flex:none;border-radius:50%;background:var(--accent);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center}
.inbox-thread{display:flex;flex-direction:column;min-width:0;min-height:0}
.thread-head{display:flex;align-items:center;gap:11px;padding:12px 16px;border-bottom:1px solid var(--bd);background:var(--surface)}
.thread-head .nm{flex:1;min-width:0}
.thread-head .nm .a{font-size:14px;font-weight:600}
.thread-head .typing-row{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--accent-700)}
.thread-head .typing span{background:var(--accent);width:4px;height:4px}
.thread-head .vip{font-family:var(--mono);font-size:9px;color:var(--accent-700);background:var(--accent-50);border-radius:5px;padding:2px 6px}
.icon-btn{width:32px;height:32px;border:1px solid var(--bd);border-radius:9px;background:var(--surface);display:flex;align-items:center;justify-content:center;color:var(--ink-2);cursor:pointer;flex:none}
.thread-msgs{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:9px}
.day-pill{align-self:center;font-family:var(--mono);font-size:9px;letter-spacing:.16em;color:var(--ink-4);background:var(--surface);border:1px solid var(--bd);border-radius:20px;padding:3px 12px;margin-bottom:2px}
.thread-msgs .bubble{max-width:74%}
.thread-msgs .bubble .txt{font-size:13.5px}
.thread-msgs .bubble .time{font-size:9px;color:var(--ink-3)}
.thread-msgs .bubble-them .time{color:var(--ink-4)}
.type-bubble{align-self:flex-start;background:var(--surface);border:1px solid var(--bd);border-radius:15px 15px 15px 5px;padding:9px 12px}
.composer{display:flex;align-items:center;gap:9px;padding:11px 14px;border-top:1px solid var(--bd);background:var(--surface)}
.composer .add{width:32px;height:32px;flex:none}
.composer .field{flex:1;font-size:13px;color:var(--ink-4);background:var(--bg);border-radius:20px;padding:10px 14px}
.composer input.field{color:var(--ink);border:1px solid var(--bd);height:40px;padding:0 16px;outline:none;font-family:var(--sans);font-size:13.5px}
.composer .send{width:38px;height:38px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(14,110,140,.35);cursor:pointer;flex:none;border:none}
.inbox-context{display:none;border-left:1px solid var(--bd);background:var(--surface);overflow-y:auto;min-height:0;padding:20px 18px}
.ctx-profile{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding-bottom:18px;border-bottom:1px solid var(--bd)}
.ctx-profile .nm{font-size:15px;font-weight:600}
.ctx-profile .id{font-family:var(--mono);font-size:10px;color:var(--ink-3)}
.ctx-section{padding:16px 0;border-bottom:1px solid var(--bd)}
.ctx-section .label{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--ink-4);margin-bottom:10px}
.ctx-field{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:9px}
.ctx-field .k{font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--ink-4)}
.ctx-field .v{font-size:12.5px;font-weight:600;text-align:right}
.ctx-tag{display:inline-flex;height:26px;align-items:center;padding:0 11px;border-radius:20px;background:var(--accent-50);color:var(--accent-700);font-size:12px;font-weight:600;margin:0 6px 6px 0}
.ctx-order{border:1px solid var(--bd);border-radius:12px;padding:12px}
.ctx-order .row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ctx-order .id{font-size:13px;font-weight:600}
.ctx-order .items{font-size:12px;color:var(--ink-2);margin-top:6px}
.ctx-assigned{display:flex;align-items:center;gap:9px}
