:root{--text:#333;--text-muted:#666;--border:#ccc;--bg-subtle:#f5f5f5;--accent:#4a90a4;--space-sm:8px;--space-md:16px}body{color:var(--text);margin:72px;font-family:system-ui,sans-serif;line-height:1.5}h1,h2,h3{margin:var(--space-md) 0 var(--space-sm);font-weight:600}p{max-width:65ch;margin:var(--space-sm) 0}label{margin-right:var(--space-sm)}button{cursor:pointer}.app-header{align-items:center;gap:var(--space-md);margin-bottom:var(--space-sm);display:flex}.app-header h1{margin:0;font-size:1.5rem}canvas{border:1px solid var(--border)}ul{padding-left:var(--space-md);margin:0}a{color:var(--accent)}.form{margin:var(--space-md) 0}.form fieldset{padding:var(--space-sm) var(--space-md);border:1px solid var(--border);border-radius:4px}.radio-group{gap:var(--space-md);margin-bottom:var(--space-sm);display:flex}.radio-group label{cursor:pointer;align-items:center;gap:4px;display:flex}.file-inputs,.url-inputs{gap:var(--space-md);display:flex}.url-fields{flex-direction:column;gap:0;display:flex}.url-row{align-items:center;gap:var(--space-sm);display:flex}.url-row label{flex-shrink:0;width:30px;margin:0}.url-row input{width:500px;margin:0}.example-buttons{flex-direction:column;align-items:flex-start;gap:4px;display:flex}.example-buttons span{color:var(--text-muted);font-size:.9em}.example-buttons button{text-align:left;width:100%}.rubberband{background:var(--border);cursor:crosshair}.rubberband:hover{background:#aaa}.controls{gap:var(--space-md);margin-bottom:var(--space-md);flex-wrap:wrap;align-items:center;display:flex}.visualization-panel{border:1px solid var(--border);padding:var(--space-md);margin:var(--space-md) 0;border-radius:4px}.panel-header{text-align:center;margin-bottom:var(--space-md);padding-bottom:var(--space-sm);border-bottom:1px solid var(--border)}.panel-header h3{margin:0 0 4px}.panel-subtitle{max-width:none;color:var(--text-muted);margin:0;font-size:.9em}.file-layout{border-top:1px solid var(--border);padding-top:var(--space-md);margin-top:var(--space-md)}.file-layout-header{justify-content:space-between;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-sm);flex-wrap:wrap;display:flex}.file-layout-subtitle{color:var(--text-muted);margin-bottom:var(--space-sm);font-size:.85em}.optimize-checkbox{align-items:center;gap:4px;margin:0;font-size:.9em;display:flex}.optimize-checkbox input{margin:0}.file-layout-canvas{margin:var(--space-sm) 0}.canvas-row{align-items:stretch;margin-bottom:4px;display:flex}.canvas-labels{flex-direction:column;display:flex}.canvas-label{width:50px;color:var(--text-muted);padding-right:var(--space-sm);flex-shrink:0;justify-content:flex-end;align-items:center;font-size:.75em;display:flex}dialog{width:min(800px,90vw);max-height:80vh;padding:var(--space-md) calc(var(--space-md) * 1.5);border:1px solid var(--border);border-radius:6px;overflow-y:auto;box-shadow:0 8px 32px #0000002e}dialog::backdrop{background:#0006}dialog h3{margin-top:0}dialog h4{margin:var(--space-md) 0 var(--space-sm)}dialog p{max-width:none}dialog button{margin-top:var(--space-md)}.linear-index-panel{border:1px solid var(--border);padding:var(--space-md);margin:var(--space-md) 0}.linear-index-controls{gap:var(--space-sm);margin-bottom:var(--space-sm);flex-wrap:wrap;align-items:center;display:flex}.linear-index-info{color:var(--text-muted);margin-left:auto;font-size:.9em}.graph-label{align-items:center;gap:var(--space-sm);color:var(--text-muted);margin:var(--space-sm) 0 4px;font-size:.85em;font-weight:500;display:flex}@media (width<=800px){.file-inputs,.url-inputs{flex-direction:column}.url-row input{width:100%}body{margin:var(--space-sm)}}
