body{margin:0}main{padding:16px}.scanner-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel{padding:16px;border:1px solid var(--line);border-radius:var(--radius-lg)}button,select,input{font:inherit}button,select,.btn{min-height:44px}button{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);padding:8px 12px;cursor:pointer}.primary{background:var(--ink);color:var(--paper)}button:disabled{opacity:.45;cursor:default}.row{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}label{display:flex;gap:8px;align-items:center;flex-wrap:wrap}canvas{display:block;max-width:100%;height:auto;background:var(--surface);border:1px solid var(--line)}#source{touch-action:none;cursor:crosshair}.corners{display:grid;grid-template-columns:1fr 1fr;gap:8px}.corners label{display:grid;grid-template-columns:24px 1fr 1fr}.corners input{width:100%;min-width:0;padding:8px;box-sizing:border-box;background:var(--paper);color:var(--ink);border:1px solid var(--line)}fieldset{margin:12px 0;border:1px solid var(--line)}.curve{display:grid;gap:12px}.curve input{width:100%}output{display:block;overflow-wrap:anywhere}p{line-height:1.55;color:var(--ink-2)}h2{font-size:1.15rem}#status{min-height:2em}@media(max-width:750px){.scanner-grid{grid-template-columns:1fr}.mw-header{flex-wrap:wrap}main{padding:10px}.panel{padding:12px}.corners{grid-template-columns:1fr}canvas{max-height:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
#curveKnots fieldset{display:flex;flex-wrap:wrap;gap:8px}#curveKnots label{display:grid;gap:4px;min-width:78px;flex:1}#curveKnots input{width:100%;min-width:0}details>summary{cursor:pointer;padding:12px 0}
.guides{margin:16px 0;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.guides h3{margin:0 0 4px;font-size:1rem}.hint{font-size:.92em}
.g-kinds{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:6px 12px;margin:8px 0}.g-kinds label{gap:6px;flex-wrap:nowrap}.g-kinds b{margin-left:auto;font-variant-numeric:tabular-nums}
.sw{display:inline-block;width:22px;height:0;border-top:3px solid;flex:none}.sw-h{border-color:#0a8f6a}.sw-v{border-color:#7a3fd0}.sw-text{border-top-style:dashed;border-color:#d77a00}.sw-manual{border-color:#c0306a}
.g-use{display:grid;gap:6px}#gDraw[aria-pressed=true]{background:var(--ink);color:var(--paper)}#source.drawing{cursor:copy}
.color{display:grid;gap:10px}.color-top{display:grid;grid-template-columns:1fr 1fr;gap:8px}.color-top label{display:grid;gap:4px}.color-top select{width:100%}
.sliders{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px}.sliders label{display:grid;grid-template-columns:1fr auto;gap:2px 8px}.sliders input{grid-column:1/-1;width:100%;margin:0}.sliders output{font-variant-numeric:tabular-nums;min-width:3ch;text-align:right;grid-row:1;grid-column:2}
.confirm{margin:12px 0;padding:12px;border:2px solid var(--ink);border-radius:var(--radius-lg);background:var(--surface)}.confirm p{margin:0 0 6px;color:var(--ink)}
@media(max-width:750px){.sliders,.color-top{grid-template-columns:1fr}}
.g-use label,.g-kinds label{flex-wrap:nowrap;align-items:flex-start}.g-use input,.g-kinds input{margin-top:.25em;flex:none}.g-kinds .sw{margin-top:.6em}
@media(max-width:750px){.g-kinds{grid-template-columns:1fr}}