/* HUBMAT Visual — 7º ano · Números e Álgebra */
.g7-controls{display:flex;gap:7px;flex-wrap:wrap;justify-content:center}.g7-controls .btn{flex:1 1 92px}
.g7-readout{text-align:center;font-size:clamp(21px,4vw,34px);font-weight:850;margin:10px 0}
.g7-line{max-width:650px;margin:auto}.g7-track{height:10px;background:#d5dfd8;border-radius:99px;position:relative;margin:55px 20px 22px}.g7-dot{position:absolute;width:22px;height:22px;border-radius:50%;background:#235f9b;top:50%;transform:translate(-50%,-50%)}.g7-labels{display:flex;justify-content:space-between;font-weight:750}
.g7-set{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.g7-set span{padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:#fff}.g7-set .p-hit{background:#e7f0f8;border-color:#235f9b}.g7-set .q-hit{box-shadow:inset 0 -4px 0 #146348}.g7-set .hit{background:var(--gold);border-color:#936b18;box-shadow:inset 0 -4px 0 #146348}
.g7-money{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:9px;max-width:620px;margin:auto}.g7-money>div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;text-align:center}.g7-money strong{display:block;font-size:28px}
.g7-calc{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:8px;align-items:center;max-width:700px;margin:auto}.g7-box{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px;text-align:center;font-size:26px;font-weight:800}.g7-op{font-size:28px;font-weight:900}
.g7-fracbar{display:grid;gap:8px;max-width:520px;margin:12px auto}.g7-frac-unit{display:grid;grid-template-columns:repeat(var(--d,4),1fr);height:44px;border:2px solid #567567}.g7-frac-unit i{border-right:1px solid #82968a;background:#fff}.g7-frac-unit i:last-child{border-right:0}.g7-frac-unit i.on{background:var(--gold)}
.g7-ratio{display:grid;grid-template-columns:var(--p,2fr) var(--q,3fr);gap:5px;max-width:600px;margin:auto}.g7-ratio>div{padding:18px;text-align:center;border-radius:12px;font-weight:850;font-size:24px}.g7-ratio .a{background:#d9e8f5;border:2px solid #235f9b}.g7-ratio .b{background:#f8df9f;border:2px solid #9a711b}
.g7-seq{display:flex;gap:7px;flex-wrap:wrap;justify-content:center}.g7-seq span{min-width:48px;padding:10px;border:1px solid var(--line);border-radius:9px;background:#fff;text-align:center;font-weight:800}.g7-table{width:100%;border-collapse:collapse;background:#fff;max-width:600px;margin:auto}.g7-table th,.g7-table td{padding:8px;border:1px solid var(--line);text-align:center}
.g7-flow{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.g7-flow span{padding:8px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;font-weight:700}.g7-flow span.current{background:var(--gold);border-color:#936b18}
@media(max-width:560px){.g7-money{grid-template-columns:1fr}.g7-calc{grid-template-columns:1fr auto 1fr}.g7-calc .result{grid-column:1/-1}.g7-controls .btn{flex-basis:42%}}
.g7-unknown{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;max-width:680px;margin:12px auto}
.g7-unknown>div{background:#fff;border:2px solid var(--line);border-radius:14px;padding:18px;text-align:center}.g7-unknown strong{display:block;font-size:clamp(28px,6vw,48px)}
.g7-balance-sign{font-size:38px;font-weight:900;color:#146348}.g7-role-note{text-align:center;max-width:680px;margin:10px auto;color:#426251;font-weight:700}
@media(max-width:520px){.g7-unknown{grid-template-columns:1fr}.g7-balance-sign{transform:none}}

.g7-proportion-plot{max-width:720px;margin:10px auto;background:#fff;border:1px solid var(--line);border-radius:13px;padding:8px}.g7-proportion-plot svg{width:100%;height:auto;display:block}.g7-axis{stroke:#607584;stroke-width:2}.g7-proportion-curve{fill:none;stroke:#235f9b;stroke-width:4}.g7-proportion-guide{stroke:#9fb1a4;stroke-width:1.5;stroke-dasharray:5 5}.g7-current-point{fill:#f2c257;stroke:#8f6818;stroke-width:3}.g7-current-point.good{fill:#dcebd6;stroke:#146348}.g7-target-point{fill:#fff;stroke:#a4481a;stroke-width:3}.g7-svg-label{font-size:14px;fill:#50665b;font-weight:800}.g7-prop-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:620px;margin:8px auto}.g7-prop-meta>div{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px;text-align:center}.g7-prop-meta strong{display:block;font-size:18px}
@media(max-width:560px){.g7-prop-meta{grid-template-columns:1fr}}