/* ================================================================ Sadid — light design (Dentech 360) */
:root{
  --bg:#F0F7FE; --card:#FFFFFF; --card2:#F5FAFF; --line:#DDEBFA; --line2:#C8DDF6;
  --text:#0B2A6B; --muted:#6E83A6; --soft:#2D4E95; --dim:#8DA2C2;
  --gold:#0A74F0; --gold-hi:#2D8DFA; --gold-bg:#E8F2FE; --teal:#0DB89B; --teal-bg:#E3F8F3; --coral:#FD5F3A; --red:#E0413A; --red-bg:#FDEEEC;
  --navy:#0A3B78;
  --r-lg:16px; --r-md:12px; --rail:96px; --top-h:90px;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);-webkit-text-size-adjust:100%}
body{font-family:Tahoma,'Segoe UI',Arial,sans-serif;font-size:14px;line-height:1.6}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
[hidden]{display:none !important}
h1,h2,h3,p{margin:0}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.num{font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}
.mono{font-family:ui-monospace,Consolas,monospace;direction:ltr;unicode-bidi:isolate}
.muted{color:var(--muted)}
.label{font-size:12px;color:var(--muted)}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--teal);flex:0 0 9px}
.gold{background:linear-gradient(160deg,#1E88F7,#0A6BE0) !important;color:#fff !important;border-color:var(--gold) !important}
.gold:hover{background:#0662CF !important}
.panel,.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:0 4px 18px rgba(10,116,240,.02)}

/* logo — editable wordmark */
.sadid-logo{font-family:Tahoma,Arial,sans-serif;font-weight:700;color:#0662CF;background:linear-gradient(180deg,#1E88F7,#0450A8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:inline-block;line-height:1.7;font-size:29px;white-space:nowrap}
.vowel{color:var(--coral);-webkit-text-fill-color:var(--coral)}
.brand-mark{display:flex;gap:4px;margin-bottom:2px}.brand-mark i{width:11px;height:11px;border-radius:3px;background:var(--coral)}.brand-mark i+i{background:var(--gold)}
.settings{margin-top:auto;border:0;border-top:1px solid var(--line);background:transparent;padding:14px 2px 4px;width:100%;color:#2D4E95;font-size:12px;display:flex;flex-direction:column;align-items:center;gap:6px}.settings svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.settings:hover{color:var(--gold)}

/* rail */
.rail{position:fixed;right:0;top:0;bottom:0;width:var(--rail);border-left:1px solid var(--line);background:#fff;display:flex;flex-direction:column;align-items:center;gap:22px;padding:18px 8px;z-index:20}
.brand{display:flex;flex-direction:column;align-items:center;text-align:center;line-height:1.25;padding:2px 0}
.brand small{display:block;font:700 8px Arial,sans-serif;letter-spacing:1px;color:var(--gold);margin-top:4px}
.nav{display:grid;gap:14px;width:100%;margin-top:10px}
.nav button{border:0;border-radius:12px;background:transparent;padding:10px 2px;color:#2D4E95;font-size:12px;display:flex;flex-direction:column;align-items:center;gap:6px}
.nav button svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.nav button:hover{background:var(--gold-bg)}
.nav button.active{color:var(--gold);background:var(--gold-bg)}

/* shell */
.shell{margin-right:var(--rail);min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
.top{min-height:var(--top-h);border-bottom:1px solid var(--line);background:rgba(255,255,255,.85);padding:14px 28px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.top h1{font-size:24px;font-weight:700}
.top-meta{display:flex;gap:22px;align-items:center;font-size:12px}
.fresh{display:flex;align-items:center;gap:8px;line-height:1.5;color:var(--muted)}
.fresh.bad .dot{background:var(--red)}.fresh.wait .dot{background:var(--dim)}
.date-chip{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#fff;border-radius:30px;padding:11px 20px;font-size:13px;color:var(--text)}
.date-chip svg{color:var(--gold)}
.date-chip:hover{border-color:#9CC6F7;background:var(--gold-bg)}
.layout{flex:1;min-height:0;display:grid;grid-template-columns:minmax(320px,min(31%,470px)) minmax(0,1fr);gap:18px;padding:20px 24px;width:100%;max-width:1840px;margin:0 auto}

/* ================================================================ assistant panel */
.avatar-panel{position:relative;padding:16px 12px 18px;display:flex;flex-direction:column;align-items:stretch;min-width:0}
.end-btn{position:absolute;top:12px;left:12px;z-index:3}
.icon-btn{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.icon-btn:hover:not(:disabled){border-color:var(--red);color:var(--red);background:var(--red-bg)}
.icon-btn:disabled{opacity:0;pointer-events:none}
.avatar-header{text-align:center;margin-bottom:10px}
.avatar-header .sadid-logo{font-size:52px;line-height:1.45}
.brand-subtitle{font-size:13px;color:var(--soft)}
.status{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:4px;color:var(--teal);font-size:12px}
.speaking .status{color:var(--gold)}.speaking .status .dot{background:var(--gold)}
.listening .status .dot{background:var(--coral);animation:blink 1s infinite}
.thinking .status{color:var(--soft)}.thinking .status .dot{background:var(--soft);animation:blink 1s infinite}
.muted-state .status{color:var(--dim)}.muted-state .status .dot{background:var(--dim)}
.live{color:var(--coral)}
@keyframes blink{50%{opacity:.3}}

/* the oval: navy top, white bottom */
.oval-wrap{display:flex;justify-content:center;min-width:0}
.avatar-oval{width:100%;aspect-ratio:.7;position:relative;border:2px solid #CFE3FB;border-radius:50%;background:linear-gradient(to bottom,#0C3F82 0%,#1659B4 34%,#F3F7FC 64%,#fff 78%,#fff 100%);padding:15px 7px 34px;overflow:hidden;display:flex;flex-direction:column;align-items:center;box-shadow:0 0 0 6px #EAF3FE,0 0 0 7px #DCEBFC,0 12px 34px rgba(10,116,240,.14)}
.figbox{position:relative;width:calc(100% + 14px);margin:-15px -7px -40px;overflow:hidden;pointer-events:none;flex:1 1 0;min-height:140px;container-type:size;
  -webkit-mask-image:linear-gradient(#000 66%,transparent 100%);mask-image:linear-gradient(#000 64%,transparent 98%)}
.figure{position:absolute;top:0;left:50%;transform:translateX(-50%);aspect-ratio:1122/1402;width:min(100%,calc(100cqh * 1.12));
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%)}
.figure img{position:absolute;display:block;pointer-events:none;user-select:none;-webkit-user-drag:none}
.av-base{inset:0;width:100%;height:100%}
.av-eye,.av-gaze{left:35.2%;top:23.54%;width:31.19%;height:8.56%;opacity:0}
.av-gaze{transition:opacity .16s ease-in-out}
.av-mouth{left:35.65%;top:33.52%;width:28.70%;height:17.97%;opacity:0;transition:opacity 110ms ease-in-out}

.wave{position:relative;z-index:2;width:76%;height:76px;flex-shrink:0;display:flex;justify-content:center;align-items:center;gap:3px;margin-top:2px}
.wave i{width:3px;border-radius:4px;background:var(--gold);height:var(--h);opacity:.9;transform-origin:center;transform:scaleY(.35);transition:transform 90ms linear}
.wave i{background:linear-gradient(#2D8DFA,#0A6BE0)}
.wave i:nth-child(n+13):nth-child(-n+27):nth-child(3n+1){background:linear-gradient(#FF7A55,#F04A25)}
.listening .wave i{background:var(--teal)}
.avatar-question{position:relative;z-index:2;flex:0 0 auto;width:80%;height:40px;white-space:nowrap;text-overflow:ellipsis;display:flex;align-items:center;justify-content:center;text-align:center;font-size:22px;font-weight:700;color:var(--text);margin:2px 0 4px;line-height:1.45;overflow:hidden}
.avatar-question.long{font-size:14.5px;font-weight:400;line-height:1.75;color:var(--soft);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding-top:4px}
.avatar-question .you{color:var(--gold)}
.avatar-oval .bubble{display:none !important}
.bubble{position:relative;z-index:2;flex:0 0 auto;height:26px;line-height:15px;align-self:center;background:#EAF3FE;color:#2D4E95;border:1px solid #D8E8FB;border-radius:16px 16px 4px 16px;font-size:11.5px;padding:5px 12px;margin:0;max-width:84%;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.controls{position:relative;z-index:2;flex:0 0 auto;display:flex;justify-content:center;align-items:center;gap:13px;margin:12px 0 0}
.round{width:52px;height:52px;border-radius:50%;border:1px solid #D8E8FB;background:#fff;box-shadow:0 4px 12px rgba(10,116,240,.08);display:flex;align-items:center;justify-content:center;color:var(--text)}
.round:hover{background:var(--gold-bg);border-color:#9CC6F7}
.round[aria-pressed="true"]{border-color:var(--coral);color:var(--coral)}
#soundBtn .snd-off{display:none}#soundBtn[aria-pressed="true"] .snd-on{display:none}#soundBtn[aria-pressed="true"] .snd-off{display:block}
.orb-wrap{position:relative;width:74px;height:74px}
.round.mic{position:relative;z-index:1;width:74px;height:74px;border:0;background:linear-gradient(160deg,#2D95FF,#0069E8);color:#fff;box-shadow:0 0 0 6px rgba(10,116,240,.10),0 10px 24px rgba(10,116,240,.35)}
.round.mic svg{width:30px;height:30px}
.round.mic:hover{background:linear-gradient(160deg,#1E88F7,#005ACF);color:#fff}
.round.mic .ic-stop{display:none}
.speaking .round.mic{background:var(--coral);box-shadow:0 5px 14px rgba(242,116,71,.25)}
.speaking .round.mic .ic-mic{display:none}.speaking .round.mic .ic-stop{display:block}
.round.mic.muted{background:#A9C2E2;box-shadow:none}
.orb-ring{position:absolute;inset:-6px;border-radius:50%;opacity:0;pointer-events:none;background:conic-gradient(from 0deg,var(--gold),rgba(10,116,240,0) 40%,var(--coral) 70%,rgba(242,116,71,0) 90%,var(--gold));
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px))}
@keyframes spin{to{transform:rotate(360deg)}}
.listening .orb-ring{opacity:1;animation:spin 3s linear infinite}
.mic-hint{position:relative;z-index:2;flex:0 0 auto;height:17px;max-width:70%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center;font-size:11px;color:var(--muted);margin-top:6px}
.ask{display:flex;align-items:center;border:1px solid #D6E8FC;border-radius:30px;padding:6px 10px;gap:6px;background:#fff;margin-top:12px}
.ask input{flex:1;min-width:0;background:none;border:0;color:var(--text);padding:6px;outline:none;font-size:14px}
.ask input::placeholder{color:#8EA2C2}
.ask-send{border:0;background:transparent;color:var(--gold);width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.ask-send:hover{background:var(--gold-bg)}
.chips{display:flex;gap:7px;margin-top:14px}
.chips button{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;font-size:11.5px;padding:10px 6px;border:1px solid #DCEBFC;border-radius:12px;background:#F3F7FC;color:#2D4E95;white-space:nowrap}
.chips button:hover{background:#E2EFFE;border-color:#9CC6F7}

/* ================================================================ analysis column */
.analysis{min-width:0;display:flex;flex-direction:column;gap:14px}
.section-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:2px}
.section-title h2{font-size:22px;font-weight:700}
.section-title .muted{font-size:13px}
.answer{display:flex;flex-direction:column;gap:14px;padding-bottom:12px;border-bottom:1px dashed var(--line2)}
.dash{display:flex;flex-direction:column;gap:14px}
.kpis4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.kcard{padding:16px 18px;min-height:165px;border-radius:12px;display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.kcard.primary{border-color:#BFDBFA;background:#F3F9FF}
.kc-top{width:100%;display:flex;justify-content:space-between}
.iconbox{display:flex;background:var(--gold-bg);border-radius:10px;width:40px;height:40px;align-items:center;justify-content:center;color:var(--gold);margin-bottom:5px}
.iconbox svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.value{display:block;font-size:clamp(21px,2.3vw,38px);font-weight:800;letter-spacing:-.01em;line-height:1.4;color:var(--text)}
.kcard p{color:var(--muted);font-size:13px}
.change{display:block;margin-top:5px;font-size:13px;font-weight:700}
.change.up{color:var(--teal)}.change.down{color:var(--red)}
.chart-panel{padding:16px 20px 10px}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.panel-head h3{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:700}
.segments{border:1px solid var(--line);background:#F2F8FF;border-radius:12px;padding:3px;display:flex}
.segments button{border:0;background:transparent;border-radius:9px;padding:4px 20px;font-size:12px;color:var(--text)}
.segments button.active{background:var(--gold);color:#fff}
.trend{min-height:220px}
.trend svg{width:100%;display:block;direction:ltr;overflow:visible}
.trend text{font:12px Tahoma,Arial,sans-serif;fill:var(--muted)}
.trend text.ar{font-family:Tahoma,Arial,sans-serif}
.skeleton{height:210px;border-radius:12px;background:linear-gradient(90deg,#EAF2FC,#F7FBFF,#EAF2FC);background-size:200% 100%;animation:sk 1.4s linear infinite}
@keyframes sk{to{background-position:-200% 0}}
.insight{padding:16px 20px;border-color:#D6E8FC;background:#F3F7FC;display:flex;gap:18px;align-items:center;justify-content:space-between}
.insight h3 .spark{color:var(--coral)}
.insight h3{color:var(--gold);font-size:17px;margin-bottom:3px}
.insight p{font-size:13.5px;line-height:1.85;color:var(--text)}
.insight-actions{display:flex;gap:8px;flex-shrink:0}
.insight-actions button{font-size:12px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px 16px;color:var(--text)}
.insight-actions button:hover{background:var(--gold-bg);border-color:#9CC6F7}
.bottom{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.table-panel{padding:16px;min-width:0}
.table-panel h3{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:700;margin-bottom:12px}
.table-panel table{width:100%;border-collapse:collapse;text-align:right;font-size:12px}
.table-panel th{color:var(--muted);font-weight:400}
.table-panel td,.table-panel th{padding:8px 3px;border-bottom:1px solid #E6EFFA}
.table-panel tr:last-child td{border:0}
.table-panel td.name{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pbar{display:flex;align-items:center;gap:8px}
.pbar .bar{flex:1;height:7px;border-radius:8px;background:#E2EFFC;min-width:50px}
.pbar .bar span{display:block;height:100%;border-radius:8px;background:var(--gold);width:0;transition:width .9s cubic-bezier(.2,.7,.2,1)}
.pbar .num{color:var(--muted);min-width:42px;text-align:left}

/* modal + toast */
.modal{position:fixed;inset:0;z-index:40;background:rgba(11,42,107,.45);display:flex;align-items:center;justify-content:center;padding:16px}
.modal-card{width:min(380px,100%);padding:24px;display:flex;flex-direction:column;gap:12px}
.modal-title{font-size:18px;font-weight:700;color:var(--text)}
.modal-card input{height:48px;padding:0 14px;border-radius:12px;border:1px solid var(--line2);background:#fff;color:var(--text);font-size:16px}
.modal-card button{height:48px;border-radius:12px;border:0}
.toast{position:fixed;bottom:22px;left:22px;z-index:40;max-width:min(520px,90vw);padding:14px 20px;border-radius:12px;background:#fff;color:var(--text);border:1px solid #9CC6F7;box-shadow:0 8px 30px rgba(11,42,107,.12);font-size:14px}

/* ================================================================ desktop: one screen, analysis scrolls, presenter fills the height */
@media (min-width:1100px){
  .shell{height:100vh;height:100dvh;overflow:hidden}
  .layout{overflow:hidden}
  .avatar-panel{min-height:0;overflow:hidden}
  .oval-wrap{flex:1 1 auto;min-height:0;container-type:size}
  .avatar-oval{aspect-ratio:auto;height:100cqh;width:min(100cqw,calc(100cqh * .72))}
  .analysis{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-left:4px;scrollbar-width:thin;scrollbar-color:#C8DDF6 transparent}
}
@media (min-width:1650px){ .kcard{min-height:185px} }
@media (max-width:1349px) and (min-width:1100px){ .kcard{min-height:0;padding:12px 14px} .value{font-size:clamp(18px,1.9vw,26px)} .iconbox{width:34px;height:34px} .kcard p,.change{font-size:12px} .layout{grid-template-columns:minmax(300px,30%) minmax(0,1fr)} }
@media (min-width:1100px) and (max-height:900px){
  .top{min-height:72px;padding:10px 24px}.top h1{font-size:21px}
  .layout{padding:14px 18px;gap:14px}
  .avatar-header{margin-bottom:6px}.avatar-header .sadid-logo{font-size:40px;line-height:1.35}
  .wave{height:58px}.avatar-question{font-size:19px;height:36px}
  .controls{margin-top:8px}.round{width:46px;height:46px}.orb-wrap,.round.mic{width:64px;height:64px}
  .mic-hint{display:none}.ask{margin-top:10px;padding:4px 10px}.chips{margin-top:10px}.chips button{padding:8px 6px}
  .kcard{min-height:0}
}
@media (min-width:1100px) and (max-height:720px){
  .brand-subtitle{display:none}.avatar-header .sadid-logo{font-size:34px}
}

/* ================================================================ tablet */
@media (max-width:1099px){
  .layout{grid-template-columns:minmax(0,1fr);padding:16px}
  .avatar-panel{width:100%;max-width:460px;justify-self:center}
  .kpis4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bottom{grid-template-columns:1fr}
  .insight{flex-direction:column;align-items:stretch}
  .insight-actions{flex-wrap:wrap}
  .top-meta .fresh{display:none}
  .value{font-size:28px}
}
@media (max-width:1099px) and (min-width:801px){
  /* side-by-side: presenter on the right, analysis beside it */
  .layout{grid-template-columns:350px minmax(0,1fr)}
  .mic-hint{display:none}
  .avatar-panel{align-self:start;position:sticky;top:16px}
  .avatar-header .sadid-logo{font-size:46px}
  .avatar-question{font-size:20px}
  .brand-subtitle{font-size:12px}
}
@media (max-width:800px){
  :root{--rail:65px}
  .brand .sadid-logo{font-size:22px}.brand small{font-size:7px}
  .nav button{font-size:10px}
  .top{padding:14px 16px;flex-direction:column;align-items:stretch;gap:10px}
  .top h1{font-size:19px}
  .top-meta{justify-content:flex-start}
  .section-title{align-items:flex-start;flex-direction:column;gap:2px}
  .chart-panel{padding:12px}
  .kcard{min-height:0;padding:14px}
  .change .muted{display:none}
}

/* ================================================================ phone: rail becomes a bottom tab bar */
@media (max-width:600px){
  :root{--rail:0px}
  .rail{top:auto;left:0;width:auto;height:calc(64px + env(safe-area-inset-bottom));padding:0 4px env(safe-area-inset-bottom);flex-direction:row;border-left:0;border-top:1px solid var(--line);box-shadow:0 -4px 18px rgba(11,42,107,.06)}
  .brand,.settings{display:none}
  .nav{grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;margin:0;align-self:center}
  .nav button{padding:6px 0;font-size:10.5px;gap:3px}.nav button svg{width:22px;height:22px}
  .shell{margin-right:0;padding-bottom:calc(70px + env(safe-area-inset-bottom))}
  .top{padding:12px 14px}
  .top h1{font-size:18px}
  .layout{padding:10px;gap:12px}
  .avatar-panel{padding:14px 10px 14px}
  .avatar-header .sadid-logo{font-size:42px}
  .avatar-oval{max-width:min(100%,calc(62dvh * .7))}
  .avatar-question{font-size:19px}
  .chips{flex-wrap:wrap}.chips button{flex:1 1 30%}
  .change .muted{display:none}
  .kpis4{gap:8px}.kcard{padding:12px}.value{font-size:22px}
  .iconbox{width:34px;height:34px}
  .panel-head{flex-wrap:wrap}
  .trend{min-height:0}
  .toast{left:12px;right:12px;bottom:calc(80px + env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){ .listening .orb-ring,.skeleton{animation:none} }

/* ================================================================ analysis panel */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg)}
.qcard{padding:16px 20px;display:flex;flex-direction:column;gap:4px}
.qtext{font-size:18px;line-height:1.6;color:var(--text);font-weight:400}
.result{display:flex;flex-direction:column;gap:14px}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.rise{animation:rise .5s cubic-bezier(.2,.7,.2,1) both}

.empty{padding:22px;display:flex;flex-direction:column;gap:14px}
.empty-title{font-size:17px;color:var(--text)}
.sugg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.sugg button{min-height:52px;padding:10px 14px;border:1px solid var(--line2);border-radius:14px;background:var(--card2);font-size:14px;color:var(--soft);cursor:pointer;text-align:right;line-height:1.45;display:flex;align-items:center;gap:10px}
.sugg button:hover{border-color:var(--gold);color:var(--text)}
.sugg button svg{flex:0 0 18px;color:var(--gold)}

.hero{padding:20px;display:flex;flex-direction:column;gap:16px}
.hero-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}
.big{font-size:clamp(34px,3.2vw,46px);font-weight:600;color:var(--text);line-height:1}
.unit{font-size:14px;color:var(--muted)}
.delta{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;padding:7px 11px;border-radius:12px;white-space:nowrap}
.delta.up{color:var(--teal);background:var(--teal-bg);border:1px solid #BFE9DF}
.delta.down{color:var(--red);background:var(--red-bg);border:1px solid #F5C2C4}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.kpi{padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card2);display:flex;flex-direction:column;gap:3px;min-width:0}
.kpi b{font-size:19px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi small{font-size:11.5px;color:var(--dim)}
.sub{font-size:12.5px;color:var(--muted)}

.block{padding:20px;display:flex;flex-direction:column;gap:14px}
.block-head{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:15px;font-weight:600;color:var(--text)}
.bar-row{display:flex;flex-direction:column;gap:6px}
.bar-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:14px;color:var(--soft)}
.bar-top .name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-top .v{display:flex;align-items:baseline;gap:10px;flex:0 0 auto}
.bar-top .v b{color:var(--text);font-weight:600}
.bar-top .v i{font-style:normal;font-size:12px;color:var(--muted);min-width:42px;text-align:left}
.track{height:6px;background:#E6EEF7;border-radius:999px;overflow:hidden}
.fill{height:100%;border-radius:999px;background:#A9C2E2;width:0;transition:width .9s cubic-bezier(.2,.7,.2,1)}
.fill.first{background:var(--gold)}

/* diverging bars (explain_change) */
.drv{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) auto;align-items:center;gap:12px;font-size:14px}
.drv .name{color:var(--soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dtrack{position:relative;height:10px;direction:ltr}
.dtrack::before{content:"";position:absolute;left:50%;top:-4px;bottom:-4px;width:1px;background:#C9D8EA}
.dfill{position:absolute;top:0;height:100%;border-radius:4px;width:0;transition:width .9s cubic-bezier(.2,.7,.2,1)}
.dfill.up{left:50%;background:var(--teal)}
.dfill.down{right:50%;background:var(--red)}
.drv .v{text-align:left;white-space:nowrap}
.drv .v b{font-weight:600}.drv .v b.up{color:var(--teal)}.drv .v b.down{color:var(--red)}
.drv .v i{display:block;font-style:normal;font-size:11.5px;color:var(--muted)}
.tag{font-size:11px;padding:2px 8px;border-radius:999px;margin-inline-start:6px}
.tag.new{color:var(--teal);background:var(--teal-bg)}.tag.stopped{color:var(--red);background:var(--red-bg)}

/* columns (time_pattern) */
.cols{display:flex;align-items:flex-end;gap:6px;height:180px;direction:ltr;padding-top:8px}
.col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;height:100%;justify-content:flex-end}
.col .cbar{width:100%;max-width:42px;border-radius:8px 8px 3px 3px;background:#C9D8EA;height:0;transition:height .9s cubic-bezier(.2,.7,.2,1)}
.col.max .cbar{background:var(--gold)}
.col span{font-size:11px;color:var(--muted);white-space:nowrap}
.col b{font-size:11px;color:var(--soft);font-weight:500}

.chart{width:100%;height:180px;display:block;direction:ltr}
@keyframes draw{from{stroke-dashoffset:1600}to{stroke-dashoffset:0}}
.line{stroke-dasharray:1600;animation:draw 1.5s ease-out .2s both}
.src{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:0 6px;font-size:12px;color:var(--dim)}
.err{padding:16px 20px;color:var(--red);border-color:#F5C2C4;background:var(--red-bg)}
.loading{padding:20px;color:var(--muted);display:flex;align-items:center;gap:10px}
.spin{width:16px;height:16px;border-radius:50%;border:2px solid #DCE8F5;border-top-color:var(--gold);animation:spin .8s linear infinite}

.history{display:flex;flex-direction:column;gap:8px;padding:6px 4px}
.hist-list{display:flex;flex-direction:column;gap:6px}
.hist-list button{display:flex;align-items:center;gap:10px;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--soft);font-size:13.5px;text-align:right;cursor:pointer}
.hist-list button:hover{border-color:var(--line2);color:var(--text)}
.hist-list button span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}



/* ================================================================ chart library */
.heard{font-size:12px;color:var(--dim)}
.up{color:var(--teal)}.down{color:var(--red)}
.dimmed{color:#70859C !important}
.kpis.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.kpi small.up{color:var(--teal)}.kpi small.down{color:var(--red)}
.track.thin{height:4px;margin-top:4px}
.fill.neg{background:var(--red)}
.bar-top .v i.up{color:var(--teal)}.bar-top .v i.down{color:var(--red)}

/* hero variants */
.split{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:16px;align-items:end}
.split > div{display:flex;flex-direction:column;gap:8px;min-width:0}
.split .big{font-size:clamp(26px,2.4vw,36px)}
.split .vs{align-self:center}
.strip{padding:18px 20px;display:flex;flex-direction:column;gap:14px}
.strip-main{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.strip-main .label{flex-basis:100%}
.strip-kpis{display:flex;flex-wrap:wrap;gap:8px}
.strip-kpis span{display:flex;align-items:baseline;gap:6px;padding:8px 12px;border-radius:999px;background:var(--card2);border:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.strip-kpis b{font-size:15px;color:var(--text);font-weight:600}

/* donut */
.donut{display:grid;grid-template-columns:minmax(140px,180px) minmax(0,1fr);gap:18px;align-items:center}
.donut svg{width:100%;height:auto}
.donut .arc{transition:stroke-dasharray .9s ease}
.dn-v{font:600 20px 'IBM Plex Sans',sans-serif;fill:var(--text)}
.dn-l{font:400 11px 'IBM Plex Sans Arabic',sans-serif;fill:#70859C}
.legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.legend li{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--soft)}
.legend .sw{flex:0 0 10px;height:10px;border-radius:3px}
.legend .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.legend b{color:var(--text);font-weight:600}
.legend-inline{display:flex;gap:16px;font-size:12px;color:var(--muted)}
.legend-inline i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-inline-end:6px;vertical-align:-1px}
.grp{display:flex;flex-direction:column;gap:2px}

/* treemap */
.tree{position:relative;height:240px;direction:ltr;border-radius:12px;overflow:hidden}
.tile{position:absolute;padding:2px;box-sizing:border-box}
.tile::before{content:"";position:absolute;inset:2px;border-radius:10px;background:var(--c);opacity:.22;border:1px solid var(--c)}
.tile .tn,.tile b{position:relative;display:block;padding:8px 10px 0;direction:rtl;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile .tn{font-size:12.5px;color:var(--text)}
.tile b{padding-top:2px;font-size:16px;font-weight:600;color:var(--c)}

/* lollipop */
.lolli{display:flex;flex-direction:column;gap:12px}
.lp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) auto;gap:12px;align-items:center;font-size:13.5px}
.lp .name{color:var(--soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lp b{color:var(--text);font-weight:600}
.lp-track{height:12px;position:relative}
.lp-stem{position:absolute;right:0;top:5px;height:2px;background:#C9D8EA;width:0;transition:width .9s cubic-bezier(.2,.7,.2,1)}
.lp-stem i{position:absolute;left:-6px;top:-5px;width:12px;height:12px;border-radius:50%;box-shadow:0 0 0 4px rgba(10,116,240,.14)}

/* podium */
.podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:end}
.pd{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 10px;border-radius:16px;border:1px solid var(--line);background:var(--card2);text-align:center;min-width:0}
.pd.p1{order:2;padding-top:24px;border-color:#BFDBFA;background:linear-gradient(180deg,#EAF1FA,var(--card2))}
.pd.p2{order:1}.pd.p3{order:3}
.rank{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;background:#E6EEF7;color:var(--text)}
.p1 .rank{background:var(--gold);color:#fff}
.pd-name{font-size:13px;color:var(--soft);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pd b{font-size:18px;color:var(--text);font-weight:600}
.pd small{font-size:11.5px;color:var(--muted)}
.rest{margin:0;padding:0 18px 0 0;display:flex;flex-direction:column;gap:6px;font-size:13.5px;color:var(--muted)}
.rest li span{color:var(--soft)}.rest li b{float:left;color:var(--text);font-weight:500}

/* table */
.tbl-wrap{overflow-x:auto;border-radius:12px;border:1px solid var(--line)}
.tbl{width:100%;border-collapse:collapse;font-size:13.5px;min-width:440px}
.tbl th{font-size:11.5px;font-weight:600;color:var(--muted);text-align:left;padding:10px 12px;background:var(--card2)}
.tbl td{padding:10px 12px;border-top:1px solid var(--line);text-align:left;color:var(--soft);position:relative}
.tbl .tl{text-align:right;color:var(--text)}
.tbl td.hot{color:var(--text);font-weight:600}
.tbl td.hot span:last-child{position:relative}
.tbar{position:absolute;left:0;top:6px;bottom:6px;background:rgba(10,116,240,.10);border-radius:4px}
.tbl td.up{color:var(--teal)}.tbl td.down{color:var(--red)}

/* series axis, heat, radial, waterfall, gauge, pnl, pareto */
.axis{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11.5px;color:var(--muted);direction:ltr}
.axis .sub{direction:rtl;text-align:center}
.heat{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}
.hc{border-radius:10px;padding:10px 8px;display:flex;flex-direction:column;gap:2px;align-items:center;font-size:12px}
.hc b{font-size:13px;font-weight:600}
.radial{width:min(300px,100%);height:auto;display:block;margin:0 auto}
.rl{font:500 9px 'IBM Plex Sans',sans-serif;fill:#70859C}
.wf-labels{display:grid;gap:4px;direction:ltr}
.wf-labels span{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;color:var(--muted);text-align:center;overflow:hidden;white-space:nowrap}
.wf-labels b{font-size:11.5px;color:var(--soft);font-weight:600}
.gauge{width:min(220px,100%);height:auto;display:block}
.g-v{font:600 24px 'IBM Plex Sans',sans-serif;fill:var(--text)}
.g-l{font:400 11px 'IBM Plex Sans Arabic',sans-serif;fill:#70859C}
.fin-top{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.fin-top .kpis{flex:1;min-width:240px}
.pnl{display:flex;flex-direction:column;gap:10px}
.pl{display:grid;grid-template-columns:minmax(110px,1fr) minmax(0,1.6fr) auto auto;gap:12px;align-items:center;font-size:14px;color:var(--soft)}
.pl b{color:var(--text);font-weight:600;min-width:90px;text-align:left}
.pl i{font-style:normal;font-size:12px;color:var(--muted);min-width:56px;text-align:left}
.pl.neg b{color:var(--red)}
.pl.sum{padding-top:10px;border-top:1px dashed #E6EEF7}
.pl.total{padding-top:10px;border-top:1px solid #BFDBFA}
.pl.total span,.pl.total b{color:var(--gold);font-weight:700}
@media (max-width:640px){
  .donut{grid-template-columns:minmax(0,1fr)}
  .donut svg{max-width:200px;margin:0 auto}
  .split{grid-template-columns:minmax(0,1fr)}
  .podium{gap:6px}.pd b{font-size:15px}
  .lp{grid-template-columns:minmax(0,1fr) auto}.lp-track{grid-column:1 / -1;order:3}
  .pl{grid-template-columns:minmax(0,1fr) auto}.pl .track{grid-column:1 / -1;order:3}.pl i{display:none}
}
.tile.tiny .tn{display:none}.tile.tiny b{font-size:12px;padding:6px 6px 0}
.kpi{align-items:flex-start}.kpi b{max-width:100%}

/* welcome (nothing loads until asked) */
.welcome{display:flex;flex-direction:column;gap:14px}
.welcome-card{padding:34px 26px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}
.welcome-icon{width:62px;height:62px;border-radius:18px;background:var(--gold-bg);color:var(--gold);display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.welcome-card h3{font-size:20px}
.welcome-card .sugg{width:100%;max-width:640px;margin-top:12px}
.welcome-card .sugg button{justify-content:center;text-align:center;font-weight:700;color:var(--soft)}
@media (max-width:600px){ .welcome-card{padding:24px 14px} .welcome-card .sugg{grid-template-columns:1fr} }


/* ================================================================ Naseeh final design (exact palette) */
:root{--bg:#EEF8FE;--line:#DBEAFF;--line2:#C6DCF6;--text:#143769;--muted:#8198B9;--soft:#3D5A80;--gold:#1F5FAE;--gold-hi:#1F5FAE;--gold-bg:#EAF1FA;--teal:#0CB69E;--coral:#F27447;--card2:#F4F9FF}
body{background:var(--bg)}
.gold{background:#1F5FAE !important;border-color:#1F5FAE !important}
.gold:hover{background:#184E92 !important}
.logo-img{display:block;width:78px;height:auto;margin:0 auto}
.logo-img.big{width:min(150px,42%);margin:2px auto 4px}
.brand small{margin-top:6px;color:#1F5FAE}
.nav button.active{background:#EAF1FA;color:#1F5FAE}
.top h1{color:var(--text)}

.avatar-panel{border-radius:23px;padding:18px 15px 16px;overflow:hidden}
.avatar-header{margin-bottom:0}
.brand-subtitle{font-size:14px;color:var(--text);margin-bottom:6px}
.portrait{position:relative;height:320px;overflow:hidden;container-type:size;flex:0 0 auto;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 66%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 66%,transparent 100%)}
.portrait .figure{--w:clamp(calc(100cqh * .8003),100cqw,calc(100cqh * 1.25));position:absolute;left:50%;transform:translateX(-50%);width:var(--w);top:calc((100cqh - var(--w) * 1.2496) * .1);aspect-ratio:1122/1402;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%)}
.voice{margin-top:-18px;position:relative;z-index:1;text-align:center;flex:0 0 auto}
.voice .wave{width:100%;height:62px;gap:4px;padding:0 12px;margin:0}
.voice .wave i{background:#1F5FAE;width:3px}
.voice .wave i:nth-child(5n){background:var(--coral)}
.listening .voice .wave i{background:#1F5FAE}
.session-status{display:flex;align-items:center;justify-content:center;gap:15px;font-size:13px;margin:0 0 12px;color:var(--text)}
.session-status .separator{width:1px;height:14px;background:#CEDCF0}
.connected{display:flex;align-items:center;gap:8px;color:var(--teal)}
.idle .connected,.muted-state .connected{color:var(--muted)}.idle .connected .dot,.muted-state .connected .dot{background:#91A4BD}
.speaking .connected{color:#1F5FAE}.speaking .connected .dot{background:#1F5FAE}
.listening .connected .dot,.thinking .connected .dot{animation:blink 1s infinite}
.voice .controls{display:flex;direction:ltr;align-items:flex-start;justify-content:center;gap:32px;margin:0 0 12px}
.control{display:flex;flex-direction:column;align-items:center;gap:4px}
.control button{border:1px solid var(--line);width:60px;height:58px;border-radius:14px;background:#fff;color:var(--text);display:grid;place-items:center;box-shadow:0 4px 12px rgba(40,94,166,.03);padding:0}
.control button:hover{filter:brightness(.97)}
.control span{font-size:11px;color:#5B6F8C}
.control .mic{width:70px;height:62px;background:#1F5FAE;color:#fff;border-color:#1F5FAE;box-shadow:0 5px 15px rgba(31,95,174,.15)}
.listening .control .mic{box-shadow:0 0 0 4px #C9DBF2,0 5px 15px rgba(31,95,174,.2)}
.control .mic.muted{background:#A9C2E2;border-color:#A9C2E2}
.control .end{background:#FFF0EB;border-color:#FFDBD0}
.control .end:disabled{opacity:.5;cursor:default;filter:none}
.stop-square{display:block;width:19px;height:19px;border-radius:3px;background:var(--coral)}
#soundBtn[aria-pressed="true"]{opacity:.45}
#soundBtn .snd-off{display:none}#soundBtn[aria-pressed="true"] .snd-on{display:none}#soundBtn[aria-pressed="true"] .snd-off{display:block}
.ask{border-color:var(--line);border-radius:30px;padding:8px 10px;margin-top:6px}
.ask input{font-size:13px}.ask input::placeholder{color:var(--muted)}
.ask-send{color:#1F5FAE}.ask-kbd{border:0;background:transparent;color:#8A9AB2;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.chips{margin-top:12px;gap:8px}
.chips button{border:1px solid var(--line);border-radius:13px;background:#F4F7FB;color:#3D5A80;font-size:11px;padding:10px 8px}
.chips button:hover{background:#E9F0F8}
.qcard,.insight{border-radius:21px}
.insight{background:#F3F7FC;border-color:var(--line)}
.insight h3{color:#1F5FAE}

/* desktop: portrait takes the free height */
@media (min-width:1100px){
  .avatar-panel{display:flex;flex-direction:column}
  .portrait{flex:1 1 0;height:auto;min-height:150px;max-height:380px}
}
@media (min-width:1100px) and (max-height:820px){
  .logo-img.big{width:min(120px,36%)} .brand-subtitle{font-size:12.5px;margin-bottom:2px}
  .voice .wave{height:50px} .session-status{margin-bottom:8px}
  .control button{width:54px;height:50px}.control .mic{width:62px;height:54px}.voice .controls{gap:24px;margin-bottom:8px}
  .chips{margin-top:8px}
}
@media (max-width:1099px){ .portrait{height:300px} .voice .controls{gap:24px} }
@media (max-width:800px){ .logo-img{width:52px} }
@media (max-width:600px){ .portrait{height:min(300px,40dvh)} .voice .controls{gap:22px} }
.portrait{isolation:isolate}
.portrait::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 56% 68% at 50% 46%,#4F80C1 0%,#5F8BC6 40%,#A3BEE1 66%,#E6EFFA 86%,#fff 100%)}
.portrait .figure{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 16%,#000 84%,transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 16%,#000 84%,transparent 100%)}

/* ================================================================ typography (self-hosted, works offline) */
@font-face{font-family:'Plex Arabic';src:url(fonts/plex-arabic-400.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Plex Arabic';src:url(fonts/plex-arabic-500.woff2) format('woff2');font-weight:500;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Plex Arabic';src:url(fonts/plex-arabic-600.woff2) format('woff2');font-weight:600;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Plex Arabic';src:url(fonts/plex-arabic-700.woff2) format('woff2');font-weight:700;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Plex Arabic';src:url(fonts/plex-latin-400.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2190-21FF}
@font-face{font-family:'Plex Arabic';src:url(fonts/plex-latin-500.woff2) format('woff2');font-weight:500;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2190-21FF}
@font-face{font-family:'Plex Arabic';src:url(fonts/plex-latin-600.woff2) format('woff2');font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2190-21FF}
@font-face{font-family:'Plex Arabic';src:url(fonts/plex-latin-700.woff2) format('woff2');font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2190-21FF}
body,button,input{font-family:'Plex Arabic',Tahoma,'Segoe UI',sans-serif}
body{font-size:14.5px;line-height:1.7}
.top h1{font-size:23px;font-weight:600}
.nav button,.control span,.chips button,.sugg button{font-weight:500}
.brand-subtitle{font-weight:500}

/* ================================================================ portrait: white studio, red shemagh avatar */
.portrait::before{background:radial-gradient(ellipse 60% 58% at 50% 40%,#F2F7FD 0%,#F7FAFE 55%,#fff 80%)}
.portrait{-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 74%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 74%,transparent 100%)}
.portrait .figure{-webkit-mask-image:none;mask-image:none}
.portrait .av-base{mix-blend-mode:multiply}
@media (max-width:1099px){ .top h1{font-size:20px} }
@media (max-width:600px){ .top h1{font-size:17px} }

/* ================================================================ refined professional palette */
:root{--bg:#F5F7FA;--card:#FFFFFF;--card2:#F7F9FC;--line:#E4EAF2;--line2:#D3DDEA;--text:#0F2A4A;--muted:#6B7F99;--soft:#3D5A80;--dim:#97A6BA;
  --gold:#1F5FAE;--gold-hi:#1F5FAE;--gold-bg:#EAF1FA;--teal:#0E9F7E;--teal-bg:#E7F6F1;--coral:#EE6A3C;--red:#D64545;--red-bg:#FCEEEE}
body{background:var(--bg)}
.top{background:#fff}
.panel,.card{border-color:var(--line);box-shadow:0 1px 2px rgba(15,42,74,.04),0 6px 20px rgba(15,42,74,.03)}
.gold{background:#1F5FAE !important;border-color:#1F5FAE !important}
.gold:hover{background:#184E92 !important}
.voice .wave i{background:#1F5FAE}
.voice .wave i:nth-child(5n){background:#1F5FAE}
.voice .wave i:nth-child(n+16):nth-child(-n+24):nth-child(3n){background:var(--coral)}
.control .mic{background:#1F5FAE;border-color:#1F5FAE;box-shadow:0 6px 16px rgba(31,95,174,.22)}
.control .end{background:#FDF1EC;border-color:#F6D5C8}
.stop-square{background:var(--coral)}
.control button{border-color:var(--line)}
.ask{border-color:var(--line2)}
.chips button{background:#F4F7FB;border-color:var(--line);color:var(--soft)}
.chips button:hover{background:#EAF1FA;border-color:#C9DBF2}
.insight{background:#F3F7FC;border-color:var(--line)}
.insight h3{color:#1F5FAE}
.date-chip svg,.ask-send{color:#1F5FAE}
.nav button{color:#4A5F7D}
.nav button.active{background:#EAF1FA;color:#1F5FAE}
.welcome-icon{background:#EAF1FA;color:#1F5FAE}
.sugg button{background:#fff;border-color:var(--line);color:var(--text)}
.sugg button:hover{border-color:#1F5FAE;background:#F7FAFE}
.change.up,.up{color:var(--teal)}
.connected{color:var(--teal)}
.speaking .connected{color:#1F5FAE}.speaking .connected .dot{background:#1F5FAE}
.brand small{color:#1F5FAE}

/* one professional family everywhere: IBM Plex Sans Arabic (standard of Saudi digital-government platforms) */
h1,h2,h3,.section-title h2,.panel-head h3,.table-panel h3,.welcome-card h3,.insight h3,.qtext,.empty-title,.block-head,
.value,.big,.kpi b,.pd b,.dn-v,.g-v,.strip-kpis b{font-family:'Plex Arabic',Tahoma,sans-serif}
h1,h2,h3,.section-title h2,.panel-head h3,.table-panel h3,.welcome-card h3,.insight h3{font-weight:700}
.value,.big{font-weight:700;letter-spacing:-.01em}
.src{display:none !important}

/* presenter patches (new frame set) */
.av-eye,.av-gaze,.av-expr{left:33.155%;top:21.398%;width:33.868%;height:11.555%;opacity:0}
.av-gaze.g-left{left:33.868%;top:22.967%;width:32.531%;height:8.916%}
.av-gaze{transition:opacity .22s ease-in-out}
.av-expr{transition:opacity .28s ease-in-out}
.av-eye{transition:none}
.av-mouth{transition:opacity 70ms linear}

.res-tag{display:inline-flex;align-self:flex-start;margin:4px 0 -4px;padding:3px 10px;border-radius:999px;background:#EAF1FA;color:#1F5FAE;font-size:12px;font-weight:600}
.result > .result:first-child .res-tag{background:#1F5FAE;color:#fff}

/* ================================================================ patient medical files */
.pf-search{display:flex;gap:8px;width:100%;max-width:560px;margin-top:14px}
.pf-search input{flex:1;min-width:0;height:48px;padding:0 16px;border:1px solid var(--line2);border-radius:14px;background:#fff;font-size:15px;color:var(--text);outline:none}
.pf-search input:focus{border-color:#1F5FAE;box-shadow:0 0 0 3px #EAF1FA}
.pf-search button{height:48px;padding:0 22px;border-radius:14px;border:0;font-weight:600;color:#fff}
.pf{display:flex;flex-direction:column;gap:14px}
.pf-card{padding:18px 20px;display:flex;flex-direction:column;gap:12px;min-width:0}
.pf-ch{display:flex;align-items:center;gap:10px}
.pf-ch h3{font-size:15.5px;font-weight:700;flex:1;margin:0}
.pf-ci{width:34px;height:34px;border-radius:10px;background:#EAF1FA;color:#1F5FAE;display:flex;align-items:center;justify-content:center;flex:0 0 34px}
.pf-ci svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pf-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pf-head{padding:20px 22px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 20px;align-items:center;background:linear-gradient(135deg,#fff 0%,#F6F9FD 100%)}
.pf-id{display:flex;gap:16px;align-items:center;min-width:0}
.pf-id h2{font-size:22px;margin:0 0 2px;line-height:1.35}
.pf-id p{margin:0;font-size:13.5px}
.pf-av{width:64px;height:64px;border-radius:20px;background:linear-gradient(160deg,#2B6BBE,#1A4F93);color:#fff;font-weight:700;font-size:20px;display:flex;align-items:center;justify-content:center;flex:0 0 64px;letter-spacing:.02em}
.pf-av.sm{width:40px;height:40px;border-radius:12px;font-size:14px;flex-basis:40px}
.pf-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.pf-tags span{font-size:12px;padding:4px 10px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--soft)}
.pf-stats{display:flex;gap:10px}
.pf-stats>div{min-width:96px;padding:10px 14px;border-radius:14px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;gap:1px}
.pf-stats b{font-size:18px;font-weight:700;color:var(--text)}
.pf-stats small{font-size:11.5px;color:var(--muted)}
.pf-alerts{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;padding-top:12px;border-top:1px dashed var(--line2)}
.pf-alert{font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:10px;display:inline-flex;align-items:center;gap:6px}
.pf-alert::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.pf-alert.danger{background:#FCEEEE;color:#B83232}
.pf-alert.warn{background:#FFF5E6;color:#A8620A}
.pf-alert.info{background:#EAF1FA;color:#1F5FAE}
.vt-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.vt{padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;gap:1px;position:relative;overflow:hidden}
.vt::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:transparent}
.vt.ok::before{background:var(--teal)}.vt.warn::before{background:#E39A2D}.vt.bad::before{background:#D64545}
.vt.bad{background:#FFF8F8}.vt.warn{background:#FFFBF4}
.vt-l{font-size:11.5px;color:var(--muted)}
.vt b{font-size:18px;font-weight:700;color:var(--text);line-height:1.3}
.vt-u,.vt-s{font-size:11px;color:var(--dim)}
.vt-trend{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.vt-trend>div{display:flex;flex-direction:column;gap:4px}
.spark{width:100%;height:46px;background:#F7F9FC;border-radius:10px}
.pf-row{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;font-size:13.5px;padding:7px 0;border-bottom:1px solid #EEF2F7}
.pf-row:last-child{border-bottom:0}
.pf-row span{color:var(--muted);font-size:12.5px}
.pf-row p{margin:0;color:var(--text);line-height:1.7;white-space:pre-line}
.pf-row.bad p{color:#B83232;font-weight:600}.pf-row.warn p{color:#A8620A;font-weight:600}.pf-row.dx p{color:#1F5FAE;font-weight:600}
.pf-sub{font-size:12px;color:var(--muted);font-weight:600;margin-top:4px;padding-top:8px;border-top:1px dashed var(--line2)}
.pf-code{font-size:11px;font-weight:700;color:#1F5FAE;background:#EAF1FA;border-radius:6px;padding:1px 6px;margin-inline-end:6px}
.pf-tl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.pf-tl li{display:grid;grid-template-columns:14px minmax(0,1fr);gap:10px;position:relative;padding-bottom:12px}
.pf-tl li::before{content:"";position:absolute;right:6px;top:14px;bottom:0;width:2px;background:#E4EAF2}
.pf-tl li:last-child::before{display:none}
.pf-dot{width:14px;height:14px;border-radius:50%;border:3px solid #1F5FAE;background:#fff;margin-top:4px;position:relative;z-index:1}
.pf-tl-h{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;font-size:13px}
.pf-tl-h span{color:var(--muted);font-size:12.5px}
.pf-tl p{margin:2px 0 0;font-size:13px;color:var(--soft)}
.pf-dx{display:inline-block;margin-top:4px;font-size:12px;font-weight:600;color:#1F5FAE;background:#EAF1FA;border-radius:8px;padding:2px 8px}
.pf-tooth{font-weight:700;color:#1F5FAE}
.pf-mute{display:block;color:var(--muted);font-size:11.5px}
.pf-due{display:flex;flex-wrap:wrap;gap:10px}
.pf-due span{font-size:13px;padding:8px 12px;border-radius:10px;background:#FFF5E6;color:#A8620A}
.pf-due b{font-weight:700}
.pf-pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pf-pick button{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:14px;background:#fff;text-align:right;cursor:pointer}
.pf-pick button:hover{border-color:#1F5FAE;background:#F7FAFE}
.pf-pick b{display:block;font-size:14px;color:var(--text)}
.pf-pick small{font-size:12px;color:var(--muted)}
.pf-na{font-size:12px;color:var(--muted);margin:0}
.pf .tbl{min-width:0}
.pf .tbl td.tl{white-space:normal}
@media (max-width:1349px){ .vt-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:1099px){ .pf-grid{grid-template-columns:1fr} .vt-grid{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (max-width:700px){
  .pf-head{grid-template-columns:1fr}
  .pf-stats>div{flex:1;min-width:0}
  .vt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pf-pick{grid-template-columns:1fr}
  .pf-row{grid-template-columns:1fr;gap:2px}
  .pf-search{flex-direction:column}
}
.pf-row p,.pf .tbl td,.pf-tl p,.pf-dx,.pf-alert,.bar-top .name{unicode-bidi:plaintext}

/* ================================================================ patient file — clinical views */
.pf-tabs{display:flex;gap:4px;padding:4px;background:#fff;border:1px solid var(--line);border-radius:14px;overflow-x:auto;scrollbar-width:none;position:sticky;top:0;z-index:3;box-shadow:0 4px 14px rgba(15,42,74,.05)}
.pf-tabs button{flex:0 0 auto;border:0;background:transparent;padding:9px 16px;border-radius:10px;font-size:13px;font-weight:600;color:var(--soft);white-space:nowrap;cursor:pointer}
.pf-tabs button:hover{background:#F4F7FB}
.pf-tabs button.on{background:#1F5FAE;color:#fff}
.pf-body{display:flex;flex-direction:column;gap:14px}
.pf-card.wide{grid-column:1/-1}
.dl{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;font-weight:700;padding:2px 7px;border-radius:999px;white-space:nowrap}
.dl.bad{background:#FCEEEE;color:#B83232}.dl.good{background:#E7F6F1;color:#0B7D63}.dl.eq{background:#F1F4F8;color:#6B7F99}
.dl.info{background:#EAF1FA;color:#1F5FAE}.dl.warn{background:#FFF5E6;color:#A8620A}
.tbl.cmp th{white-space:nowrap}
.tbl.cmp tbody th{color:var(--muted);font-weight:600;font-size:12.5px;text-align:right;background:#F7F9FC;width:90px}
.tbl.cmp td{text-align:right;vertical-align:top;line-height:1.7;white-space:normal}
.rx-tag,.sv-tag{display:inline-block;margin:2px 0 2px 4px;font-size:12px;padding:2px 8px;border-radius:8px;background:#F1F5FB;color:var(--text);border:1px solid var(--line)}
.rx-tag.off{text-decoration:line-through;color:var(--muted)}
.sv-tag b{color:#1F5FAE}
.pg .pg-card{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fff;display:flex;flex-direction:column;gap:6px}
.pg li{padding-bottom:14px}
.pg-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px}
.pg-h span{color:var(--soft)}
.pg-h em{font-style:normal;font-size:11.5px;color:var(--muted);background:#F4F7FB;padding:2px 8px;border-radius:999px}
.pg-open{margin-inline-start:auto;border:1px solid var(--line);background:#fff;color:#1F5FAE;font-size:12px;font-weight:600;padding:5px 10px;border-radius:9px;cursor:pointer}
.pg-open:hover{border-color:#1F5FAE}
.pg-v{display:flex;flex-wrap:wrap;gap:6px}
.vchip{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:4px 8px;border-radius:9px;background:#F7F9FC;border:1px solid var(--line)}
.vchip i{font-style:normal;color:var(--muted)}
.vchip b{font-weight:700}
.pg-card p{margin:0;font-size:13px;line-height:1.75;color:var(--text);unicode-bidi:plaintext}
.lbl{display:inline-block;min-width:62px;color:var(--muted);font-size:12px;font-weight:600;margin-inline-end:6px}
.rx-mini{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.rx-mini li{display:flex;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:10px;background:#F7F9FC;font-size:13px}
.rx-mini span{color:var(--muted);font-size:12px}
.rx-for{font-size:12.5px;color:var(--muted)}
.rx-sheet{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.rx-line{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border-top:1px solid #EEF2F7}
.rx-line:first-child{border-top:0}
.rx-n{width:24px;height:24px;border-radius:8px;background:#EAF1FA;color:#1F5FAE;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.rx-line b{display:block;font-size:14px;unicode-bidi:plaintext}
.rx-line small{color:var(--muted);font-size:12px;unicode-bidi:plaintext}
.rx-stop{font-size:12.5px;color:var(--muted)}
.mx-wrap{overflow-x:auto}
.mx{border-collapse:separate;border-spacing:0;font-size:12px;min-width:100%}
.mx th,.mx td{padding:7px 6px;border-bottom:1px solid #EEF2F7;text-align:center}
.mx thead th{color:var(--muted);font-weight:600;white-space:nowrap}
.mx tbody th{text-align:right;font-weight:600;color:var(--text);white-space:nowrap;max-width:240px;overflow:hidden;text-overflow:ellipsis;unicode-bidi:plaintext}
.mx-dot{display:inline-block;width:12px;height:12px;border-radius:50%;background:#1F5FAE;box-shadow:0 0 0 3px #EAF1FA}
.mx-dot.rx{background:#0E9F7E;box-shadow:0 0 0 3px #E7F6F1}
.dx-item{padding:9px 0;border-bottom:1px solid #EEF2F7;display:flex;flex-direction:column;gap:2px}
.dx-item:last-child{border-bottom:0}
.dx-item b{font-size:13.5px;unicode-bidi:plaintext}
.dx-item small{font-size:12px;color:var(--muted)}
.vc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.vc{border:1px solid var(--line);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:6px;min-width:0}
.vc-h{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13.5px}
.vc-lg{display:flex;gap:10px;font-size:11.5px;color:var(--muted)}
.vc-lg i{display:inline-block;width:10px;height:3px;border-radius:2px;margin-inline-end:4px;vertical-align:middle}
.vchart{width:100%;height:auto;direction:ltr}
.vchart .ref{stroke:#D64545;stroke-dasharray:4 5;stroke-width:1;opacity:.55}
.vchart .ref-t{font-size:10px;fill:#D64545;opacity:.8}
.vchart .ax{font-size:10.5px;fill:#8A9AB2}
.vc-stat{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:11.5px;color:var(--muted)}
.vc-stat b{color:var(--text)}
.vc-empty{padding:30px 0;text-align:center;font-size:12px}
.dchart{display:flex;flex-direction:column;gap:6px;align-items:center;padding:8px 0;direction:ltr}
.djaw{display:flex;gap:14px}
.dq{display:flex;gap:5px}
.dmid{display:flex;justify-content:space-between;width:100%;max-width:640px;font-size:11px;color:var(--muted);border-top:1px dashed var(--line2);padding-top:4px;direction:rtl}
.tooth{position:relative;width:34px;height:44px;border-radius:10px 10px 14px 14px;border:1.5px solid #D3DDEA;background:#fff;display:flex;align-items:flex-end;justify-content:center;padding-bottom:5px;font-size:11.5px;font-weight:700;color:#6B7F99;cursor:default}
.tooth.done{background:#EAF1FA;border-color:#1F5FAE;color:#1F5FAE}
.tooth i{position:absolute;top:-7px;right:-7px;min-width:18px;height:18px;border-radius:9px;background:#EE6A3C;color:#fff;font-style:normal;font-size:10.5px;display:flex;align-items:center;justify-content:center;padding:0 4px}
.visit-sheet{gap:14px}
.vs-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--line);font-size:14px}
.vs-nav button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:6px 12px;font-size:12.5px;color:#1F5FAE;cursor:pointer}
.vs-nav button:disabled{opacity:.35;cursor:default}
.vs-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.vs-sec{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#FBFCFE}
.vs-sec span{display:block;font-size:12px;color:var(--muted);font-weight:600;margin-bottom:3px}
.vs-sec p{margin:0;font-size:13.5px;line-height:1.75;unicode-bidi:plaintext;white-space:pre-line}
@media (max-width:1349px){ .vc-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:700px){
  .vc-grid,.vs-body{grid-template-columns:1fr}
  .tooth{width:22px;height:32px;font-size:9.5px;border-radius:7px 7px 10px 10px}
  .dq{gap:2px}.djaw{gap:6px}
  .tooth i{min-width:14px;height:14px;font-size:9px;top:-6px;right:-5px}
}
.pg-card p{unicode-bidi:normal;direction:rtl;text-align:right}.pg-card p .rx-tag,.pg-card p .sv-tag,.pg-card p .pf-dx{unicode-bidi:isolate}
.pf .tbl td.num,.pf .tbl td{white-space:nowrap}.pf .tbl td.tl{white-space:normal}
.vchart .ax{font-size:11px}.vchart .ref-t{font-size:10.5px}

/* ================================================================ patient file v3 — pro look */
.pf-tabs{gap:2px;padding:5px;border-radius:16px;background:rgba(255,255,255,.92);backdrop-filter:blur(8px)}
.pf-tabs button{display:inline-flex;align-items:center;gap:7px;padding:10px 15px;border-radius:12px;transition:background .15s,color .15s}
.pf-tabs button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;opacity:.8}
.pf-tabs button.on{background:linear-gradient(160deg,#2667B8,#1A4F93);color:#fff;box-shadow:0 6px 16px rgba(31,95,174,.28)}
.pf-tabs button.on svg{opacity:1}
.btn-ghost{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line2);background:#fff;color:#1F5FAE;font-weight:600;border-radius:10px;padding:7px 12px;font-size:12.5px;cursor:pointer;transition:all .15s}
.btn-ghost:hover{background:#1F5FAE;border-color:#1F5FAE;color:#fff;box-shadow:0 4px 12px rgba(31,95,174,.25)}
.btn-ghost.sm{padding:5px 10px;font-size:12px;margin-inline-start:auto}

/* AI reading band */
.ai-band{position:relative;border-radius:18px;padding:16px 18px;background:linear-gradient(135deg,#0F2A4A 0%,#173E6E 55%,#1F5FAE 100%);color:#fff;overflow:hidden;box-shadow:0 10px 30px rgba(15,42,74,.22)}
.ai-band::after{content:"";position:absolute;inset:-40% -10% auto auto;width:280px;height:280px;background:radial-gradient(circle,rgba(238,106,60,.35),transparent 65%);pointer-events:none}
.ai-h{display:flex;align-items:center;gap:8px;margin-bottom:10px;position:relative;z-index:1}
.ai-h b{font-size:15px}
.ai-h small{color:#AFC4E0;font-size:11.5px;margin-inline-start:auto}
.ai-spark{width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,#EE6A3C,#F59E6B);display:flex;align-items:center;justify-content:center;font-size:14px;box-shadow:0 0 0 4px rgba(238,106,60,.18)}
.ai-band ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;position:relative;z-index:1}
.ai-band li{display:flex;gap:10px;align-items:flex-start;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:9px 11px;font-size:13px;line-height:1.7}
.ai-band li i{flex:0 0 20px;height:20px;border-radius:50%;font-style:normal;font-weight:800;font-size:11px;display:flex;align-items:center;justify-content:center;margin-top:2px}
.ai-band li.bad i{background:#FF8A80;color:#5A0E0E}.ai-band li.warn i{background:#FFD27A;color:#5A3A00}.ai-band li.ok i{background:#7EE2C1;color:#063D2E}.ai-band li.info i{background:#A9C8F0;color:#0F2A4A}
.ai-band li b{color:#fff}

/* status pills */
.st-pill{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap}
.st-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.st-pill.sm{font-size:11px;padding:2px 8px}
.st-pill.ok{background:#E3F6F0;color:#0B7D63}.st-pill.warn{background:#FFF2DD;color:#9A5B05}.st-pill.bad{background:#FDE8E8;color:#B42828}
.st-pill.info{background:#E7F0FB;color:#1F5FAE}.st-pill.mute{background:#EEF2F6;color:#66788F}
.lg{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--soft);margin-inline-start:auto}
.lg span{display:inline-flex;align-items:center;gap:6px}
.lg i{width:12px;height:12px;border-radius:4px;display:inline-block}
.sw.ok{background:#0E9F7E}.sw.warn{background:#D98A1C}.sw.bad{background:#D64545}

/* charts */
.ch{width:100%;height:auto;display:block;direction:ltr;overflow:visible}
.ch-grid{stroke:#EDF1F6;stroke-width:1}
.ch-ax{font-size:10.5px;fill:#8A9AB2;font-family:'Plex Arabic',Tahoma,sans-serif}
.ch-band{fill:#0E9F7E;opacity:.07}
.ch-band-t{font-size:9.5px;fill:#0B7D63;opacity:.8}
.ch-ref{stroke:#D64545;stroke-dasharray:3 4;opacity:.6}
.ch-ref-t{font-size:10px;fill:#D64545}
.ch-pt .hit{fill:transparent}
.ch-pt.hov circle:last-child{r:6}
.ch-last text{font-size:11px;font-weight:700;fill:#fff}
.ch-empty{padding:34px 0;text-align:center;color:var(--dim);font-size:12.5px;background:#F7F9FC;border-radius:12px}
.ch.bp .z-ok{fill:#0E9F7E;opacity:.06}.ch.bp .z-warn{fill:#D98A1C;opacity:.08}.ch.bp .z-bad{fill:#D64545;opacity:.07}
.zone-t{font-size:10.5px;fill:#66788F;font-weight:600}
.bp-v{font-size:12px;font-weight:700;fill:#0F2A4A}.bp-v.sub{fill:#66788F;font-weight:600}
.bp-bar .hit{fill:transparent}.bp-bar.hov .hit{fill:#1F5FAE;opacity:.05}
.vgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.vcard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px 16px 10px;display:flex;flex-direction:column;gap:4px;box-shadow:0 1px 2px rgba(15,42,74,.04),0 8px 22px rgba(15,42,74,.04)}
.vc-top{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:var(--soft);font-weight:600}
.vc-num{display:flex;align-items:baseline;gap:6px}
.vc-num b{font-size:30px;font-weight:700;color:var(--text);letter-spacing:-.02em;line-height:1.1}
.vc-num small{font-size:12px;color:var(--muted)}
.vc-foot{margin:0;font-size:12px;color:var(--muted);text-align:center}
.gauge2{width:100%;max-width:240px;margin:4px auto 0;display:block}
.g2-v{font-size:26px;font-weight:700;fill:#0F2A4A}.g2-l{font-size:12px;fill:#66788F;font-weight:600}

/* progress board */
.pg-board{padding:18px 20px;display:flex;flex-direction:column;gap:14px}
.pg-hdr{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center}
.pg-visit{padding:12px 14px;border-radius:14px;background:#F6F8FB;border:1px solid var(--line);display:flex;flex-direction:column;gap:1px}
.pg-visit.now{background:linear-gradient(135deg,#EAF1FA,#F7FAFE);border-color:#C9DBF2}
.pg-visit b{font-size:17px}.pg-visit small{color:var(--muted);font-size:12px}
.pg-gap{display:flex;flex-direction:column;align-items:center;justify-content:center;width:74px;height:74px;border-radius:50%;background:#fff;border:2px dashed #C9DBF2;color:#1F5FAE}
.pg-gap span{font-size:22px;font-weight:700;line-height:1}.pg-gap small{font-size:11px;color:var(--muted)}
.mt-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.mt{border-radius:14px;padding:10px 12px;border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;gap:3px;position:relative;overflow:hidden}
.mt::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:#DCE3EC}
.mt.good::before{background:#0E9F7E}.mt.bad::before{background:#D64545}
.mt-l{font-size:12px;color:var(--muted);font-weight:600}
.mt-v{display:flex;align-items:baseline;gap:6px;direction:rtl}
.mt-v b{font-size:19px;font-weight:700;color:var(--text)}
.mt-v .prev{font-size:12.5px;color:var(--dim);text-decoration:line-through}
.mt-v .arr{color:var(--dim);font-size:12px}
.mt-v small{font-size:11px;color:var(--muted)}
.mt-s{font-size:11.5px;font-weight:700;color:var(--muted)}
.mt.good .mt-s{color:#0B7D63}.mt.bad .mt-s{color:#B42828}
.pg-rows{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.pg-row{display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid #EEF2F7;align-items:start}
.pg-row:last-child{border-bottom:0}
.pg-cmp{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;line-height:1.7}
.pg-cmp .was{color:var(--dim)}.pg-cmp .is{color:var(--text);font-weight:600}.pg-cmp .arr{color:#1F5FAE;font-weight:700}
.pg-meds{display:flex;flex-wrap:wrap;gap:4px}
.rx-tag.add{background:#E7F0FB;border-color:#C9DBF2;color:#1F5FAE;font-weight:600}
.pf-dot.ok{border-color:#0E9F7E}.pf-dot.warn{border-color:#D98A1C}.pf-dot.bad{border-color:#D64545}
.pg .pg-card{box-shadow:0 1px 2px rgba(15,42,74,.03);transition:box-shadow .15s,border-color .15s}
.pg .pg-card:hover{border-color:#C9DBF2;box-shadow:0 8px 22px rgba(15,42,74,.07)}

/* prescription pad */
.rx-pad{padding:0;overflow:hidden;border:1px solid var(--line)}
.rx-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:16px 20px;background:linear-gradient(135deg,#F6F9FD,#fff);border-bottom:1px dashed var(--line2)}
.rx-symbol{width:46px;height:46px;border-radius:14px;background:linear-gradient(160deg,#2667B8,#1A4F93);color:#fff;font-size:26px;font-family:Georgia,serif;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(31,95,174,.25)}
.rx-top b{font-size:16px;display:block}.rx-top small{color:var(--muted);font-size:12.5px}
.rx-dx{margin-inline-start:auto;display:flex;flex-wrap:wrap;gap:6px}
.rx-list{list-style:none;counter-reset:rx;margin:0;padding:6px 20px}
.rx-list li{counter-increment:rx;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,2fr) auto;gap:14px;align-items:center;padding:12px 0 12px 0;border-bottom:1px solid #EEF2F7;position:relative;padding-inline-start:38px}
.rx-list li:last-child{border-bottom:0}
.rx-list li::before{content:counter(rx);position:absolute;right:0;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:8px;background:#EAF1FA;color:#1F5FAE;font-weight:700;font-size:12.5px;display:flex;align-items:center;justify-content:center}
.rx-name{display:flex;align-items:baseline;gap:8px;direction:ltr;justify-content:flex-end}
.rx-name b{font-size:15px}
.rx-dose{font-size:12px;font-weight:700;color:#1F5FAE;background:#EAF1FA;border-radius:6px;padding:1px 7px}
.rx-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:var(--text)}
.rx-meta i{font-style:normal;color:var(--muted);margin-inline-end:5px;font-size:11.5px}
.rx-stop{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:12px 20px;background:#FBFCFE;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)}

/* gantt / swimlanes */
.gantt{display:flex;flex-direction:column;gap:2px}
.gt-axis,.gt-row{display:grid;grid-template-columns:230px minmax(0,1fr);gap:14px;align-items:center}
.gt-ticks{position:relative;height:34px;border-bottom:1px solid var(--line)}
.gt-tick{position:absolute;bottom:0;transform:translateX(50%);display:flex;flex-direction:column;align-items:center;gap:2px}
.gt-tick em{font-style:normal;font-size:10.5px;color:var(--muted);white-space:nowrap;order:-1}
.gt-tick i{width:1px;height:6px;background:#C9D4E2}
.gt-row{padding:7px 0;border-bottom:1px solid #F1F4F8}
.gt-label{display:flex;flex-direction:column;gap:1px;min-width:0}
.gt-label b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;unicode-bidi:plaintext}
.gt-label small{font-size:11.5px;color:var(--muted)}
.gt-label > i{display:none}
.gt-label:not(.dx){position:relative;padding-inline-start:14px}
.gt-label:not(.dx) > i{display:block;position:absolute;right:0;top:6px;width:8px;height:8px;border-radius:3px}
.gt-label.dx{flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 6px}
.gt-label.dx small{flex-basis:100%}
.gt-track{position:relative;height:26px;background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1px),#F3F6FA calc(10% - 1px) 10%);border-radius:8px}
.gt-seg{position:absolute;top:5px;height:16px;border-radius:8px;background:var(--c);opacity:.88;transform:translateX(0);display:flex;align-items:center;justify-content:center;min-width:10px;box-shadow:0 0 0 2px #fff;cursor:default}
.gt-seg.hov{opacity:1;box-shadow:0 0 0 2px #fff,0 4px 10px rgba(15,42,74,.25)}
.gt-dose{font-size:10px;color:#fff;font-weight:700;white-space:nowrap;padding:0 6px}
.sl-line{position:absolute;top:12px;height:2px;border-radius:2px;background:#C9DBF2}
.sl-line.chronic{background:#F2C77E}.sl-line.past{background:#DCE3EC}
.sl-dot{position:absolute;top:6px;width:14px;height:14px;border-radius:50%;transform:translateX(50%);background:#1F5FAE;box-shadow:0 0 0 3px #fff,0 0 0 4px #C9DBF2;cursor:default}
.sl-dot.chronic{background:#D98A1C;box-shadow:0 0 0 3px #fff,0 0 0 4px #F2C77E}.sl-dot.past{background:#8A9AB2;box-shadow:0 0 0 3px #fff,0 0 0 4px #DCE3EC}
.sl-dot.hov{transform:translateX(50%) scale(1.25)}
.dx-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.dx-kpis>div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 14px;display:flex;flex-direction:column;gap:2px;position:relative;overflow:hidden}
.dx-kpis>div::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#C9D4E2}
.dx-kpis>.warn::before{background:#D98A1C}.dx-kpis>.info::before{background:#1F5FAE}.dx-kpis>.mute::before{background:#8A9AB2}
.dx-kpis b{font-size:24px;font-weight:700}.dx-kpis span{font-size:12px;color:var(--muted)}

/* dental chart */
.dental2{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 0;direction:ltr}
.d2-jaw{display:flex;align-items:flex-end;gap:8px}
.d2-jaw:not(.up){align-items:flex-start}
.d2-q{display:flex;gap:3px}
.d2-mid{width:2px;align-self:stretch;background:#E4EAF2;border-radius:2px}
.d2-sep{display:flex;justify-content:space-between;width:100%;max-width:700px;font-size:11px;color:var(--muted);padding:4px 0;border-top:1px dashed var(--line2);border-bottom:1px dashed var(--line2);direction:rtl}
.tooth2{position:relative;width:38px;border:0;background:transparent;padding:2px;border-radius:10px;display:flex;flex-direction:column;align-items:center;gap:2px;cursor:default}
.tooth2 svg{width:32px;height:38px;display:block}
.tooth2 .tn{font-size:11px;font-weight:700;color:#8A9AB2}
.tooth2.done .tn{color:#0F2A4A}
.tooth2.done{background:#F7FAFE}
.tooth2.hov{background:#EAF1FA}
.tooth2 i{position:absolute;top:-4px;right:-3px;min-width:17px;height:17px;border-radius:9px;background:#0F2A4A;color:#fff;font-style:normal;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 4px;box-shadow:0 0 0 2px #fff}
.proc-chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--text)}
.proc-chip::before{content:"";width:9px;height:9px;border-radius:3px;background:var(--c)}

/* tooltip */
.pf-tip{position:fixed;z-index:60;pointer-events:none;min-width:150px;max-width:300px;background:#0F2A4A;color:#fff;border-radius:12px;padding:10px 12px;font-size:12px;box-shadow:0 12px 30px rgba(15,42,74,.35);direction:rtl}
.pf-tip b{display:block;font-size:12.5px;margin-bottom:6px;color:#fff;unicode-bidi:plaintext}
.pf-tip div{display:flex;justify-content:space-between;gap:14px;padding:2px 0;border-top:1px solid rgba(255,255,255,.08)}
.pf-tip span{color:#AFC4E0}
.pf-tip strong{font-weight:700;unicode-bidi:plaintext}

@media (max-width:1349px){ .vgrid{grid-template-columns:repeat(2,minmax(0,1fr))} .mt-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .ai-band ul{grid-template-columns:1fr} }
@media (max-width:700px){
  .vgrid,.dx-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gt-axis,.gt-row{grid-template-columns:120px minmax(0,1fr);gap:8px}
  .rx-list li{grid-template-columns:1fr;gap:6px}
  .pg-hdr{grid-template-columns:1fr auto 1fr;gap:6px}.pg-gap{width:56px;height:56px}
  .tooth2{width:21px;padding:0}.tooth2 svg{width:19px;height:24px}.tooth2 .tn{font-size:8.5px}.d2-q{gap:1px}.d2-jaw{gap:3px}
  .pf-tabs button svg{display:none}
}
.z-ok-k{fill:#0E9F7E}.z-warn-k{fill:#D98A1C}.z-bad-k{fill:#D64545}
.zone-t{direction:ltr}
.gt-tick{transform:translateX(-50%)}
.sl-dot{transform:translateX(-50%)}.sl-dot.hov{transform:translateX(-50%) scale(1.25)}
.gt-track{direction:ltr}
.d2-sep{direction:ltr}

/* ================================================================ v4 — calmer, evidence-first */
/* layout: file wide, assistant narrow while a patient file is open */
@media (min-width:1100px){
  .layout{transition:grid-template-columns .25s ease}
  .layout.pf-mode{grid-template-columns:minmax(250px,24%) minmax(0,1fr)}
  .layout.pf-mode .brand-subtitle,.layout.pf-mode .chips{display:none}
  .layout.pf-mode .logo-img.big{width:min(110px,40%)}
  .layout.pf-mode .portrait{max-height:300px}
  .layout.presenter-min{grid-template-columns:96px minmax(0,1fr)}
  .layout.presenter-min .avatar-panel{padding:14px 8px;align-items:center}
  .layout.presenter-min .avatar-header,.layout.presenter-min .portrait,.layout.presenter-min .ask,.layout.presenter-min .chips,.layout.presenter-min .session-status .separator,.layout.presenter-min .control span{display:none !important}
  .layout.presenter-min .voice{margin-top:46px}
  .layout.presenter-min .voice .wave{width:72px;height:40px;gap:1px;padding:0}
  .layout.presenter-min .voice .wave i{width:2px}
  .layout.presenter-min .voice .controls{flex-direction:column;gap:10px;direction:rtl}
  .layout.presenter-min .session-status{flex-direction:column;gap:4px;font-size:11px}
  .layout.presenter-min .collapse-btn svg{transform:rotate(180deg)}
}
.collapse-btn{position:absolute;top:12px;left:12px;z-index:4;width:32px;height:32px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--soft);display:flex;align-items:center;justify-content:center;cursor:pointer}
.collapse-btn:hover{border-color:#1F5FAE;color:#1F5FAE}
.collapse-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
@media (max-width:1099px){
  .collapse-btn{display:none}
  .layout.pf-mode .avatar-panel{padding:10px 12px}
  .layout.pf-mode .avatar-header,.layout.pf-mode .portrait,.layout.pf-mode .chips{display:none}
  .layout.pf-mode .voice{margin-top:0}
  .layout.pf-mode .voice .wave{height:34px}
  .layout.pf-mode .control span{display:none}
  .layout.pf-mode .control button{width:48px;height:44px}.layout.pf-mode .control .mic{width:56px;height:48px}
}

/* question + generated answer: compact */
.qcard{padding:12px 16px;cursor:pointer;flex-direction:row;align-items:center;gap:10px}
.qcard .label{flex:0 0 auto}
.qcard .qtext{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.qcard .heard{display:none}
.qcard.open{flex-wrap:wrap}.qcard.open .qtext{white-space:normal}.qcard.open .heard{display:block;flex-basis:100%}
#insightCard{padding:12px 16px;flex-direction:column;align-items:stretch;gap:4px}
.ins-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ins-h h3{margin:0;font-size:15px}
.ins-more{margin-inline-start:auto;border:0;background:none;color:#1F5FAE;font-weight:600;font-size:12.5px;cursor:pointer;padding:2px 4px}
#insight.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kind{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;border:1px solid}
.kind.rec{color:#3D5A80;border-color:#D3DDEA;background:#F7F9FC}
.kind.calc{color:#1F5FAE;border-color:#C9DBF2;background:#F2F7FD}
.kind.gen{color:#8A4B1D;border-color:#F2D3BE;background:#FDF5EF}

/* header: clinical alerts separate from money */
.pf-head{background:#fff}
.pf-av{background:#1F5FAE}
.pf-stats .money b{font-size:15px}
.pf-alerts{align-items:center}
.pf-alerts>.label{font-weight:600;margin-inline-end:4px}
.pf-alert{font-size:13px;border:1px solid transparent}
.pf-alert::before{display:none}
.pf-alert i{width:17px;height:17px;border-radius:50%;font-style:normal;font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;background:currentColor}
.pf-alert i{color:inherit}
.pf-alert.danger{background:#FDF0F0;border-color:#F3CFCF;color:#A92E2E}.pf-alert.danger i{background:#C53B3B;color:#fff}
.pf-alert.warn{background:#FFF8EC;border-color:#F2DDB5;color:#8A5A0A}.pf-alert.warn i{background:#C98A1A;color:#fff}
.pf-alert.info{background:#F2F7FD;border-color:#D3E2F5;color:#1F5FAE}.pf-alert.info i{background:#1F5FAE;color:#fff}
.pf-alert.sm{font-size:12px;padding:3px 9px}

/* sticky tab bar with identity */
.pf-tabbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;background:rgba(245,247,250,.94);backdrop-filter:blur(8px);padding:6px 0;margin:-6px 0}
.pf-mini{display:flex;align-items:center;gap:8px;flex:0 0 auto;font-size:12.5px;color:var(--soft);max-width:44%;overflow:hidden}
.pf-mini b{color:var(--text);white-space:nowrap}
.pf-tabs{flex:1;position:static;box-shadow:none;background:#fff;padding:0 6px;border-radius:14px;gap:0;min-width:0}
.pf-tabs button{border-radius:0;padding:12px 13px;border-bottom:2px solid transparent;color:var(--muted);font-size:13.5px;background:none !important;box-shadow:none !important}
.pf-tabs button:hover{color:var(--text)}
.pf-tabs button.on{color:#1F5FAE;border-bottom-color:#1F5FAE;background:none;box-shadow:none}
.pf-tabs button:focus-visible{outline:2px solid #1F5FAE;outline-offset:-2px;border-radius:8px}
.pf-ctx{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--soft);padding:9px 14px;border-radius:12px;background:#F2F7FD;border:1px solid #D3E2F5}
.pf-ctx b{color:#1F5FAE}
.ai-dot{width:8px;height:8px;border-radius:50%;background:#EE6A3C;box-shadow:0 0 0 4px rgba(238,106,60,.15)}
@keyframes flash{0%{box-shadow:0 0 0 0 rgba(31,95,174,.0)}30%{box-shadow:0 0 0 4px rgba(31,95,174,.18)}100%{box-shadow:0 0 0 0 rgba(31,95,174,0)}}
.pf-body.flash>:first-child{animation:flash 1.4s ease-out}

/* findings (rule based) — calm card, sources clickable */
.findings{background:#fff;border:1px solid var(--line);border-inline-start:4px solid #1F5FAE;border-radius:16px;padding:14px 16px}
.findings header{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.findings header b{font-size:15px}
.findings header small{color:var(--muted);font-size:12px;margin-inline-start:auto}
.fd-ic{width:24px;height:24px;border-radius:8px;background:#F2F7FD;color:#EE6A3C;display:flex;align-items:center;justify-content:center;font-size:13px}
.findings ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.findings li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid #EEF2F7;font-size:14px;line-height:1.7}
.findings li:first-child{border-top:0}
.findings li>span:first-child{position:relative;padding-inline-start:16px}
.findings li>span:first-child::before{content:"";position:absolute;right:0;top:.62em;width:7px;height:7px;border-radius:50%;background:#1F5FAE}
.findings li.warn>span:first-child::before{background:#C98A1A}.findings li.muted>span:first-child::before{background:#B5C1D0}
.findings li.muted{color:var(--muted)}
.src-w{flex:0 0 auto;font-size:12px;color:var(--muted);white-space:nowrap}
.src-btn{border:1px solid #C9DBF2;background:#F2F7FD;color:#1F5FAE;font-size:12px;font-weight:600;border-radius:8px;padding:3px 9px;cursor:pointer;margin-inline-start:4px}
.src-btn:hover{background:#1F5FAE;color:#fff;border-color:#1F5FAE}

/* diff + flags (neutral, factual) */
.df{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:600;color:#3D5A80;background:#F1F4F8;border-radius:999px;padding:2px 8px;white-space:nowrap}
.df.eq{color:#7C8CA3}
.flag{display:inline-flex;align-items:center;font-size:11.5px;font-weight:700;color:#A92E2E;background:#FDF0F0;border:1px solid #F3CFCF;border-radius:6px;padding:1px 6px;white-space:nowrap;margin-inline-start:4px}
.na{color:#9AA7B8;font-style:italic;font-size:.95em}
.pf-note{margin:6px 0 0;font-size:12.5px;color:var(--muted)}
.vt.out{background:#FFFBFB;border-color:#F3CFCF}
.vt.ok::before,.vt.warn::before,.vt.bad::before{background:transparent}
.vt b{font-size:19px}
.vt-l,.vt-u{font-size:12px}

/* comparison board */
.cmp-ctrl{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:space-between}
.seg{display:inline-flex;background:#F1F4F8;border-radius:12px;padding:3px;gap:2px}
.seg button{border:0;background:transparent;padding:7px 13px;border-radius:9px;font-size:13px;font-weight:600;color:var(--soft);cursor:pointer}
.seg button.on{background:#fff;color:#1F5FAE;box-shadow:0 1px 3px rgba(15,42,74,.12)}
.cmp-sel{display:flex;gap:10px;flex-wrap:wrap}
.cmp-sel label{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.cmp-sel select{height:36px;border:1px solid var(--line2);border-radius:10px;padding:0 10px;font:inherit;font-size:13px;color:var(--text);background:#fff}
.ctx-note{font-size:13px;color:#8A5A0A;background:#FFF8EC;border:1px solid #F2DDB5;border-radius:10px;padding:8px 12px}
.pg-visit.now{background:#F2F7FD}
.pg-gap{border-style:solid;border-width:1px}
.mt::before{display:none}
.mt-s{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.mt-v .prev{text-decoration:none}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:13.5px;line-height:1.75}
.two small{display:block;color:var(--muted);font-size:11.5px;margin-bottom:2px}
.med-grp{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-bottom:6px}
.med-grp .label{min-width:130px}
.rx-tag.off{text-decoration:none;color:var(--muted);border-style:dashed}
.pg-actions{display:flex;gap:8px;justify-content:flex-end}
.pg-h b{font-size:14px}

/* rx pad: calmer */
.rx-symbol{background:#1F5FAE;box-shadow:none}
.rx-top{background:#FAFBFD}
.rx-meta{font-size:13px}
.rx-stop em{flex-basis:100%;font-style:normal;font-size:12px;color:var(--muted)}
.rx-foot{padding:10px 20px;font-size:12.5px;color:var(--muted);border-top:1px solid var(--line)}

/* charts */
.lg .ln{width:16px;height:0;border-top:2px solid #1F5FAE;border-radius:0}
.lg .ln.dash{border-top:2px dashed #5B8DCC}
.lg .ln.ref{border-top:1px dashed #C53B3B}
.lg .nd{background:#fff;border:1px solid #C3CFDD}
.ch-ref{stroke:#C53B3B;opacity:.55}
.ch-ref-t{fill:#A92E2E;font-size:10.5px}
.ch-pt .hit{fill:transparent}
.ch-pt.hov .hit{fill:#1F5FAE;opacity:.06}
.ch-pt:focus{outline:none}.ch-pt:focus .hit{fill:#1F5FAE;opacity:.1}
.vc-num b{font-size:28px}
.vcard{box-shadow:none}
.vc-foot{font-size:12px}

/* timelines */
.gt-seg{opacity:.85}
.sl-dot{background:#1F5FAE;box-shadow:0 0 0 3px #fff,0 0 0 4px #C9DBF2;cursor:pointer}
.sl-line{background:#C9DBF2}
.gt-label small{font-size:12px}

/* dental */
.layers{display:flex;flex-wrap:wrap;gap:6px}
.layers span{font-size:12.5px;font-weight:600;padding:5px 11px;border-radius:999px;border:1px solid var(--line)}
.layers .on{background:#1F5FAE;color:#fff;border-color:#1F5FAE}
.layers .off{color:#9AA7B8;background:#F7F9FC;border-style:dashed}
.tooth2 .sf{font-style:normal;font-size:9.5px;font-weight:700;color:#1F5FAE;line-height:1}
.tooth2:focus-visible{outline:2px solid #1F5FAE;outline-offset:1px}

.muted-card{background:#FAFBFD}
.na-grid{display:flex;flex-wrap:wrap;gap:8px}
.na-grid span{font-size:12.5px;color:#7C8CA3;border:1px dashed #D3DDEA;border-radius:10px;padding:6px 10px;background:#fff}

/* bigger minimum text */
.pf .tbl{font-size:13.5px}.pf .tbl th{font-size:12.5px}
.vchip{font-size:12.5px}
.pf-tl-h span,.pg-h span{font-size:13px}
@media (max-width:1349px){ .pf-mini{display:none} }
@media (max-width:700px){ .two{grid-template-columns:1fr} .findings li{flex-direction:column;align-items:flex-start;gap:4px} .med-grp .label{min-width:0;flex-basis:100%} .seg{flex-wrap:wrap} }

@media (max-width:1749px){ .pf-mini{display:none} }
.pf-tabs button{padding:12px 11px}
@media (max-width:600px){ .nav{grid-template-columns:repeat(6,minmax(0,1fr)) !important} .nav button{font-size:9.5px !important} }

/* brand marks */
.dentech-logo{display:block;height:58px;width:auto;margin-inline-start:6px}
.logo-img{width:84px}
.logo-img.big{width:min(190px,52%);margin:2px auto 6px}
.layout.pf-mode .logo-img.big{width:min(130px,46%)}
@media (min-width:1100px) and (max-height:820px){ .logo-img.big{width:min(150px,44%)} .dentech-logo{height:46px} }
@media (max-width:1099px){ .dentech-logo{height:46px} }
@media (max-width:800px){ .top-meta{flex-wrap:wrap} .dentech-logo{height:40px;margin-inline-start:auto} }
/* Dentech: clear brand block at the far left of the header */
.dentech-logo{height:74px;margin-inline-start:14px;padding-inline-start:22px;border-inline-start:1px solid var(--line)}
@media (min-width:1100px) and (max-height:820px){ .dentech-logo{height:62px} }
@media (max-width:1099px){ .dentech-logo{height:60px;padding-inline-start:16px} }
@media (max-width:800px){ .dentech-logo{height:52px;border:0;padding:0} }
@media (max-width:800px){ .top-meta{flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:10px} .dentech-logo{height:48px;margin:0} .date-chip{padding:9px 14px;font-size:12.5px} }

/* ================================================================ v5 — journey, safety, pharmacy, billing */
.dentech-logo{height:92px}
@media (min-width:1100px) and (max-height:820px){ .dentech-logo{height:76px} }
@media (max-width:1099px){ .dentech-logo{height:70px} }
@media (max-width:800px){ .dentech-logo{height:56px} }
.pf-tabs{overflow-x:auto;scrollbar-width:thin}

.journey{display:flex;flex-direction:column;gap:0;direction:ltr}
.jr-lane{display:grid;grid-template-columns:minmax(0,1fr) 130px;align-items:center;border-bottom:1px solid #EEF2F7;min-height:54px}
.jr-l{direction:rtl;text-align:right;padding:8px 0 8px 10px;display:flex;flex-direction:column}
.jr-l b{font-size:13.5px}.jr-l small{font-size:11.5px;color:var(--muted)}
.jr-lane>.jr-l{order:2}
.jr-track{position:relative;height:54px;background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1px),#F3F6FA calc(10% - 1px) 10%)}
.jr-axis{min-height:32px;border-bottom:1px solid var(--line)}.jr-axis .jr-track{height:32px;background:none}
.jr-axis .gt-tick{bottom:2px}
.jr-visit{position:absolute;top:50%;width:18px;height:18px;border-radius:50%;transform:translate(-50%,-50%);background:var(--c);border:3px solid #fff;box-shadow:0 0 0 1.5px var(--c);cursor:pointer;padding:0}
.jr-visit:hover,.jr-visit.hov{transform:translate(-50%,-50%) scale(1.25)}
.jr-chip{position:absolute;top:50%;transform:translate(-50%,-50%);font-size:11px;font-weight:700;padding:3px 7px;border-radius:7px;white-space:nowrap;cursor:default;direction:ltr}
.jr-chip i{font-style:normal;opacity:.7;margin-inline-start:2px}
.jr-chip.dx{background:#EAF1FA;color:#1F5FAE;border:1px solid #C9DBF2}
.jr-chip.rx{background:#E7F5F0;color:#0B6B57;border:1px solid #BFE3D7}
.jr-chip.pr{background:#F2EFFB;color:#4B3FB0;border:1px solid #D6D0F2;min-width:22px;text-align:center}
.jr-chip.hov{box-shadow:0 4px 10px rgba(15,42,74,.18)}
.jr-bp{position:absolute;inset:0;width:100%;height:100%}
.jr-dot{position:absolute;width:9px;height:9px;border-radius:50%;background:#fff;border:2px solid #1F5FAE;transform:translate(-50%,-50%)}
.jr-dot.out{border-color:#C53B3B;background:#FDF0F0}

.safety-head{display:flex;align-items:center;gap:14px;padding:16px 18px;border-inline-start:5px solid #0E7C66}
.safety-head.warn{border-inline-start-color:#C98A1A}.safety-head.bad{border-inline-start-color:#C53B3B}
.safety-head b{font-size:16px;display:block}.safety-head small{font-size:12.5px;color:var(--muted);line-height:1.7}
.safety-head>.kind{margin-inline-start:auto;flex:0 0 auto}
.sh-ic{flex:0 0 42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:20px;color:#fff;background:#0E7C66}
.safety-head.warn .sh-ic{background:#C98A1A}.safety-head.bad .sh-ic{background:#C53B3B}
.safety-list{list-style:none;margin:0;padding:0}
.safety-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0 10px 0;border-bottom:1px solid #EEF2F7;font-size:13.5px;line-height:1.7;padding-inline-start:14px;position:relative}
.safety-list li::before{content:"";position:absolute;right:0;top:1.25em;width:7px;height:7px;border-radius:50%;background:#1F5FAE}
.safety-list li.bad::before{background:#C53B3B}.safety-list li.warn::before{background:#C98A1A}
.safety-list li.bad{color:#7E2222}
.allergy-box{border:1px solid var(--line);border-radius:14px;padding:14px;background:#FAFBFD}
.allergy-box.has{background:#FDF4F4;border-color:#F3CFCF}
.allergy-box>b{font-size:17px;display:block;margin-bottom:10px}
.allergy-box.has>b{color:#A92E2E}
.al-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.al-grid span{font-size:12px;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px}
.al-grid em{display:block;font-style:normal;color:#9AA7B8;margin-top:2px}
.stock-cta{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.rx-foot{display:flex;flex-direction:column;gap:8px}
.rx-foot .stock-cta{width:100%}
.stock-slot{width:100%}

.stk-sum{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.stk-sum span{display:flex;align-items:baseline;gap:6px;font-size:12.5px;padding:7px 12px;border-radius:12px;border:1px solid var(--line);background:#fff}
.stk-sum b{font-size:18px}
.stk-sum .in b{color:#0B6B57}.stk-sum .low b{color:#9A5B05}.stk-sum .out b{color:#A92E2E}
.stk-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.stk{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fff;display:flex;flex-direction:column;gap:7px;border-inline-start:4px solid #0E7C66}
.stk.low{border-inline-start-color:#C98A1A}.stk.out{border-inline-start-color:#C53B3B;background:#FFFBFB}
.stk-h{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.stk-h b{display:block;font-size:14px;direction:ltr;text-align:right;unicode-bidi:plaintext}
.stk-h small{font-size:11.5px;color:var(--muted)}
.stk-badge{flex:0 0 auto;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;background:#E3F6F0;color:#0B6B57}
.stk.low .stk-badge{background:#FFF2DD;color:#9A5B05}.stk.out .stk-badge{background:#FDE8E8;color:#A92E2E}
.stk-bar{height:6px;border-radius:6px;background:#EEF2F7;overflow:hidden}
.stk-bar span{display:block;height:100%;background:#0E7C66;border-radius:6px}
.stk.low .stk-bar span{background:#C98A1A}.stk.out .stk-bar span{background:#C53B3B}
.stk-meta{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12.5px;color:var(--muted)}
.stk-meta b{color:var(--text)}
.stk-pt{font-size:12px;color:var(--soft);background:#F7F9FC;border-radius:8px;padding:6px 9px}

.bill-split{display:flex;align-items:center;gap:20px;justify-content:center;padding:6px 0}
.bill-ring{width:150px;height:150px}
.bs-row{display:flex;align-items:center;gap:8px;font-size:13.5px;padding:6px 0;min-width:170px}
.bs-row i{width:12px;height:12px;border-radius:4px}
.bs-row b{margin-inline-start:auto;font-size:15px}
.ch-pt .hit{fill:transparent}.ch-pt.hov .hit{fill:#1F5FAE;opacity:.05}

@media (max-width:700px){ .jr-lane{grid-template-columns:minmax(0,1fr) 78px} .stk-list,.al-grid{grid-template-columns:1fr} .bill-split{flex-direction:column} }
.stk-meta span{direction:rtl}
.top{min-height:108px;padding-top:8px;padding-bottom:8px}.dentech-logo{height:88px}@media (min-width:1100px) and (max-height:820px){.top{min-height:92px}.dentech-logo{height:74px}}@media (max-width:800px){.top{min-height:0}}

/* ================================================================ report → PDF → e-mail */
.sec-actions{display:flex;align-items:center;gap:10px}
#mailBtn svg{flex:0 0 16px}
.rp-ov{position:fixed;inset:0;z-index:80;background:rgba(15,42,74,.35);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;transition:opacity .25s}
.rp-ov.in{opacity:1}
.rp-card{width:min(440px,100%);background:#fff;border-radius:22px;padding:26px 26px 20px;box-shadow:0 30px 80px rgba(15,42,74,.35);transform:translateY(14px) scale(.98);transition:transform .3s}
.rp-ov.in .rp-card{transform:none}
.rp-stage{position:relative;height:150px;margin-bottom:8px;overflow:hidden;border-radius:16px;background:radial-gradient(ellipse at 50% 60%,#EEF4FC,#fff 70%)}
.rp-doc{position:absolute;left:50%;top:22px;width:84px;height:106px;margin-left:-42px;background:#fff;border:1.5px solid #D3DDEA;border-radius:8px;box-shadow:0 10px 24px rgba(15,42,74,.12);padding:28px 12px 0;display:flex;flex-direction:column;gap:7px;overflow:hidden;transition:transform .6s cubic-bezier(.5,0,.2,1),opacity .4s}
.rp-doc-h{position:absolute;top:0;left:0;right:0;height:20px;background:#C53B3B;display:flex;align-items:center;justify-content:center}
.rp-doc-h span{color:#fff;font:700 10px/1 Arial,sans-serif;letter-spacing:1px}
.rp-doc i{display:block;height:5px;border-radius:3px;background:#DCE6F3;width:100%;transform-origin:right;animation:rpline 1.2s ease-in-out infinite}
.rp-doc i.s{width:60%}
.rp-doc i:nth-child(3){animation-delay:.15s}.rp-doc i:nth-child(4){animation-delay:.3s}.rp-doc i:nth-child(5){animation-delay:.45s}.rp-doc i:nth-child(6){animation-delay:.6s}
@keyframes rpline{0%{transform:scaleX(.2);background:#C9DBF2}60%{transform:scaleX(1);background:#1F5FAE}100%{transform:scaleX(1);background:#DCE6F3}}
.rp-scan{position:absolute;left:0;right:0;height:22px;background:linear-gradient(transparent,rgba(31,95,174,.18),transparent);animation:rpscan 1.1s linear infinite}
@keyframes rpscan{from{top:0}to{top:100%}}
.rp-env{position:absolute;left:50%;top:44px;width:96px;margin-left:-48px;opacity:0;transform:scale(.6);transition:all .45s cubic-bezier(.3,1.4,.5,1)}
.rp-env svg{width:96px;height:66px;fill:#fff;stroke:#1F5FAE;stroke-width:2.2;stroke-linejoin:round}
.rp-plane{position:absolute;left:50%;top:56px;width:40px;height:40px;margin-left:-20px;opacity:0}
.rp-plane svg{width:40px;height:40px;fill:#EAF1FA;stroke:#1F5FAE;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.rp-done{position:absolute;left:50%;top:38px;width:76px;height:76px;margin-left:-38px;border-radius:50%;background:#0E7C66;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.4);transition:all .4s cubic-bezier(.3,1.5,.5,1);box-shadow:0 0 0 10px rgba(14,124,102,.12)}
.rp-done svg{width:40px;height:40px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:30;stroke-dashoffset:30}
.rp-card[data-phase="env"] .rp-doc{transform:translateY(18px) scale(.55);opacity:.0}
.rp-card[data-phase="env"] .rp-env{opacity:1;transform:none}
.rp-card[data-phase="fly"] .rp-doc,.rp-card[data-phase="done"] .rp-doc{opacity:0}
.rp-card[data-phase="fly"] .rp-env{opacity:0;transform:scale(.4) translateY(10px)}
.rp-card[data-phase="fly"] .rp-plane{animation:rpfly 1.25s cubic-bezier(.45,0,.3,1) forwards}
@keyframes rpfly{0%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}35%{opacity:1;transform:translate(-40px,18px) rotate(-12deg) scale(1.05)}75%{opacity:1}100%{opacity:0;transform:translate(190px,-120px) rotate(18deg) scale(.5)}}
.rp-card[data-phase="done"] .rp-done{opacity:1;transform:none}
.rp-card[data-phase="done"] .rp-done svg{animation:rpcheck .45s .15s ease-out forwards}
@keyframes rpcheck{to{stroke-dashoffset:0}}
.rp-title{text-align:center;font-size:18px;margin:4px 0 12px}
.rp-title small{display:block;font-size:13px;font-weight:500;color:var(--muted);margin-top:4px}
.rp-steps{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:8px}
.rp-steps li{display:grid;grid-template-columns:22px 1fr;column-gap:10px;align-items:center;font-size:14px;color:#9AA7B8;transition:color .2s}
.rp-steps li small{grid-column:2;font-size:12px;color:#9AA7B8;direction:rtl;unicode-bidi:plaintext}
.rp-steps li span{grid-row:span 2;width:20px;height:20px;border-radius:50%;border:2px solid #D3DDEA;position:relative}
.rp-steps li.run{color:var(--text);font-weight:600}
.rp-steps li.run span{border-color:#C9DBF2;border-top-color:#1F5FAE;animation:spin .8s linear infinite}
.rp-steps li.ok{color:var(--text)}
.rp-steps li.ok span{background:#0E7C66;border-color:#0E7C66}
.rp-steps li.ok span::after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.rp-bar{height:5px;border-radius:5px;background:#EEF2F7;overflow:hidden}
.rp-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#1F5FAE,#3A7BD5);border-radius:5px;transition:width .6s ease}
.rp-foot{display:flex;gap:8px;justify-content:center;margin-top:16px}
.rp-foot button{height:42px;padding:0 18px;border-radius:12px;font-weight:600;cursor:pointer}
.rp-foot .gold{border:0;color:#fff}

/* PDF (print): only the analysis result, clean A4 */
@media print{
  @page{size:A4;margin:14mm}
  body{background:#fff}
  .rail,.top,.avatar-panel,.dash,#welcome,.pf-tabs,.pf-tabbar,.sec-actions button,#historyBox,.rp-ov,.toast,.pf-tip,.collapse-btn,.btn-ghost,.src-btn,.stock-cta{display:none !important}
  .shell{margin:0 !important;height:auto !important;overflow:visible !important}
  .layout{display:block !important;padding:0 !important;overflow:visible !important}
  .analysis{overflow:visible !important;padding:0 !important}
  .panel,.card,.pf-card,.vcard{box-shadow:none !important;break-inside:avoid}
  #answer::before{content:"نصيح — تقرير";display:block;font:700 18px 'Plex Arabic',Tahoma;color:#1F5FAE;border-bottom:2px solid #1F5FAE;padding-bottom:6px;margin-bottom:10px}
}
.rp-steps li small[dir=ltr]{text-align:right;unicode-bidi:isolate}

/* ================================================================ إدارة المواعيد */
.appt{display:flex;flex-direction:column;gap:14px}
.appt svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ap-warnline{display:inline-flex;align-items:center;gap:6px;color:var(--coral);font-weight:600}.ap-warnline svg{width:16px;height:16px}

/* top bar */
.ap-bar{display:flex;align-items:center;gap:12px;padding:12px 14px;flex-wrap:wrap}
.ap-field{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.ap-field>span{display:inline-flex;align-items:center;gap:6px}.ap-field svg{width:17px;height:17px;color:var(--gold)}
.ap-field select{height:40px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0 12px;font:inherit;font-size:14px;color:var(--text);min-width:220px;max-width:320px}
.ap-datenav{display:flex;align-items:center;gap:4px;background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:3px}
.ap-ic{width:34px;height:34px;border-radius:9px;border:0;background:transparent;color:var(--soft);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto}
.ap-ic:hover{background:#fff;color:var(--gold)}.ap-ic svg{width:17px;height:17px}
.ap-today{height:34px;border:0;border-radius:9px;background:#fff;color:var(--text);font:inherit;font-size:13px;font-weight:600;padding:0 12px;display:inline-flex;align-items:center;gap:7px;cursor:pointer;box-shadow:0 1px 2px rgba(15,42,74,.06)}
.ap-today svg{width:16px;height:16px;color:var(--gold)}
.ap-search{flex:1;min-width:260px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:0 4px 0 12px;background:#fff;height:42px}
.ap-search:focus-within{border-color:#9DB9DD;box-shadow:0 0 0 3px rgba(31,95,174,.08)}
.ap-search>svg{width:18px;height:18px;color:var(--dim);flex:0 0 auto}
.ap-search input{flex:1;min-width:0;border:0;outline:0;font:inherit;font-size:14px;background:transparent;color:var(--text)}
.ap-search button{height:34px;border-radius:9px;border:1px solid;padding:0 14px;font:inherit;font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap}
.ap-search button svg{width:16px;height:16px}
.ap-search.big{height:52px;margin-top:4px}.ap-search.big input{font-size:15px}

/* board */
.ap-board{display:flex;flex-direction:column;gap:12px}
.ap-kpis{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.ap-k{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;position:relative;overflow:hidden}
.ap-k::before{content:"";position:absolute;inset:0 0 auto auto;width:4px;height:100%;background:var(--k,#C9D6E6)}
.ap-k b{font-size:22px;font-weight:700;color:var(--text);text-align:right}.ap-k span{font-size:12px;color:var(--muted)}
.ap-k.tot{--k:#1F5FAE}.ap-k.ok{--k:#0E9F7E}.ap-k.wait{--k:#E2A43B}.ap-k.in{--k:#2E8BDA}.ap-k.out{--k:#7A8CA5}.ap-k.cnl{--k:#D64545}.ap-k.ftc{--k:#EE6A3C}
.ap-list{padding:6px 0}
.ap-list-h{display:flex;align-items:center;gap:10px;padding:10px 16px 12px;border-bottom:1px solid var(--line);font-weight:600;font-size:14px;flex-wrap:wrap}
.ap-list-h .muted{font-weight:400;font-size:12px}
.ap-chip{margin-inline-start:auto;display:inline-flex;align-items:center;gap:6px;background:var(--gold-bg);color:var(--gold);border-radius:20px;padding:4px 11px;font-size:12px;font-weight:600}
.ap-chip svg{width:14px;height:14px}
.ap-row{display:grid;grid-template-columns:92px minmax(0,1.4fr) minmax(0,1fr) auto;align-items:center;gap:14px;padding:12px 16px;border-bottom:1px solid #EEF2F7;position:relative}
.ap-row:last-child{border-bottom:0}
.ap-row::before{content:"";position:absolute;right:0;top:10px;bottom:10px;width:3px;border-radius:3px;background:var(--sc,#C9D6E6)}
.ap-row:hover{background:#FAFCFE}
.ap-row.s-cnl,.ap-row.s-mov,.ap-row.s-ftc{opacity:.62}
.s-wait{--sc:#E2A43B}.s-ok{--sc:#0E9F7E}.s-emg{--sc:#D64545}.s-walk{--sc:#2E8BDA}.s-cnl{--sc:#97A6BA}.s-ftc{--sc:#EE6A3C}.s-mov{--sc:#7A8CA5}
.ap-time{display:flex;flex-direction:column;gap:1px;text-align:right}.ap-time b{font-size:15px}.ap-time span{font-size:11.5px;color:var(--muted)}
.ap-time .num,.ap-time b{direction:rtl}
.ap-who{display:flex;flex-direction:column;min-width:0}.ap-who b{font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ap-who .muted{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-state{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ap-pill{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:20px;font-size:12px;font-weight:600;background:color-mix(in srgb,var(--sc) 13%,#fff);color:color-mix(in srgb,var(--sc) 80%,#0F2A4A);white-space:nowrap}
.ap-att{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;color:var(--soft);background:var(--card2);border:1px solid var(--line);border-radius:20px;padding:2px 8px}
.ap-att svg{width:13px;height:13px}.ap-att.in{color:#2E8BDA}.ap-att.out{color:#7A8CA5}
.ap-acts{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.ap-act{height:32px;border-radius:9px;border:1px solid var(--line);background:#fff;color:var(--soft);font:inherit;font-size:12.5px;font-weight:600;padding:0 10px;display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.ap-act svg{width:15px;height:15px}
.ap-act:hover{border-color:#9DB9DD;color:var(--gold)}
.ap-act.pri{background:var(--gold);border-color:var(--gold);color:#fff}.ap-act.pri:hover{background:#184E92;color:#fff}
.ap-act.dang{color:#C23B3B}.ap-act.dang:hover{border-color:#E9A7A7;background:#FDF3F3}
.ap-empty{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:38px 16px;color:var(--muted)}
.ap-empty svg{width:40px;height:40px;color:#B7C7DB}.ap-empty b{color:var(--text);font-size:15px}.ap-empty span{font-size:13px}
.ap-empty.sm{padding:22px 10px}

/* wizard */
.ap-wiz{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:14px;align-items:start}
.ap-main{display:flex;flex-direction:column;gap:12px;min-width:0}
.ap-aside{display:flex;flex-direction:column;gap:12px;position:sticky;top:0}
.ap-step{min-width:0;max-width:100%;padding:16px 18px;transition:border-color .2s,box-shadow .2s}
.ap-step.on{border-color:#B9CFEA;box-shadow:0 0 0 3px rgba(31,95,174,.06),0 6px 20px rgba(15,42,74,.04)}
.ap-step-h{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ap-step-h>div{display:flex;flex-direction:column;flex:1;min-width:0}.ap-step-h b{font-size:15.5px}.ap-step-h .muted{font-size:12.5px}
.ap-n{width:30px;height:30px;border-radius:50%;background:var(--card2);border:1.5px solid var(--line2);color:var(--soft);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex:0 0 auto;transition:all .25s}
.ap-step.on .ap-n{background:var(--gold);border-color:var(--gold);color:#fff}
.ap-step.done .ap-n{background:#E7F6F1;border-color:#9BD7C6;color:#0E9F7E;font-size:0}
.ap-step.done .ap-n::after{content:"✓";font-size:15px}
.ap-near{height:34px;border-radius:10px;border:1px solid #F3C6B4;background:#FFF5F1;color:#C8522A;font:inherit;font-size:13px;font-weight:700;padding:0 12px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap}
.ap-near svg{width:16px;height:16px}.ap-near:hover{background:#FFEDE5}
.ap-none{font-size:13px;margin:4px 2px}

.ap-docs{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;max-height:236px;overflow:auto;padding:2px}
.ap-doc{position:relative;display:flex;align-items:center;gap:10px;text-align:right;border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;font:inherit;cursor:pointer;color:var(--text)}
.ap-doc>span:nth-child(2){display:flex;flex-direction:column;min-width:0}.ap-doc b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ap-doc .muted{font-size:11.5px}
.ap-doc-ic{width:34px;height:34px;border-radius:10px;background:var(--gold-bg);color:var(--gold);display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.ap-doc-ic svg{width:18px;height:18px}
.ap-doc:hover{border-color:#9DB9DD}
.ap-doc.sel{border-color:var(--gold);background:#F3F8FE;box-shadow:inset 0 0 0 1px var(--gold)}
.ap-doc.sel .ap-doc-ic{background:var(--gold);color:#fff}
.ap-doc:disabled{opacity:.45;cursor:not-allowed}
.ap-last{position:absolute;top:-8px;left:10px;font-style:normal;font-size:10.5px;font-weight:700;background:#0E9F7E;color:#fff;border-radius:10px;padding:1px 8px}

.ap-days-wrap{display:flex;align-items:center;gap:6px}
.ap-days{flex:1;display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 8px;scrollbar-width:thin}
.ap-day{scroll-snap-align:center;flex:0 0 86px;display:flex;flex-direction:column;align-items:center;gap:1px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:9px 6px 8px;font:inherit;color:var(--text);cursor:pointer;position:relative;transition:transform .15s,border-color .15s}
.ap-day:hover:not(:disabled){transform:translateY(-2px);border-color:#9DB9DD}
.ap-day .wd{font-size:11.5px;color:var(--muted)}.ap-day b{font-size:24px;line-height:1.15}.ap-day .mo{font-size:11.5px;color:var(--soft)}
.ap-day .hj{font-size:10px;color:var(--dim);white-space:nowrap;direction:rtl;unicode-bidi:isolate}
.ap-day .fr{margin-top:3px;font-size:11px;font-weight:700;color:#0E9F7E}
.ap-day .ld{display:block;width:70%;height:3px;border-radius:3px;background:#EEF2F7;margin-top:5px;overflow:hidden}.ap-day .ld i{display:block;height:100%;background:#9DB9DD;border-radius:3px}
.ap-day.full .fr{color:var(--coral)}
.ap-day.off{background:repeating-linear-gradient(135deg,#F7F9FC 0 6px,#F1F4F8 6px 12px);color:var(--dim);cursor:not-allowed}
.ap-day.off .fr{color:var(--dim)}.ap-day.off b{color:var(--dim)}
.ap-day.sel{background:var(--gold);border-color:var(--gold);color:#fff;box-shadow:0 8px 20px rgba(31,95,174,.25)}
.ap-day.sel .wd,.ap-day.sel .mo,.ap-day.sel .hj,.ap-day.sel .fr{color:rgba(255,255,255,.85)}
.ap-day.sel .ld{background:rgba(255,255,255,.25)}.ap-day.sel .ld i{background:#fff}
.ap-skel{flex:0 0 86px;height:118px;border-radius:14px;background:linear-gradient(90deg,#F1F4F8,#F8FAFC,#F1F4F8);background-size:200% 100%;animation:apsk 1.2s infinite}
@keyframes apsk{to{background-position:-200% 0}}

.ap-legend{display:flex;gap:14px;font-size:12px;color:var(--muted);margin-bottom:8px;flex-wrap:wrap}
.ap-legend span{display:inline-flex;align-items:center;gap:6px}.ap-legend i{width:12px;height:12px;border-radius:4px;border:1px solid var(--line2)}
.ap-legend i.free{background:#fff}.ap-legend i.busy{background:#FFF4E6;border-color:#F2C78F}.ap-legend i.past{background:#F1F4F8}
.ap-period{margin-top:10px}
.ap-period-h{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}.ap-period-h b{font-size:13px;color:var(--soft)}.ap-period-h .muted{font-size:11.5px}
.ap-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:7px}
.ap-slot{position:relative;height:40px;border-radius:10px;border:1px solid var(--line);background:#fff;font:inherit;font-size:13.5px;font-weight:600;color:var(--text);cursor:pointer;transition:all .12s}
.ap-slot .num{direction:rtl}
.ap-slot:hover:not(:disabled){border-color:var(--gold);color:var(--gold)}
.ap-slot.busy{background:#FFF8EE;border-color:#F2D3A8;color:#9A6418}
.ap-slot.busy i{position:absolute;top:-6px;left:-6px;min-width:18px;height:18px;border-radius:9px;background:#E2A43B;color:#fff;font-style:normal;font-size:10.5px;display:flex;align-items:center;justify-content:center;padding:0 4px}
.ap-slot.past,.ap-slot:disabled{background:#F4F6F9;color:#B4C0D0;border-color:#EDF1F5;cursor:not-allowed}
.ap-slot.sel,.ap-slot.sel:hover:not(:disabled){background:var(--gold);border-color:var(--gold);color:#fff;box-shadow:0 6px 16px rgba(31,95,174,.28);transform:translateY(-1px)}
.ap-slot-skel{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:7px}.ap-slot-skel i{height:40px;border-radius:10px;background:linear-gradient(90deg,#F1F4F8,#F8FAFC,#F1F4F8);background-size:200% 100%;animation:apsk 1.2s infinite}

.ap-opt{display:grid;grid-template-columns:110px minmax(0,1fr);align-items:center;gap:12px;padding:8px 0;border-top:1px dashed #EAEFF5}
.ap-opt:first-child{border-top:0}
.ap-opt>span{font-size:13px;color:var(--muted)}
.ap-opt input{height:40px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font:inherit;font-size:14px;color:var(--text);width:100%}
.ap-opt input:focus{outline:0;border-color:#9DB9DD;box-shadow:0 0 0 3px rgba(31,95,174,.08)}
.ap-segs{display:inline-flex;background:var(--card2);border:1px solid var(--line);border-radius:11px;padding:3px;gap:3px;flex-wrap:wrap}
.ap-segs.wrap{display:flex}
.ap-seg{height:32px;border:0;border-radius:8px;background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--soft);padding:0 13px;cursor:pointer}
.ap-seg:hover:not(:disabled){background:#fff}
.ap-seg.sel{background:#fff;color:var(--gold);box-shadow:0 1px 3px rgba(15,42,74,.12)}
.ap-seg.s0.sel{color:#B47A16}.ap-seg.s2.sel{color:#C23B3B}
.ap-seg:disabled{color:#BCC8D6;cursor:not-allowed}

/* patient card */
.ap-pcard{min-width:0;padding:16px;display:flex;flex-direction:column;gap:12px}
.ap-pcard.empty{align-items:center;text-align:center;gap:6px;padding:24px 16px}
.ap-pc-top{display:flex;align-items:center;gap:14px}
.ap-avatar{flex:0 0 auto;filter:drop-shadow(0 6px 14px rgba(15,42,74,.12))}
.ap-pc-id{display:flex;flex-direction:column;min-width:0;gap:2px}.ap-pc-id b{font-size:16.5px;line-height:1.4}.ap-pc-id .muted{font-size:12.5px}
.ap-pc-stats{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.ap-pc-stats>div{display:flex;flex-direction:column;align-items:center;padding:8px 4px;gap:1px;text-align:center}
.ap-pc-stats>div+div{border-right:1px solid var(--line)}
.ap-pc-stats b{font-size:14px}.ap-pc-stats span{font-size:11px;color:var(--muted)}
.ap-alerts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ap-alerts li{display:flex;align-items:flex-start;gap:7px;font-size:12.5px;border-radius:10px;padding:7px 10px;background:#FFF8EE;color:#8A5A12}
.ap-alerts li.bad{background:#FDF0F0;color:#B23434}.ap-alerts svg{width:15px;height:15px;flex:0 0 auto;margin-top:2px}
.ap-up ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.ap-up li{display:grid;grid-template-columns:1fr auto;gap:2px 8px;font-size:12.5px;padding:8px 10px;border-radius:10px;background:var(--card2)}
.ap-up li>span:nth-child(2){grid-column:1;color:var(--muted);font-size:12px}.ap-up li .ap-pill{grid-row:1/3;grid-column:2;align-self:center}
.ap-pc-links{display:flex;gap:8px}
.ap-link{flex:1;height:34px;border-radius:9px;border:1px solid var(--line);background:#fff;color:var(--soft);font:inherit;font-size:12.5px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}
.ap-link svg{width:15px;height:15px}.ap-link:hover{border-color:#9DB9DD;color:var(--gold)}
.ap-matches{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.ap-match{display:flex;align-items:center;gap:12px;text-align:right;border:1px solid var(--line);background:#fff;border-radius:12px;padding:8px 12px;font:inherit;color:var(--text);cursor:pointer}
.ap-match>span{display:flex;flex-direction:column;flex:1}.ap-match .muted{font-size:12px}.ap-match>svg:last-child{width:18px;height:18px;color:var(--dim)}
.ap-match:hover{border-color:var(--gold);background:#F7FAFE}

/* live ticket */
.ap-ticket{padding:0;overflow:hidden;position:relative}
.tk-h{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(135deg,#1F5FAE,#184E92);color:#fff;padding:12px 16px;font-weight:700;font-size:14px}
.tk-h i{width:46px;height:8px;background:radial-gradient(circle,rgba(255,255,255,.5) 2px,transparent 2.5px) 0 0/8px 8px}
.ap-ticket dl{margin:0;padding:6px 16px 4px;position:relative}
.ap-ticket dl::before,.ap-ticket dl::after{content:"";position:absolute;top:-10px;width:20px;height:20px;border-radius:50%;background:var(--bg)}
.ap-ticket dl::before{right:-10px}.ap-ticket dl::after{left:-10px}
.ap-ticket dl>div{display:grid;grid-template-columns:86px minmax(0,1fr);gap:8px;padding:9px 0;border-bottom:1px dashed #E3E9F1}
.ap-ticket dl>div:last-child{border-bottom:0}
.ap-ticket dt{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}.ap-ticket dt svg{width:15px;height:15px;color:var(--gold)}
.ap-ticket dd{margin:0;font-size:13.5px;font-weight:600;display:flex;flex-direction:column}.ap-ticket dd>span.tm{display:block}.ap-ticket dd small{font-weight:400;font-size:11.5px;color:var(--muted)}
.tk-warn{display:flex;align-items:center;gap:6px;margin:0 16px 8px;font-size:12px;color:#9A6418;background:#FFF8EE;border-radius:9px;padding:6px 10px}.tk-warn svg{width:15px;height:15px}
.ap-book{margin:8px 16px 16px;width:calc(100% - 32px);height:48px;border-radius:12px;border:0;background:#C9D6E6;color:#fff;font:inherit;font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px;cursor:not-allowed;transition:all .2s}
.ap-book svg{width:19px;height:19px;stroke-width:2.4}
.ap-ticket.ready .ap-book{background:linear-gradient(135deg,#0E9F7E,#0B8A6D);cursor:pointer;box-shadow:0 10px 22px rgba(14,159,126,.28)}
.ap-ticket.ready .ap-book:hover{transform:translateY(-1px)}
.ap-book .spin{border-color:rgba(255,255,255,.4);border-top-color:#fff}

/* dialogs */
.ap-modal{position:fixed;inset:0;z-index:60;background:rgba(15,42,74,.36);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:16px;animation:rise .2s both}
.ap-dialog{width:min(440px,100%);padding:18px;display:flex;flex-direction:column;gap:10px}
.ap-dialog label{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--muted)}
.ap-dialog select,.ap-dialog input{height:40px;border:1px solid var(--line);border-radius:10px;padding:0 10px;font:inherit;font-size:14px;color:var(--text);background:#fff}
.ap-dlg-h{display:flex;gap:12px;align-items:center;margin-bottom:4px}.ap-dlg-h>div{display:flex;flex-direction:column}.ap-dlg-h b{font-size:16px}.ap-dlg-h .muted{font-size:12.5px}
.ap-dlg-ic{width:42px;height:42px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.ap-dlg-ic svg{width:22px;height:22px}
.ap-dlg-ic.dang{background:#FDF0F0;color:#C23B3B}.ap-dlg-ic.warn{background:#FFF4E6;color:#B47A16}
.ap-dlg-f{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.ap-btn{height:40px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--text);font:inherit;font-size:13.5px;font-weight:600;padding:0 14px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.ap-btn svg{width:17px;height:17px}.ap-btn:hover{border-color:#9DB9DD}
.ap-btn.pri{background:var(--gold);border-color:var(--gold);color:#fff}.ap-btn.dang{background:#D64545;border-color:#D64545;color:#fff}
.ap-btn.ghost{background:transparent}

/* success */
.ap-success{padding:26px 22px 22px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;overflow:hidden}
.ap-success h3{font-size:22px;margin-top:4px}
.ap-ok-anim svg{width:92px;height:92px}
.ap-ok-anim .ring{fill:#E7F6F1;stroke:#0E9F7E;stroke-width:5;stroke-dasharray:315;stroke-dashoffset:315;animation:apring .7s .1s ease forwards}
.ap-ok-anim .tick{fill:none;stroke:#0E9F7E;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:70;stroke-dashoffset:70;animation:apring .45s .7s ease forwards}
@keyframes apring{to{stroke-dashoffset:0}}
.ap-pass{position:relative;width:100%;max-width:620px;margin:14px 0 6px;display:grid;grid-template-columns:200px minmax(0,1fr);border:1px solid var(--line);border-radius:16px;overflow:hidden;text-align:right;animation:appass .6s .35s cubic-bezier(.2,.8,.2,1) both;background:#fff}
@keyframes appass{from{opacity:0;transform:translateY(-18px) scale(.97);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0 0 0 0)}}
.ap-pass-l{background:linear-gradient(160deg,#1F5FAE,#163F75);color:#fff;padding:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;border-left:2px dashed rgba(255,255,255,.35)}
.ap-pass-l>div{display:flex;flex-direction:column}.ap-pass-l .muted{color:rgba(255,255,255,.75);font-size:12px}
.ap-pass-r{display:grid;grid-template-columns:1fr 1fr;gap:0}
.ap-pass-r>div{padding:12px 16px;display:flex;flex-direction:column;gap:2px;border-bottom:1px solid #EEF2F7}
.ap-pass-r>div:nth-child(odd){border-left:1px solid #EEF2F7}
.ap-pass-r span{font-size:11.5px;color:var(--muted)}.ap-pass-r b{font-size:14px}.ap-pass-r small{font-size:11.5px;color:var(--muted)}
.ap-pass-r .ap-pill{align-self:flex-start;--sc:#0E9F7E}
.ap-stamp{position:absolute;left:18px;bottom:12px;border:3px solid #0E9F7E;color:#0E9F7E;border-radius:10px;padding:2px 12px;font-weight:800;font-size:16px;transform:rotate(-12deg) scale(2.2);opacity:0;animation:apstamp .35s 1.15s cubic-bezier(.3,1.6,.5,1) forwards;background:rgba(255,255,255,.75)}
@keyframes apstamp{to{transform:rotate(-12deg) scale(1);opacity:.92}}
.ap-send{width:100%;max-width:620px;margin-top:10px;display:flex;flex-direction:column;gap:8px;text-align:right}
.ap-send-btns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ap-sendbtn{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px 14px;font:inherit;color:var(--text);cursor:pointer;text-align:right;transition:all .15s}
.ap-sendbtn>svg{width:34px;height:34px;padding:7px;border-radius:10px;flex:0 0 auto}
.ap-sendbtn>span{display:flex;flex-direction:column}.ap-sendbtn b{font-size:14px}.ap-sendbtn small{font-size:11.5px;color:var(--muted)}
.ap-sendbtn.wa>svg{background:#E8F8EE;color:#1FA855}.ap-sendbtn.mail>svg{background:var(--gold-bg);color:var(--gold)}.ap-sendbtn.pr>svg{background:#F1F4F8;color:var(--soft)}
.ap-sendbtn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(15,42,74,.08)}
.ap-sendbtn.wa:hover{border-color:#8FD9AE}.ap-sendbtn.mail:hover{border-color:#9DB9DD}
.ap-send-stage{border:1px solid var(--line);border-radius:14px;background:var(--card2);padding:16px;display:flex;flex-direction:column;align-items:center;gap:10px;animation:rise .3s both}
.ap-send-t{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;margin:0}
.ap-okdot{width:22px;height:22px;border-radius:50%;background:#0E9F7E;color:#fff;display:inline-flex;align-items:center;justify-content:center}.ap-okdot svg{width:14px;height:14px;stroke-width:3}
.ap-fly{position:relative;width:100%;max-width:420px;height:150px}
.ap-phone{position:absolute;right:18px;top:6px;width:112px;height:138px;border-radius:18px;border:3px solid #0F2A4A;background:#fff;overflow:hidden;box-shadow:0 10px 24px rgba(15,42,74,.15)}
.ap-chat{position:absolute;inset:16px 6px 8px;background:#ECE5DD;border-radius:8px;overflow:hidden}
.ap-bubble{position:absolute;right:5px;bottom:6px;left:12px;background:#DCF8C6;border-radius:8px 8px 2px 8px;padding:5px 6px;font-size:5.4px;line-height:1.5;color:#1d2b1f;text-align:right;transform-origin:100% 100%;animation:apbub .5s .15s cubic-bezier(.3,1.5,.5,1) both;max-height:92px;overflow:hidden}
@keyframes apbub{from{transform:scale(.2);opacity:0}to{transform:none;opacity:1}}
.ap-env{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#F3F8FE,#fff)}
.ap-env svg{width:62px;height:62px;color:var(--gold);animation:apenv .6s .2s ease both}
@keyframes apenv{0%{transform:translateY(30px) scale(.7);opacity:0}100%{transform:none;opacity:1}}
.ap-plane{position:absolute;right:120px;top:52px;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;background:var(--gold);box-shadow:0 8px 18px rgba(31,95,174,.35);animation:apfly 1.4s .5s cubic-bezier(.45,.05,.4,1) both}
.ap-send-stage.wa .ap-plane{background:#1FA855;box-shadow:0 8px 18px rgba(31,168,85,.35)}
.ap-plane svg{width:22px;height:22px;stroke:#fff}
@keyframes apfly{0%{transform:translate(0,0) scale(.4);opacity:0}15%{opacity:1;transform:translate(-20px,-10px) scale(1)}70%{opacity:1}100%{transform:translate(-250px,-30px) scale(.6) rotate(-12deg);opacity:0}}
.ap-trail{position:absolute;right:150px;top:72px;display:flex;gap:16px}
.ap-trail i{width:7px;height:7px;border-radius:50%;background:#B9CFEA;opacity:0;animation:aptrail 1.4s .7s ease-in-out both}
.ap-send-stage.wa .ap-trail i{background:#9FDDB8}
.ap-trail i:nth-child(2){animation-delay:.85s}.ap-trail i:nth-child(3){animation-delay:1s}
@keyframes aptrail{0%,100%{opacity:0}40%{opacity:1}}
.ap-send-stage.sent .ap-phone{animation:apdone .4s ease both}
@keyframes apdone{50%{transform:scale(1.04)}}
.ap-mailform{display:flex;align-items:center;gap:8px;width:100%;max-width:420px}
.ap-mailform>svg{width:20px;height:20px;color:var(--gold)}
.ap-mailform input{flex:1;height:40px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font:inherit;font-size:14px}
.ap-next{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap;justify-content:center}

/* responsive */
@media (max-width:1349px){ .ap-kpis{grid-template-columns:repeat(4,minmax(0,1fr))} .ap-row{grid-template-columns:84px minmax(0,1fr) auto} .ap-state{grid-column:2;grid-row:2} .ap-acts{grid-row:1/3;grid-column:3} }
@media (max-width:1099px){ .ap-wiz{display:flex;flex-direction:column;align-items:stretch} .ap-wiz:has(.ap-success) .ap-pcard{order:3} .ap-main{display:contents} .ap-aside{display:contents} .ap-pcard{order:-1} .ap-ticket{order:5;position:sticky;bottom:calc(72px + env(safe-area-inset-bottom));z-index:5;box-shadow:0 -8px 24px rgba(15,42,74,.12)} .ap-success{order:1} .ap-pass{grid-template-columns:1fr} .ap-pass-l{flex-direction:row;border-left:0;border-bottom:2px dashed rgba(255,255,255,.35)} }
@media (max-width:700px){
  .ap-bar{padding:10px}.ap-field{width:100%}.ap-field select{flex:1;min-width:0;max-width:none}
  .ap-search{min-width:0;flex:1 1 100%}.ap-datenav{flex:1 1 100%;justify-content:space-between}
  .ap-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.ap-k b{font-size:19px}
  .ap-row{grid-template-columns:68px minmax(0,1fr);gap:8px 10px;padding:12px}
  .ap-state{grid-column:2;grid-row:2}.ap-acts{grid-column:1/-1;grid-row:3;justify-content:flex-start}
  .ap-act span{display:none}.ap-act{width:38px;justify-content:center;padding:0}
  .ap-step{padding:14px 12px}.ap-day{flex-basis:76px}.ap-slots{grid-template-columns:repeat(auto-fill,minmax(76px,1fr))}
  .ap-opt{grid-template-columns:1fr;gap:6px}
  .ap-send-btns{grid-template-columns:1fr}.ap-pass-r{grid-template-columns:1fr}.ap-pass-r>div:nth-child(odd){border-left:0}
  .ap-docs{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){ .ap-pass,.ap-stamp,.ap-plane,.ap-trail i,.ap-bubble,.ap-ok-anim *{animation-duration:.01s !important;animation-delay:0s !important} }
@media print{ .appt{display:none !important} }
/* rail: 6 tabs with two-line labels */
.nav button{line-height:1.25;text-align:center}
@media (min-width:601px){ .nav{flex:1;min-height:0;align-content:space-evenly;gap:8px;margin-top:6px} .nav button{padding:12px 2px;gap:7px} .nav button svg{width:27px;height:27px} }

/* booking: Naseeh's words in one strip, compact steps so date + times + ticket fit one screen */
.ap-say{display:flex;align-items:flex-start;gap:10px;background:linear-gradient(90deg,#F3F8FE,#fff);border:1px solid #D7E5F5;border-radius:12px;padding:9px 14px;animation:rise .3s both}
.ap-say>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.ap-say b{font-size:13px;color:var(--soft);font-weight:600}
.ap-say span#apSayA{font-size:13.5px;color:var(--text);line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ap-say-ic{color:var(--coral);font-size:16px;line-height:1.4}
.ap-docs.one{display:flex;align-items:center;gap:10px;max-height:none}
.ap-docs.one .ap-doc{flex:1;cursor:default;padding:8px 12px}
.ap-link.sm{flex:0 0 auto;height:34px;padding:0 12px}
.ap-step{padding:12px 16px}.ap-step-h{margin-bottom:8px}
#apStepDoc .ap-step-h{margin-bottom:6px}
.ap-day{padding:7px 6px 6px;flex-basis:80px}.ap-day b{font-size:21px}
.ap-period{margin-top:6px}.ap-slot{height:36px}
.ap-wiz,.ap-main{gap:10px}
.appt{gap:10px}
.tk-hint{margin:0 16px;font-size:11.5px;color:var(--muted);text-align:center}
.ap-book:focus-visible{outline:3px solid rgba(14,159,126,.35);outline-offset:2px}
/* booking fits one screen: sticky Naseeh strip, compact patient card, ticket always reachable */
.ap-say{position:sticky;top:0;z-index:6;box-shadow:0 6px 16px rgba(15,42,74,.08);background:#F7FAFE}
.ap-say span#apSayA{-webkit-line-clamp:1}
.ap-step{scroll-margin-top:76px}
@media (min-width:1100px){
  .ap-aside{top:64px;max-height:calc(100dvh - 210px);overflow:auto;scrollbar-width:thin}
  .ap-pcard{padding:12px;gap:8px}
  .ap-pcard .ap-avatar{width:64px;height:64px}
  .ap-pc-id b{font-size:15px}
  .ap-pc-stats>div{padding:5px 4px}
  .ap-up li{padding:6px 9px}
  .ap-up ul li:nth-child(n+2){display:none}
  .ap-ticket dl>div{padding:6px 0}
  .tk-h{padding:9px 14px}
  .ap-book{margin:6px 14px 12px;width:calc(100% - 28px);height:44px}
}
@media (min-width:1100px){
  .ap-aside:has(.ap-ticket.ready) .ap-pc-stats,.ap-aside:has(.ap-ticket.ready) .ap-up,.ap-aside:has(.ap-ticket.ready) .ap-pc-links{display:none}
  .ap-aside{max-height:none;overflow:visible}
}

/* ================================================================ booking wizard v2 — one step on stage, steps on the left */
.appt.wz-mode .ap-field,.appt.wz-mode .ap-datenav{display:none}
.wz{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:start}
.wz-stage{padding:20px 22px;min-height:470px;display:flex;flex-direction:column;gap:14px;min-width:0}
.wz-h{display:flex;align-items:center;gap:14px;padding-bottom:14px;border-bottom:1px solid #EEF2F7}
.wz-h>div{flex:1;min-width:0}.wz-h h3{font-size:21px;margin:0}.wz-h p{margin:2px 0 0;font-size:13px}
.wz-n{width:42px;height:42px;border-radius:13px;background:linear-gradient(150deg,#2A6CC0,#1F5FAE);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:19px;box-shadow:0 6px 14px rgba(31,95,174,.25);flex:0 0 auto}
.wz-mic{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:#C8522A;background:#FFF5F1;border:1px solid #F7D3C4;border-radius:20px;padding:6px 12px;max-width:46%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wz-mic svg{width:15px;height:15px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.9}
.wz-body{flex:1;min-width:0;animation:rise .35s both}
.wz-loading{display:flex;align-items:center;gap:10px;color:var(--muted);padding:30px 4px}
.wz-note{font-size:13px;color:var(--soft);margin:14px 2px 8px;font-weight:600}
.wz-matches{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px}
.wz-match{display:flex;align-items:center;gap:12px;text-align:right;border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 12px;font:inherit;color:var(--text);cursor:pointer;transition:all .15s}
.wz-match:hover,.wz-match:focus-visible{border-color:var(--gold);box-shadow:0 6px 16px rgba(31,95,174,.12);transform:translateY(-1px)}
.wz-match>svg:last-child{width:18px;height:18px;color:var(--dim)}
.wz-idx{width:28px;height:28px;border-radius:50%;background:var(--gold-bg);color:var(--gold);font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.wz-mi{display:flex;flex-direction:column;flex:1;min-width:0}.wz-mi b{font-size:14.5px}.wz-mi .muted{font-size:12px}
.wz-empty{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;color:var(--muted);padding:44px 16px}
.wz-empty svg{width:44px;height:44px;color:#B7C7DB;fill:none;stroke:currentColor;stroke-width:1.6}.wz-empty b{color:var(--text);font-size:16px}.wz-empty span{font-size:13px;max-width:420px}
.wz-docs{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.wz-doc{position:relative;display:flex;align-items:center;gap:12px;text-align:right;border:1px solid var(--line);background:#fff;border-radius:14px;padding:12px 14px;font:inherit;color:var(--text);cursor:pointer;transition:all .15s}
.wz-doc>span:nth-child(2){display:flex;flex-direction:column;min-width:0}.wz-doc b{font-size:14px}.wz-doc .muted{font-size:12px}
.wz-doc:hover{border-color:#9DB9DD;transform:translateY(-1px)}
.wz-doc.sel{border-color:var(--gold);background:#F3F8FE;box-shadow:inset 0 0 0 1px var(--gold)}
.wz-doc:disabled{opacity:.45;cursor:not-allowed}
.wz-daybar{display:flex;align-items:center;gap:8px;margin-bottom:12px}.wz-daybar b{font-size:14px;min-width:150px;text-align:center}
.wz-daybar .ap-near{margin-inline-start:auto}
.wz-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.wz-days .ap-day{flex:none;width:100%}
.wz-days .ap-skel{height:116px;flex:none}
.ap-day.full{opacity:.6;cursor:not-allowed}
.wz-stage .ap-slots{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}
.wz-stage .ap-slot{height:40px}
/* review */
.wz-review{display:flex;flex-direction:column;gap:14px}
.wz-rv-who{display:flex;align-items:center;gap:14px}.wz-rv-who>div{display:flex;flex-direction:column;gap:2px}.wz-rv-who b{font-size:19px}
.wz-up{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#8A5A12;background:#FFF8EE;border-radius:20px;padding:3px 10px;margin-top:4px;width:fit-content}.wz-up svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8}
.wz-rv-grid{display:grid;grid-template-columns:1fr 1fr 1.2fr;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:linear-gradient(180deg,#FBFDFF,#fff)}
.wz-rv-grid>div{padding:14px 16px;display:flex;flex-direction:column;gap:3px}
.wz-rv-grid>div+div{border-right:1px dashed #DCE5F0}
.wz-rv-grid span{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}.wz-rv-grid span svg{width:15px;height:15px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.8}
.wz-rv-grid b{font-size:15.5px}.wz-rv-grid small{font-size:12px;color:var(--muted)}
.wz-rv-grid .big b{font-size:20px;color:var(--gold)}
.wz-opts{display:flex;flex-direction:column;gap:2px}
.wz-opt{display:grid;grid-template-columns:90px minmax(0,1fr);align-items:center;gap:12px;padding:8px 0;border-top:1px dashed #EAEFF5}
.wz-opt:first-child{border-top:0}.wz-opt>span{font-size:13px;color:var(--muted)}
.wz-opt input{height:40px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font:inherit;font-size:14px;color:var(--text);width:100%}
.wz-opt input:focus{outline:0;border-color:#9DB9DD;box-shadow:0 0 0 3px rgba(31,95,174,.08)}
/* left rail: steps */
.wz-rail{padding:16px;display:flex;flex-direction:column;gap:12px;position:sticky;top:64px}
.wz-who{display:flex;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid #EEF2F7}
.wz-who>div{display:flex;flex-direction:column;min-width:0}.wz-who b{font-size:15px;line-height:1.4}.wz-who .muted{font-size:12px}
.wz-alerts{display:flex;flex-direction:column;gap:5px}
.wz-alerts span{display:flex;align-items:flex-start;gap:6px;font-size:12px;border-radius:9px;padding:5px 9px;background:#FFF8EE;color:#8A5A12}
.wz-alerts span.bad{background:#FDF0F0;color:#B23434}.wz-alerts svg{width:14px;height:14px;flex:0 0 auto;margin-top:2px;fill:none;stroke:currentColor;stroke-width:1.8}
.wz-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.wz-steps li{position:relative}
.wz-steps li:not(:last-child)::after{content:"";position:absolute;right:15px;top:38px;bottom:-4px;width:2px;background:#E4EAF2;border-radius:2px}
.wz-steps li.done:not(:last-child)::after{background:#9BD7C6}
.wz-steps button{width:100%;display:flex;align-items:flex-start;gap:12px;text-align:right;border:0;background:transparent;font:inherit;color:var(--text);padding:7px 4px 12px;border-radius:12px;cursor:pointer}
.wz-steps button:disabled{cursor:default}
.wz-steps button:not(:disabled):hover{background:#F7FAFE}
.wz-dot{width:32px;height:32px;border-radius:50%;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;background:#F4F6F9;color:var(--dim);border:2px solid #E4EAF2;position:relative;z-index:1}
.wz-dot svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.wz-steps li.done .wz-dot{background:#E7F6F1;border-color:#9BD7C6;color:#0E9F7E}
.wz-steps li.cur .wz-dot{background:var(--gold);border-color:var(--gold);color:#fff;box-shadow:0 0 0 5px rgba(31,95,174,.12)}
.wz-t{display:flex;flex-direction:column;min-width:0;padding-top:4px}
.wz-t b{font-size:12.5px;color:var(--muted);font-weight:600}
.wz-steps li.cur .wz-t b{color:var(--gold)}
.wz-v{font-size:14px;font-weight:600;line-height:1.5;display:flex;flex-direction:column}
.wz-v small{font-size:11.5px;color:var(--muted);font-weight:400}
.wz-v i{font-style:normal;color:#C3CEDB;font-weight:400}.wz-v i.wz-now{color:var(--gold);font-size:12.5px}
.wz-steps li.todo .wz-t b{color:#B4C0D0}
.wz-cta .ap-book{margin:0;width:100%}
.wz-cta .ap-book.on{background:linear-gradient(135deg,#0E9F7E,#0B8A6D);cursor:pointer;box-shadow:0 10px 22px rgba(14,159,126,.28)}
.wz-cta .tk-hint{margin:0 0 6px}
.wz-stage.s-done{padding:0;min-height:0}
.wz-stage .ap-success{padding:24px 20px}
@media (max-width:1349px){ .wz{grid-template-columns:minmax(0,1fr) 270px} .wz-mic{display:none} .wz-rv-grid{grid-template-columns:1fr 1fr} .wz-rv-grid .big{grid-column:1/-1;border-right:0 !important;border-top:1px dashed #DCE5F0} }
@media (max-width:1099px){
  .wz{display:flex;flex-direction:column-reverse}
  .wz-rail{position:static}
  .wz-steps{flex-direction:row;overflow-x:auto;gap:4px}
  .wz-steps li{flex:1 0 auto}.wz-steps li::after{display:none}
  .wz-steps button{flex-direction:column;align-items:center;text-align:center;padding:6px}
  .wz-v small{display:none}.wz-v{font-size:12px;max-width:120px}
}
@media (max-width:700px){ .wz-days{grid-template-columns:repeat(4,minmax(0,1fr))} .wz-stage{padding:14px} .wz-h h3{font-size:18px} .wz-rv-grid{grid-template-columns:1fr} .wz-rv-grid>div+div{border-right:0;border-top:1px dashed #DCE5F0} .wz-opt{grid-template-columns:1fr} }
.wz-hbook{margin:0 !important;width:auto !important;height:46px;padding:0 18px;border-radius:12px;flex:0 0 auto}
.wz-hbook kbd{font:600 10.5px/1 'IBM Plex Sans Arabic',sans-serif;background:rgba(255,255,255,.22);border-radius:5px;padding:3px 6px;margin-inline-start:4px}
.wz-steps button{padding:5px 4px 8px}
.wz-steps li:not(:last-child)::after{top:34px}
.ap-book.on{background:linear-gradient(135deg,#0E9F7E,#0B8A6D);cursor:pointer;box-shadow:0 10px 22px rgba(14,159,126,.28)}
.ap-book.on:hover{transform:translateY(-1px)}
.ap-day.mine{background:#EEF6FF;border-color:#B9CFEA;cursor:not-allowed}.ap-day.mine .fr{color:var(--gold)}
/* success: everything incl. send buttons on one screen */
.wz-stage .ap-success{padding:16px 18px;gap:10px;align-items:stretch;text-align:right}
.ap-done-h{display:flex;align-items:center;gap:14px}
.ap-done-h h3{font-size:20px;margin:0}.ap-done-h p{margin:2px 0 0;font-size:13px}
.ap-done-h .ap-ok-anim svg{width:58px;height:58px}
.wz-stage .ap-pass{max-width:none;margin:2px 0 0;grid-template-columns:170px minmax(0,1fr)}
.wz-stage .ap-pass-l{padding:12px;gap:6px}.wz-stage .ap-pass-l .ap-avatar{width:52px;height:52px}
.wz-stage .ap-pass-r>div{padding:8px 14px}
.wz-stage .ap-pass-r b{font-size:13.5px}
.wz-stage .ap-stamp{font-size:14px;bottom:8px;left:12px}
.wz-stage .ap-send{max-width:none;margin-top:0;gap:6px}
.wz-stage .ap-sendbtn{padding:9px 12px}.wz-stage .ap-sendbtn>svg{width:30px;height:30px;padding:6px}
.wz-stage .ap-next{margin-top:2px;justify-content:flex-start}
.wz-stage .ap-next .ap-btn{height:36px}
.wz-stage .ap-fly{height:120px}.wz-stage .ap-phone{height:112px;width:92px}.wz-stage .ap-plane{top:40px;right:100px}
@media (max-width:1349px){ .wz-stage .ap-send-btns{grid-template-columns:repeat(3,minmax(0,1fr))} .wz-stage .ap-sendbtn small{display:none} }
@media (max-width:700px){ .wz-stage .ap-pass{grid-template-columns:1fr} .wz-stage .ap-send-btns{grid-template-columns:repeat(3,minmax(0,1fr))} .wz-stage .ap-sendbtn{flex-direction:column;text-align:center;gap:4px} }

/* status-change splash */
.ap-splash{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;background:rgba(15,42,74,.28);backdrop-filter:blur(4px);animation:spIn .25s ease both;cursor:pointer;--c:#0E9F7E;--cb:#E7F6F1}
.ap-splash.in{--c:#0E9F7E;--cb:#E7F6F1}.ap-splash.out{--c:#2E6FBF;--cb:#EAF1FA}.ap-splash.ok{--c:#0E9F7E;--cb:#E7F6F1}.ap-splash.cnl{--c:#D64545;--cb:#FDF0F0}.ap-splash.ftc{--c:#E07B2E;--cb:#FFF3E8}
.ap-splash.bye{animation:spOut .3s ease forwards}
@keyframes spIn{from{opacity:0}}@keyframes spOut{to{opacity:0}}
.sp-card{position:relative;width:min(420px,calc(100% - 32px));background:#fff;border-radius:22px;padding:26px 24px 22px;text-align:center;box-shadow:0 30px 80px rgba(15,42,74,.25);border-top:6px solid var(--c);overflow:hidden;animation:spPop .45s cubic-bezier(.3,1.4,.5,1) both}
@keyframes spPop{from{transform:scale(.85) translateY(10px);opacity:0}}
.sp-card h3{font-size:23px;margin:6px 0 2px;color:var(--c)}
.sp-name{font-size:19px;font-weight:700;margin:0;color:var(--text)}
.sp-sub{margin:4px 0 12px;color:var(--muted);font-size:14px}
.sp-meta{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}
.sp-meta span{display:inline-flex;align-items:center;gap:5px;background:var(--cb);color:var(--c);border-radius:20px;padding:4px 11px;font-size:12.5px;font-weight:600}
.sp-meta svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.9}
.sp-bar{position:absolute;left:0;bottom:0;height:4px;background:var(--c);width:100%;transform-origin:left;animation:spBar 3.2s linear forwards}
@keyframes spBar{to{transform:scaleX(0)}}
.sp-art{width:150px;height:110px;margin:0 auto;display:block}
.sp-art.ok,.sp-art.cnl,.sp-art.ftc{width:100px;height:100px}
.sp-art .ring{fill:var(--cb);stroke:var(--c);stroke-width:5;stroke-dasharray:302;stroke-dashoffset:302;animation:apring .6s .1s ease forwards}
.sp-art .tick{fill:none;stroke:var(--c);stroke-width:8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:110;stroke-dashoffset:110;animation:apring .45s .6s ease forwards}
.sp-door{fill:var(--cb);stroke:var(--c);stroke-width:3}.sp-knob{fill:var(--c)}.sp-floor{stroke:#DCE5F0;stroke-width:3;stroke-linecap:round}
.sp-man{fill:none;stroke:var(--c);stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round}.sp-man circle{fill:var(--c)}
.sp-art.in .sp-man{animation:spWalkIn 1.3s .15s ease-in-out both}
.sp-art.out .sp-man{animation:spWalkOut 1.3s .15s ease-in-out both}
@keyframes spWalkIn{from{transform:translateX(-36px);opacity:.2}to{transform:translateX(48px);opacity:1}}
@keyframes spWalkOut{from{transform:translateX(0);opacity:1}to{transform:translateX(-90px);opacity:.25}}
.ap-ph{gap:12px}.ap-ph>span:nth-child(2){display:flex;align-items:baseline;gap:4px}.ap-ph b{font-size:15px}.ap-ph .ap-btn{height:34px}
@media (prefers-reduced-motion:reduce){ .ap-splash *{animation-duration:.01s !important} }
.cost-chip{font-size:11.5px;color:#0E7F66;background:#E7F6F1;border-radius:20px;padding:1px 8px;margin-inline-start:6px;cursor:help}