/* Amber Smile — approval app
   Dizainas perkeltas iš approval-app.html demo (nekeičiam vizualo),
   papildyta: login, modalai, loading/error būsenos, media, flag priežastis. */

:root{
  --bg:#F7F3EC; --surface:#FFFFFF; --surface-2:#FBF7F0;
  --ink:#2A2219; --ink-soft:#6B6153; --ink-mute:#A0947F;
  --line:#ECE3D3; --line-strong:#E0D4BE;
  --accent:#B0730F; --accent-soft:#F4E7CC;
  --send:#2E7A50; --send-soft:#E4F0E8;
  --flag:#B4442B; --flag-soft:#F7E4DC;
  --ar:#B0730F; --ar-soft:#F4E7CC;
  --en:#496C88; --en-soft:#E6EDF3;
  --warn:#B0730F;
  --font-ui:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-serif:"Iowan Old Style","Palatino Linotype",Georgia,serif;
  --font-mono:ui-monospace,"SF Mono","Cascadia Code",Menlo,monospace;
  --font-ar:"Geeza Pro","Segoe UI","Tahoma",system-ui,sans-serif;
  --shadow:0 1px 2px rgba(42,34,25,.04),0 6px 20px rgba(42,34,25,.06);
  --radius:14px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#16130F;--surface:#201B15;--surface-2:#262019;--ink:#F1EADF;--ink-soft:#C4B9A7;--ink-mute:#897E6D;
  --line:#322A20;--line-strong:#3E3427;--accent:#E0A63C;--accent-soft:#3A2E18;--send:#54B889;--send-soft:#1B3527;
  --flag:#E27455;--flag-soft:#3A241C;--ar:#E0A63C;--ar-soft:#3A2E18;--en:#88AAC8;--en-soft:#1E2A34;--warn:#E0A63C;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35);}}
:root[data-theme="dark"]{
  --bg:#16130F;--surface:#201B15;--surface-2:#262019;--ink:#F1EADF;--ink-soft:#C4B9A7;--ink-mute:#897E6D;
  --line:#322A20;--line-strong:#3E3427;--accent:#E0A63C;--accent-soft:#3A2E18;--send:#54B889;--send-soft:#1B3527;
  --flag:#E27455;--flag-soft:#3A241C;--ar:#E0A63C;--ar-soft:#3A2E18;--en:#88AAC8;--en-soft:#1E2A34;--warn:#E0A63C;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35);}

*{box-sizing:border-box;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-ui);line-height:1.5;-webkit-font-smoothing:antialiased;}
[hidden]{display:none!important;}

/* ---------- header ---------- */
header.top{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:13px 20px;}
.brand{display:flex;align-items:baseline;gap:9px;}
.brand .beads{font-size:19px;transform:translateY(2px);}
.brand .name{font-family:var(--font-serif);font-size:20px;font-weight:600;}
.brand .sub{font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);}
.demo-tag{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent);border-radius:20px;padding:2px 8px;}
.spacer{flex:1;}
.count{display:flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:12px;color:var(--ink-soft);background:var(--surface-2);border:1px solid var(--line);border-radius:20px;padding:5px 12px;}
.count b{color:var(--ink);font-size:13px;font-variant-numeric:tabular-nums;}
.dot{width:7px;height:7px;border-radius:50%;background:var(--send);box-shadow:0 0 0 3px var(--send-soft);}
.dot.offline{background:var(--flag);box-shadow:0 0 0 3px var(--flag-soft);}
.icon-btn{cursor:pointer;background:transparent;border:1px solid var(--line);border-radius:9px;color:var(--ink-soft);font-size:14px;padding:6px 10px;line-height:1;transition:border-color .15s,color .15s;}
.icon-btn:hover{border-color:var(--line-strong);color:var(--ink);}
.icon-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

/* ---------- layout ---------- */
.wrap{max-width:720px;margin:0 auto;padding:22px 18px 80px;}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px;}
.chip{cursor:pointer;font-size:13px;font-weight:500;color:var(--ink-soft);background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:7px 14px;transition:background .15s,color .15s,border-color .15s;user-select:none;font-family:var(--font-ui);}
.chip:hover{border-color:var(--line-strong);}
.chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.chip.active{background:var(--ink);color:var(--bg);border-color:var(--ink);}
.chip .n{font-family:var(--font-mono);font-size:11px;opacity:.65;margin-left:5px;font-variant-numeric:tabular-nums;}

.list{display:flex;flex-direction:column;gap:14px;}

/* ---------- kompaktiškos sąrašo eilutės (inbox) ---------- */
.row{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;font-family:var(--font-ui);box-shadow:var(--shadow);transition:border-color .15s,transform .1s;}
.row:hover{border-color:var(--line-strong);}
.row:active{transform:scale(.995);}
.row.flagged{border-color:var(--flag-soft);background:var(--flag-soft);}
.row-who{font-weight:600;font-size:14px;white-space:nowrap;flex:0 0 auto;max-width:42%;overflow:hidden;text-overflow:ellipsis;}
.row-badge{font-family:var(--font-mono);font-size:9px;letter-spacing:.05em;padding:2px 6px;border-radius:5px;flex:0 0 auto;}
.row-badge.ar{color:var(--ar);background:var(--ar-soft);}
.row-badge.en{color:var(--en);background:var(--en-soft);}
.row-prev{flex:1;min-width:0;color:var(--ink-soft);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.row-time{font-family:var(--font-mono);font-size:11px;color:var(--ink-mute);white-space:nowrap;flex:0 0 auto;}
.card-close{background:none;border:0;color:var(--ink-soft);font-size:12.5px;cursor:pointer;padding:0 0 2px;font-family:var(--font-ui);align-self:flex-start;}
.card-close:hover{color:var(--accent);}

/* ---------- kortelė ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;transition:opacity .35s,transform .35s,max-height .4s,margin .35s,padding .35s;}
.card-in{padding:16px 18px;display:flex;flex-direction:column;gap:11px;}
.c-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.who{font-size:13px;font-weight:600;}
.badge{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:6px;font-weight:500;}
.badge.ar{color:var(--ar);background:var(--ar-soft);}
.badge.en{color:var(--en);background:var(--en-soft);}
.cat{font-size:11.5px;color:var(--ink-soft);background:var(--surface-2);border:1px solid var(--line);border-radius:6px;padding:2px 8px;}
.time{font-family:var(--font-mono);font-size:11px;color:var(--ink-mute);margin-left:auto;}

.tags{display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.src{font-size:11.5px;color:var(--ink-soft);display:flex;align-items:center;gap:5px;}
.src b{color:var(--ink);font-weight:600;}
.tag{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;padding:2px 6px;border-radius:5px;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-soft);}
.tag.vip{color:var(--accent);border-color:var(--accent-soft);background:var(--accent-soft);}
.tag.new{color:var(--en);border-color:var(--en-soft);background:var(--en-soft);}
.tag.lang{color:var(--ar);border-color:var(--ar-soft);background:var(--ar-soft);}

.product{display:flex;align-items:center;gap:10px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:8px 10px;}
.product .thumb{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px;flex:0 0 auto;background:var(--accent-soft);overflow:hidden;}
.product .thumb img{width:100%;height:100%;object-fit:cover;}
.product .pinfo{flex:1;min-width:0;}
.product .pinfo b{font-size:12.5px;display:block;}
.product .pinfo span{font-size:11px;color:var(--ink-mute);}
.product .plink{font-size:11.5px;color:var(--accent);text-decoration:none;white-space:nowrap;font-weight:600;}

.thread-toggle{cursor:pointer;align-self:flex-start;font-size:12px;color:var(--ink-soft);background:none;border:none;padding:1px 0;display:flex;align-items:center;gap:6px;font-family:var(--font-ui);}
.thread-toggle:hover{color:var(--accent);}
.thread-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.thread{display:none;flex-direction:column;gap:8px;padding:11px 12px;background:var(--surface-2);border-radius:10px;border:1px solid var(--line);}
.thread.open{display:flex;}
.bubble{max-width:82%;font-size:13px;padding:7px 11px;border-radius:12px;line-height:1.4;}
.bubble .btr{font-size:11px;color:var(--ink-soft);margin-top:3px;font-style:italic;direction:ltr;text-align:left;}
.bubble .bt{font-size:9.5px;color:var(--ink-mute);margin-top:3px;font-family:var(--font-mono);direction:ltr;text-align:left;}
.bubble.in{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px;}
.bubble.out{align-self:flex-end;background:var(--accent-soft);border-bottom-right-radius:4px;}
.bubble[dir="rtl"]{font-family:var(--font-ar);font-size:15px;}

.msg{border-left:2px solid var(--accent);padding-left:12px;}
.msg .lbl{font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:3px;}
.msg .orig{font-size:15.5px;white-space:pre-wrap;}
.msg .orig[dir="rtl"]{font-family:var(--font-ar);font-size:17px;}
.msg .tr{font-size:12.5px;color:var(--ink-mute);margin-top:3px;}

.reply{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:12px 13px;}
.reply .rl{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:7px;flex-wrap:wrap;}
.reply .rtext{font-size:15px;border-radius:6px;transition:opacity .2s;white-space:pre-wrap;}
.reply .rtext[dir="rtl"]{font-family:var(--font-ar);font-size:17px;line-height:1.7;}
.rtr-label{font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute);margin:9px 0 3px;}
.reply .rtr{font-size:13px;color:var(--ink-soft);outline:none;white-space:pre-wrap;}
.editable[contenteditable="true"]{background:var(--surface);box-shadow:0 0 0 2px var(--accent);padding:6px 8px;margin:-2px -4px;border-radius:6px;color:var(--ink);}
.edit-hint{display:none;font-size:11.5px;color:var(--accent);margin-top:9px;align-items:center;gap:6px;}
.reply.editing .edit-hint{display:flex;}
.reply.editing .rtext[dir="rtl"]{opacity:.4;}
.warn-note{color:var(--warn);font-weight:600;}
.rtext.regen{animation:flash 1s ease;}
@keyframes flash{0%{background:var(--accent-soft);box-shadow:0 0 0 2px var(--accent);}100%{background:transparent;box-shadow:none;}}
/* laukiam Claude perrašymo LT→AR */
.reply.regenerating .rtext[dir="rtl"]{opacity:.35;}
.regen-note{display:none;align-items:center;gap:7px;font-size:11.5px;color:var(--accent);margin-top:9px;}
.reply.regenerating .regen-note{display:flex;}
.reply.regenerating .edit-hint{display:none;}

.history{font-size:11.5px;color:var(--ink-soft);display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.history b{color:var(--ink);}
.auto-badge{font-family:var(--font-mono);font-size:9px;letter-spacing:.05em;text-transform:uppercase;color:var(--send);background:var(--send-soft);border-radius:5px;padding:2px 6px;}
.quick{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px;padding-top:9px;border-top:1px dashed var(--line-strong);}
.quick .ql{font-family:var(--font-mono);font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute);align-self:center;margin-right:2px;}
.qchip{cursor:pointer;font-size:11.5px;color:var(--accent);background:var(--accent-soft);border:1px solid transparent;border-radius:20px;padding:4px 10px;transition:filter .15s;font-family:var(--font-ui);}
.qchip:hover{filter:brightness(.97);}
.qchip:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

/* prisegta media */
.media-strip{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px;padding-top:9px;border-top:1px dashed var(--line-strong);}
.media-item{position:relative;width:54px;height:54px;border-radius:8px;overflow:hidden;border:1px solid var(--line-strong);background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:18px;}
.media-item img{width:100%;height:100%;object-fit:cover;}
.media-item .x{position:absolute;top:2px;right:2px;width:16px;height:16px;border-radius:50%;border:none;background:rgba(0,0,0,.6);color:#fff;font-size:10px;line-height:1;cursor:pointer;padding:0;}

.actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap;}
.btn{cursor:pointer;font-family:var(--font-ui);font-size:13.5px;font-weight:600;border-radius:9px;padding:9px 16px;border:1px solid transparent;transition:filter .15s,background .15s,color .15s;}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.btn[disabled]{opacity:.5;cursor:not-allowed;}
.btn.send{background:var(--send);color:#fff;}
.btn.send:hover:not([disabled]){filter:brightness(1.06);}
.btn.edit{background:transparent;color:var(--ink-soft);border-color:var(--line-strong);}
.btn.edit:hover:not([disabled]){color:var(--ink);border-color:var(--ink-soft);}
.btn.media{background:transparent;color:var(--ink-soft);border-color:var(--line-strong);}
.btn.media:hover:not([disabled]){color:var(--ink);border-color:var(--ink-soft);}
.btn.redraft{background:transparent;color:var(--ink-soft);border-color:var(--line-strong);}
.btn.redraft:hover:not([disabled]){color:var(--accent);border-color:var(--accent);}
.btn.wait{background:transparent;color:var(--ink-soft);border-color:var(--line-strong);}
.btn.wait:hover:not([disabled]){color:var(--accent);border-color:var(--accent);}
.btn.primary{background:var(--accent);color:#fff;}
.btn.primary:hover:not([disabled]){filter:brightness(1.06);}
.btn.ghost{background:transparent;color:var(--ink-soft);border-color:var(--line-strong);}
.btn.ghost:hover:not([disabled]){color:var(--ink);border-color:var(--ink-soft);}
.btn.danger{background:var(--flag);color:#fff;}
.btn.danger:hover:not([disabled]){filter:brightness(1.06);}
.spin{display:inline-block;width:11px;height:11px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite;vertical-align:-1px;margin-right:6px;}
@keyframes spin{to{transform:rotate(360deg);}}

.card.flagged{border-color:var(--flag-soft);}
.flag-bar{background:var(--flag-soft);color:var(--flag);font-size:12.5px;font-weight:600;display:flex;align-items:center;gap:8px;padding:9px 18px;flex-wrap:wrap;}
.flag-bar .spacer{flex:1;}
.flag-bar .tb-btn{--tc:var(--flag);}
.card.busy{pointer-events:none;opacity:.6;}
.card.leaving{opacity:0;transform:translateY(-6px) scale(.99);max-height:0;margin-top:-14px;padding:0;pointer-events:none;border-color:transparent;}
.card-err{font-size:12.5px;color:var(--flag);background:var(--flag-soft);border-radius:8px;padding:7px 10px;display:flex;align-items:center;gap:8px;}

/* ---------- būsenos ---------- */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);opacity:0;background:var(--ink);color:var(--bg);font-size:13.5px;font-weight:600;padding:11px 18px;border-radius:11px;box-shadow:var(--shadow);transition:opacity .25s,transform .25s;z-index:60;max-width:90vw;text-align:center;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast.err{background:var(--flag);color:#fff;}
.empty{text-align:center;color:var(--ink-mute);font-size:14px;padding:50px 0;}
.banner{display:flex;align-items:center;gap:10px;font-size:13px;background:var(--flag-soft);color:var(--flag);border:1px solid var(--flag);border-radius:10px;padding:10px 13px;margin-bottom:16px;}
.banner .spacer{flex:1;}

.skeleton{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;display:flex;flex-direction:column;gap:11px;}
.sk-line{height:11px;border-radius:6px;background:linear-gradient(90deg,var(--surface-2),var(--line),var(--surface-2));background-size:200% 100%;animation:sk 1.3s linear infinite;}
@keyframes sk{0%{background-position:200% 0;}100%{background-position:-200% 0;}}

/* ---------- login ---------- */
.login{position:fixed;inset:0;z-index:80;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:20px;}
.login-box{width:100%;max-width:340px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px 24px;display:flex;flex-direction:column;gap:14px;text-align:center;}
.login-box .beads{font-size:30px;}
.login-box h1{font-family:var(--font-serif);font-size:22px;font-weight:600;margin:0;}
.login-box p{margin:0;font-size:12.5px;color:var(--ink-mute);}
.field{display:flex;flex-direction:column;gap:6px;text-align:left;}
.field label{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);}
.field input,.field textarea,.field select{font-family:var(--font-ui);font-size:14px;color:var(--ink);background:var(--surface-2);border:1px solid var(--line-strong);border-radius:9px;padding:10px 12px;width:100%;}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--accent);outline-offset:0;border-color:var(--accent);}
.login-err{font-size:12.5px;color:var(--flag);}

/* ---------- modalai ---------- */
.modal{position:fixed;inset:0;z-index:70;background:rgba(20,16,12,.45);display:flex;align-items:center;justify-content:center;padding:20px;}
.modal-box{width:100%;max-width:420px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px 22px;display:flex;flex-direction:column;gap:14px;max-height:86vh;overflow:auto;}
.modal-box h2{font-family:var(--font-serif);font-size:18px;font-weight:600;margin:0;}
.modal-box .mnote{font-size:12.5px;color:var(--ink-mute);margin:0;}
.modal-actions{display:flex;gap:9px;justify-content:flex-end;flex-wrap:wrap;}
.reasons{display:flex;flex-direction:column;gap:7px;}
.reason{display:flex;align-items:center;gap:9px;font-size:13.5px;background:var(--surface-2);border:1px solid var(--line);border-radius:9px;padding:9px 11px;cursor:pointer;}
.reason:hover{border-color:var(--line-strong);}
.reason input{accent-color:var(--accent);}
.uploading{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--accent);padding:12px 2px;line-height:1.4;}
.drop{border:1px dashed var(--line-strong);border-radius:10px;padding:18px;text-align:center;font-size:13px;color:var(--ink-soft);cursor:pointer;background:var(--surface-2);}
.drop:hover,.drop.over{border-color:var(--accent);color:var(--accent);}

/* ---------- žymų valdymas ---------- */
.tag{display:inline-flex;align-items:center;gap:3px;}
.tag.block{color:var(--flag);border-color:var(--flag-soft);background:var(--flag-soft);}
.tag-x{border:none;background:none;color:inherit;font-size:13px;line-height:1;cursor:pointer;opacity:.5;padding:0;margin-left:1px;}
.tag-x:hover{opacity:1;}
.tag-x:focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-radius:3px;}
.tag-add{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);background:none;border:1px dashed var(--line-strong);border-radius:5px;padding:2px 7px;cursor:pointer;transition:color .15s,border-color .15s;}
.tag-add:hover{color:var(--accent);border-color:var(--accent);}
.tag-pick{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 4px;}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}
/* ---------- pokalbio (chat) vaizdas ---------- */
.chat{display:flex;flex-direction:column;gap:8px;margin:10px 0 6px;}
.bubble{max-width:88%;padding:9px 12px;border-radius:12px;font-size:14.5px;line-height:1.4;}
.bubble.in{align-self:flex-start;background:var(--surface-2);border:1px solid var(--line);}
.bubble.out{align-self:flex-end;background:var(--send-soft);border:1px solid var(--send);}
.bubble .btext{color:var(--ink);}
.bubble .btr{margin-top:4px;font-size:12.5px;color:var(--ink-soft);font-style:italic;}
.bubble .bimg{max-width:200px;max-height:220px;border-radius:8px;margin:4px 0;display:block;cursor:zoom-in;}
.bubble .bvid{max-width:220px;border-radius:8px;margin:4px 0;display:block;background:#000;}
.lightbox{position:fixed;inset:0;z-index:90;background:rgba(20,16,12,.88);display:flex;align-items:center;justify-content:center;padding:20px;cursor:zoom-out;}
.lightbox img{max-width:95vw;max-height:92vh;border-radius:10px;box-shadow:0 12px 48px rgba(0,0,0,.5);}
.lightbox .lb-close{position:fixed;top:16px;right:20px;width:42px;height:42px;border-radius:50%;border:none;background:rgba(255,255,255,.16);color:#fff;font-size:24px;line-height:1;cursor:pointer;}
.lightbox .lb-close:hover{background:rgba(255,255,255,.28);}
.msg-reply{margin-top:6px;font-size:11.5px;font-family:var(--font-mono);letter-spacing:.03em;background:none;border:0;color:var(--accent);cursor:pointer;padding:0;opacity:.85;}
.msg-reply:hover{opacity:1;text-decoration:underline;}
.summary{margin:2px 0 12px;padding:8px 12px;border-radius:9px;background:var(--accent-soft);border:1px solid var(--accent);font-size:13.5px;color:var(--ink);}
.reply-target{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:6px 10px;margin-bottom:8px;border-radius:8px;background:var(--send-soft);border:1px solid var(--send);color:var(--ink);}
.reply-target .clear-target{margin-left:auto;background:none;border:0;color:inherit;cursor:pointer;font-size:15px;line-height:1;}
.safebar{position:sticky;top:0;z-index:5;background:var(--send-soft);border:1px solid var(--send);border-radius:10px;padding:10px 14px;margin-bottom:14px;font-size:13.5px;color:var(--ink);line-height:1.4;}
.deadman{position:sticky;top:0;z-index:6;background:#c0392b;color:#fff;border:1px solid #7d241a;border-radius:10px;padding:12px 15px;margin-bottom:14px;font-size:14px;line-height:1.45;box-shadow:0 3px 14px rgba(192,57,43,.35);}
.deadman b{font-weight:700;}
.msg-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:6px;}
.msg-emoji{background:none;border:1px solid var(--line-2);border-radius:7px;padding:1px 7px;cursor:pointer;font-size:14px;line-height:1.4;}
.msg-emoji:hover{border-color:var(--accent);}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}
@media (max-width:520px){.wrap{padding:16px 12px 70px;}.brand .sub{display:none;}.demo-tag{display:none;}}

/* ---------- Broadcast rodinys (js/broadcast.js) ---------- */
.views{display:flex;gap:6px;margin-left:14px;}
.vbtn{cursor:pointer;font:inherit;font-size:13px;font-weight:600;padding:6px 13px;border-radius:9px;
  background:transparent;border:1px solid var(--line);color:var(--ink-soft);}
.vbtn:hover{border-color:var(--line-strong);}
.vbtn.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);}
.bc-caps{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px;}
.bc-cap{font-family:var(--font-mono);font-size:10.5px;border-radius:5px;padding:3px 8px;
  border:1px solid var(--line-strong);color:var(--ink-soft);}
.bc-cap.ok{border-color:var(--send);color:var(--send);}
.bc-cap.no{border-color:var(--warn);color:var(--warn);}
.bc-tabs{display:flex;gap:6px;margin-bottom:14px;}
.bc-tab{cursor:pointer;font:inherit;font-size:13px;font-weight:600;padding:8px 15px;border-radius:9px;
  background:var(--surface);border:1px solid var(--line);color:var(--ink-soft);}
.bc-tab.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);}
.bc-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px;margin-bottom:14px;box-shadow:var(--shadow);}
.bc-card h2{font-size:14px;margin:0 0 10px;}
.bc-muted{color:var(--ink-soft);font-size:12.5px;margin:6px 0;}
.bc-lab{display:block;font-size:12px;color:var(--ink-soft);margin:12px 0 5px;}
.bc-in{width:100%;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:9px;
  color:var(--ink);padding:10px 12px;font:inherit;font-size:14px;margin-bottom:8px;}
.bc-in:focus{outline:2px solid var(--accent);outline-offset:1px;}
.bc-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;align-items:center;}
.bc-prod{display:flex;gap:12px;align-items:center;background:var(--surface-2);border:1px solid var(--line);
  border-radius:11px;padding:10px;margin-bottom:8px;}
.bc-prod img{width:60px;height:60px;object-fit:cover;border-radius:8px;flex:0 0 auto;}
.bc-prod.err{border-color:var(--flag);}
.bc-pill{display:inline-block;font-family:var(--font-mono);font-size:9.5px;text-transform:uppercase;
  border-radius:4px;padding:2px 6px;margin-left:6px;}
.bc-pill.in{background:var(--send-soft);border:1px solid var(--send);color:var(--send);}
.bc-pill.out{background:var(--flag-soft);border:1px solid var(--flag);color:var(--flag);}
.bc-kv{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
.bc-kv:last-of-type{border-bottom:0;}
.bc-kv>span:first-child{color:var(--ink-soft);min-width:118px;flex:0 0 auto;}
.bc-kv code{font-family:var(--font-mono);font-size:12px;background:var(--accent-soft);
  color:var(--accent);border-radius:5px;padding:2px 7px;}
.bc-var{background:var(--surface-2);border:1px solid var(--line);border-radius:9px;
  padding:8px 11px;margin:4px 0;font-size:12.5px;word-break:break-all;}
.bc-preview{background:var(--send-soft);border:1px solid var(--send);border-radius:10px;
  padding:12px 14px;white-space:pre-wrap;font-size:14px;margin-top:12px;}
.bc-note{background:var(--accent-soft);border:1px solid var(--accent);border-radius:9px;
  padding:9px 12px;font-size:13px;margin-top:10px;}
.bc-warn{background:var(--flag-soft);border:1px solid var(--flag);border-radius:9px;
  padding:9px 12px;font-size:13px;margin-top:10px;}
.bc-err{background:var(--flag-soft);border:1px solid var(--flag);border-radius:9px;
  padding:10px 13px;font-size:13.5px;margin-bottom:12px;}
.bc-collage{width:100%;border-radius:10px;border:1px solid var(--line-strong);margin-top:8px;display:block;}
.bc-parked{background:var(--accent-soft);border:1px solid var(--accent);border-radius:10px;padding:9px 11px;margin-bottom:12px;}
.bc-parkrow{display:flex;align-items:center;gap:10px;padding:5px 0;}
.bc-parkrow+.bc-parkrow{border-top:1px solid var(--line);}
.bc-parkrow img{width:46px;height:46px;object-fit:cover;border-radius:8px;flex:0 0 auto;}
.bc-parkinfo{flex:1;min-width:0;font-size:13px;}
.bc-parkinfo>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bc-msg{background:var(--surface-2);border:1px solid var(--line-strong);border-radius:10px;
  padding:12px 14px;white-space:pre-wrap;font-size:13.5px;margin-bottom:8px;}
.bc-msg.ar{direction:rtl;text-align:right;font-family:var(--font-ar);}
@media (max-width:640px){.views{margin-left:0;width:100%;order:3;}}
.bc-skurow{display:flex;gap:8px;} .bc-skurow .bc-sku{flex:2;} .bc-skurow .bc-price{flex:1;}

/* ---------- WhatsApp 24h langas ---------- */
.wa-bar{padding:7px 12px;font-size:12.5px;border-radius:10px 10px 0 0;}
.wa-bar.expired{background:#fdecea;color:#8a2a20;border-bottom:1px solid #f3c2bb;}
.wa-bar.warning{background:#fdf6e3;color:#7a5c12;border-bottom:1px solid #eeddb0;}
.row-wa{font-size:10px;background:#fdecea;color:#8a2a20;border-radius:6px;padding:1px 5px;margin-left:4px;white-space:nowrap;}
.row-wa.warn{background:#fdf6e3;color:#7a5c12;}

/* ---------- ankstesnis pokalbis (Zoko istorija) ---------- */
.prevwrap{margin:8px 0;}
.prevbtn{border:1px solid var(--line-strong);background:var(--surface-2);color:var(--ink-soft);border-radius:8px;padding:5px 10px;font-size:12px;cursor:pointer;}
.prevbtn:hover{background:var(--accent-soft);}
.prevbox{margin-top:8px;padding:8px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;max-height:320px;overflow-y:auto;}
.prevmsg{margin:4px 0;padding:6px 9px;border-radius:9px;font-size:13px;max-width:82%;word-wrap:break-word;color:var(--ink);}
.prevmsg.in{background:var(--surface);border:1px solid var(--line);margin-right:auto;}
.prevmsg.out{background:var(--send-soft);margin-left:auto;text-align:right;}
.prevtime{display:block;font-size:10px;opacity:.5;margin-bottom:2px;}
.previmg{max-width:160px;max-height:160px;border-radius:8px;display:block;margin-top:4px;}
.prevempty{font-size:12px;opacity:.6;padding:4px;}

/* ---------- Dienos dealas: rytą laukiantis juodraštis ---------- */
.bc-daily{border-color:var(--line-strong);}
.bc-daily.done{border-color:var(--ok,#3a7d44);}
.bc-daily summary{cursor:pointer;}
.bc-bigprice{font-size:34px;font-weight:700;letter-spacing:-.5px;margin:14px 0 2px;}
.bc-prods{display:flex;flex-direction:column;gap:8px;margin:12px 0;}
#fManual summary{cursor:pointer;font-size:13.5px;}
#fManual[open] summary{margin-bottom:10px;}

/* ---------- ⏳ Laukia sąrašai (spalvos pagal public/js/topics.js -> color) ---------- */
:root{
  --t-shipped:#2E7A50;--t-shipped-soft:#E4F0E8;
  --t-ebay:#496C88;--t-ebay-soft:#E6EDF3;
  --t-ordering:#B0730F;--t-ordering-soft:#F4E7CC;
  --t-media:#6B4E9E;--t-media-soft:#EDE7F7;
  --t-payment:#B4442B;--t-payment-soft:#F7E4DC;
  --t-pin:#6B6153;--t-pin-soft:#EFE9DE;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --t-shipped:#54B889;--t-shipped-soft:#1B3527;--t-ebay:#88AAC8;--t-ebay-soft:#1E2A34;
  --t-ordering:#E0A63C;--t-ordering-soft:#3A2E18;--t-media:#B49BE0;--t-media-soft:#2A2338;
  --t-payment:#E27455;--t-payment-soft:#3A241C;--t-pin:#C4B9A7;--t-pin-soft:#2A241C;}}
:root[data-theme="dark"]{
  --t-shipped:#54B889;--t-shipped-soft:#1B3527;--t-ebay:#88AAC8;--t-ebay-soft:#1E2A34;
  --t-ordering:#E0A63C;--t-ordering-soft:#3A2E18;--t-media:#B49BE0;--t-media-soft:#2A2338;
  --t-payment:#E27455;--t-payment-soft:#3A241C;--t-pin:#C4B9A7;--t-pin-soft:#2A241C;}

/* kiekvienas sąrašas pasiima savo spalvą į --tc / --tcs, toliau visi elementai ima iš jų */
.t-shipped{--tc:var(--t-shipped);--tcs:var(--t-shipped-soft);}
.t-ebay{--tc:var(--t-ebay);--tcs:var(--t-ebay-soft);}
.t-ordering{--tc:var(--t-ordering);--tcs:var(--t-ordering-soft);}
.t-media{--tc:var(--t-media);--tcs:var(--t-media-soft);}
.t-payment{--tc:var(--t-payment);--tcs:var(--t-payment-soft);}
.t-pin{--tc:var(--t-pin);--tcs:var(--t-pin-soft);}
.tdot{width:9px;height:9px;border-radius:50%;background:var(--tc);flex:0 0 auto;}
.temo{margin-right:5px;font-style:normal;}
.newer-note{font-size:12px;color:var(--accent);background:var(--accent-soft);border-radius:8px;padding:6px 9px;margin-top:6px;}
.settled-note{font-size:12px;color:var(--ink-soft);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px 9px;margin-top:6px;}

/* grupė aplanke */
.tgroup{border:1px solid var(--line);border-left:3px solid var(--tc);border-radius:12px;background:var(--surface);
  box-shadow:var(--shadow);padding:0 0 10px;display:flex;flex-direction:column;gap:8px;overflow:hidden;}
.tgroup-h{display:flex;align-items:center;gap:9px;background:var(--tcs);padding:9px 14px;font-size:13px;color:var(--tc);}
.tgroup-h b{font-size:13.5px;white-space:nowrap;}
.tgroup-d{color:var(--ink-soft);font-size:12px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tgroup-n{font-family:var(--font-mono);font-size:11px;background:var(--surface);color:var(--tc);border-radius:20px;padding:2px 8px;flex:0 0 auto;}
.tgroup .row{margin:0 10px;width:auto;box-shadow:none;}

/* ženkleliai eilutėje */
.tpill{font-size:10px;font-weight:600;color:var(--tc);background:var(--tcs);border-radius:6px;padding:2px 6px;white-space:nowrap;flex:0 0 auto;}
.row-new{font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--accent);border-radius:6px;padding:2px 5px;white-space:nowrap;flex:0 0 auto;}

/* juosta ant atidarytos kortelės */
.topic-bar{display:flex;align-items:center;gap:8px;background:var(--tcs);color:var(--tc);font-size:12.5px;font-weight:600;padding:9px 18px;flex-wrap:wrap;}
.topic-bar .tb-d{color:var(--ink-soft);font-weight:400;}
.topic-bar .spacer{flex:1;}
.tb-btn{cursor:pointer;font-family:var(--font-ui);font-size:11.5px;color:var(--tc);background:var(--surface);border:1px solid var(--tc);border-radius:7px;padding:3px 9px;}
.tb-btn:hover{filter:brightness(.97);}

/* pasirinkimas langelyje */
.reason.topic{align-items:flex-start;gap:10px;border-left:3px solid var(--tc);}
.reason.topic .tlab{display:flex;flex-direction:column;gap:1px;flex:1;}
.reason.topic .tlab span{font-size:12px;color:var(--ink-soft);}
.reason.topic .tdot{margin-top:5px;}
.reason.topic input{margin-top:3px;}
.tsug{font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--tc);background:var(--tcs);border-radius:20px;padding:3px 7px;white-space:nowrap;}

/* Koliažo stilių pasirinkimas */
.bc-styles{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 4px;}
.bc-style{flex:0 0 auto;width:92px;padding:4px;background:var(--surface-2);border:2px solid var(--line);
  border-radius:9px;cursor:pointer;display:flex;flex-direction:column;gap:4px;align-items:center;}
.bc-style.on{border-color:var(--accent,#C9A227);}
.bc-style img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:5px;display:block;}
.bc-style span{font-size:10.5px;color:var(--ink-soft);text-align:center;line-height:1.2;}

/* ---------- Peržiūra prieš Zoko (2026-08-31) ----------
   Kortelė, kurioje Julija mato VISĄ broadcast'ą taip, kaip jį pamatys klientas,
   dar prieš tai, kai kas nors nukeliauja į Zoko. */
.bc-daily.review{border-color:var(--accent);}
.bc-pickrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:4px 0 6px;}
.bc-pickrow .bc-in{flex:1 1 180px;min-width:0;}
.bc-wa{background:var(--surface-2);border:1px solid var(--line-strong);border-radius:12px;
  padding:8px;margin:10px 0 6px;max-width:420px;}
.bc-wa-img{width:100%;border-radius:9px;display:block;}
.bc-wa-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;padding:10px 4px 4px;}
.bc-wa-btns{display:flex;flex-direction:column;gap:6px;margin-top:8px;border-top:1px solid var(--line);padding-top:8px;}
.bc-wabtn{text-align:center;font-size:13.5px;color:var(--en);background:var(--en-soft);
  border-radius:8px;padding:7px 10px;}
.bc-vars{margin:10px 0;}
.bc-vars summary{cursor:pointer;font-size:13px;color:var(--ink-soft);}


/* ---------- TELEFONAS: nieko nebeslenka į šoną ----------
   Buvo taip: antraštėje „Messages | Broadcast" netilpdavo (390 px ekrane puslapis
   išsitempdavo iki 549 px), tad Julijai tekdavo vedžioti ekraną pirmyn atgal.
   Priežastis: `.views` turėjo `width:100%; order:3`, bet pati antraštė NESIKĖLĖ į kitą
   eilutę (nebuvo flex-wrap), todėl vietoj nusileidimo žemyn ji tempdavo antraštę platyn. */
html, body { max-width: 100%; overflow-x: hidden; }
img, video { max-width: 100%; }
/* ilgos nuorodos žinutėse nebelaužia maketo */
.btext, .btr, .rtext, .rtr, .prevmsg, .bc-msg, .bc-kv div { overflow-wrap: anywhere; }

@media (max-width: 640px) {
  header.top { flex-wrap: wrap; gap: 9px; padding: 10px 13px; }
  .brand { order: 1; flex: 1 1 auto; min-width: 0; }
  .brand .name { font-size: 18px; }
  .brand .sub { display: none; }            /* „MESSAGES" po logotipu telefone nereikalingas */
  header.top .spacer { display: none; }
  .icon-btn { order: 2; }
  .views { order: 3; width: auto; flex: 1 1 auto; margin-left: 0; }
  .views .vbtn { flex: 1; }                 /* du mygtukai pasidalija eilutę per pusę */
  .count { order: 4; flex: 0 0 auto; white-space: nowrap; font-size: 11px; padding: 4px 10px; }
  .wrap { padding: 16px 12px 80px; }
  .card-in { padding: 14px 13px; }
  .flag-bar, .topic-bar { padding: 8px 13px; }
  .tgroup-h { padding: 8px 11px; }
  .tgroup-d { display: none; }              /* grupės paaiškinimas telefone tik trukdo */
  .tgroup .row { margin: 0 7px; }
  .bubble { max-width: 94%; }
  .actions .btn { flex: 1 1 auto; }         /* mygtukai per visą plotį, patogu nykščiui */
}

/* --- Plan: broadcast'ų lentelė. Kortelės, ne <table>: tikra lentelė 360-390 px
   ekrane ištemptų puslapį, o Julija dirba telefone (žr. CLAUDE.md). --- */
.camp-row{border-color:var(--line-strong);}
.camp-row.off{opacity:.55;}
.camp-head{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;}
.camp-head>div{min-width:0;flex:1;}
.camp-sw{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--ink-soft);
  cursor:pointer;flex:0 0 auto;user-select:none;}
.camp-sw input{width:auto;margin:0;cursor:pointer;}
.camp-sug{cursor:pointer;font-family:var(--font-mono);font-size:10.5px;margin:3px 4px 0 0;
  padding:3px 7px;border-radius:6px;background:var(--surface-2);color:var(--ink-soft);
  border:1px solid var(--line-strong);}
.camp-sug:hover{color:var(--accent);border-color:var(--accent);}
.camp-msg:empty{display:none;}
.camp-msg>div{margin-top:10px;}
.bc-var .camp-var{margin-top:6px;}