/* Shared visual polish for Lau OS and YLAUXI (loaded last by both shells).
   Same layouts and components; calmer depth, readable figures, designed
   empty states, gentle motion, and phone fixes. Many rules need !important
   because the screens carry inline styles; those get removed screen by
   screen, after which these can drop it. */
:root{
  --enh-ease:cubic-bezier(.22,1,.36,1);
  --enh-shadow:0 1px 2px rgba(110,95,82,.04),0 10px 28px rgba(110,95,82,.06);
  --enh-shadow-h:0 2px 4px rgba(110,95,82,.05),0 18px 40px rgba(110,95,82,.10);
}

/* page entrance */
.content>.view.act,.main>.view.act{animation:enhIn .42s var(--enh-ease) both}
@keyframes enhIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* breadcrumb: quiet, shows where you are */
#lau-breadcrumb{background:transparent !important;border-bottom:0 !important}
#lau-breadcrumb .bc-item,#lau-breadcrumb .bc-home{color:#6E5F52 !important}

/* buttons: press feedback and hover */
.btn,.tbtn,.dbtn,.hub-tab{transition:transform .14s var(--enh-ease),background .2s,border-color .2s,box-shadow .2s,color .2s !important}
.btn:active,.tbtn:active,.dbtn:active{transform:scale(.97)}
.btn.btn-out:hover{border-color:#A89880 !important;background:rgba(196,181,168,.08) !important}

/* cards: one radius, warm depth, gentle lift */
.card,.mc,.brc,.kpi,.dash-next-card,.dash-side-card,.dash-hero-card,.dash-stat-strip,.dash-forecast-card2,.dash-panel,.bd-card{
  border-radius:14px !important;border:1px solid rgba(10,10,10,.07) !important;box-shadow:var(--enh-shadow) !important;
  transition:transform .32s var(--enh-ease),box-shadow .32s var(--enh-ease)}
.mc:hover,.brc:hover,.dash-next-card:hover,.kpi:hover{transform:translateY(-2px);box-shadow:var(--enh-shadow-h) !important}

/* figures: editorial serif, ink, aligned digits */
.mv,.kpi .v,.kpi-val,.dash-hero-val{font-family:'Bodoni Moda',Didot,Georgia,serif !important;color:var(--text,#0A0A0A) !important;font-variant-numeric:tabular-nums;letter-spacing:0 !important}
.ml,.kpi-lbl{letter-spacing:.16em !important;color:#6E5F52 !important}
/* set by ylux-enhance.js on text that was taupe (fails contrast) */
.enh-muted{color:#6E5F52 !important}
.enh-ink{color:var(--text,#0A0A0A) !important}

/* tabs */
.hub-tabs{background:rgba(196,181,168,.14) !important}
.hub-tab.act{box-shadow:0 1px 3px rgba(110,95,82,.12) !important}

/* tables: calmer header, room, hover, aligned numbers */
.tbl th,.fn-tbl th{font-size:11px !important;letter-spacing:.14em !important;color:#6E5F52 !important;font-weight:500 !important;border-bottom:1px solid rgba(10,10,10,.08) !important}
.tbl td,.fn-tbl td{border-bottom:1px solid rgba(10,10,10,.06) !important;font-variant-numeric:tabular-nums}
.tbl tbody tr,.fn-tbl tbody tr{transition:background .15s}
.tbl tbody tr:hover,.fn-tbl tbody tr:hover{background:rgba(196,181,168,.08)}
.enh-tw{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* forms */
.fi{border-radius:10px !important;transition:border-color .2s,box-shadow .2s}
.fi:focus{border-color:#A89880 !important;box-shadow:0 0 0 3px rgba(196,181,168,.25) !important;outline:none}
:focus-visible{outline:2px solid #A89880;outline-offset:2px}

/* designed empty states (class added by ylux-enhance.js to plain "No … yet" lines) */
.enh-empty{display:flex !important;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;padding:34px 20px !important;margin:6px 0;border:1px dashed rgba(168,152,128,.55);border-radius:14px;background:linear-gradient(180deg,var(--bg2,#FFFFFF),var(--bg,#FAFAF8));color:#5C5854 !important;font-size:14px !important}
.enh-empty::before{content:"";width:38px;height:38px;border-radius:50%;border:1px solid #A89880;background:radial-gradient(circle,rgba(196,181,168,.35) 0 6px,transparent 7px)}

/* brand page number strip wraps instead of squeezing */
#bd-kpis,#ybd-kpis{display:grid !important;grid-template-columns:repeat(auto-fit,minmax(130px,1fr)) !important;gap:10px !important}

/* phone: tab rows scroll in one line */
@media (max-width:768px){
  .hub-tabs,.yxfinhub-tabs{overflow-x:auto;flex-wrap:nowrap !important;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .hub-tabs::-webkit-scrollbar,.yxfinhub-tabs::-webkit-scrollbar{display:none}
  .hub-tab,.yxfinhub-tabs button{flex:none}
}
@media (prefers-reduced-motion:reduce){
  .content>.view.act,.main>.view.act{animation:none}
  .card,.mc,.brc,.kpi,.btn,.tbtn{transition:none !important}
}

/* brand cards (ylux-shared.js yluxBrandCard): real figures, quiet attention note */
.brc-logo{max-height:32px;max-width:110px;object-fit:contain;display:block;margin-bottom:10px}
.brc-figs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0 10px;padding-top:12px;border-top:1px solid var(--border)}
.brc-figs>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.brc-l{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-m)}
.brc-v{font-family:var(--font-editorial);font-size:20px;line-height:1.1;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brc-attn{display:inline-flex;align-items:center;gap:7px;font-size:11px;letter-spacing:.06em;color:var(--text);border:1px solid var(--cap-d);border-radius:999px;padding:2px 10px;margin-bottom:10px}
.brc-attn i{width:6px;height:6px;border-radius:50%;background:var(--cap-d)}
.brc-go{font-size:11px;color:var(--text-m);text-align:right;letter-spacing:.08em;text-transform:uppercase}
.brc:focus-visible{outline:2px solid var(--cap-d);outline-offset:2px}
#brg .brc,#yx-brand-portfolio-card .brc{display:flex;flex-direction:column}
.brc .brc-go{margin-top:auto}
.brc .brc-attn{align-self:flex-start}

/* order photos + order drawer (ylux-shared.js yluxOrderThumb / yluxOrderDetail) */
.ylux-oth-wrap{display:inline-flex;align-items:center;gap:6px;vertical-align:middle}
.ylux-oth{flex:none;display:inline-block;width:40px;height:40px;border-radius:10px;overflow:hidden;background:var(--subtle);border:1px solid var(--border)}
.ylux-oth img{display:block;width:100%;height:100%;object-fit:cover}
.ylux-oth.is-empty{background:linear-gradient(135deg,var(--subtle),var(--cap-f))}
.ylux-oth-more{font-size:var(--fs-label);letter-spacing:.04em;color:var(--text-s);border:1px solid var(--border-s);border-radius:var(--r-pill);padding:1px 7px;font-variant-numeric:tabular-nums}
.ylux-oth-cell{width:1%;white-space:nowrap}
#yxord-table .ylux-oth-cell{padding:8px 14px}
.ylux-ord-row{cursor:pointer}
.ylux-ord-row:focus-visible{outline:2px solid var(--cap-d);outline-offset:-2px}
html.yod-open,html.yod-open body{overflow:hidden}
#ylux-yod{position:fixed;inset:0;z-index:var(--z-drawer)}
.yod-scrim{position:absolute;inset:0;background:rgba(110,95,82,.18)}
html.ylux-dark .yod-scrim{background:rgba(10,9,8,.55)}
.yod{position:absolute;top:0;right:0;bottom:0;width:min(460px,100%);display:flex;flex-direction:column;background:var(--bg);color:var(--text);border-left:1px solid var(--border);box-shadow:var(--sh-float);animation:yodIn var(--dur-base) var(--ease) both;outline:none}
@keyframes yodIn{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
.yod-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 24px 16px;border-bottom:1px solid var(--border);background:var(--bg2)}
.yod-eyebrow,.yod-lbl,.yod-st-l{font-size:var(--fs-label);letter-spacing:.16em;text-transform:uppercase;color:var(--text-m)}
.yod-title{font-size:var(--fs-lead);color:var(--text);margin-top:4px;font-variant-numeric:tabular-nums;word-break:break-all}
.yod-meta{font-size:var(--fs-meta);color:var(--text-s);margin-top:4px}
.yod-x{flex:none;width:36px;height:36px;border-radius:var(--r-pill);border:1px solid var(--border-s);background:transparent;color:var(--text);font-size:20px;line-height:1;cursor:pointer;font-family:inherit}
.yod-x:hover{border-color:var(--cap-d);background:var(--cap-f)}
.yod-body{flex:1;overflow-y:auto;padding:20px 24px;-webkit-overflow-scrolling:touch}
.yod-loading{font-size:var(--fs-small);color:var(--text-s);padding:24px 0}
.yod-sts{display:flex;flex-wrap:wrap;gap:12px 20px;margin-bottom:20px}
.yod-st{display:flex;flex-direction:column;gap:6px}
.yod-chip{display:inline-flex;align-items:center;gap:7px;font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;color:var(--text);border:1px solid var(--border-s);border-radius:var(--r-pill);padding:3px 10px}
.yod-chip i{width:7px;height:7px;border-radius:50%;box-sizing:border-box}
.yod-chip--done i{background:var(--cap-d)}
.yod-chip--open i{border:1.5px solid var(--cap-d);background:transparent}
.yod-chip--off i{width:9px;height:1.5px;border-radius:0;background:var(--text-m)}
.yod-chip--off{color:var(--text-s);border-style:dashed}
.yod-sec{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r-box);padding:16px;margin-bottom:12px}
.yod-sec .yod-lbl{margin-bottom:8px}
.yod-txt{font-size:var(--fs-ui);color:var(--text);line-height:1.5}
.yod-txt--m{font-size:var(--fs-meta);color:var(--text-s)}
.yod-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--fs-meta)}
.yod-link{color:var(--text);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--cap-d)}
.yod-lines{list-style:none;margin:0 0 8px;padding:0}
.yod-line{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.yod-line:last-child{border-bottom:0}
.yod-line--none{font-size:var(--fs-small);color:var(--text-s)}
.yod-line-main{flex:1;min-width:0}
.yod-line-nm{font-size:var(--fs-ui);color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.yod-line-sub{font-size:var(--fs-meta);color:var(--text-s);margin-top:2px}
.yod-line-amt,.yod-sum span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.yod-line-amt{font-size:var(--fs-ui)}
.yod-sum{display:flex;justify-content:space-between;font-size:var(--fs-small);color:var(--text-s);padding:4px 0}
.yod-sum--total{color:var(--text);font-size:var(--fs-ui);border-top:1px solid var(--border-s);margin-top:6px;padding-top:10px}
.yod-actions{display:flex;flex-wrap:wrap;gap:8px;padding:16px 24px;border-top:1px solid var(--border);background:var(--bg2)}
@media (max-width:767px){
  .yod{width:100%;border-left:0}
  .yod-hd,.yod-body,.yod-actions{padding-left:16px;padding-right:16px}
  .yod-actions{padding-bottom:max(16px,env(safe-area-inset-bottom))}
  .yod-actions .btn{flex:1 1 auto}
}
@media (prefers-reduced-motion:reduce){.yod{animation:none}}
/* brand cover image: edge-to-edge header of the card (the card clips it to its
   14px radius); a card without one is unchanged */
.brc.has-cover{padding-top:0}
.brc-cover{display:block;width:calc(100% + 40px);max-width:none;margin:0 -20px 16px;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-box) var(--r-box) 0 0;background:var(--subtle)}
/* cover image field (edit dialog + Add Brand, ylux-shared.js yluxBrandCoverField) */
.brcov{display:flex;flex-direction:column;gap:8px;width:100%;max-width:420px}
.brcov [hidden]{display:none !important}
.brcov-box{position:relative;aspect-ratio:16/9;border-radius:var(--r-box);overflow:hidden;background:var(--subtle);border:1px dashed var(--border-s);display:flex;align-items:center;justify-content:center}
.brcov-box.has-img{border-style:solid;border-color:var(--border)}
.brcov-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.brcov-box:not(.has-img) .brcov-img,.brcov-box.has-img .brcov-empty{display:none}
.brcov-empty{font-size:var(--fs-meta);line-height:1.6;color:var(--text-m);padding:0 16px;text-align:center}
.brcov-file{display:none}
.brcov-acts{display:flex;gap:8px;flex-wrap:wrap}
.brcov-acts .btn:focus-visible{outline:2px solid var(--cap-d);outline-offset:2px}
.brcov-acts .btn[disabled]{opacity:.6;cursor:progress}

/* client accounts (ylux-shared.js loadPortalClients) and their editor
   (partials/portal_client_modal.html): status by label and outline, not colour */
.pcl-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:.5px solid var(--border)}
.pcl-main{min-width:0}
.pcl-name{font-size:13px;color:var(--text)}
.pcl-co{color:var(--text-m)}
.pcl-meta{font-size:11px;color:var(--text-m);margin-top:4px}
.pcl-acts{display:flex;gap:8px;flex-shrink:0;flex-wrap:wrap}
.pcl-chip{display:inline-block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--text);border:1px solid var(--cap-d);border-radius:var(--r-pill);padding:1px 8px;margin-left:4px;vertical-align:1px}
.pcl-chip.off{color:var(--text-m);border-style:dashed}
.pcm-ov{display:none;position:fixed;inset:0;z-index:1000;background:rgba(10,9,8,.55);overflow-y:auto}
.pcm-ov.open{display:block}
.pcm-box{max-width:520px;margin:40px auto;background:var(--bg2);border:.5px solid var(--border-s);border-radius:var(--r-box);padding:36px}
.pcm-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
.pcm-title{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-m)}
.pcm-x{background:none;border:none;cursor:pointer;font-size:20px;color:var(--text-m)}
.pcm-grid{display:grid;gap:16px}
.pcm-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pcm-checks{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.pcm-check{display:flex;align-items:center;gap:4px;font-size:11px;cursor:pointer}
.pcm-check input{accent-color:var(--cap)}
.pcm-hint{color:var(--text-m);text-transform:none;letter-spacing:0}
.pcm-msg{font-size:11px;color:var(--crit);min-height:0}
.pcm-foot{display:flex;gap:12px;margin-top:28px;padding-top:20px;border-top:.5px solid var(--border);justify-content:flex-end}
@media (max-width:768px){
  .pcl-row{flex-direction:column;align-items:flex-start}
  .pcm-box{margin:16px;padding:24px}
  .pcm-2{grid-template-columns:1fr}
}

/* Lau OS's two prompt dialogs match YLAUXI's .modal: 14px box, warm overlay
   shadow, readable title (taupe text fails contrast on white) */
#lau-multi-overlay>div,#lau-input-overlay>div{border-radius:var(--r-box) !important;box-shadow:var(--sh-overlay)}
#lau-multi-title{color:var(--text-m) !important}

/* plan upgrade panel (ylux-entitlements.js) */
.ylux-upgrade{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r-box,14px);box-shadow:var(--sh-raised);padding:22px 24px;margin:0 0 20px;max-width:640px;animation:enhIn .42s var(--enh-ease) both}
.ylux-upgrade-eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-m);margin-bottom:8px}
.ylux-upgrade-title{font-family:var(--font-editorial,'Bodoni Moda',Georgia,serif);font-size:20px;line-height:1.3;color:var(--text);margin-bottom:6px}
.ylux-upgrade-text{color:var(--text-s);font-size:14px;margin:0 0 16px}
.ylux-upgrade-btn{display:inline-flex;align-items:center;min-height:40px;padding:0 22px;border-radius:999px;background:var(--cta,#C4B5A8);color:var(--cta-text,#0A0A0A);text-decoration:none;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.ylux-upgrade-btn:hover{background:var(--cta-hover,#A89880)}
.ylux-upgrade-btn:focus-visible{outline:2px solid var(--cap-d);outline-offset:2px}
.plan-payg-price{float:right;color:var(--text-m)}
.plan-payg-note{font-size:12px;color:var(--text-m);margin-top:8px}
.plan-addons{display:flex;flex-direction:column;gap:2px}
.plan-addon-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);font-size:13px;color:var(--text)}
.plan-addon-row:last-child{border-bottom:0}
.plan-addon-price{display:block;font-size:12px;color:var(--text-m);margin-top:2px}
.plan-addon-state{font-size:12px;color:var(--text-m)}
.plan-addons-owned{margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid var(--border-s)}

/* Ads Manager: connection cards + connect dialog (both apps) */
.ads-conn-card{border:1px solid var(--border);border-radius:var(--r-box,14px);padding:14px 16px;min-width:180px;background:var(--bg2)}
.ads-conn-card.is-on{border-color:var(--border-s)}
.ads-conn-name{font-size:13px;color:var(--text);margin-bottom:4px}
.ads-conn-state{font-size:12px;color:var(--text-m);margin-bottom:10px}
.ads-conn-note{font-size:12px;color:var(--text-m)}
.ads-connect-dialog{position:fixed;inset:0;margin:auto;height:fit-content;border:1px solid var(--border-s);border-radius:var(--r-box,14px);background:var(--bg2);color:var(--text);padding:0;width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto;box-shadow:var(--sh-raised)}
.ads-connect-dialog::backdrop{background:rgba(10,10,10,.42)}
.ads-connect-form{padding:26px 28px;display:flex;flex-direction:column;gap:12px}
.ads-connect-eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-m)}
.ads-connect-title{font-family:var(--font-editorial,'Bodoni Moda',Georgia,serif);font-weight:400;font-size:22px;margin:0}
.ads-connect-intro{font-size:13px;color:var(--text-s);margin:0 0 4px;line-height:1.55}
.ads-connect-help{font-size:11px;color:var(--text-m);margin-top:4px;line-height:1.45}
.ads-connect-err{font-size:12px;color:var(--text);border-left:2px solid var(--text);padding-left:10px;margin:0}
.ads-connect-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}
@media (max-width:560px){.ads-connect-form{padding:20px 18px}.ads-connect-actions .btn{flex:1}}

.plan-include-fee{display:flex;justify-content:space-between;gap:12px;margin-top:10px;padding-top:10px;border-top:1px solid var(--border);font-size:13px;color:var(--text)}
.plan-include-val{color:var(--text-m);font-variant-numeric:tabular-nums}

/* Platform Console (Lau OS → YLAÜXI Admin) */
.yl-nav-sep{height:1px;background:var(--border);margin:10px 14px}
.pc-muted{color:var(--text-m);font-size:12px}
.pc-strong{color:var(--text)}
.pc-num{font-variant-numeric:tabular-nums}
.pc-pad{padding:16px 20px}
.pc-note{margin-top:12px}
.pc-empty{padding:20px;color:var(--text-m);font-size:13px}
.pc-toolbar,.pc-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pc-toolbar{margin-bottom:16px}
.pc-grow{flex:1;min-width:180px}
.pc-wrap{flex-wrap:wrap}
.pc-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}
.pc-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:16px;align-items:start}
@media (max-width:900px){.pc-split{grid-template-columns:1fr}}
.pc-table{width:100%}
.pc-table td,.pc-table th{vertical-align:top}
.pc-click{cursor:pointer}
.pc-click:hover td,.pc-click:focus td{background:var(--faint,rgba(196,181,168,.08))}
.pc-click:focus{outline:2px solid var(--cap-d,#A89880);outline-offset:-2px}
.pc-cell-actions{white-space:nowrap;text-align:right}
.pc-pager{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-top:1px solid var(--border)}
.pc-pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:11px;letter-spacing:.04em;border:1px solid var(--border-s);color:var(--text-s)}
.pc-pill.is-good{border-color:var(--text-m);color:var(--text)}
.pc-pill.is-alert{border-color:var(--text);color:var(--text);font-weight:600}
.pc-pill.is-quiet{color:var(--text-m);border-style:dashed}
.pc-attn{display:flex;flex-direction:column}
.pc-attn-item{all:unset;cursor:pointer;padding:14px 20px;border-bottom:1px solid var(--border);font-size:14px;color:var(--text)}
.pc-attn-item:last-child{border-bottom:0}
.pc-attn-item:hover,.pc-attn-item:focus-visible{background:var(--faint,rgba(196,181,168,.08))}
.pc-attn-item strong{font-variant-numeric:tabular-nums;margin-right:4px}
.pc-drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100vw);background:var(--bg2,#fff);border-left:1px solid var(--border-s);box-shadow:var(--sh-raised,0 20px 60px rgba(10,10,10,.12));z-index:900;display:flex;flex-direction:column}
.pc-drawer-hd{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:22px 24px;border-bottom:1px solid var(--border)}
.pc-drawer-body{padding:20px 24px;overflow:auto;flex:1}
.pc-eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-m)}
.pc-d-name{font-family:var(--font-editorial,'Bodoni Moda',Georgia,serif);font-weight:400;font-size:22px;margin:6px 0 2px}
.pc-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;margin-bottom:18px}
.pc-fact div:last-child{font-size:13px;color:var(--text)}
.pc-actions{display:flex;flex-wrap:wrap;gap:8px;padding:14px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-bottom:6px}
.pc-danger{border-style:dashed}
.pc-sec{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-m);margin:20px 0 8px}
.pc-line,.pc-note-row{font-size:13px;padding:7px 0;border-bottom:1px solid var(--border)}
.pc-note-row{display:flex;justify-content:space-between;gap:12px}
.pc-bars{padding:12px 20px 18px}
.pc-bar{display:grid;grid-template-columns:90px 1fr 90px;gap:12px;align-items:center;font-size:13px;padding:6px 0}
.pc-bar .pc-num{text-align:right}
.pc-bar-track{height:6px;border-radius:999px;background:var(--faint,rgba(196,181,168,.12));overflow:hidden}
.pc-bar-fill{display:block;height:100%;background:var(--cap,#C4B5A8)}
.pc-thread-h{font-family:var(--font-editorial,'Bodoni Moda',Georgia,serif);font-weight:400;font-size:20px;margin:6px 0 4px}
.pc-msg{white-space:pre-wrap;font-size:14px;line-height:1.6;padding:14px 0;border-bottom:1px solid var(--border)}
.pc-msg.is-reply{padding-left:14px;border-left:2px solid var(--cap,#C4B5A8)}
.pc-reply{width:100%;margin:14px 0 10px;box-sizing:border-box}
.pc-log{max-height:420px;overflow:auto}
.pc-err{padding:10px 16px;border-bottom:1px solid var(--border);font-size:12px}
.pc-err pre{white-space:pre-wrap;font-size:11px;color:var(--text-s);margin:8px 0 0}
.pc-list-row{display:flex;justify-content:space-between;gap:12px;padding:12px 20px;border-top:1px solid var(--border)}
.pc-form .form-row textarea{width:100%;box-sizing:border-box}
@media (max-width:640px){.pc-facts{grid-template-columns:1fr}.pc-bar{grid-template-columns:70px 1fr 70px}}
/* YLAÜXI Admin on phones: the sidebar becomes a scrolling row of sections
   above the content instead of squeezing it. */
@media (max-width:760px){
  #v-ylauxi .ylauxi-admin-app{flex-direction:column !important;min-height:0}
  #v-ylauxi .yl-sidebar{position:static;width:100% !important;min-height:0;border-right:0;border-bottom:1px solid var(--border)}
  #v-ylauxi .yl-sidebar .yl-logo,#v-ylauxi .yla-sb-foot,#v-ylauxi .yl-nav-sep{display:none}
  #v-ylauxi .yl-nav{display:flex;overflow-x:auto;gap:4px;padding:8px;scrollbar-width:none}
  #v-ylauxi .yl-nav::-webkit-scrollbar{display:none}
  #v-ylauxi .yl-nav-item{white-space:nowrap;flex:0 0 auto;border-radius:999px}
  #v-ylauxi .yl-main{min-width:0}
  #v-ylauxi .yl-topbar{flex-wrap:wrap;gap:10px}
  #v-ylauxi .yl-card{overflow-x:auto}
  #v-ylauxi .kpi{padding:16px 18px;box-sizing:border-box}
  #v-ylauxi .kpi-val{font-size:28px;line-height:1.15}
}
.pc-kpi-date{font-size:.7em}

/* Shipping label rate picker (both apps) */
.ship-rates{display:flex;flex-direction:column;gap:6px;max-height:50vh;overflow:auto}
.ship-rate{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;padding:10px 12px;border:1px solid var(--border);border-radius:var(--r-box,14px);cursor:pointer}
.ship-rate:has(input:checked){border-color:var(--text)}
.ship-rate input{grid-row:span 2}
.ship-rate-name{font-size:13px;color:var(--text)}
.ship-rate-meta{font-size:12px;color:var(--text-m);font-variant-numeric:tabular-nums}

/* Text areas marked only .fi-ta had no styles (browser default: grey and
   monospace in dark mode). Same look as .fi fields; code boxes keep their
   inline monospace. */
textarea.fi-ta{width:100%;min-height:100px;resize:vertical;background:var(--bg2,#FFFFFF);color:var(--text,#0A0A0A);
  border:.5px solid var(--border-s,rgba(10,10,10,.14));border-radius:10px;padding:10px 12px;outline:none;
  font-family:var(--ylux-font-ui,'Sofia Sans Semi Condensed',system-ui,sans-serif);font-size:13px;line-height:1.5}
textarea.fi-ta:focus{border-color:#A89880;box-shadow:0 0 0 3px rgba(196,181,168,.25)}
textarea.fi-ta::placeholder{color:var(--text-m,#6E5F52);opacity:1}

/* file pickers: a taupe-outline pill instead of the browser's grey button */
input[type=file]{font-family:var(--ylux-font-ui,'Sofia Sans Semi Condensed',system-ui,sans-serif);font-size:12px;color:var(--text-s,#5C5854)}
input[type=file]::file-selector-button{font:inherit;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  margin-right:12px;padding:8px 16px;border-radius:999px;border:.5px solid #A89880;background:transparent;color:var(--text,#0A0A0A);cursor:pointer}
input[type=file]::file-selector-button:hover{background:rgba(196,181,168,.14)}

/* One empty state everywhere (approved pattern): dashed taupe 14px box, ring,
   a calm sentence-case title and an optional line. Inside a card it drops its
   own box so there's no card inside a card. */
.empty-state,.ylux-panel-empty,.card-empty{border:1px dashed rgba(168,152,128,.55) !important;border-radius:14px !important;background:transparent !important;
  padding:32px 20px !important;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.empty-state::before,.card-empty::before{content:"";width:34px;height:34px;border-radius:50%;border:1px solid #A89880;margin-bottom:6px;
  background:radial-gradient(circle,rgba(196,181,168,.35) 0 5px,transparent 6px)}
.empty-state .es-icon{display:none}
.empty-state .es-title,.ylux-panel-empty-title,.card-empty-title{font-family:var(--font-editorial,'Bodoni Moda',Georgia,serif) !important;font-size:17px !important;
  font-weight:400 !important;text-transform:none !important;letter-spacing:0 !important;color:var(--text,#0A0A0A) !important;margin:0 !important;line-height:1.3}
.empty-state .es-desc,.ylux-panel-empty-desc,.card-empty-sub{font-size:13px !important;color:var(--text-s,#5C5854) !important;max-width:40ch;line-height:1.5;margin:0 auto !important}
.empty-state .btn,.card-empty .btn{margin-top:10px}
:is(.card,.mc,.dash-panel,.bd-card,.pc-card) :is(.empty-state,.ylux-panel-empty,.card-empty,.enh-empty){border:0 !important;padding:20px 8px !important;background:transparent !important}

/* Range sliders: taupe, never the browser's black/blue. */
input[type=range]{accent-color:#A89880}

/* Phones: every sub-tab and chip row is one scrolling line (approved pattern,
   same as the hub tabs); desktop two/three-column layouts stack; wide tables
   scroll inside their card instead of being cut off. */
@media (max-width:768px){
  .view :is(.tabs,.todo-tab-bar,.fn-tab-bar,.lg-tabs,.soc-tab-bar,.ag-cat-tabs,.an-tabs,.cv-right-tabs,.ypt-tabs,.p-pills,.sc-tabs,
    .em-brand-tabs,.ag-view-tabs,.int-cats,.ag-pillar-tabs,.pf-order-tabs,.pill-track,.se-tabs,[id$="-tab-nav"],[id$="-tabs"],[role=tablist]){
    display:flex !important;flex-wrap:nowrap !important;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;max-width:100%}
  .view :is(.tabs,.todo-tab-bar,.fn-tab-bar,.lg-tabs,.soc-tab-bar,.ag-cat-tabs,.an-tabs,.cv-right-tabs,.ypt-tabs,.p-pills,.sc-tabs,
    .em-brand-tabs,.ag-view-tabs,.int-cats,.ag-pillar-tabs,.pf-order-tabs,.pill-track,.se-tabs,[id$="-tab-nav"],[id$="-tabs"],[role=tablist])::-webkit-scrollbar{display:none}
  .view :is(.tabs,.todo-tab-bar,.fn-tab-bar,.lg-tabs,.soc-tab-bar,.ag-cat-tabs,.an-tabs,.cv-right-tabs,.ypt-tabs,.p-pills,.sc-tabs,
    .em-brand-tabs,.ag-view-tabs,.int-cats,.ag-pillar-tabs,.pf-order-tabs,.pill-track,.se-tabs,[id$="-tab-nav"],[id$="-tabs"],[role=tablist])>*{flex:none !important;white-space:nowrap}
  /* a row that scrolls fades at its edge (class set by ylux-enhance.js) */
  .enh-scrolls{-webkit-mask-image:linear-gradient(90deg,#0A0A0A calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#0A0A0A calc(100% - 28px),transparent)}
  .enh-scrolls.enh-at-end{-webkit-mask-image:none;mask-image:none}

  /* desktop form/column grids written inline: one column (calendars, auto-fit
     grids and figure tiles keep theirs) */
  .view [style*="grid-template-columns"]:not([style*="repeat(7"]):not([style*="auto-fit"]):not([style*="auto-fill"]):not(:has(> .mc)):not(:has(> .kpi)):not(.deal-board){
    grid-template-columns:minmax(0,1fr) !important}
  /* figure tiles two to a row instead of a tall stack */
  .view :is(.mc-grid,.kpi-grid,.stat-grid),.view [style*="grid-template-columns"]:has(> .mc),.view [style*="grid-template-columns"]:has(> .kpi){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important}

  /* wide tables are wrapped in a scroller by ylux-enhance.js; keep headers on one line */
  .view th{white-space:nowrap}
  .view pre{white-space:pre-wrap;word-break:break-word;border-radius:14px}
}

/* Controls that kept square corners: buttons are pills, fields are 10px,
   like every other button and field. */
:is(.dbtn,.agc-run,.chat-send,.cv-generate-btn,.mkt-dbtn,.se-tab){border-radius:999px !important}
:is(.ag-search-inp,.ag-search,.chat-input,.cv-input,.view select,.view input[type=text],.view input[type=email],.view input[type=number],.view input[type=search],.view input[type=url],.view input[type=date],.view input[type=datetime-local]):not(.fi-ta){border-radius:10px !important}
/* analytics tabs: the same underline sub-tabs as the other screens */
.an-tab{border:0 !important;border-bottom:2px solid transparent !important;border-radius:0 !important;background:transparent !important}
.an-tab.act{border-bottom-color:var(--text,#0A0A0A) !important;color:var(--text,#0A0A0A) !important}

/* CANVAS on phones: the three desktop panes stack (categories as one
   scrolling chip row, then the canvas, then the create panel). */
@media (max-width:768px){
  #v-canvas,#v-yx-canvas{height:auto !important;overflow:visible !important}
  #v-canvas .cv-layout,#v-yx-canvas .cv-layout{flex-direction:column;overflow:visible;height:auto}
  #v-canvas .cv-left,#v-yx-canvas .cv-left,#v-canvas .cv-right,#v-yx-canvas .cv-right{width:auto;border:0;overflow:visible;background:transparent}
  #v-canvas .cv-cat-list,#v-yx-canvas .cv-cat-list{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;padding:8px 0;scrollbar-width:none}
  #v-canvas .cv-cat-list::-webkit-scrollbar,#v-yx-canvas .cv-cat-list::-webkit-scrollbar{display:none}
  #v-canvas .cv-cat,#v-yx-canvas .cv-cat{flex:none;white-space:nowrap;border:.5px solid var(--border-s,rgba(10,10,10,.14));border-radius:999px;padding:8px 14px;min-height:40px}
  #v-canvas .cv-center,#v-yx-canvas .cv-center{min-height:360px;border-radius:14px;margin:8px 0}
  #v-canvas .cv-right-body,#v-yx-canvas .cv-right-body{overflow:visible;padding:12px 0}
}

/* Brand home: the section label that repeats the selected tab is dropped,
   and large figures stay inside their tiles. */
:is(#bd-overview,#bd-commerce,#bd-finance,#bd-ops,#bd-settings)>.ylux-sec-lbl:first-child{display:none}
#bd-kpis .stat-v,#ybd-kpis .stat-v{white-space:nowrap;font-size:clamp(20px,1.9vw,30px) !important;overflow:hidden;text-overflow:ellipsis}

/* "Recommended for you" shortcut chips: icon beside the label, not above it */
.ylux-spot-link{display:inline-flex !important;align-items:center;gap:6px;min-height:40px}
.ylux-spot-link .ylux-ic{display:inline-block;flex:none}

/* Home on phones: Expenses and Net side by side under Revenue (was three
   full-width cards before anything else) */
@media (max-width:768px){
  .dash-side-stack{flex-direction:row !important}
  .dash-side-card{padding:16px 18px !important;min-width:0}
  .dash-hero-card{padding:22px 20px !important}
}

/* a section/card label that only repeats the selected tab (ylux-enhance.js) */
.enh-dup-lbl{display:none !important}

/* large figures set in the UI face elsewhere (ylux-enhance.js) */
.enh-fig{font-family:'Bodoni Moda',Didot,Georgia,serif !important;font-weight:400 !important;font-variant-numeric:tabular-nums;letter-spacing:0 !important}

/* Calendar legend: the dot rule reset each type's outline to transparent, so
   the outlined types were near-invisible. Same fills, outlines restored. */
.cal-leg-dot{width:12px !important;height:12px !important;border-width:1px !important;border-style:solid !important}
.cal-leg-dot.cal-ev--campaign{border-color:#A89880 !important}
.cal-leg-dot.cal-ev--event{border-color:#C4B5A8 !important}
.cal-leg-dot.cal-ev--deadline{border-color:#A89880 !important}
.cal-leg-dot.cal-ev--legal{border-color:var(--text-m,#6E5F52) !important;border-style:dashed !important}
.cal-leg-dot.cal-ev--social,.cal-leg-dot.cal-ev--email{border-color:#C4B5A8 !important}
.cal-leg-dot.cal-ev--general{border-color:var(--text-m,#6E5F52) !important}

/* Embedded admin screens (Lau OS Sales, YLAÜXI): no big page titles (the
   breadcrumb and tabs say where you are); figures regular weight like everywhere. */
:is(#v-sales,#v-ylauxi) .page-title{font-family:var(--ylux-font-display,'Sofia Sans Semi Condensed',sans-serif) !important;font-size:11px !important;
  letter-spacing:.16em !important;text-transform:uppercase;font-weight:400 !important;color:var(--text-m,#6E5F52) !important;margin-bottom:12px}
.kpi-val{font-weight:400 !important}

/* Section-header actions ("+ Add content", "Refresh →") were bare taupe text
   with no padding: low contrast and a tiny tap target. Same small outline
   pill as the other secondary buttons. */
.sec-act{display:inline-flex !important;align-items:center;gap:4px;min-height:32px;padding:0 14px !important;border:.5px solid #A89880 !important;
  border-radius:999px !important;color:var(--text,#0A0A0A) !important;background:transparent !important;font-size:11px !important;letter-spacing:.1em !important;
  text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:background .2s}
.sec-act:hover{background:rgba(196,181,168,.14) !important}
@media (max-width:768px){.sec-act{min-height:44px}}

/* CONCIERGE: the "Ask me anything" prompt goes once a conversation is showing */
#concierge-messages .cc-empty:not(:only-child){display:none}

/* ── Sidebar, both apps: collapsed it is a rail of icons; open (hovered
   on desktop, or the phone drawer) it shows the labels alone. */
#lau-sidebar:hover .ni .nd,
#yx-sidebar:hover .ni .nd{display:none}
@media (max-width:768px){
  #lau-sidebar .ni .nd,
  #yx-sidebar .ni .nd{display:none}
}

/* order drawer: progress line */
.yod-prog{list-style:none;margin:0 0 20px;padding:0;display:flex;align-items:center}
.yod-prog li{display:flex;align-items:center;gap:7px;font-size:var(--fs-meta);color:var(--text-s);flex:1}
.yod-prog li:last-child{flex:0 0 auto}
.yod-prog li i{width:9px;height:9px;border-radius:50%;border:1.3px solid var(--text-m);flex:none}
.yod-prog li.is-done{color:var(--text)}
.yod-prog li.is-done i{background:var(--text-m)}
.yod-prog li:not(:last-child)::after{content:"";flex:1;height:1px;background:var(--border-s);margin:0 10px}
.yod-prog li.is-done:not(:last-child)::after{background:var(--cap-d)}

/* customer messages inbox (both apps): list | thread */
.cmsg-wrap{display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);gap:0;border:.5px solid var(--border);border-radius:var(--r-box);overflow:hidden;min-height:440px;background:var(--bg2)}
#cmsg-list{border-right:.5px solid var(--border);overflow-y:auto;max-height:560px}
.cmsg-it{display:flex;gap:12px;align-items:flex-start;width:100%;text-align:left;padding:12px 16px;border:0;border-bottom:.5px solid var(--border);background:transparent;cursor:pointer;font-family:var(--font-ui);color:var(--text);transition:background var(--dur-quick)}
.cmsg-it:hover{background:var(--faint)}
.cmsg-it.is-on{background:var(--cap-f)}
.cmsg-av{width:34px;height:34px;flex:none;border-radius:50%;background:var(--cap-fb);display:flex;align-items:center;justify-content:center;font-family:var(--font-editorial);font-size:14px;color:var(--text)}
.cmsg-it-w{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.cmsg-it-top{display:flex;justify-content:space-between;gap:8px;font-size:var(--fs-small)}
.cmsg-it-nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmsg-it-ch{font-size:var(--fs-label);letter-spacing:.08em;color:var(--text-m);flex:none}
.cmsg-it-sn{font-size:var(--fs-meta);color:var(--text-s);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:6px}
.cmsg-dot{width:7px;height:7px;flex:none;border-radius:50%;border:1.3px solid var(--text-m)}
.cmsg-it.is-new .cmsg-it-nm{font-weight:500}
#cmsg-thread{display:flex;flex-direction:column;min-width:0;padding:16px 20px;gap:12px}
.cmsg-hd{display:flex;align-items:center;gap:12px;padding-bottom:12px;border-bottom:.5px solid var(--border)}
.cmsg-hd-t{flex:1;min-width:0;display:flex;flex-direction:column}
.cmsg-hd-nm{font-family:var(--font-editorial);font-size:17px;color:var(--text)}
.cmsg-hd-ch{font-size:var(--fs-meta);color:var(--text-m)}
.cmsg-msgs{flex:1;overflow-y:auto;max-height:420px;display:flex;flex-direction:column;gap:8px;padding:4px 2px}
.cmsg-b{max-width:74%;padding:10px 14px;border-radius:14px;font-size:var(--fs-small);line-height:1.5;color:var(--text);animation:cmsgIn var(--dur-base) var(--ease) both}
.cmsg-b.is-in{background:var(--subtle);border-bottom-left-radius:4px;align-self:flex-start}
.cmsg-b.is-out{background:var(--cap-f);border:.5px solid var(--cap-fb);border-bottom-right-radius:4px;align-self:flex-end}
.cmsg-b-who{display:block;font-size:var(--fs-label);letter-spacing:.06em;color:var(--text-m);margin-bottom:2px}
@keyframes cmsgIn{from{opacity:0;transform:translateY(6px)}}
.cmsg-send{display:flex;gap:8px;align-items:center}
.cmsg-send .fi{flex:1;border-radius:var(--r-pill)}
.cmsg-empty{font-size:var(--fs-small);color:var(--text-s);padding:16px}
.cmsg-pick{margin:auto;text-align:center;max-width:32ch}
@media (max-width:767px){.cmsg-wrap{grid-template-columns:1fr}#cmsg-list{border-right:0;max-height:300px}.cmsg-b{max-width:88%}}
@media (prefers-reduced-motion:reduce){.cmsg-b{animation:none}}

/* agent studio cards (both apps) */
.ag-card,.ag-task{border:.5px solid var(--border);border-radius:var(--r-box);padding:14px 16px;margin-bottom:10px;background:var(--bg2);transition:box-shadow var(--dur-base) var(--ease)}
.ag-card:hover,.ag-task:hover{box-shadow:var(--sh-raised)}
.ag-task.is-waiting{border-color:var(--cap-d);background:linear-gradient(180deg,var(--cap-f),var(--bg2) 60%)}
.ag-hd{display:flex;align-items:center;gap:12px}
.ag-hd-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ag-mono{width:36px;height:36px;flex:none;border-radius:10px;background:var(--subtle);display:flex;align-items:center;justify-content:center;font-family:var(--font-editorial);font-size:16px;color:var(--text)}
.ag-nm{font-family:var(--font-editorial);font-size:17px;color:var(--text)}
.ag-goal{font-size:var(--fs-ui);color:var(--text)}
.ag-meta{font-size:var(--fs-meta);color:var(--text-s)}
.ag-st{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-meta);color:var(--text-s)}
.ag-st::before{content:"";width:8px;height:8px;border-radius:50%;border:1.3px solid var(--text-m)}
.ag-st.is-on::before{background:var(--text-m)}
.ag-brief{font-size:var(--fs-small);color:var(--text-s);margin-top:8px;line-height:1.55}
.ag-ask{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.ag-ask .fi{flex:1;min-width:180px}
.ag-out{font-size:var(--fs-small);line-height:1.6;white-space:pre-wrap;margin-top:8px;color:var(--text)}
.ag-out:empty{display:none}
.ag-steps{margin:10px 0 0 48px;border-left:1px solid var(--border-s);padding-left:12px;display:flex;flex-direction:column;gap:4px;font-size:var(--fs-meta);color:var(--text-s)}
.ag-q{margin-top:10px;font-size:var(--fs-small);color:var(--text)}
.ag-q-l{display:block;font-size:var(--fs-label);letter-spacing:.16em;text-transform:uppercase;color:var(--text-m);margin-bottom:2px}
.ag-cancel{margin-top:10px}
.ag-ring{width:34px;height:34px;flex:none;transform:rotate(-90deg)}
.ag-ring circle{fill:none;stroke-width:2}
.ag-ring-bg{stroke:var(--cap-fb)}
.ag-ring-fg{stroke:var(--cap-d);stroke-linecap:round;transition:stroke-dashoffset .6s var(--ease)}
.ag-ring.is-run{animation:agPulse 2.4s ease-in-out infinite}
@keyframes agPulse{50%{opacity:.6}}
@media (prefers-reduced-motion:reduce){.ag-ring.is-run{animation:none}}