html,body {width:100%;height:100%;overflow:hidden;}body {background:var(--bay) var(--tx-washi);padding:18px 24px;font-size:17px;display:flex;flex-direction:column;gap:10px;}
header {display:flex;justify-content:space-between;align-items:center;gap:20px;}header .eyebrow {font-size:13px;letter-spacing:.12em;}h1 {font:600 35px/1.1 var(--display-font);margin:4px 0 0;}header a {font-size:14px;}main {display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:24px;min-height:0;flex:1;}aside {overflow:auto;padding-right:5px;}p {margin:9px 0;line-height:1.25;}button,input,select,textarea {font:inherit;}button {padding:5px 10px;}label {display:block;color:var(--muted);font-size:15px;margin:10px 0 5px;}select,input[type=url] {width:100%;background:var(--bay);color:var(--ink);border:1px solid var(--line);padding:6px;}button.primary {display:block;width:100%;margin:10px 0 6px;background:var(--accent);color:var(--bay);border-color:var(--accent);padding:9px;}button.primary:disabled {opacity:.55;}.actions {display:flex;gap:6px;font-size:15px;}.actions button {flex:1;}.stats {display:flex;gap:22px;margin:0 0 8px;}.stats strong {font:600 43px/1 var(--display-font);display:block;}.stats span {font-size:14px;color:var(--muted);}.mode {font-size:14px;color:var(--accent);border-bottom:1px solid var(--line);padding-bottom:8px;margin-top:0;}#status {min-height:43px;font-size:16px;}details {margin-top:13px;font-size:14px;border-top:1px solid var(--line);padding-top:7px;}summary {cursor:pointer;}details p {font-size:13px;}textarea {width:100%;background:var(--panel);border:1px solid var(--line);color:var(--ink);font:11px/1.6 monospace;white-space:pre;}code {font-size:11px;}#connect {margin-top:5px;}.numerical {font-size:12px;color:var(--muted);line-height:1.3;margin-top:12px;}.full-link {font-size:13px;}.plot-panel {position:relative;display:flex;flex-direction:column;min-height:0;}canvas {width:100%;min-height:0;flex:1;border:1px solid var(--line);background:var(--bay);touch-action:none;cursor:grab;}canvas:active {cursor:grabbing;}.plot-tools {position:absolute;right:9px;top:9px;display:flex;gap:4px;background:var(--bay);font-size:14px;}.legend {display:flex;gap:18px;font-size:14px;position:absolute;left:12px;top:12px;background:var(--bay);padding:2px 5px;pointer-events:none;}.given {color:#276f82;}.solution {color:var(--accent);}.browse {display:flex;align-items:center;gap:8px;margin-top:9px;font-size:15px;}#solution {flex:1;min-width:50px;accent-color:var(--accent);}#which {min-width:88px;text-align:right;font-variant-numeric:tabular-nums;}#plot-note {font-size:12px;color:var(--muted);margin:5px 0 0;}footer {font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:8px;}
body.embedded {padding:0;font-size:17px;}body.embedded header,body.embedded footer,body.embedded .full-link {display:none;}body.embedded main {gap:23px;grid-template-columns:minmax(0,1fr) 270px;}body.embedded .stats strong {font-size:42px;}
@media(max-width:650px){html,body {height:auto;overflow:auto;}body {padding:12px;}header {display:block;}h1 {font-size:30px;}main {grid-template-columns:1fr;}canvas {min-height:350px;}.plot-panel {height:440px;}aside {overflow:visible;}footer {padding-bottom:15px;}.legend {font-size:11px;gap:7px;top:48px;}.stats {margin-top:12px;}body.embedded main {grid-template-columns:1fr;}}

body.embedded .stats {margin-bottom:5px;} body.embedded .stats strong {font-size:37px;}
body.embedded .mode {font-size:13px;padding-bottom:6px;}
body.embedded #status {font-size:14px;min-height:35px;margin:7px 0;}
body.embedded label {margin-top:7px;} body.embedded select {font-size:15px;}
body.embedded button.primary {padding:7px;margin-top:8px;}
body.embedded .actions {font-size:13px;} body.embedded details {margin-top:9px;}
body.embedded .numerical {font-size:11px;margin-top:9px;}

.display-controls {display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:9px;font-size:14px;}
#show-all {border-color:var(--accent);color:var(--accent);padding:6px 11px;white-space:nowrap;}
#show-all[aria-pressed=true] {background:var(--accent);color:var(--bay);}
#render-status {color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;}
body.embedded .display-controls {margin-top:7px;gap:9px;font-size:13px;}
body.embedded #show-all {padding:4px 9px;} body.embedded #render-status {font-size:12px;}
@media(max-width:650px){.plot-panel {height:515px;}canvas {min-height:300px;}.display-controls {gap:6px;font-size:14px;}#render-status {font-size:12px;}.legend {gap:7px;font-size:10px;}}
