/* credite.ro — stiluri preluate din prototip (referinta-artifact/pagina/credite-ro.html),
   fără partea de administrare (înlocuită de Filament). Adăugirile proprii sunt la final. */
:root{
  --bg:#F5F2FB; --surface:#FFFFFF; --surface-2:#F8F6FD; --ink:#1A1330; --muted:#645C80; --line:#E2DCEF;
  --accent:#6A2BD9; --accent-ink:#FFFFFF; --accent-soft:#EDE5FB;
  --amber:#B7790A; --amber-soft:#FBEFD0; --amber-ink:#5A3A00;
  --ok:#0A7A4F; --ok-soft:#DCF1E6; --warn:#8F5B00; --warn-soft:#FBEFD0; --bad:#B3261E; --bad-soft:#FADDDA;
  --bar-1:#D2C8EC; --logo-bg:#FFFFFF; --shadow:0 1px 2px rgba(26,19,48,.06),0 10px 28px rgba(26,19,48,.08); --overlay:rgba(17,12,31,.55);
  --f-display:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;
  --f-body:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'DM Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#110C1F; --surface:#1A1330; --surface-2:#150F28; --ink:#EEE9FA; --muted:#A89FC4; --line:#2F2650;
    --accent:#B79CFF; --accent-ink:#1A0B3D; --accent-soft:#2B1F52;
    --amber:#F2B134; --amber-soft:#3A2D0E; --amber-ink:#F7D88A;
    --ok:#3CCB9F; --ok-soft:#12382C; --warn:#F2B134; --warn-soft:#3A2D0E; --bad:#FF8A80; --bad-soft:#3F1B18;
    --bar-1:#3B2F66; --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 28px rgba(0,0,0,.35); --overlay:rgba(0,0,0,.65);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#110C1F; --surface:#1A1330; --surface-2:#150F28; --ink:#EEE9FA; --muted:#A89FC4; --line:#2F2650;
  --accent:#B79CFF; --accent-ink:#1A0B3D; --accent-soft:#2B1F52;
  --amber:#F2B134; --amber-soft:#3A2D0E; --amber-ink:#F7D88A;
  --ok:#3CCB9F; --ok-soft:#12382C; --warn:#F2B134; --warn-soft:#3A2D0E; --bad:#FF8A80; --bad-soft:#3F1B18;
  --bar-1:#3B2F66; --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 28px rgba(0,0,0,.35); --overlay:rgba(0,0,0,.65);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--bg); color:var(--ink); font:400 16px/1.5 var(--f-body);
  padding-left:max(16px,env(safe-area-inset-left,0px)); padding-right:max(16px,env(safe-area-inset-right,0px));
  padding-top:12px; padding-bottom:48px;
}
body.has-bar{padding-bottom:120px}
.wrap{max-width:1180px;margin:0 auto}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.mono{font-family:var(--f-mono)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Antet */
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 0 18px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;font:800 clamp(2.3rem,7.5vw,3.3rem)/1 var(--f-display);letter-spacing:-.03em}
.brandwrap{display:flex;flex-direction:column;gap:7px;width:fit-content;max-width:100%;min-width:0}
.tagline{display:flex;justify-content:space-between;align-items:center;gap:6px;font:400 clamp(.74rem,2.5vw,1.02rem)/1.1 var(--f-body);color:var(--muted);white-space:nowrap}
.tagline i{flex:none;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.brand svg{flex:none;width:clamp(48px,9.5vw,62px);height:clamp(48px,9.5vw,62px)}
.wm{letter-spacing:-.03em}
.wm i{font-style:normal;color:var(--accent)}
.nav{display:flex;align-items:center;gap:6px}
.nav a{padding:8px 12px;border-radius:999px;text-decoration:none;font-weight:600;font-size:.92rem;color:var(--muted)}
.nav a:hover{color:var(--ink);background:var(--surface)}
.icon-btn{display:grid;place-items:center;width:40px;height:40px;border-radius:999px;border:1px solid var(--line);background:var(--surface);cursor:pointer}
.icon-btn:hover{border-color:var(--muted)}
.icon-btn.burger,.navtheme{display:none}
@media (max-width:640px){.top{position:relative}.icon-btn.burger{display:grid}.nav{display:none;position:absolute;top:100%;left:0;right:0;z-index:50;flex-direction:column;align-items:stretch;gap:2px;padding:8px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 32px rgba(0,0,0,.18)}.nav.open{display:flex}.nav a{padding:12px 14px;font-size:1rem;border-radius:12px}.nav>.icon-btn{display:none}.navtheme{display:block;text-align:left;padding:12px 14px;border:0;border-top:1px solid var(--line);margin-top:4px;border-radius:0 0 12px 12px;background:none;color:var(--muted);font:600 1rem var(--f-body,inherit);cursor:pointer}}

/* Hero */
.hero{display:grid;grid-template-columns:minmax(0,1fr);gap:0;padding:0 0 18px}
.hero h1{margin:0 0 14px;font:800 clamp(2.15rem,5.4vw,3.75rem)/1.02 var(--f-display);letter-spacing:-.025em;text-wrap:balance}
.hl{background:linear-gradient(transparent 64%,var(--amber-soft) 64%);padding:0 .08em}
.hero p.lead{margin:0 0 16px;max-width:56ch;color:var(--muted);font-size:1.08rem}
.mode{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:none;width:100%;margin:0}
.mode-btn{display:flex;gap:12px;align-items:center;text-align:left;padding:14px 16px;border-radius:14px;border:1.5px solid var(--line);background:var(--surface);cursor:pointer}
.mode-btn:hover{border-color:var(--muted)}
.mode-btn b{display:block;font:700 1.08rem/1.2 var(--f-display)}
.mode-btn small{display:block;margin-top:2px;color:var(--muted);font-size:.8rem;line-height:1.3}
.mode-btn .mi{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--surface-2);color:var(--accent)}
.mode-btn[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
.mode-btn[aria-pressed="true"] .mi{background:var(--accent);color:var(--accent-ink)}
@media (max-width:560px){
  .mode{gap:10px}
  .mode-btn{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:12px;padding:16px 14px;min-height:140px}
  .mode-btn .mi{width:42px;height:42px}
  .mode-btn b{font-size:1.1rem}
  .mode-btn small{font-size:.78rem}
}
.indices{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow)}
.indices h2{margin:0 0 6px;font:500 .75rem/1.3 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.idx{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid var(--line)}
.idx:first-of-type{border-top:0}
.idx span{font-size:.95rem;font-weight:600}
.idx small{display:block;font-weight:400;color:var(--muted);font-size:.78rem}
.idx b{font:700 1.6rem/1 var(--f-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.indices .src{margin:8px 0 0;font-size:.78rem;color:var(--muted)}
.indices.wide{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 28px}
.indices.wide .idx{border-top:0}
@media (max-width:720px){.indices.wide{grid-template-columns:minmax(0,1fr)}.indices.wide .idx+.idx{border-top:1px solid var(--line)}}
@media (max-width:860px){.hero{grid-template-columns:minmax(0,1fr);align-items:start}}

/* Taburi */
.tabs{display:flex;gap:8px;overflow-x:auto;padding:0 2px 18px;margin:0 -2px;scrollbar-width:thin}
.tab{flex:none;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:var(--surface);cursor:pointer;font-weight:600;font-size:.95rem;white-space:nowrap}
.tab:hover{border-color:var(--muted)}
.tab[aria-selected="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.tab svg{flex:none}

/* Consola */
.app{display:grid;grid-template-columns:minmax(0,350px) minmax(0,1fr);gap:24px;align-items:start}
@media (max-width:920px){.app{grid-template-columns:minmax(0,1fr)}}
.calc{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:var(--shadow)}
.side{display:grid;gap:16px;min-width:0}
.sidecard{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow)}
.sidecard h3{margin:0 0 10px;font:700 1.05rem/1.2 var(--f-display)}
.sidecard ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.sidecard li a{display:block;padding:8px 0;border-top:1px solid var(--line);text-decoration:none;color:var(--ink);font-weight:600;font-size:.9rem;line-height:1.3}
.sidecard li:first-child a{border-top:0}
.sidecard li a:hover{color:var(--accent)}
.sidecard{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:8px;padding:10px 14px}
.sidecard h3{grid-column:1/-1;margin:0 0 6px}
.sidecard .ssrc,.sidecard .more{grid-column:1/-1}
.sidecard.guides{display:block;padding:16px 18px}.sidecard.guides h3{font-size:1.05rem;margin:0 0 10px}
.sidx{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:6px 0 2px;border-top:1px solid var(--line)}
.sidx small{display:none!important}
.sidx b{font-size:1.02rem}.sidx span{font-size:.74rem;letter-spacing:.02em}.sidecard h3{font-size:.95rem;margin:0 0 4px}.sidecard .ssrc{margin:4px 0 0;font-size:.7rem}
.sidx span{font-size:.9rem;font-weight:600}
.sidx small{display:block;font-weight:400;color:var(--muted);font-size:.76rem}
.sidx b{font:700 1.5rem/1 var(--f-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--accent)}
.sidecard .ssrc{margin:8px 0 0;font-size:.76rem;color:var(--muted)}
.sidecard .more{display:inline-block;margin-top:8px;font-weight:700;font-size:.88rem;color:var(--accent);text-decoration:none}
@media (min-width:921px){.side{align-self:stretch;grid-template-rows:1fr auto}.stk{min-height:0}.stk .calc{position:sticky;top:16px}}

.calc h2{margin:0 0 14px;font:700 1.25rem/1.2 var(--f-display);letter-spacing:-.01em}
.field{margin-bottom:18px}
.frow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px}
.frow label{font-weight:600;font-size:.92rem}
.frow label small{display:block;font-weight:400;color:var(--muted);font-size:.76rem}
.numbox{display:flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface-2);border-radius:10px;padding:5px 10px}
.numbox:focus-within{border-color:var(--accent)}
.numbox input{width:8ch;border:0;background:transparent;text-align:right;font:500 1rem var(--f-mono);outline:none;-moz-appearance:textfield}
.numbox input::-webkit-outer-spin-button,.numbox input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.numbox span{color:var(--muted);font-size:.85rem}
.numbox select{border:0;background:transparent;font:600 .85rem var(--f-body);color:var(--muted);cursor:pointer;padding:0 2px;outline:none}
.numbox select:focus-visible{outline:2px solid var(--accent);border-radius:4px}
input[type=range]{width:100%;height:28px;accent-color:var(--accent);cursor:pointer}
.derived{margin:-4px 0 16px;padding:10px 12px;border-radius:10px;background:var(--accent-soft);color:var(--ink);font-size:.9rem}
.derived:empty{display:none}
.mine{border-top:1px solid var(--line);padding-top:14px}
.mine summary{cursor:pointer;font-weight:600;font-size:.92rem}
.mine p{margin:8px 0 10px;color:var(--muted);font-size:.85rem}
.mine-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mine-grid label{font-size:.76rem;color:var(--muted);display:block;margin-bottom:3px}
.mine-grid input{width:100%;border:1px solid var(--line);background:var(--surface-2);border-radius:8px;padding:7px 8px;font:500 .95rem var(--f-mono)}

/* Rezultate */
.res-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}
.res-head h2{margin:0;font:700 1.35rem/1.2 var(--f-display);letter-spacing:-.01em}
.res-head h2 small{display:block;margin-top:3px;font:400 .88rem var(--f-body);color:var(--muted);letter-spacing:0}
.sorter{display:flex;align-items:center;gap:8px;font-size:.88rem;color:var(--muted)}
.sorter select{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:8px 10px;font-weight:600;color:var(--ink)}
.list{display:grid;gap:12px}

.offer{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1.25fr) auto;grid-template-areas:"head metrics pay" "bar bar bar" "more act act";gap:14px 22px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px}
.offer.best{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),var(--shadow)}
.offer.mine-o{border-style:dashed;border-color:var(--amber)}
.o-head{grid-area:head;display:flex;gap:12px;align-items:center;min-width:0}
.o-name{min-width:0}
.o-name h3{margin:0;font:700 1.05rem/1.2 var(--f-display)}
.o-name p{margin:2px 0 0;color:var(--muted);font-size:.84rem}
.badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.badge{font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);color:var(--muted)}
.badge.gold{background:var(--amber-soft);border-color:transparent;color:var(--amber-ink)}
.badge.green{background:var(--accent-soft);border-color:transparent;color:var(--accent)}
.o-metrics{grid-area:metrics;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0}
.o-metrics dt{font-size:.74rem;color:var(--muted);font-weight:600}
.o-metrics dd{white-space:nowrap;margin:2px 0 0;font:700 1.12rem/1.1 var(--f-display);font-variant-numeric:tabular-nums}
.o-pay{grid-area:pay;display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right}
.o-pay .lab{font-size:.74rem;color:var(--muted);font-weight:600}
.o-pay strong{font:800 2rem/1 var(--f-display);letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.o-pay strong small{font:600 .85rem var(--f-body);color:var(--muted);letter-spacing:0;margin-left:3px}
.ratio{font-size:.76rem;font-weight:700;padding:2px 8px;border-radius:999px}
.ratio.ok{background:var(--ok-soft);color:var(--ok)}
.ratio.warn{background:var(--warn-soft);color:var(--warn)}
.ratio.bad{background:var(--bad-soft);color:var(--bad)}
.saving{font-size:.78rem;font-weight:700}
.saving.up{color:var(--ok)}
.saving.down{color:var(--bad)}
.o-act{grid-area:act;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px 10px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 16px;border-radius:10px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);font-weight:700;font-size:.9rem;text-decoration:none;cursor:pointer}
.btn:hover{filter:brightness(1.07)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--muted);filter:none}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.cmp{display:flex;align-items:center;gap:6px;font-size:.84rem;font-weight:600;cursor:pointer;white-space:nowrap}
.cmp input{width:18px;height:18px;accent-color:var(--accent)}
.o-barwrap{grid-area:bar}
.o-bar{display:flex;gap:2px;height:8px}
.o-bar span{display:block;height:100%;border-radius:4px}
.o-bar .b1{background:var(--bar-1)}
.o-bar .b2{background:var(--accent)}
.o-barcap{display:flex;justify-content:space-between;gap:12px;margin-top:5px;font-size:.76rem;color:var(--muted);font-variant-numeric:tabular-nums}
.o-more{grid-area:more;border-top:1px solid var(--line);padding-top:10px}
.o-more summary{cursor:pointer;font-size:.86rem;font-weight:600;color:var(--muted)}
.o-more summary:hover{color:var(--ink)}
.det{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px 20px;margin:12px 0 0}
.det div{min-width:0}
.det dt{font-size:.74rem;color:var(--muted);font-weight:600}
.det dd{margin:1px 0 0;font-size:.9rem;font-variant-numeric:tabular-nums}
.det .wide{grid-column:1/-1}
@media (max-width:720px){
  .offer{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "metrics" "pay" "bar" "act" "more";gap:14px}
  .o-pay{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;text-align:left;gap:8px 12px}
  .o-pay .lab{width:100%}
  .o-act{width:100%;justify-content:space-between;flex-wrap:nowrap;gap:6px}
  .o-act .btn{padding-left:12px;padding-right:12px;white-space:nowrap;font-size:14px}
  .o-act .cmp{font-size:14px;white-space:nowrap;margin-right:auto}
}
.unav{margin-top:16px;border:1px dashed var(--line);border-radius:12px;padding:10px 14px}
.unav summary{cursor:pointer;font-weight:600;font-size:.9rem;color:var(--muted)}
.unav ul{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:6px;font-size:.88rem}
.unav li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;color:var(--muted)}
.unav li b{color:var(--ink)}
.empty{padding:28px;text-align:center;border:1px dashed var(--line);border-radius:14px;color:var(--muted)}

/* Bară de comparare */
.cbar{position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--ink);color:var(--bg);
  padding:12px max(16px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.cbar-in{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cbar b{font-weight:700}
.cbar p{margin:0;font-size:.92rem}
.cbar .acts{display:flex;gap:8px}
.cbar .btn{background:var(--bg);color:var(--ink);border-color:var(--bg)}
.cbar .btn.ghost{background:transparent;color:var(--bg);border-color:var(--muted)}

/* Fereastră comparare */
.modal{position:fixed;inset:0;z-index:40;background:var(--overlay);display:grid;place-items:center;
  padding:16px max(16px,env(safe-area-inset-right,0px)) calc(16px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.panel{width:100%;max-width:940px;max-height:100%;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:var(--shadow)}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.panel-h h2{margin:0;font:700 1.3rem/1.2 var(--f-display)}
.tscroll{overflow-x:auto}
.ctable{width:100%;min-width:560px;border-collapse:collapse;font-size:.92rem}
.ctable th,.ctable td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;font-variant-numeric:tabular-nums}
.ctable thead th{font:700 1rem var(--f-display);border-bottom:2px solid var(--ink)}
.ctable thead th small{display:block;font:400 .78rem var(--f-body);color:var(--muted)}
.ctable tbody th{font-weight:600;color:var(--muted);width:24%}
.ctable td.best{color:var(--accent);font-weight:800}
.ctable td.best::after{content:" ✓";font-weight:700}

/* Ghid și întrebări */
.section{margin-top:56px}
.section h2{margin:0 0 6px;font:800 clamp(1.5rem,3.4vw,2.2rem)/1.1 var(--f-display);letter-spacing:-.02em;text-wrap:balance}
.section>p.sub{margin:0 0 20px;color:var(--muted);max-width:60ch}
.guide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:820px){.guide{grid-template-columns:minmax(0,1fr)}}
.gcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px}
.gcard h3{margin:0 0 6px;font:700 1.08rem/1.25 var(--f-display)}
.gcard p{margin:0;color:var(--muted);font-size:.94rem}
.gcard .eq{display:block;margin-top:10px;padding:8px 10px;border-radius:8px;background:var(--surface-2);font:500 .8rem/1.4 var(--f-mono);color:var(--ink)}
.faq{display:grid;gap:8px;max-width:820px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.faq summary{cursor:pointer;font-weight:700}
.faq details p{margin:10px 0 0;color:var(--muted);font-size:.95rem}
footer{margin-top:56px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:.85rem}
footer p{margin:0 0 10px;max-width:80ch}
footer ul{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;padding:0;list-style:none}

/* Detalii credit: câmpuri suplimentare */
.linkbtn{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:4px 0;margin:-6px 0 14px;color:var(--accent);font-weight:700;font-size:.92rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.linkbtn svg{transition:transform .15s}
.linkbtn[aria-expanded="true"] svg{transform:rotate(180deg)}
.more-fields{border-top:1px solid var(--line);padding-top:14px;margin-bottom:6px}
.lab{display:block;font-weight:600;font-size:.92rem;margin-bottom:6px}
.hintp{margin:6px 0 0;font-size:.78rem;color:var(--muted)}
.ms{position:relative}
.ms-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;padding:10px 12px;border:1px solid var(--line);background:var(--surface-2);border-radius:10px;cursor:pointer;font-size:.92rem}
.ms-btn[aria-expanded="true"]{border-color:var(--accent)}
.ms-btn span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-btn .ph{color:var(--muted)}
.ms-pop{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:8;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px}
.ms-pop label{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:.92rem}
.ms-pop label:hover{background:var(--surface-2)}
.ms-pop input{width:18px;height:18px;accent-color:var(--accent)}

/* Card: nume clicabil, ofertă sponsorizată */
.o-open{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-align:left}
.o-open:hover{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.offer.spons{border-color:var(--amber)}

/* Sigle bănci */
.blogo{flex:none;width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--logo-bg);border:1px solid var(--line);color:#7C7596;overflow:hidden}
.blogo img{max-width:70%;max-height:70%;object-fit:contain}
.blogo img.full{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}
.blogo.big{width:52px;height:52px}
.txt{width:100%;border:1px solid var(--line);background:var(--surface-2);border-radius:10px;padding:10px 12px;font:inherit}
.demo{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:var(--amber-soft);color:var(--amber-ink);font-size:.88rem}

/* Pagina de detalii */
body.view-detail .hero,body.view-detail #comparator,body.view-detail .section,body.view-detail .cbar{display:none}
#detail{padding-top:2px}
.dback{margin-bottom:12px}
.crumbs{color:var(--muted);font-size:.85rem;margin:0 0 12px}
.dhead{display:grid;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow)}
.dhead.spons{border-color:var(--amber)}
.dtop{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 16px}
.dtop .o-head{flex:1 1 280px}
.dhead h1{margin:0;font:800 clamp(1.3rem,3.4vw,1.7rem)/1.15 var(--f-display);letter-spacing:-.02em}
.dhead .sub{margin:2px 0 0;color:var(--muted);font-size:.9rem}
.dcta{display:flex;flex-wrap:wrap;gap:8px}
.dkpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));margin:0;padding-top:14px;border-top:1px solid var(--line)}
.dkpi>div{padding:0 14px;border-left:1px solid var(--line);min-width:0}
.dkpi>div:first-child{padding-left:0;border-left:0}
.dkpi dt{font-size:.72rem;color:var(--muted);font-weight:600}
.dkpi dd{margin:3px 0 0;font:700 1.2rem/1.15 var(--f-display);font-variant-numeric:tabular-nums}
.dkpi .pay dd{font-size:1.8rem;color:var(--accent);letter-spacing:-.02em}
.dkpi dd small{font:600 .78rem var(--f-body);color:var(--muted);letter-spacing:0}
@media (max-width:560px){
  .dkpi{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 0}
  .dkpi>div:nth-child(odd){padding-left:0;border-left:0}
  .dkpi .pay{grid-column:1/-1;padding:0;border:0}
}
.dgrid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:14px;margin-top:14px;align-items:start}
@media (max-width:860px){.dgrid{grid-template-columns:minmax(0,1fr)}}
.stack{display:grid;gap:14px;min-width:0}
.dcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 16px;min-width:0}
.dcard h2{margin:0 0 10px;font:700 1rem/1.2 var(--f-display)}
.dcard p{margin:0 0 6px;color:var(--muted);font-size:.88rem}
.dcard p:last-child{margin-bottom:0}
.facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px 16px;margin:0}
.facts dt{font-size:.72rem;color:var(--muted);font-weight:600}
.facts dd{margin:2px 0 0;font:700 .98rem/1.25 var(--f-display);font-variant-numeric:tabular-nums}
.facts dd.plain{font:600 .9rem/1.3 var(--f-body)}
.facts small{font:400 .76rem var(--f-body);color:var(--muted)}
.kv{margin:0}
.kv div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-top:1px solid var(--line);font-size:.9rem}
.kv div:first-child{border-top:0;padding-top:0}
.kv dt{color:var(--muted)}
.kv dd{margin:0;font-weight:600;text-align:right}
.sponsor-note{padding:10px 12px;border-radius:10px;background:var(--amber-soft);color:var(--amber-ink);font-size:.88rem}

/* Administrare */
.ahead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin:0 0 14px}
.ahead h1{margin:0;font:800 clamp(1.4rem,3.6vw,1.9rem)/1.1 var(--f-display);letter-spacing:-.02em}
.agrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px 18px}
.afield{min-width:0}
.afield .lab{margin-bottom:5px}
textarea.txt{min-height:96px;resize:vertical}
.o-warn{margin:6px 0 0;font-size:.8rem;font-weight:600;color:var(--amber-ink);background:var(--amber-soft);border-radius:8px;padding:4px 8px;display:inline-block}
@media (prefers-reduced-motion:no-preference){.offer,.btn,.tab{transition:border-color .15s,filter .15s,background .15s}}

.art-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:820px){.art-grid{grid-template-columns:minmax(0,1fr)}}
.acard{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;text-decoration:none;color:inherit;min-width:0}
.acard:hover{border-color:var(--muted)}
.acard img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;background:var(--surface-2)}
.acard h3{margin:0;font:700 1.1rem/1.25 var(--f-display);text-wrap:balance}
.acard p{margin:0;color:var(--muted);font-size:.92rem}
.ameta{display:flex;flex-wrap:wrap;gap:4px 10px;color:var(--muted);font-size:.8rem}
.ameta .cat{color:var(--accent);font-weight:700}
.article{max-width:740px;margin:0 auto}
.article h1{margin:8px 0 10px;font:800 clamp(1.7rem,4.6vw,2.6rem)/1.08 var(--f-display);letter-spacing:-.025em;text-wrap:balance}
.article .lead{font-size:1.08rem;color:var(--muted);margin:0 0 16px}
.article .cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:14px;margin:0 0 20px;background:var(--surface-2)}
.prose{font-size:1.04rem;line-height:1.7}
.prose h2{margin:28px 0 8px;font:800 1.5rem/1.2 var(--f-display);letter-spacing:-.015em}
.prose h3{margin:22px 0 6px;font:700 1.2rem/1.25 var(--f-display)}
.prose p{margin:0 0 14px}
.prose ul,.prose ol{margin:0 0 14px;padding-left:22px}
.prose li{margin:4px 0}
.mdt{border-collapse:collapse;width:100%;font-size:.94rem;margin:0 0 16px}
.mdt th,.mdt td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.mdt th{font:700 .9rem var(--f-display);border-bottom:2px solid var(--ink)}
.prose a,.article .useful a{color:var(--accent);font-weight:600}
.article .useful{margin:26px 0 0;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.article .useful h2{margin:0 0 6px;font:700 1.1rem/1.2 var(--f-display)}
.article .useful ul{margin:0;padding-left:20px}
.art-cta{margin:26px 0 0;padding:16px;border-radius:14px;background:var(--accent-soft);display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between}
.art-cta b{font:700 1.1rem/1.2 var(--f-display)}
.c-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.c-ok{display:flex;gap:8px;align-items:flex-start;margin-top:12px;font-size:.9rem;color:var(--muted)}
.cform{max-width:none;width:100%;padding:12px 16px}
.cform .agrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 12px}
.cform .lab{margin-bottom:3px;font-size:.84rem}
.cform .txt{padding:7px 10px}
.c-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-top:10px}
.c-foot .c-ok{margin:0}
@media (max-width:700px){.cform .agrid{grid-template-columns:minmax(0,1fr)}}
#c-status.ok{color:var(--ok);font-weight:600}
#c-status.err{color:var(--bad);font-weight:600}
.draft-note{margin:0 0 12px;padding:8px 12px;border-radius:10px;background:var(--surface-2);border:1px solid var(--line);font-size:.86rem;font-weight:600}
.indices.wide .idx{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;padding:10px 8px}
.indices.wide .idx span{text-align:center}
.indices.wide .idx b{font-size:2rem}
.indices.wide .idx+.idx{border-left:1px solid var(--line)}
@media (max-width:820px){.indices.wide .idx+.idx{border-left:0;border-top:1px solid var(--line)}}
@media (min-width:721px) and (max-width:1000px){.indices.wide{grid-template-columns:repeat(2,minmax(0,1fr))}.indices.wide .idx:nth-child(3){border-left:0}.indices.wide .idx:nth-child(n+3){border-top:1px solid var(--line)}}
@media (max-width:720px){.indices.wide{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;padding:4px 2px}.indices.wide .idx,.indices.wide .idx+.idx{border:0;padding:8px 4px;gap:2px}.indices.wide .idx:nth-child(even){border-left:1px solid var(--line)}.indices.wide .idx:nth-child(n+3){border-top:1px solid var(--line)}.indices.wide .idx small{display:none}.indices.wide .idx span{font-size:.8rem;line-height:1.2}.indices.wide .idx b{font-size:1.35rem}}
.list .offer{border-width:1.5px;border-color:color-mix(in srgb,var(--accent) 24%,var(--line));box-shadow:0 1px 2px rgba(26,19,48,.06),0 6px 18px rgba(26,19,48,.07);border-left:5px solid color-mix(in srgb,var(--accent) 45%,var(--line))}
.list .offer:nth-child(even):not(.best):not(.spons):not(.mine-o){background:var(--surface-2)}
.list .offer{cursor:pointer}
.list .offer details,.list .offer details *{cursor:auto}
.list .offer summary{cursor:pointer}
.list .offer:hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 10px 26px rgba(26,19,48,.12)}
.list .offer.best{border-left-width:5px;border-left-color:var(--accent)}
.list .offer.spons{border-left-width:5px;border-left-color:var(--amber)}
@media (prefers-reduced-motion:no-preference){.list .offer{transition:box-shadow .15s,border-color .15s}}
.capt{display:flex;align-items:center;gap:0;margin:0 0 16px;border-radius:18px;overflow:hidden;background:linear-gradient(180deg,#A9B3F8,#D8DDFD);border:1px solid var(--line);box-shadow:var(--shadow)}
.capt .bubble .l1,.capt .bubble .l2{display:block;white-space:nowrap}
.capt .bubble .l1{font-size:clamp(1.05rem,2.5vw,1.9rem);text-align:center}
.capt .bubble .l2{margin-top:6px;text-transform:none;font-weight:700;letter-spacing:0;font-size:clamp(.8rem,1.75vw,1.25rem);text-align:center}
.capt .art{flex:0 1 60%;min-width:0;display:block;line-height:0}
.capt .art img{width:100%;height:auto;display:block;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.capt .say{flex:1 1 0;min-width:0;padding:12px 22px 12px 4px;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.capt .bubble{position:relative;background:#fff;color:#2B1A5E;border:3px solid #2B1A5E;border-radius:22px;padding:14px 18px;font:800 clamp(1.05rem,2.1vw,1.7rem)/1.12 var(--f-display);letter-spacing:-.01em}
.capt .bubble::before{content:"";position:absolute;left:-17px;top:42%;width:0;height:0;border:11px solid transparent;border-right:17px solid #2B1A5E;border-left:0}
.capt .bubble::after{content:"";position:absolute;left:-11px;top:calc(42% + 3px);width:0;height:0;border:8px solid transparent;border-right:13px solid #fff;border-left:0}
.capt .nm{display:inline-flex;align-items:center;gap:8px;background:#2B1A5E;color:#fff;border-radius:999px;padding:5px 14px;font:700 .86rem/1 var(--f-display);letter-spacing:.02em}
.capt .nm i{width:8px;height:8px;border-radius:50%;background:#F2B134;display:inline-block}
@media (max-width:700px){.capt{flex-direction:column;align-items:stretch}.capt .art{flex:none}.capt .say{padding:10px 14px 14px;align-items:center}.capt .bubble{text-align:center}.capt .bubble::before,.capt .bubble::after{display:none}}

/* ---------- Adăugiri credite.ro (față de prototip) ---------- */
body{margin:0;overflow-wrap:break-word}
/* Atributul hidden câștigă mereu (în Artifact o făcea scheletul paginii). */
[hidden]{display:none!important}
:root[data-theme="light"]{color-scheme:light}
img,svg{max-width:100%}
textarea{font:inherit;color:inherit}
/* Taburile sunt linkuri reale (/credite/<tip>), ca să fie indexabile. */
a.tab{text-decoration:none;color:inherit}
a.tab[aria-selected="true"]{color:var(--accent-ink)}
/* Paginile de articole: link de întoarcere și antet de listă. */
.ahead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin:0 0 14px}
.ahead h1{margin:0;font:800 clamp(1.4rem,3.6vw,1.9rem)/1.1 var(--f-display);letter-spacing:-.02em}
/* Contact: erori de validare venite de la server. */
.c-err{margin:4px 0 0;font-size:.8rem;font-weight:600;color:var(--bad)}
.txt[aria-invalid="true"]{border-color:var(--bad)}