/* D-69 / OE-D69-003 M-5 - Shared Qvix visual styles (qvix-visual.css).
   Theme tokens only. Contrast via --text/--text2/--border.
   OE-D69-006 M-1b: typography styles moderno | mano | estandar. */
.qv-slot{margin:8px 0;}
.qv-slot.qv-ok{margin:10px 0;}
.qv-card{
  margin:0;
  padding:12px 14px;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:8px;
  color:var(--text);
}
.qv-title{
  font-size:13px;
  font-weight:600;
  color:var(--text);
  margin:0 0 10px;
}
.qv-source{
  font-size:11px;
  font-family:'DM Mono',ui-monospace,monospace;
  color:var(--text3);
  margin-top:8px;
}
.qv-data{margin-top:8px;font-size:12px;color:var(--text2);}
.qv-data summary{cursor:pointer;color:var(--accent);font-size:12px;}
.qv-data table{width:100%;border-collapse:collapse;margin-top:6px;}
.qv-data th,.qv-data td{
  border:1px solid var(--border);
  padding:4px 6px;
  text-align:left;
  color:var(--text2);
  font-size:11px;
}
.qv-data th{background:var(--bg4);color:var(--text);font-weight:600;}
.qv-tl{list-style:none;margin:0;padding:0;border-left:2px solid var(--border2);margin-left:6px;}
.qv-tl li{display:flex;gap:10px;padding:0 0 12px 14px;position:relative;}
.qv-tl li:last-child{padding-bottom:0;}
.qv-tl li::before{
  content:'';
  position:absolute;
  left:-5px;top:4px;
  width:8px;height:8px;border-radius:50%;
  background:var(--blue);
  border:2px solid var(--bg3);
}
.qv-when{
  flex:0 0 72px;
  font-size:11px;
  font-family:'DM Mono',ui-monospace,monospace;
  color:var(--text3);
  padding-top:1px;
}
.qv-tl-b{flex:1;min-width:0;}
.qv-tl-b strong{display:block;font-size:13px;color:var(--text);font-weight:600;}
.qv-detail{display:block;font-size:12px;color:var(--text2);margin-top:2px;line-height:1.45;}
.qv-chart{width:100%;overflow-x:auto;}
.qv-svg{width:100%;height:auto;display:block;max-width:560px;}
.qv-grid{stroke:var(--border);stroke-width:1;}
.qv-tick{fill:var(--text3);font-size:10px;font-family:'DM Mono',ui-monospace,monospace;}
.qv-val{fill:var(--text2);font-size:10px;font-family:'DM Mono',ui-monospace,monospace;}
.qv-line{fill:none;stroke-width:2;}
.qv-legend{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;font-size:12px;color:var(--text2);}
.qv-lg{display:inline-flex;align-items:center;gap:5px;}
.qv-lg i{display:inline-block;width:10px;height:10px;border-radius:2px;}
.qv-node{fill:var(--bg2);stroke:var(--border2);stroke-width:1.5;}
.qv-nlabel{fill:var(--text);font-size:11px;font-family:system-ui,sans-serif;}
.qv-edge{fill:none;stroke:var(--text3);stroke-width:1.5;}
.qv-arrow{fill:var(--text3);}
.qv-elabel{fill:var(--text3);font-size:10px;font-family:'DM Mono',ui-monospace,monospace;}
@media (prefers-reduced-motion: reduce){
  .qv-card,.qv-slot,.qv-tl li::before{animation:none!important;transition:none!important;}
}

/* ── OE-D69-006 M-1b typography styles ───────────────────────────────── */
.qv-typebar{
  display:flex;flex-wrap:wrap;gap:6px;align-items:center;
  margin:0;padding:0;
}
.qv-typebar button{
  font:inherit;font-size:11px;line-height:1.2;
  min-height:24px;min-width:24px;
  padding:4px 8px;border-radius:6px;cursor:pointer;
  border:1px solid var(--border);background:var(--bg2);color:var(--text2);
}
.qv-typebar button:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;
}
.qv-typebar button[aria-pressed="true"]{
  border-color:var(--accent);color:var(--accent);background:var(--bg3);
}
.qv-typebar .qv-type-std{
  margin-left:auto;color:var(--text3);
}
/* OE-D69-011 M-3: compact typebar inside the suggested summary. */
.qv-typebar-inline{
  margin-left:auto;
  flex:1 1 auto;
  justify-content:flex-end;
  min-width:0;
}
.qv-typebar-inline .qv-type-std{margin-left:0;}
@media (max-width:390px){
  .qv-suggested-sum{gap:6px;padding:8px 10px;}
  .qv-typebar-inline{flex-basis:100%;justify-content:flex-start;}
  .qv-typebar-inline button{font-size:10px;padding:4px 6px;}
}

/* moderno (default): Manrope + system fallback */
.qv-root[data-qv-type="moderno"] .qv-card,
.qv-root[data-qv-type="moderno"] .qv-suggested-sum,
.qv-root[data-qv-type="moderno"] .qv-nlabel{
  font-family:"Qvix Modern",system-ui,-apple-system,"Segoe UI",sans-serif;
}
.qv-root[data-qv-type="moderno"] .qv-when,
.qv-root[data-qv-type="moderno"] .qv-tick,
.qv-root[data-qv-type="moderno"] .qv-val,
.qv-root[data-qv-type="moderno"] .qv-elabel,
.qv-root[data-qv-type="moderno"] .qv-source,
.qv-root[data-qv-type="moderno"] .qv-provenance{
  font-family:"Qvix Modern",ui-monospace,monospace;
}

/* mano alzada: short labels only — never detail / data table / alt */
.qv-root[data-qv-type="mano"] .qv-title,
.qv-root[data-qv-type="mano"] .qv-suggested-label,
.qv-root[data-qv-type="mano"] .qv-tl-b strong{
  font-family:"Qvix Hand Title","Segoe Print","Bradley Hand","Chalkboard SE",cursive;
  font-weight:400;
  font-size:15px;
  letter-spacing:0.01em;
}
.qv-root[data-qv-type="mano"] .qv-when,
.qv-root[data-qv-type="mano"] .qv-nlabel,
.qv-root[data-qv-type="mano"] .qv-legend,
.qv-root[data-qv-type="mano"] .qv-lg{
  font-family:"Qvix Hand","Segoe Print","Bradley Hand","Chalkboard SE",cursive;
  font-size:14px;
}
.qv-root[data-qv-type="mano"] .qv-detail,
.qv-root[data-qv-type="mano"] .qv-data,
.qv-root[data-qv-type="mano"] .qv-data th,
.qv-root[data-qv-type="mano"] .qv-data td,
.qv-root[data-qv-type="mano"] .qv-source,
.qv-root[data-qv-type="mano"] .qv-provenance,
.qv-root[data-qv-type="mano"] .qv-tick,
.qv-root[data-qv-type="mano"] .qv-val,
.qv-root[data-qv-type="mano"] .qv-elabel{
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
}

/* estandar: force system stack (a11y escape hatch) */
.qv-root[data-qv-type="estandar"] .qv-card,
.qv-root[data-qv-type="estandar"] .qv-suggested-sum,
.qv-root[data-qv-type="estandar"] .qv-title,
.qv-root[data-qv-type="estandar"] .qv-when,
.qv-root[data-qv-type="estandar"] .qv-nlabel,
.qv-root[data-qv-type="estandar"] .qv-tl-b strong{
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
}

/* OE-D69-003 M-5 - suggested / collapsible visual_sections under the response. */
.qv-sections{margin:8px 0 4px;display:flex;flex-direction:column;gap:8px;}
.qv-suggested{
  margin:0;
  padding:0;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:8px;
  color:var(--text);
}
.qv-suggested > .qv-card{border:0;border-radius:0 0 8px 8px;background:transparent;}
.qv-suggested-sum{
  cursor:pointer;
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  min-height:24px;
  font-size:12px;
  color:var(--text2);
  border-bottom:1px solid transparent;
}
.qv-suggested-sum:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;
}
.qv-suggested[open] > .qv-suggested-sum{border-bottom-color:var(--border);}
.qv-suggested-sum::-webkit-details-marker{display:none;}
.qv-suggested-label{font-weight:600;color:var(--accent);}
.qv-provenance{
  font-size:11px;
  font-family:'DM Mono',ui-monospace,monospace;
  color:var(--text3);
  line-height:1.35;
}
@media (prefers-reduced-motion: reduce){
  .qv-suggested,.qv-sections{animation:none!important;transition:none!important;}
}

/* ── OE-D69-006 M-1/M-2/M-3: stage color, carousel, quiz ───────────────── */
.qv-tl li{position:relative;padding-left:14px;border-left:3px solid var(--qv-stage,var(--border));}
.qv-tl li::before{background:var(--qv-stage,var(--accent));}
.qv-scale-note{font-size:11px;color:var(--text3);margin:0 0 8px;}
.qv-present{display:flex;flex-direction:column;gap:8px;}
.qv-carousel{
  position:relative;overflow:hidden;border:1px solid var(--border);
  border-radius:8px;background:var(--bg2);outline:none;
}
.qv-carousel-track{display:flex;transition:transform .28s ease;}
.qv-carousel.qv-reduced .qv-carousel-track{transition:none;}
.qv-slide{flex:0 0 100%;box-sizing:border-box;padding:14px 16px;min-height:120px;}
.qv-slide-kicker{
  display:inline-block;font-size:11px;font-weight:600;letter-spacing:.02em;
  color:var(--accent);margin-bottom:6px;
}
.qv-slide-title{margin:0 0 6px;font-size:15px;font-weight:600;color:var(--text);}
.qv-slide-detail{margin:0;font-size:13px;color:var(--text2);line-height:1.45;}
.qv-carousel-nav{display:flex;align-items:center;gap:8px;padding:8px 12px;border-top:1px solid var(--border);}
.qv-carousel-btn{
  font:inherit;font-size:12px;min-height:28px;padding:4px 10px;cursor:pointer;
  border:1px solid var(--border);border-radius:6px;background:var(--bg3);color:var(--text);
}
.qv-carousel-btn:disabled{opacity:.45;cursor:default;}
.qv-carousel-btn:focus-visible,.qv-dot:focus-visible,.qv-q-opt:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;
}
.qv-carousel-status{flex:1;text-align:center;font-size:12px;color:var(--text3);}
.qv-carousel-dots{display:flex;flex-wrap:wrap;gap:4px;padding:0 12px 10px;}
.qv-dot{
  font:inherit;font-size:10px;min-width:24px;min-height:24px;padding:2px 6px;
  border-radius:999px;border:1px solid var(--border);background:var(--bg3);color:var(--text3);cursor:pointer;
}
.qv-list-alt{font-size:12px;color:var(--text2);}
.qv-list-alt > summary{cursor:pointer;color:var(--accent);padding:4px 0;}
.qv-quiz{padding:10px 12px;display:flex;flex-direction:column;gap:12px;}
.qv-quiz-label{font-size:12px;color:var(--text2);font-weight:600;}
.qv-q{border:1px solid var(--border);border-radius:8px;padding:10px;margin:0;}
.qv-q-prompt{font-size:13px;font-weight:600;color:var(--text);padding:0;margin:0 0 8px;}
.qv-q-opts{display:flex;flex-direction:column;gap:6px;}
.qv-q-opt{
  text-align:left;font:inherit;font-size:13px;padding:8px 10px;min-height:28px;cursor:pointer;
  border:1px solid var(--border);border-radius:6px;background:var(--bg2);color:var(--text);
}
.qv-q-opt.qv-ok{border-color:var(--green);background:color-mix(in srgb,var(--green) 12%,transparent);}
.qv-q-opt.qv-bad{border-color:var(--red);background:color-mix(in srgb,var(--red) 10%,transparent);}
.qv-q-feedback{margin-top:8px;font-size:12px;color:var(--text2);}
.qv-suggested-quiz > .qv-suggested-sum .qv-suggested-label{color:var(--green);}
@media (max-width:390px){
  .qv-slide{padding:12px;min-height:100px;}
  .qv-carousel-btn{font-size:11px;padding:4px 8px;}
}
@media (prefers-reduced-motion: reduce){
  .qv-carousel-track{transition:none!important;}
}

/* OE-D69-009-C — illustrations consent UX */
.qv-illust-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 0 4px;}
.qv-illust-offer-btn,.qv-illust-primary,.qv-illust-secondary,.qv-illust-remove{
  font:inherit;font-size:13px;min-height:32px;padding:6px 12px;cursor:pointer;
  border:1px solid var(--border);border-radius:6px;background:var(--bg3);color:var(--text);
}
.qv-illust-primary{background:var(--accent);color:#fff;border-color:transparent;}
.qv-illust-offer-btn:focus-visible,.qv-illust-primary:focus-visible,
.qv-illust-secondary:focus-visible,.qv-illust-remove:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;
}
.qv-illust-status{font-size:12px;color:var(--text2);}
.qv-illust-overlay{
  position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;
  background:color-mix(in srgb, #000 45%, transparent);padding:16px;
}
.qv-illust-dialog{
  width:min(520px,100%);max-height:min(90vh,720px);overflow:auto;
  background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:10px;
  padding:16px 18px;display:flex;flex-direction:column;gap:10px;
}
.qv-illust-title{margin:0;font-size:18px;font-weight:700;}
.qv-illust-live{font-size:12px;color:var(--text2);min-height:1.2em;}
.qv-illust-body{display:flex;flex-direction:column;gap:6px;}
.qv-illust-line{margin:0;font-size:13px;color:var(--text);line-height:1.4;}
.qv-illust-provisional{color:var(--text2);font-style:italic;}
.qv-illust-actions{display:flex;flex-wrap:wrap;gap:8px;padding-top:6px;}
.qv-illust-results{display:flex;flex-direction:column;gap:12px;margin-top:8px;}
.qv-illust-card{
  margin:0;padding:10px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);
}
.qv-illust-card img{display:block;max-width:100%;height:auto;border-radius:4px;}
.qv-illust-caption{font-size:12px;font-weight:700;color:var(--text);margin-top:6px;}
.qv-illust-schematic{font-size:11px;color:var(--text2);}
.qv-illust-cost{font-size:11px;color:var(--text2);margin:4px 0;}
@media (prefers-reduced-motion: reduce){
  .qv-illust-overlay,.qv-illust-dialog{transition:none!important;animation:none!important;}
}
