/* MODO OPERAR · capa premium (js/operar_*.js): herramientas, apalancamiento con riesgo, avanzado, posiciones,
   avisos de liquidación, microinteracciones y celebración. Espaciado en múltiplos de 4, radios 6/8/12/16,
   transiciones de 120-200 ms con la misma curva. Depende de css/operar.css (tokens body.op). */
body.op{--op-ease:cubic-bezier(.2,.8,.2,1);--op-t:160ms;--op-r:8px;--op-r2:12px;--op-ambar:#f5a524;
  --op-capa2:color-mix(in srgb,var(--panel2) 70%,var(--bg2));--op-sombra:0 16px 40px rgba(0,0,0,.42),0 2px 6px rgba(0,0,0,.25);
  --op-plata:linear-gradient(180deg,#fff 0%,#cfd4dd 45%,#9aa1ae 55%,#e8ebf0 100%)}
[data-tema="claro"] body.op{--op-l:#0a9e6e;--op-s:#e23744;--op-ambar:#d98a00;--op-sombra:0 16px 40px rgba(20,30,50,.16),0 2px 6px rgba(20,30,50,.08)}
.op-tenue{color:var(--tenue)}

/* ---------- esqueletos de carga ---------- */
.op-esq{display:inline-block;vertical-align:middle;width:var(--w,60px);height:var(--h,10px);border-radius:4px;
  background:linear-gradient(90deg,var(--panel2) 0%,color-mix(in srgb,var(--panel2) 55%,var(--linea2)) 40%,var(--panel2) 80%);background-size:200% 100%;animation:op-brillo 1.3s linear infinite}
@keyframes op-brillo{from{background-position:120% 0}to{background-position:-80% 0}}
.op-esq-filas{display:flex;flex-direction:column;gap:12px;padding:16px 14px}
.op-esq-filas div{display:flex;gap:24px}

/* ---------- microinteracciones ---------- */
.op-late{animation:op-latido 260ms var(--op-ease)}
@keyframes op-latido{40%{transform:scale(1.14)}100%{transform:none}}
.op-cruza{animation:op-cruza 700ms ease-out}
@keyframes op-cruza{0%{text-shadow:0 0 14px currentColor;filter:brightness(1.5)}100%{text-shadow:none;filter:none}}
.op-t tr.op-nueva td,.op-card.op-nueva{animation:op-nueva 1.4s ease-out}
@keyframes op-nueva{0%{background:color-mix(in srgb,var(--acento) 22%,transparent)}100%{background:transparent}}
.op-t tr.op-peligro td:first-child{box-shadow:inset 3px 0 0 var(--op-ambar)}
.op-t tr.op-peligro.n2 td:first-child,.op-card.op-peligro.n2{box-shadow:inset 3px 0 0 var(--op-s)}
.op-t tr.op-peligro td{animation:op-peligro 2s ease-in-out infinite}
.op-card.op-peligro{box-shadow:inset 3px 0 0 var(--op-ambar);animation:op-peligro 2s ease-in-out infinite}
@keyframes op-peligro{50%{background:color-mix(in srgb,var(--op-s) 7%,transparent)}}
.op-px b,.op-lb-medio b{transition:color .3s var(--op-ease)}

/* celebración: destellos plateados (no confeti) */
.op-brillos{position:fixed;z-index:96;pointer-events:none;overflow:visible}
.op-brillos i{position:absolute;width:var(--t);height:var(--t);background:var(--op-plata);opacity:0;
  clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);filter:drop-shadow(0 0 4px rgba(255,255,255,.7));
  animation:op-destello-plata 1.1s var(--op-ease) forwards}
@keyframes op-destello-plata{0%{opacity:0;transform:translate(0,0) scale(.3) rotate(0)}20%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1) rotate(90deg)}}

/* ---------- cabecera: herramientas ---------- */
.op-herr{display:flex;align-items:center;gap:2px;padding:2px;border-radius:10px;flex:none}
.op-herr button{position:relative;height:32px;min-width:32px;padding:0 8px;border-radius:8px;color:var(--suave);display:inline-flex;align-items:center;justify-content:center;gap:6px;
  transition:background var(--op-t) var(--op-ease),color var(--op-t) var(--op-ease)}
.op-herr button:hover{background:var(--panel2);color:var(--texto)}
.op-herr button.on{color:var(--acento);background:color-mix(in srgb,var(--acento) 14%,transparent)}
.op-herr button:focus-visible{outline:2px solid var(--acento);outline-offset:1px}
.op-herr svg{width:17px;height:17px}
.op-herr b{font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums}
.op-herr b[hidden]{display:none}

/* ---------- panel único de herramientas ---------- */
.op-panel{position:fixed;z-index:84;top:62px;right:12px;width:356px;max-height:calc(100vh - 80px);display:flex;flex-direction:column;
  background:var(--panel);border:1px solid var(--linea2);border-radius:14px;box-shadow:var(--op-sombra);font-size:12px;font-variant-numeric:tabular-nums;
  opacity:0;transform:translateY(-6px) scale(.985);transform-origin:top right;transition:opacity var(--op-t) var(--op-ease),transform var(--op-t) var(--op-ease)}
.op-panel.on{opacity:1;transform:none}
.op-panel[hidden]{display:none}
.op-panel svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.op-panel-cab{display:flex;align-items:center;gap:8px;padding:8px 8px 0 12px;border-bottom:1px solid var(--linea)}
.op-panel-tabs{display:flex;gap:16px;flex:1}
.op-panel-tabs button{position:relative;height:36px;font-size:12.5px;font-weight:600;color:var(--tenue);transition:color var(--op-t)}
.op-panel-tabs button:hover{color:var(--suave)}
.op-panel-tabs button.on{color:var(--texto)}
.op-panel-tabs button.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:2px;background:var(--acento)}
.op-panel-x{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:var(--tenue)}
.op-panel-x:hover{background:var(--panel2);color:var(--texto)}
.op-panel-c{padding:12px;overflow:auto;display:flex;flex-direction:column;gap:12px}
.op-panel-nota{color:var(--tenue);font-size:11px;line-height:1.45}
.op-ses-cab{display:flex;align-items:baseline;gap:8px}
.op-ses-cab span{color:var(--suave);font-size:11.5px;flex:1}
.op-ses-cab b{font-size:24px;font-weight:700;letter-spacing:-.01em}
.op-ses-cab small{color:var(--tenue)}
.op-ses-cab .sube,.op-kpis .sube,.op-ses-lista .sube{color:var(--op-l)}.op-ses-cab .baja,.op-kpis .baja,.op-ses-lista .baja{color:var(--op-s)}
.op-curva{width:100%;height:64px;display:block}
.op-curva.vacia{height:auto;padding:16px 8px;border:1px dashed var(--linea2);border-radius:var(--op-r);text-align:center;color:var(--tenue);font-size:11px}
.op-curva .cero{stroke:var(--linea2);stroke-dasharray:3 4;stroke-width:1;vector-effect:non-scaling-stroke}
.op-curva .linea{fill:none;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.op-curva.sube .linea{stroke:var(--op-l)}.op-curva.baja .linea{stroke:var(--op-s)}
.op-curva .area{stroke:none;opacity:.14}
.op-curva.sube .area{fill:var(--op-l)}.op-curva.baja .area{fill:var(--op-s)}
.op-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.op-kpi{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border-radius:var(--op-r);background:var(--op-capa2)}
.op-kpi span{font-size:10.5px;color:var(--tenue)}
.op-kpi b{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.op-ses-lista{display:flex;flex-direction:column}
.op-ses-lista div{display:grid;grid-template-columns:40px minmax(0,1fr) auto auto 28px;gap:8px;align-items:center;height:34px;border-top:1px solid var(--linea)}
.op-ses-lista div>b:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.op-ses-lista .op-lado{margin:0}
.op-ses-lista div>b:nth-child(4){text-align:right}
.op-sw{display:flex;align-items:center;gap:12px;cursor:pointer;padding:4px 0}
.op-sw span{flex:1;display:flex;flex-direction:column;gap:2px}
.op-sw b{font-size:12.5px;font-weight:600}
.op-sw small{font-size:11px;color:var(--tenue);line-height:1.35}
.op-sw input{position:absolute;opacity:0;width:1px;height:1px}
.op-sw i{position:relative;width:36px;height:20px;border-radius:10px;background:var(--linea2);flex:none;transition:background var(--op-t) var(--op-ease)}
.op-sw i::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35);transition:transform var(--op-t) var(--op-ease)}
.op-sw input:checked+i{background:var(--acento)}
.op-sw input:checked+i::after{transform:translateX(16px)}
.op-sw input:focus-visible+i{outline:2px solid var(--acento);outline-offset:2px}
.op-vol{display:grid;grid-template-columns:auto 1fr 44px;align-items:center;gap:12px;padding:0 0 4px}
.op-vol span{font-size:11.5px;color:var(--suave)}
.op-vol b{font-size:11.5px;text-align:right;color:var(--suave)}
.op-vol input{width:100%;accent-color:var(--acento)}
.op-vol.apagado{opacity:.45}
.op-probar{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding-top:8px;border-top:1px solid var(--linea)}
.op-probar span{font-size:11px;color:var(--tenue);margin-right:4px}
.op-atajos{display:flex;flex-direction:column;margin:0}
.op-atajos div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--linea)}
.op-atajos dt{display:flex;align-items:center;gap:4px;color:var(--tenue)}
.op-atajos dd{margin:0;color:var(--suave);text-align:right}
kbd{font:600 11px/1 "Inter",system-ui,sans-serif;min-width:22px;height:22px;padding:0 6px;display:inline-grid;place-items:center;border-radius:6px;color:var(--texto);
  background:var(--panel2);border:1px solid var(--linea2);box-shadow:inset 0 -1px 0 var(--linea2)}
.op-lista-prev{display:flex;flex-direction:column;gap:6px;padding-left:18px;color:var(--suave);line-height:1.4}
.op-principio{display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:var(--op-r);background:var(--op-capa2);border-left:2px solid var(--acento)}
.op-principio span{font-size:10.5px;color:var(--tenue);text-transform:uppercase;letter-spacing:.06em}
.op-principio b{font-size:13px}
.op-principio small{color:var(--suave);line-height:1.4}

/* ---------- formulario: avanzado y apalancamiento ---------- */
.op-f-tipos{align-items:flex-end}
.op-f-avz{margin-left:auto;align-self:center;height:24px!important;padding:0 10px!important;border-radius:12px;font-size:11px!important;font-weight:600;color:var(--tenue)!important;
  border:1px solid var(--op-borde);transition:all var(--op-t) var(--op-ease)}
.op-f-avz::after{display:none}
.op-f-avz:hover{color:var(--texto)!important;border-color:var(--linea2)}
.op-f-avz.on{color:var(--acento)!important;border-color:color-mix(in srgb,var(--acento) 55%,transparent);background:color-mix(in srgb,var(--acento) 10%,transparent)}
.op-chip-apal{color:var(--rc);position:relative;overflow:hidden;font-variant-numeric:tabular-nums}
.op-chip-apal::after{content:"";position:absolute;left:50%;width:24px;margin-left:-12px;bottom:4px;height:2px;border-radius:2px;background:var(--rc);opacity:.8;transition:background var(--op-t)}
.op-chip-apal:disabled{color:var(--suave)}
.op-chip-apal span{display:inline-block}
.op-pop{gap:12px;padding:16px;border-radius:var(--op-r2);box-shadow:var(--op-sombra);animation:op-pop var(--op-t) var(--op-ease)}
@keyframes op-pop{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
.op-pop-cab small{font-size:11px;color:var(--tenue)}
.op-ap-num{display:flex;align-items:baseline;justify-content:space-between}
.op-ap-num b{font-size:34px;font-weight:800;letter-spacing:-.02em;color:var(--rc);display:inline-block;transition:color var(--op-t) var(--op-ease);font-variant-numeric:tabular-nums}
.op-ap-niv{font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px}
.op-ap-niv.r0,.op-ap-niv.r1{color:var(--op-l);background:color-mix(in srgb,var(--op-l) 12%,transparent)}
.op-ap-niv.r2{color:var(--op-ambar);background:color-mix(in srgb,var(--op-ambar) 14%,transparent)}
.op-ap-niv.r3{color:var(--op-s);background:color-mix(in srgb,var(--op-s) 14%,transparent)}
.op-ap-medidor{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.op-ap-medidor i{height:4px;border-radius:2px;background:var(--linea2);transition:background var(--op-t) var(--op-ease)}
.op-ap-medidor i.on:nth-child(1){background:var(--op-l)}.op-ap-medidor i.on:nth-child(2){background:color-mix(in srgb,var(--op-l) 50%,var(--op-ambar))}
.op-ap-medidor i.on:nth-child(3){background:var(--op-ambar)}.op-ap-medidor i.on:nth-child(4){background:var(--op-s)}
.op-pop input[data-k=popApal]{-webkit-appearance:none;appearance:none;height:22px;background:transparent;margin:0}
.op-pop input[data-k=popApal]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--rc) var(--v),var(--linea2) var(--v))}
.op-pop input[data-k=popApal]::-moz-range-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--rc) var(--v),var(--linea2) var(--v))}
.op-pop input[data-k=popApal]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-7px;border-radius:50%;background:var(--panel);border:3px solid var(--rc);box-shadow:0 0 0 4px color-mix(in srgb,var(--rc) 18%,transparent);cursor:grab}
.op-pop input[data-k=popApal]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--panel);border:3px solid var(--rc)}
.op-pop input[data-k=popApal]:focus-visible{outline:2px solid color-mix(in srgb,var(--rc) 70%,transparent);outline-offset:4px;border-radius:8px}
.op-ap-liq{font-size:11px;color:var(--suave);line-height:1.4}
.op-ap-liq b{color:var(--texto)}
.op-pop-chips button{transition:color var(--op-t),box-shadow var(--op-t)}
.op-pop-chips button:hover{color:var(--rc)}
.op-pop-chips button.on{color:var(--rc);box-shadow:inset 0 0 0 1px var(--rc)}
.op-pop-ok{transition:filter var(--op-t)}
.op-pop-ok:hover{filter:brightness(1.06)}
.op-long,.op-short{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;height:48px;line-height:1.15}
.op-long small,.op-short small{font-size:10.5px;font-weight:600;opacity:.8;font-variant-numeric:tabular-nums}
.op-long small:empty,.op-short small:empty{display:none}
.op-long:focus-visible,.op-short:focus-visible{outline:2px solid var(--texto);outline-offset:2px}
.op-f-rr{display:flex;flex-wrap:wrap;gap:4px 12px;padding:8px 10px;border-radius:var(--op-r);background:var(--op-capa2);font-size:11px;color:var(--suave)}
.op-f-rr[hidden]{display:none}
.op-f-rr b{font-weight:700}
.op-f-rr small{color:var(--tenue)}
.op-rr-r{margin-left:auto;font-weight:700}
.op-f-rr .sube{color:var(--op-l)}.op-f-rr .baja{color:var(--op-s)}
.op-avz{display:flex;flex-direction:column;border-top:1px solid var(--op-borde);margin:0 -14px;padding:0 14px}
.op-sec{border-bottom:1px solid var(--op-borde)}
.op-sec summary{display:flex;align-items:center;gap:8px;height:38px;cursor:pointer;list-style:none;font-weight:600;font-size:12px;color:var(--suave);user-select:none}
.op-sec summary::-webkit-details-marker{display:none}
.op-sec summary:hover{color:var(--texto)}
.op-sec summary span{flex:1}
.op-sec summary em{font-style:normal;font-size:10px;font-weight:700;color:var(--tenue);padding:1px 6px;border-radius:4px;background:var(--panel2)}
.op-sec summary i{width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);transition:transform var(--op-t) var(--op-ease)}
.op-sec[open] summary{color:var(--texto)}
.op-sec[open] summary i{transform:rotate(225deg) translate(-2px,-2px)}
.op-sec summary:focus-visible{outline:2px solid var(--acento);outline-offset:-2px;border-radius:6px}
.op-sec-c{display:flex;flex-direction:column;gap:8px;padding:0 0 12px}
.op-avz-fila{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.op-avz-dos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.op-avz .op-in{height:36px}
.op-avz .op-in input{font-size:12.5px}
.op-seg{display:flex;padding:2px;border-radius:var(--op-r);background:var(--bg);border:1px solid var(--op-borde);height:36px}
.op-seg button{padding:0 10px;border-radius:6px;font-size:11.5px;font-weight:600;color:var(--tenue);transition:all var(--op-t) var(--op-ease)}
.op-seg button.on{background:var(--panel2);color:var(--texto);box-shadow:0 1px 2px rgba(0,0,0,.25)}
.op-avz-atr{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:var(--suave);min-height:18px}
.op-avz-atr b{color:var(--texto)}
.op-avz-vol{font-size:10.5px;font-weight:700;padding:2px 6px;border-radius:4px}
.op-avz-vol.baja{color:var(--op-l);background:color-mix(in srgb,var(--op-l) 12%,transparent)}
.op-avz-vol.media{color:var(--op-ambar);background:color-mix(in srgb,var(--op-ambar) 14%,transparent)}
.op-avz-vol.alta{color:var(--op-s);background:color-mix(in srgb,var(--op-s) 14%,transparent)}
.op-avz-sl{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.op-avz-sl .op-bt{height:30px}
.op-avz-ok{height:34px;justify-content:space-between;padding:0 12px}
.op-avz-ok b{font-weight:700;font-variant-numeric:tabular-nums}
.op-avz-ok:disabled{opacity:.45;cursor:not-allowed;filter:none}
.op-avz-nota{font-size:11px;color:var(--tenue);line-height:1.45}
.op-avz-nota b{color:var(--suave)}
.op-avz-nota .baja{color:var(--op-s)}
.op-paso-n{display:flex;align-items:center;gap:6px;height:36px;padding:0 4px;border-radius:var(--op-r);background:var(--bg);border:1px solid var(--op-borde)}
.op-paso-n button{width:28px;height:28px;border-radius:6px;font-size:16px;color:var(--suave)}
.op-paso-n button:hover{background:var(--panel2);color:var(--texto)}
.op-paso-n b{min-width:16px;text-align:center;font-size:13px}
.op-paso-n span{font-size:11px;color:var(--tenue);flex:1}
.op-esc-vista{display:flex;flex-direction:column;gap:6px}
.op-esc-vista small{font-size:10.5px;color:var(--tenue)}
.op-esc-barras{display:flex;align-items:flex-end;gap:6px;height:18px;padding:0 2px}
.op-esc-barras i{flex:1;height:var(--h);min-height:3px;border-radius:3px 3px 1px 1px;background:color-mix(in srgb,var(--acento) 55%,transparent)}
.op-esc-l{color:var(--op-l);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--op-l) 45%,transparent);background:color-mix(in srgb,var(--op-l) 8%,transparent);height:32px}
.op-esc-s{color:var(--op-s);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--op-s) 45%,transparent);background:color-mix(in srgb,var(--op-s) 8%,transparent);height:32px}
.op-plant{display:flex;flex-wrap:wrap;gap:6px}
.op-plant-chip{display:inline-flex;align-items:stretch;border-radius:var(--op-r);background:var(--panel2);overflow:hidden}
.op-plant-chip button{display:flex;flex-direction:column;align-items:flex-start;padding:6px 10px;font-size:11.5px;font-weight:600;line-height:1.2}
.op-plant-chip button small{font-size:10px;color:var(--tenue);font-weight:500}
.op-plant-chip button:hover{background:color-mix(in srgb,var(--texto) 5%,transparent)}
.op-plant-chip .x{padding:0 8px;color:var(--tenue);font-size:14px;border-left:1px solid var(--linea)}
.op-plant-chip .x:hover{color:var(--op-s)}

/* ---------- posiciones: agregado, liquidación y menú "⋯" ---------- */
.op-agr{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:16px;padding:8px 14px;background:var(--op-fondo);border-bottom:1px solid var(--op-borde);font-size:11.5px;color:var(--suave)}
.op-agr b{font-size:13px;font-weight:700}
.op-agr .op-bt{margin-left:auto}
.op-agr-n{color:var(--texto);font-weight:600}
.op-agr~.op-t th{top:37px}
.op-liqc{display:inline-flex;flex-direction:column;gap:4px;min-width:72px}
.op-liqbar{display:block;height:3px;border-radius:2px;background:var(--linea2);overflow:hidden}
.op-liqbar i{display:block;height:100%;border-radius:2px;background:var(--op-l);transition:width .4s var(--op-ease),background var(--op-t)}
.op-liqbar.n1 i{background:var(--op-ambar)}.op-liqbar.n2 i{background:var(--op-s)}
.op-trail{font-size:9.5px;font-weight:800;letter-spacing:.03em;padding:1px 5px;border-radius:4px;color:var(--azul);background:color-mix(in srgb,var(--azul) 14%,transparent)}
.op-ed-trail em{font-style:normal;color:var(--tenue);font-size:11px}
.op-ed-trail span{color:var(--azul)!important}
.op-menu{position:fixed;z-index:88;min-width:236px;padding:6px;border-radius:var(--op-r2);background:var(--panel);border:1px solid var(--linea2);box-shadow:var(--op-sombra);
  opacity:0;transform:translateY(-4px) scale(.98);transition:opacity 140ms var(--op-ease),transform 140ms var(--op-ease);font-size:12px}
.op-menu.on{opacity:1;transform:none}
.op-menu button{width:100%;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;text-align:left;color:var(--texto)}
.op-menu button:hover:not(:disabled),.op-menu button:focus-visible{background:var(--panel2);outline:0}
.op-menu button:disabled{opacity:.45;cursor:default}
.op-menu svg{width:16px;height:16px;flex:none;fill:none;stroke:var(--suave);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.op-menu span{display:flex;flex-direction:column;gap:1px;min-width:0}
.op-menu b{font-weight:600}
.op-menu small{font-size:10.5px;color:var(--tenue)}
.op-menu hr{border:0;border-top:1px solid var(--linea);margin:4px 6px}
.op-acc .op-bt.ic[data-menu]{color:var(--suave)}
.op-vacio b{font-size:12.5px;color:var(--suave);font-weight:600}
.op-vacio span{max-width:320px;text-align:center;line-height:1.45;font-size:11.5px}
.op-vacio svg{width:34px;height:34px;padding:6px;border-radius:10px;background:var(--panel2);opacity:.8}

/* menú del gráfico (pro.js): las dos órdenes que tienen sentido en ese precio */
.op-mdot{width:8px;height:8px;border-radius:50%;flex:none}
.op-mdot.long{background:var(--verde);box-shadow:0 0 0 3px color-mix(in srgb,var(--verde) 22%,transparent)}
.op-mdot.short{background:var(--rojo);box-shadow:0 0 0 3px color-mix(in srgb,var(--rojo) 22%,transparent)}

/* ---------- aviso de liquidación ---------- */
.op-riesgo{display:none}
body.op .op-riesgo:not([hidden]){position:fixed;z-index:70;top:64px;left:calc((100vw - 612px) / 2);transform:translateX(-50%);display:flex;align-items:center;gap:10px;max-width:min(640px,calc(100vw - 660px));
  padding:8px 8px 8px 12px;border-radius:var(--op-r2);font-size:12px;line-height:1.35;background:color-mix(in srgb,var(--panel) 92%,var(--op-ambar));
  border:1px solid color-mix(in srgb,var(--op-ambar) 55%,transparent);box-shadow:var(--op-sombra)}
body.op.op-sinlibro .op-riesgo:not([hidden]){left:calc((100vw - 324px) / 2);max-width:min(640px,calc(100vw - 372px))}
body.op .op-riesgo.n2:not([hidden]){background:color-mix(in srgb,var(--panel) 88%,var(--op-s));border-color:color-mix(in srgb,var(--op-s) 65%,transparent)}
.op-riesgo>i{width:8px;height:8px;border-radius:50%;flex:none;background:var(--op-ambar);box-shadow:0 0 0 0 var(--op-ambar);animation:op-faro 1.6s ease-out infinite}
.op-riesgo.n2>i{background:var(--op-s);animation-duration:1s}
@keyframes op-faro{0%{box-shadow:0 0 0 0 color-mix(in srgb,currentColor 0%,var(--op-s))}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
.op-riesgo span{flex:1;min-width:0}
.op-riesgo button{flex:none;height:28px;padding:0 10px;border-radius:7px;font-weight:600;font-size:11.5px;background:var(--panel2)}
.op-riesgo button[data-r=x]{width:28px;padding:0;color:var(--suave);background:none}
.op-riesgo.op-late{animation:op-latido-av 360ms var(--op-ease)}
@keyframes op-latido-av{40%{transform:translateX(-50%) scale(1.04)}100%{transform:translateX(-50%)}}

/* ---------- lista de disciplina ---------- */
.op-modal{position:fixed;inset:0;z-index:95;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,0);transition:background var(--op-t)}
.op-modal.on{background:rgba(0,0,0,.55)}
.op-modal-caja{width:100%;max-width:400px;padding:20px;border-radius:16px;background:var(--panel);border:1px solid var(--linea2);box-shadow:var(--op-sombra,0 20px 60px rgba(0,0,0,.5));
  display:flex;flex-direction:column;gap:12px;opacity:0;transform:translateY(8px) scale(.98);transition:opacity var(--op-t,160ms),transform var(--op-t,160ms)}
.op-modal.on .op-modal-caja{opacity:1;transform:none}
.op-modal h3{font-size:16px}
.op-modal p{color:var(--suave);font-size:12px;line-height:1.45}
.op-lista{display:flex;flex-direction:column;gap:4px}
.op-lista label{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:var(--panel2);cursor:pointer;font-size:12.5px;transition:background var(--op-t,160ms)}
.op-lista input{position:absolute;opacity:0;width:1px;height:1px}
.op-lista i{width:18px;height:18px;border-radius:6px;border:1.5px solid var(--linea2);flex:none;display:grid;place-items:center;transition:all var(--op-t,160ms)}
.op-lista input:checked+i{background:var(--acento);border-color:var(--acento)}
.op-lista input:checked+i::after{content:"";width:5px;height:9px;border:solid var(--acentoTxt);border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.op-lista input:focus-visible+i{outline:2px solid var(--acento);outline-offset:2px}
.op-modal-bts{display:grid;grid-template-columns:1fr 1.4fr;gap:8px;margin-top:4px}
.op-modal-bts .op-bt{height:42px;font-size:13px;border-radius:10px}
.op-modal-bts .op-bt:disabled{opacity:.5;cursor:not-allowed;filter:none}

/* ---------- modo enfoque ---------- */
@media (min-width:901px){
  body.op.op-enfoque #app{grid-template-columns:minmax(0,1fr) 0 324px;grid-template-rows:56px minmax(0,1fr) 0}
  body.op.op-enfoque #opLibro,body.op.op-enfoque #opAbajo{display:none}
  body.op.op-enfoque .op-riesgo:not([hidden]){left:calc((100vw - 324px) / 2)}
}
@media (min-width:901px) and (max-width:1280px){
  body.op.op-enfoque #app{grid-template-columns:minmax(0,1fr) 0 300px}
  .op-herr b{display:none}
}

/* ---------- teléfono ---------- */
@media (max-width:900px){
  .op-herr [data-herr=enfoque],.op-herr [data-herr=sesion]{display:none}
  .op-cab .op-par{overflow:hidden}
  .op-panel::before{content:"";display:block;width:40px;height:4px;border-radius:2px;background:var(--linea2);margin:8px auto 0;flex:none}
  .op-herr{gap:0}
  .op-herr button{min-width:30px;padding:0 6px}
  .op-herr b{display:none}
  .op-panel{top:auto;bottom:0;left:0;right:0;width:auto;max-height:82vh;border-radius:18px 18px 0 0;padding-bottom:env(safe-area-inset-bottom);transform:translateY(16px);transform-origin:bottom}
  .op-panel-tabs{gap:14px;overflow-x:auto;scrollbar-width:none}
  .op-panel-tabs button{height:44px;font-size:13px;white-space:nowrap}
  .op-sw i{width:44px;height:26px;border-radius:13px}
  .op-sw i::after{width:22px;height:22px}
  .op-sw input:checked+i::after{transform:translateX(18px)}
  body.op .op-riesgo:not([hidden]){top:calc(58px + env(safe-area-inset-top));left:8px;right:8px;max-width:none;transform:none}
  .op-riesgo.op-late{animation:op-latido 300ms var(--op-ease)}
  .op-menu{min-width:240px}
  .op-menu button{padding:10px 12px}
  .op-agr{padding:8px 0;margin-bottom:8px;gap:12px;flex-wrap:wrap;position:static;background:none}
  .op-agr .op-bt{height:32px}
  .op-long,.op-short{height:50px}
  .op-barra .op-long,.op-barra .op-short{height:50px}
  body.op.op-enfoque #app{grid-template-rows:54px minmax(0,1fr) 0 0 calc(68px + env(safe-area-inset-bottom))}
  body.op.op-enfoque #opMovTabs,body.op.op-enfoque #opLibro,body.op.op-enfoque #opAbajo{display:none!important}
  .op-modal{align-items:end;padding:0}
  .op-modal-caja{max-width:none;border-radius:18px 18px 0 0;padding-bottom:calc(20px + env(safe-area-inset-bottom))}
  .op-avz .op-in{height:44px}
  .op-seg{height:44px}
  .op-paso-n{height:44px}
}
@media (prefers-reduced-motion:reduce){
  .op-esq,.op-t tr.op-peligro td,.op-card.op-peligro,.op-riesgo>i{animation:none}
  .op-panel,.op-menu,.op-modal-caja,.op-pop{transition:none;animation:none}
}

/* =====================================================================================================
   ESTRUCTURA DE EXCHANGE EN TARJETAS (referencias: WEEX, Hyperliquid, MEXC)
   Página casi negra; cada bloque es una tarjeta un punto más clara con esquinas de 8 px y 4 px de separación.
   Etiquetas grises de 11 px arriba, valores nítidos de 12-13 px, números tabulares, verde/rojo de mercado
   y la plata de Phinvio en lo que es de marca (subrayados de pestañas, deslizadores, foco).
   ===================================================================================================== */
body.op{--op-pagina:#000;--op-tarjeta:var(--bg);--op-fondo:var(--op-tarjeta);--op-capa:var(--op-campo);--op-campo:#141821;--op-campo2:#1b202b;
  --op-borde:rgba(255,255,255,.06);--op-gris:#848e9c;--op-txt:#eaecef;--op-l:#2ebd85;--op-s:#f6465d;--op-ac:#d4d8e0;--op-ac2:#9aa1ae}
[data-tema="claro"] body.op{--op-pagina:#eceef2;--op-tarjeta:#fff;--op-campo:#f3f4f7;--op-campo2:#e9ebf0;--op-borde:rgba(15,23,42,.07);--op-gris:#707a8a;--op-txt:#1e2329;
  --op-l:#0aa06e;--op-s:#e23744;--op-ac:#3b4250;--op-ac2:#6b7385}
body.op{background:var(--op-pagina)}
body.op #app{background:var(--op-pagina);gap:4px;padding:4px;grid-template-columns:minmax(0,1fr) 300px 332px;grid-template-rows:60px minmax(0,1fr) 268px 28px;
  grid-template-areas:"opcab opcab opcab" "centro oplibro opform" "opabajo opabajo opform" "oppie oppie oppie"}
body.op.op-sinlibro #app{grid-template-columns:minmax(0,1fr) 0 332px;column-gap:0}
body.op.op-sinlibro #centro{margin-right:4px}
body.op #opCab,body.op #centro,body.op #opLibro,body.op #opAbajo,body.op .op-f,body.op .op-saldo,body.op #opPie{background:var(--op-tarjeta);border:0!important;border-radius:8px}
body.op #centro{overflow:hidden}
body.op #opForm{background:transparent;gap:4px;overflow-y:auto;overflow-x:hidden;scrollbar-width:none}
body.op #opForm::-webkit-scrollbar{display:none}
body.op .op-f{flex:1 0 auto;padding:12px 14px 14px;gap:12px}
body.op .op-saldo{margin-top:0;flex:none;padding:12px 14px}
body.op .op-error,body.op .op-f-cta{margin:0;border-radius:8px}
.op-cab,.op-col{color:var(--op-txt)}
.op-cab .sube,.op-col .sube,.op-pie .sube{color:var(--op-l)}.op-cab .baja,.op-col .baja,.op-pie .baja{color:var(--op-s)}
/* pestañas: gris, la activa en texto claro con subrayado corto de plata */
.op-subtabs button,.op-f-tipos button,.op-tb-tabs button,.op-movtabs button,.op-panel-tabs button{color:var(--op-gris)}
.op-subtabs button.on,.op-f-tipos button.on,.op-tb-tabs button.on,.op-movtabs button.on{color:var(--op-txt)}
.op-subtabs button.on::after,.op-f-tipos button.on::after,.op-tb-tabs button.on::after,.op-movtabs button.on::after,.op-panel-tabs button.on::after{
  left:50%;right:auto;width:16px;margin-left:-8px;background:var(--op-ac)}
.op-tb-tabs button.on::after,.op-movtabs button.on::after{width:20px;margin-left:-10px}

/* ---------- cabecera de mercado ---------- */
.op-cab{gap:24px;padding:0 16px 0 8px}
.op-par{gap:10px}
.op-par .av{width:28px;height:28px}
.op-par b{font-size:16px;font-weight:700}
.op-par small{display:flex;align-items:center;gap:4px;max-width:none;margin-top:3px}
.op-par small em{font-style:normal;color:var(--op-gris);font-size:10.5px;max-width:120px;overflow:hidden;text-overflow:ellipsis}
.op-mini{font-style:normal;font-size:10px;font-weight:600;line-height:1;padding:3px 5px;border-radius:4px;color:var(--op-gris);background:var(--op-campo2)}
.op-mini[hidden]{display:none}
.op-mini[data-v=maxlev]{color:var(--op-ac)}
.op-px b{font-size:20px;letter-spacing:-.01em}
.op-px small{font-size:11.5px;margin-top:2px}
.op-stats{gap:24px}
.op-stats div[hidden]{display:none}
.op-stats dt{font-size:11px;color:var(--op-gris);line-height:1.2;width:max-content}
.op-stats dt.op-exp{border-bottom:1px dashed color-mix(in srgb,var(--op-gris) 60%,transparent);cursor:help}
.op-stats dd{font-size:12px;font-weight:500;color:var(--op-txt);margin-top:3px}
.op-tf{padding-left:16px;border-left:1px solid var(--op-borde)}
.op-tf .bt{height:28px;font-size:12px;color:var(--op-gris)}
.op-tf .bt.on{color:var(--op-txt);background:var(--op-campo2)}

/* ---------- libro de órdenes ---------- */
.op-libro{border-right:0!important}
.op-sub{padding:4px 12px 0;height:40px;border-bottom:1px solid var(--op-borde)}
.op-subtabs{gap:20px;height:100%}
.op-subtabs button{height:100%;font-size:13px}
.op-lb-herr{display:flex;align-items:center;justify-content:space-between;padding:8px 12px 4px}
.op-lb-herr[hidden]{display:none}
.op-lb-vistas{display:flex;gap:4px}
.op-lb-vistas button{width:24px;height:24px;border-radius:5px;display:grid;place-items:center;opacity:.45;transition:opacity var(--op-t),background var(--op-t)}
.op-lb-vistas button:hover{opacity:.8}
.op-lb-vistas button.on{opacity:1;background:var(--op-campo2)}
.op-lb-vistas svg{width:16px;height:16px;stroke:none}
.op-lb-vistas .v{fill:var(--op-s)}.op-lb-vistas .c{fill:var(--op-l)}.op-lb-vistas .l{fill:none;stroke:var(--op-gris);stroke-width:1.4}
.op-paso{height:24px;border:0;border-radius:5px;background:var(--op-campo2);color:var(--op-txt);font-size:11.5px;padding:0 6px;font-variant-numeric:tabular-nums}
.op-lb-cab{padding:4px 12px;font-size:11px;color:var(--op-gris);line-height:1.25}
.op-lb-cab span{display:flex;flex-direction:column}
.op-lb-cab span:not(:first-child){align-items:flex-end}
.op-lb-cab small{font-size:10px;opacity:.85}
.op-lb-f{height:20px;padding:0 12px;font-size:12px}
.op-lb-f::before{opacity:.16;top:1px;bottom:1px}
.op-lb-f span:not(:first-child){color:var(--op-txt)}
.op-lb-f span:last-child{color:var(--op-gris)}
.op-lb-f.venta span:first-child{color:var(--op-s)}.op-lb-f.compra span:first-child{color:var(--op-l)}
.op-lb-f:hover{background:color-mix(in srgb,var(--op-txt) 5%,transparent)}
.op-lb-medio{border:0;margin:2px 0;padding:6px 12px;align-items:center}
.op-lb-medio b{font-size:19px;letter-spacing:-.01em}
.op-lb-medio small{font-size:11px;color:var(--op-gris);margin-left:auto}
.op-lb-ratio{padding:10px 12px;gap:6px;font-size:11px}
.op-lb-ratio i{height:18px;border-radius:3px;opacity:1;background:linear-gradient(90deg,color-mix(in srgb,var(--op-l) 28%,transparent) var(--b),color-mix(in srgb,var(--op-s) 28%,transparent) var(--b))}
.op-lb-b,.op-lb-s{font-size:10px;font-weight:800;width:18px;height:18px;display:grid;place-items:center;border-radius:3px;border:1px solid}
.op-lb-b{color:var(--op-l);border-color:color-mix(in srgb,var(--op-l) 60%,transparent)}.op-lb-s{color:var(--op-s);border-color:color-mix(in srgb,var(--op-s) 60%,transparent)}
.op-lb-esq{display:flex;flex-direction:column;gap:10px;padding:12px}
.op-lb-esq .op-esq{align-self:flex-end}
.op-tr-f{height:20px;padding:0 12px;font-size:12px}
.op-tr-f span:not(:first-child){color:var(--op-txt)}
.op-tr-f span:last-child{color:var(--op-gris)}

/* ---------- formulario ---------- */
.op-f-ac{display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:8px;background:var(--op-campo)}
.op-f-ac button{height:32px;border-radius:6px;font-weight:600;font-size:13px;color:var(--op-gris);transition:background var(--op-t) var(--op-ease),color var(--op-t)}
.op-f-ac button:hover{color:var(--op-txt)}
.op-f-ac button.on{background:var(--op-l);color:#fff}
.op-f.cerrando .op-f-ac button.on{background:var(--op-s)}
.op-chip{height:32px;border-radius:6px;background:var(--op-campo);color:var(--op-txt);font-size:12.5px}
.op-f-tipos{gap:20px;border-bottom:0;height:28px}
.op-f-tipos button{height:28px;font-size:13px}
.op-f-disp{font-size:11.5px;color:var(--op-gris)}
.op-f-disp b{color:var(--op-txt);font-weight:600}
.op-in{background:var(--op-campo);border:1px solid transparent;border-radius:8px}
.op-in:focus-within{border-color:color-mix(in srgb,var(--op-ac) 55%,transparent)}
.op-in2{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-rows:auto auto;align-items:center;column-gap:6px;row-gap:2px;height:58px;padding:8px 10px 8px 12px}
.op-in2>span{grid-column:1/-1;font-size:11px;color:var(--op-gris)}
.op-in2>span small{font-size:11px;color:var(--op-gris);opacity:.8}
.op-in2 input{grid-column:1;width:100%;height:24px;text-align:left;font-size:17px;font-weight:600;letter-spacing:-.01em}
.op-in2.apagado input{font-size:14px;font-weight:500;color:var(--op-gris)}
.op-in2>button{grid-row:2;height:24px;padding:0 8px;border-radius:5px;font-size:11.5px;font-weight:700}
.op-in2>button[data-a=ultimo]{color:var(--acento)}
.op-bbo,.op-unidad{background:var(--op-campo2);color:var(--op-txt)!important}
.op-bbo:disabled{opacity:.4;cursor:default}
.op-unidad{display:inline-flex;align-items:center;gap:4px}
.op-unidad i{font-size:10px;color:var(--op-gris)}
.op-slider{padding:2px 0}
.op-slider input::-webkit-slider-runnable-track{height:2px;background:linear-gradient(90deg,var(--op-ac) var(--v,0%),var(--op-campo2) var(--v,0%))}
.op-slider input::-moz-range-track{height:2px;background:linear-gradient(90deg,var(--op-ac) var(--v,0%),var(--op-campo2) var(--v,0%))}
.op-slider input::-webkit-slider-thumb{width:14px;height:14px;margin-top:-6px;background:var(--op-tarjeta);border:3px solid var(--op-ac)}
.op-slider input::-moz-range-thumb{background:var(--op-tarjeta);border:3px solid var(--op-ac)}
.op-marcas button i{width:7px;height:7px;transform:none;border-radius:50%;background:var(--op-tarjeta);border:1.5px solid var(--op-campo2)}
.op-slider b{min-width:48px;height:24px;display:grid;place-items:center;border-radius:5px;background:var(--op-campo);color:var(--op-txt);font-weight:600}
.op-f-tpsl{font-weight:500;color:var(--op-txt);font-size:12.5px}
.op-f-tpsl input{accent-color:var(--op-l)}
.op-f-niv .op-in{height:40px}
.op-f-det{display:flex;flex-direction:column;gap:6px;margin:0;font-size:11.5px;padding-top:4px}
.op-f-det div{display:flex;justify-content:space-between;gap:8px;min-width:0}
.op-f-det dt{color:var(--op-gris)}
.op-f-det dt[title]{border-bottom:1px dashed color-mix(in srgb,var(--op-gris) 50%,transparent);cursor:help}
.op-f-det dd{margin:0;color:var(--op-txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.op-f-motivo{color:var(--op-gris);font-size:11px}
.op-long,.op-short{border-radius:8px;height:46px;font-size:14px}
.op-long{background:var(--op-l)}.op-short{background:var(--op-s)}
.op-long:disabled,.op-short:disabled{opacity:.32}
.op-f-nota{font-size:11px;color:var(--op-gris);line-height:1.45}
.op-f-cpos{display:flex;flex-direction:column;gap:6px}
.op-f-cfila{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:10px;border-radius:8px;background:var(--op-campo);font-size:11.5px}
.op-f-cfila span:nth-child(2){color:var(--op-gris);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.op-f-cfila .op-lado{margin:0}
.op-saldo-cab b{font-size:13px}
.op-saldo dl div{font-size:12px}
.op-saldo dt{color:var(--op-gris)}

/* ---------- tablas de abajo ---------- */
.op-abajo{border-top:0!important}
.op-tb-tabs{gap:24px;padding:0 16px;border-bottom:1px solid var(--op-borde);align-items:center}
.op-tb-tabs button{height:40px;font-size:13px;font-weight:500}
.op-tb-tabs button.on{font-weight:600}
.op-tb-tabs i{min-width:0;height:auto;padding:0;margin-left:2px;background:none;color:inherit;font-size:13px;font-weight:inherit}
.op-solopar{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:12px;color:var(--op-gris);cursor:pointer;white-space:nowrap}
.op-solopar input{width:14px;height:14px;accent-color:var(--op-l)}
.op-t th{font-size:11.5px;color:var(--op-gris);font-weight:400;padding:10px 12px;background:var(--op-tarjeta)}
.op-t td{font-size:12px;padding:9px 12px;border-top:1px solid var(--op-borde)}
.op-t th:first-child,.op-t td:first-child{padding-left:16px}
.op-t tbody tr:hover td{background:color-mix(in srgb,var(--op-txt) 2.5%,transparent)}
.op-agr{background:var(--op-tarjeta);padding:8px 16px}
.op-agr~.op-t th{top:37px}
.op-bt{background:var(--op-campo2);border-radius:6px}
.op-vacio{gap:10px}
.op-vacio svg{background:none;opacity:.55;width:40px;height:40px;stroke-width:1.2;padding:0}
.op-vacio b{font-weight:500;color:var(--op-gris)}

/* ---------- pie: conexión y cinta de mercados ---------- */
#opPie{display:none}
body.op #opPie{display:flex;grid-area:oppie;align-items:center;gap:16px;padding:0 12px;font-size:11.5px;color:var(--op-gris);overflow:hidden;font-variant-numeric:tabular-nums}
.op-conex{display:flex;align-items:center;gap:6px;flex:none}
.op-conex i{width:7px;height:7px;border-radius:50%;background:var(--op-gris)}
.op-conex.bien i{background:var(--op-l);box-shadow:0 0 0 3px color-mix(in srgb,var(--op-l) 20%,transparent)}
.op-conex.lenta i{background:var(--op-ambar)}.op-conex.mal i{background:var(--op-s)}
.op-conex b{font-weight:500;color:var(--op-txt)}
.op-conex.bien b{color:var(--op-l)}.op-conex.mal b{color:var(--op-s)}
.op-cinta{flex:1;min-width:0;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 24px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 24px),transparent)}
.op-cinta>div{display:flex;width:max-content;animation:op-cinta 60s linear infinite}
.op-cinta:hover>div{animation-play-state:paused}
.op-cinta button,.op-cinta-copia{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.op-cinta button{padding:0 10px;color:var(--op-txt);font-size:11.5px}
.op-cinta button:hover{color:var(--op-ac)}
.op-cinta-copia{gap:0}
@keyframes op-cinta{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.op-pie-der{flex:none}

/* ---------- PC estrecho y enfoque ---------- */
@media (min-width:901px) and (max-width:1280px){
  body.op #app{grid-template-columns:minmax(0,1fr) 260px 304px}
  body.op.op-sinlibro #app{grid-template-columns:minmax(0,1fr) 0 304px}
  .op-cab{gap:16px}.op-stats{gap:16px}
  .op-t.pos th:nth-child(4),.op-t.pos td:nth-child(4),.op-t.pos th:nth-child(6),.op-t.pos td:nth-child(6){display:table-cell}
  .op-t.pos th:nth-child(3),.op-t.pos td:nth-child(3),.op-t.pos th:nth-child(8),.op-t.pos td:nth-child(8){display:none}
  .op-pie-der{display:none}
}
@media (min-width:901px){
  body.op.op-enfoque #app{grid-template-columns:minmax(0,1fr) 0 332px;grid-template-rows:60px minmax(0,1fr) 0 28px;row-gap:4px;column-gap:0}
  body.op.op-enfoque #centro{margin-right:4px}
  body.op.op-enfoque #app{grid-template-areas:"opcab opcab opcab" "centro oplibro opform" "centro oplibro opform" "oppie oppie oppie"}
}

/* ---------- teléfono: tarjetas también ---------- */
@media (max-width:900px){
  body.op #app{padding:0 0 0;gap:4px;grid-template-columns:100%;grid-template-rows:54px minmax(0,1fr) 42px minmax(0,34vh) calc(68px + env(safe-area-inset-bottom));
    grid-template-areas:"opcab" "centro" "opmovtabs" "opmov" "opbarra"}
  body.op #opCab{border-radius:0}
  body.op #centro,body.op #opLibro,body.op #opAbajo{border-radius:8px;margin:0 4px}
  body.op #opMovTabs{background:var(--op-tarjeta);border:0;border-radius:8px;margin:0 4px}
  body.op #opBarra{background:var(--op-tarjeta);border-top:0}
  body.op #opPie{display:none}
  body.op.op-sinlibro #centro{margin:0 4px}
  body.op #opForm{background:var(--op-pagina);gap:4px}
  body.op #opForm .op-f,body.op #opForm .op-saldo{border-radius:0}
  .op-cab{gap:8px;padding:env(safe-area-inset-top) 8px 0 4px}
  .op-tf{border-left:0;padding-left:0}
  .op-in2{height:62px}
  .op-in2 input{font-size:18px}
  .op-f-ac button{height:38px}
  .op-solopar span{display:none}
  .op-t th,.op-t td{padding-left:8px;padding-right:8px}
}
.op-in2>span small{position:static;font-size:11px}
.op-in2 input{grid-row:2;grid-column:1}
.op-in2>button{grid-row:2}
.op-in2>button:nth-of-type(1){grid-column:2}.op-in2>button:nth-of-type(2){grid-column:3}
@media (max-width:900px){
  .op-par small{display:none}
  .op-par b{max-width:118px}
  .op-libro .op-sub{display:none}
  .op-lb-herr{padding-top:10px}
  .op-f.en-hoja .op-f-ac{padding:2px}
  .op-f.en-hoja .op-f-ac button{height:32px;font-size:12.5px}
  .op-f.en-hoja .op-f-ac button.on,.op-f.en-hoja.cerrando .op-f-ac button.on{background:var(--op-campo2);color:var(--op-txt)}
  .op-f-lados{border-radius:8px;background:var(--op-campo)}
  .op-f-lados button[data-lado2=LONG].on{background:var(--op-l)}.op-f-lados button[data-lado2=SHORT].on{background:var(--op-s)}
}
@media (max-width:900px){.op-agr{padding:8px 4px}}
@media (max-width:900px){
  .op-px b{font-size:16px}.op-px small{font-size:10.5px}
  .op-par .av{width:24px;height:24px}
  .op-par{gap:6px}
  .op-cab .op-par span{min-width:0;overflow:hidden}
}
@media (max-width:900px){.op-cab .op-sello.prac{display:none}}
@media (min-width:901px){
  body.op .op-riesgo:not([hidden]){top:76px;left:calc((100vw - 640px) / 2 + 4px);max-width:min(640px,calc(100vw - 690px))}
  body.op.op-sinlibro .op-riesgo:not([hidden]),body.op.op-enfoque .op-riesgo:not([hidden]){left:calc((100vw - 340px) / 2 + 4px);max-width:min(640px,calc(100vw - 390px))}
}

/* tocar una posición la enseña en el gráfico (ver_posicion.js) */
.op-pcard, tr[data-clave] { cursor: pointer; }