/* RH-01.6c: one entry, adjacent distances and consequence. */
.entry-adjustment{width:100%;margin:22px 0 0;padding:0;--entry-fraction:0}
.entry-adjustment-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:14px;line-height:1.4}
.entry-adjustment-heading label{cursor:pointer;color:#e2dbe9}
.entry-adjustment-heading label span{color:var(--yellow);margin-left:10px;font-size:17px}
.entry-current{font:500 19px/1.3 var(--display);font-variant-numeric:tabular-nums;color:var(--yellow)}
/* Once the native alternative exists, its heading owns the lower entry readout.
   Keep the static metric for the unenhanced/no-JS example. */
.chart-shell:has(.entry-adjustment) .metrics>.entry-metric{display:none}
.entry-scale{display:grid;grid-template-columns:28px minmax(0,1fr) 28px;align-items:center;gap:14px;margin-top:0}
.entry-scale>span{color:#c2b9d1;font:13px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace}
.entry-scale>span:last-child{text-align:right}
.entry-scale input{appearance:none;-webkit-appearance:none;display:block;width:100%;height:46px;margin:0;background:transparent;cursor:ew-resize;touch-action:pan-y;outline-offset:4px;border-radius:2px}
.entry-scale input::-webkit-slider-runnable-track{height:2px;background:linear-gradient(to right,var(--yellow) 0%,var(--yellow) calc(var(--entry-fraction)*100%),#655b78 calc(var(--entry-fraction)*100%),#655b78 100%)}
.entry-scale input::-moz-range-track{height:2px;background:#655b78}
.entry-scale input::-moz-range-progress{height:2px;background:var(--yellow)}
.entry-scale input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:46px;height:46px;margin-top:-22px;border:14px solid #252235;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 1px #736850;transition:box-shadow .18s,border-color .18s}
.entry-scale input::-moz-range-thumb{box-sizing:border-box;width:46px;height:46px;border:14px solid #252235;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 1px #736850;transition:box-shadow .18s,border-color .18s}
.entry-scale input:hover::-webkit-slider-thumb{border-color:#383047;box-shadow:0 0 0 1px var(--yellow)}
.entry-scale input:hover::-moz-range-thumb{border-color:#383047;box-shadow:0 0 0 1px var(--yellow)}
.entry-scale input:active{cursor:grabbing}
.entry-scale input:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}
.entry-help{position:relative;min-height:3em;margin-top:5px;font-size:13px;line-height:1.5;color:#c2b9d1}
.entry-help p{font:inherit;color:inherit;margin:0}
#entry-keyboard-help{position:absolute;inset:0;opacity:0;pointer-events:none}
.lesson:has(:is(.entry-mark-drag,#entry-slider):focus-visible) #entry-slider-hint{opacity:0}
.lesson:has(:is(.entry-mark-drag,#entry-slider):focus-visible) #entry-keyboard-help{opacity:1}
.entry-mark-drag{cursor:ew-resize;touch-action:pan-y}
.entry-mark-drag:focus-visible{outline:none}
.entry-hit-area{pointer-events:all;touch-action:pan-y}
.entry-mark-drag:focus-visible .entry-hit-area{stroke:var(--yellow);stroke-width:3;vector-effect:non-scaling-stroke;fill:#e9d45b0a}
.entry-mark-drag:focus-visible>circle:first-child{fill:#534738;stroke:#fff0a8}
.entry-grip-arrows{pointer-events:none;opacity:.9;transition:opacity .18s}
.entry-mark-drag>circle:first-child{transition:fill .18s,stroke .18s}
.entry-mark-drag:hover>circle:first-child,.entry-mark-drag.is-dragging>circle:first-child{fill:#534738;stroke:#fff0a8}
.entry-mark-drag:hover .entry-grip-arrows,.entry-mark-drag.is-dragging .entry-grip-arrows{opacity:1}
.entry-mark-drag.is-dragging{cursor:grabbing}
.entry-controls button:active{background:#e9d45b;color:var(--ink)}
.entry-controls button:focus-visible{outline-offset:-4px}
.metrics strong,.entry-axis{font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){.entry-scale input::-webkit-slider-thumb,.entry-scale input::-moz-range-thumb,.entry-mark-drag>circle:first-child,.entry-grip-arrows{transition:none}}

/* The chart keeps its own generous field; all decisions share one reading group. */
.chart-shell{display:grid;grid-template-columns:minmax(0,1fr) 348px;align-items:center}
.chart-frame{grid-column:1;padding:16px 0;min-width:0}
.chart-frame text{font-size:19px}
.chart-frame .axis-value{font-size:20px}
.chart-frame .entry-caption{font-size:14px;letter-spacing:.07em}
.lesson-response{grid-column:2;padding:28px 26px;border-left:1px solid var(--line);min-width:0}
.lesson-response .entry-controls{width:100%;gap:6px}
.lesson-response .entry-controls button{flex:1;flex-direction:column;justify-content:center;gap:3px;padding:10px 6px;min-height:56px;font-size:13px;line-height:1.35}
.lesson-response .entry-controls button span{display:block;font-size:13px}
.lesson-response .metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:0;border-top:1px solid var(--line);gap:18px;margin:17px 0 0;padding:18px 0 0}
.lesson-response .metrics>div{display:block}
.lesson-response .metrics>.entry-metric{grid-column:1/-1}
.lesson-response .metrics>div>span{display:block;max-width:none;min-height:2.8em;font-size:13px;line-height:1.4;color:#c8bfd7;margin:0}
.lesson-response .metrics strong{font-size:34px;min-width:0;gap:6px;margin-top:7px;justify-content:flex-start}
.lesson-response .metrics small{display:block;font-size:13px;color:#c2b9d1}
#lesson-verdict{font:500 21px/1.35 var(--display);letter-spacing:-.025em;margin:22px 0 0;padding-left:14px;border-left:2px solid var(--yellow);min-height:4.05em;text-wrap:pretty}
#lesson-verdict[data-entry-state=planned]{border-color:var(--violet)}
.lesson>.example-note{max-width:760px;font-size:13px;line-height:1.6;margin:16px 0 0;color:#bcb3cc}
.lesson .example-label{font-size:13px;color:#c3bacf}
@media(min-width:1100px) and (max-width:1280px){.chart-shell{grid-template-columns:minmax(0,1fr) 320px}.lesson-response{padding:24px 20px}.chart-frame text{font-size:20px}.chart-frame .axis-value{font-size:21px}.chart-frame .entry-caption{font-size:17px}}
@media(min-width:768px) and (max-width:1099px){
 .chart-shell{grid-template-columns:minmax(0,1fr)}
 .chart-frame{padding:4px 12px 0}
 .chart-frame text{font-size:20px}.chart-frame .axis-value{font-size:21px}.chart-frame .entry-caption{font-size:20px}
 .lesson-response{grid-column:1;display:grid;grid-template-columns:1fr 1fr;gap:0 38px;padding:24px;border-left:0;border-top:1px solid var(--line)}
 .lesson-response .entry-controls{grid-column:1;grid-row:1}
 .entry-control-slot{grid-column:1;grid-row:2}
 .lesson-response .metrics{grid-column:2;grid-row:1;margin:0;padding:0;border:0;align-self:start}
 #lesson-verdict{grid-column:2;grid-row:2;margin-top:22px;font-size:21px}
}
@media(max-width:767px){
 .chart-shell{display:block}
 .chart-frame{padding:9px 7px 0}
 .chart-frame #mobile-chart text{font-size:15px}
 .chart-frame #mobile-chart .entry-axis{font-size:15px}
 .chart-frame #mobile-chart .entry-caption{font-size:15px;letter-spacing:.04em}
 .lesson-response{padding:18px 14px 22px;border-left:0;border-top:1px solid var(--line)}
 .lesson-response .entry-controls button{flex-direction:row;min-height:48px;font-size:13px;gap:9px;padding:9px 6px}
 .lesson-response .entry-controls button span{display:none}
 .entry-adjustment{margin-top:18px}
 .entry-scale{gap:11px}
 .entry-help{min-height:3em}
 .lesson-response .metrics{margin-top:14px;padding-top:16px;gap:18px}
 .lesson-response .metrics strong{font-size:34px}
 #lesson-verdict{font-size:21px;margin-top:20px;min-height:4.05em}
 .lesson>.example-note{margin-top:14px}
}
