/* Outil · Focale et netteté (Focal length & focus), id optique : seulement ce qui lui est propre (le reste vient de app/kit.css).
   Préfixe des classes : op-
   À gauche : le schéma vu de côté (zone fixe), le résultat en grand (le cadre, ou la focale), l'info, Copier et le lien Crop factor.
   À droite : capteur, partir de la focale ou du cadre, focale (calculée en pêche depuis le cadre), ouverture, distance, plan
   (grisé hors du cadre), 5 lignes fixes. */
.op .outil-fixe { align-items: stretch; }
.op-svg { width: 100%; height: auto; aspect-ratio: 600 / 240; display: block; border-radius: 14px; box-shadow: inset 0 0 0 1px var(--filet-doux); background: rgba(242, 240, 235, .02); }
.op-sol { stroke: var(--filet); stroke-width: 1; }
.op-net { fill: rgba(74, 143, 192, .14); }
.op-bord { stroke: rgba(255, 163, 112, .5); stroke-width: 1; }
.op-sujet { fill: #f2f0eb; }
.op-map { stroke: rgba(242, 240, 235, .35); stroke-dasharray: 2 4; }
.op-hyper { stroke: #4a8fc0; stroke-width: 1.2; stroke-dasharray: 4 3; }
.op-cam { fill: #2a2622; stroke: rgba(242, 240, 235, .5); stroke-width: 1; }
.op-cote { fill: none; stroke: #4a8fc0; stroke-width: 1.4; }
.op-t { fill: var(--texte2); font: 500 10px var(--mono); }
.op-t2 { fill: var(--papier); }
.op-grand { display: flex; flex-direction: column; gap: 6px; }
.op-grand b { height: 38px; font: 700 32px/1.1 var(--display); letter-spacing: -.02em; color: var(--peche); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.op-info { flex: none; height: 2lh; margin: 0; overflow: hidden; }
.op-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.op-actions .pastille { cursor: pointer; }
.op-actions .pastille:hover { translate: none; }
.op-actions .pastille:disabled { opacity: .3; cursor: default; }
.op-deux { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.op-eteint { opacity: .3; pointer-events: none; transition: opacity .4s var(--courbe); }
.op-rangee { cursor: default; height: 52px; }
.op-rangee .val { white-space: normal; text-align: right; font-variant-numeric: tabular-nums; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
@media (max-width: 959px) { .op .outil-defile > div:nth-child(-n+2) { order: -1; } }