/* Geometria 3.6 — coniche generali */
.layout.cg-layout{display:grid;grid-template-columns:minmax(0,345px) minmax(0,1fr);align-items:start;gap:18px}
.cg-sidebar,.cg-content{min-width:0;display:grid;gap:18px;align-content:start}
.cg-sidebar>.panel{padding:18px 16px}
.cg-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 10px}
.cg-field{display:grid;gap:6px;font-size:.84rem;font-weight:750;color:#315575;margin-bottom:12px;min-width:0}
.cg-field input{width:100%;min-width:0;border:1px solid #bccfe2;border-radius:8px;background:#fff;color:#183f68;font-size:.96rem;padding:9px 10px;box-sizing:border-box}
.cg-formula-intro{text-align:center;padding:11px 5px;border-radius:8px;background:#f0f5fc;font-size:.89rem;font-weight:700;color:#2a5884;margin:5px 0 14px;overflow-wrap:anywhere}
.cg-hint{font-size:.83rem;line-height:1.6;color:#4f6984;background:#f1f6fc;border-radius:8px;padding:10px;margin:2px 0 14px}
.cg-examples{align-items:flex-start;gap:3px 9px}
.cg-examples button[aria-current="true"]{font-weight:850;color:#153e6e;text-decoration:none}
.cg-small{margin:6px 0 13px;font-size:.84rem;color:#4f6984;line-height:1.55}
.cg-progress{display:grid;gap:8px;font-size:.83rem;font-weight:740;color:#345878}
.cg-progress output{color:#108472;font-weight:800;font-variant-numeric:tabular-nums}
.cg-progress input{width:100%;accent-color:#128d77}
.cg-animation{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0}
.cg-animation button{padding:8px 11px;font-size:.84rem}
.cg-graph-controls{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:5px 0 8px}
.cg-graph-controls .g3-view-presets,.cg-graph-controls .g3-zoom{display:flex;gap:6px}
.cg-graph-controls button{background:#eef5fd;color:#214d77;border:1px solid #cbddeb;border-radius:8px;padding:8px 11px;font-weight:700;cursor:pointer}
.cg-checks{gap:8px 14px;margin:8px 0 10px}
.cg-description{min-height:48px}.cg-description b,.cg-description span{display:block}
.cg-canvas-wrap{overflow:hidden;position:relative;background:white;border:1px solid #dce6f0;border-radius:13px}
#cg-canvas{width:100%;aspect-ratio:960/640;display:block;touch-action:none;cursor:grab;outline-offset:-3px}
#cg-canvas:active{cursor:grabbing}
.cg-graph{scroll-margin-top:64px}
.cg-prose{font-size:.89rem;line-height:1.7;color:#415e7b}.cg-prose p{margin:7px 0 11px}.cg-prose b{color:#17466d}
.cg-results .g3-result-table{width:100%}
.cg-steps .g3-math{overflow-x:auto;overflow-y:hidden}
.cg-steps .g3-step{margin:0 0 14px}
.cg-steps .g3-step h3{font-size:.95rem;color:#173f6a;margin:12px 0 8px}
.cg-steps .g3-step p{font-size:.85rem;line-height:1.6;color:#5a7187;margin:5px 0 8px}
.cg-steps .g3-math{background:#f1f6fc;padding:9px 10px;margin:5px 0;border-radius:7px;font-size:.88rem;min-width:0;white-space:normal}
@media(max-width:920px){.layout.cg-layout{grid-template-columns:minmax(0,1fr)}.cg-sidebar>.panel{padding:18px 22px}.cg-fields{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:550px){.cg-sidebar>.panel{padding:16px}.cg-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.cg-checks{gap:8px}}
@media(max-width:330px){.cg-fields{grid-template-columns:1fr}}

/* Costruzione fuoco-direttrice e confronto dei sistemi di riferimento */
.cg-point-panel{margin:12px 0 9px;padding:12px 14px;background:#f2f7fd;border:1px solid #d7e6f3;border-radius:9px;display:grid;gap:8px}
.cg-point-top{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:6px 12px;color:#244c71;font-size:.87rem}
.cg-point-top output{color:#137969;font-weight:750;font-variant-numeric:tabular-nums}
.cg-muted{color:#657f95;font-weight:400}
.cg-point-panel input[type=range]{width:100%;accent-color:#147e71;margin:0}
.cg-focus-chooser{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:.82rem;color:#375879}
.cg-focus-chooser select{border:1px solid #bfd2e1;border-radius:6px;padding:5px 9px;color:#275276;background:#fff}
.cg-point-measure{font-size:.85rem;line-height:1.6;margin:0;color:#315572}
.cg-comparison{margin:12px 0 4px;padding:14px;background:#f5f8fc;border:1px solid #d8e4ef;border-radius:9px;min-width:0}
.cg-comparison-heading{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px}
.cg-comparison-heading h3{font-size:.98rem;margin:0;color:#18456e}
.cg-comparison-heading span{font-size:.8rem;font-weight:750;color:#16816d}
.cg-comparison-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.cg-comparison-columns>div{min-width:0}
.cg-comparison-columns strong{display:block;color:#375873;font-size:.78rem;margin-bottom:6px}
.cg-equation{font-size:.91rem;font-weight:650;line-height:1.6;padding:10px;background:white;border:1px solid #e1e9f2;border-radius:6px;color:#214c78;overflow-wrap:anywhere;word-break:normal;min-height:53px}
.cg-canonical{font-size:.85rem;color:#365e7a;margin:10px 0 4px;line-height:1.7}
.cg-comparison .cg-small{margin:6px 0 0}
@media(max-width:650px){.cg-comparison-columns{grid-template-columns:1fr}.cg-point-panel{padding:10px}}

.cg-point-panel[hidden]{display:none!important}

/* v3.6: pannelli didattici di rette componenti e ramo iperbolico. */
.cg-degenerate{border-left:4px solid #ad76bd;background:#f8f5fc;color:#394c6f;border-radius:8px;padding:12px 14px;margin:10px 0;font-size:.86rem;line-height:1.65}
.cg-degenerate[hidden],.cg-branch-row[hidden]{display:none!important}
.cg-degenerate strong{color:#623e88}.cg-degenerate p{margin:5px 0}
.cg-branch-row{border-top:1px solid #d8e5f1;padding-top:8px}

/* Align the graph below the fixed navigation after examples or Play. */
.cg-graph{scroll-margin-top:64px}
