/* Original illustration styles, MIT licensed. */
.es-explorer { --es-accent: #315e70; --es-fill: #315e7018; --es-warn: #964021; margin-top: 2rem; border: 1px solid var(--line); border-radius: 6px; padding: clamp(1rem,3vw,1.6rem); scroll-margin-top: 1.5rem; }
.es-explorer[hidden] { display: none; }
.es-explorer h3 { margin: 0 0 .55rem; font: 400 1.55rem/1.25 Georgia,serif; letter-spacing: -.02em; }
.es-explorer p { margin: .65rem 0; }
.es-explorer .es-help, .es-explorer .es-caption { font-size: .875rem; color: var(--muted); }
.es-toolbar { display:flex; gap:.65rem 1rem; align-items:center; flex-wrap:wrap; margin:1.3rem 0 .8rem; }
.es-toolbar fieldset { border:0; padding:0; margin:0; min-width:0; }
.es-toolbar legend { font-size:.8rem; margin-bottom:.3rem; color:var(--muted); }
.es-choices { display:flex; gap:.8rem; flex-wrap:wrap; }
.es-choices label { display:flex; align-items:center; gap:.35rem; min-height:44px; cursor:pointer; font-size:.925rem; }
.es-explorer input { accent-color:var(--es-accent); }
.es-explorer button, .es-explorer select { font:inherit; font-size:.875rem; min-height:44px; border:1px solid var(--line); border-radius:3px; padding:.5rem .75rem; color:var(--ink); background:var(--paper); }
.es-explorer button { cursor:pointer; }
.es-explorer button:hover:not(:disabled) { border-color:var(--es-accent); }
.es-explorer button:disabled { opacity:.45; cursor:default; }
.es-explorer .es-primary { background:var(--es-accent); color:#fff; border-color:var(--es-accent); }
.es-plot { display:block; width:100%; height:auto; aspect-ratio:10/7; background:var(--paper); border:1px solid var(--line); border-radius:4px; touch-action:pan-y; }
.es-polygon { fill:var(--es-fill); stroke:var(--es-accent); stroke-width:2.5; stroke-linejoin:round; pointer-events:none; }
.es-polygon.is-invalid { fill:none; stroke:var(--es-warn); stroke-dasharray:7 6; }
.es-point { cursor:grab; touch-action:none; outline:none; }
.es-point:active { cursor:grabbing; }
.es-hit { fill:transparent; }
.es-dot { fill:var(--muted); stroke:var(--paper); stroke-width:2; pointer-events:none; }
.es-point text { fill:var(--muted); font:18px/1 sans-serif; pointer-events:none; }
.es-point.is-selected .es-dot { fill:var(--es-accent); }
.es-point.is-selected text { fill:var(--es-accent); font-weight:600; }
.es-ring { fill:none; stroke:var(--es-accent); stroke-width:2; opacity:0; pointer-events:none; }
.es-point.is-active .es-ring, .es-point:focus-visible .es-ring { opacity:1; }
.es-point:focus-visible .es-ring { stroke-width:3; stroke-dasharray:3 3; }
.es-point.is-interior .es-dot { fill:var(--es-warn); }
.es-point.is-interior text { fill:var(--es-warn); }
.es-legend { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.3rem 1rem; margin:.6rem 0; font-size:.75rem; color:var(--muted); }
.es-result { margin:1rem 0; min-height:7rem; }
.es-result strong { font-size:1rem; font-weight:600; }
.es-result p { font-size:.925rem; }
.es-warning { color:var(--es-warn); font-size:.875rem; }
.es-warning[hidden] { display:none; }
.es-actions { display:flex; flex-wrap:wrap; gap:.5rem; }
.es-nudge { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; border-top:1px solid var(--line); padding-top:1rem; margin-top:1rem; }
.es-nudge label { font-size:.875rem; }
.es-arrows { display:flex; gap:.3rem; }
.es-arrows button { min-width:44px; padding:.5rem; }
.es-explorer :is(button,select,input):focus-visible { outline:2px solid var(--es-accent); outline-offset:3px; }
[data-theme="dark"] .es-explorer { --es-accent:#98c3d5; --es-fill:#98c3d51c; --es-warn:#efb28d; }
[data-theme="dark"] .es-explorer .es-primary { color:#16252b; }
@media (max-width:440px) { .es-explorer { margin-left:-.3rem; margin-right:-.3rem; padding:.8rem; } .es-toolbar { align-items:flex-start; } .es-result { min-height:10rem; } }