:root{--bg:#f6f1e6;--panel:#fcfaf4;--text:#355d73;--accent:#69a94e;--muted:#7c9aa6;--highlight:#d9a441;--ok:#5e9e46;--err:#e06c5e;--border:#dad4c2;--input-bg:#fff;--cell-bg:#fff;--btn-bg:#edf2e4;--btn-border:#c6d6bd;--edge-on:#355d73;--edge-off:#e06c5e;--grid-line:#355d73;--hover-bg:#eaf3e2}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:Segoe UI,system-ui,sans-serif}header{background:var(--panel);border-bottom:1px solid var(--border);padding:10px 16px}header h1{margin:0 0 8px;font-size:18px}header h1 small{color:var(--muted);font-weight:400}.toolbar{align-items:center;gap:8px;display:flex}.toolbar button{background:var(--btn-bg);color:var(--text);border:1px solid var(--btn-border);cursor:pointer;border-radius:4px;padding:5px 12px;font-size:13px}.toolbar button:hover{border-color:var(--accent)}.toolbar button.primary{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}#status{color:var(--muted);margin-left:8px;font-size:13px}main{grid-template-columns:1fr 1fr;gap:12px;height:calc(100vh - 70px);padding:12px;display:grid}.editors{grid-template-rows:1fr 1fr;gap:12px;display:grid}.pane{background:var(--panel);border-radius:8px;flex-direction:column;min-height:0;padding:10px;display:flex}.pane h3{color:var(--accent);margin:0 0 6px;font-size:13px}textarea{background:var(--input-bg);color:var(--text);border:1px solid var(--border);resize:none;border-radius:6px;flex:1;min-height:0;padding:8px;font-family:Consolas,monospace;font-size:12px}.CodeMirror{border:1px solid var(--border);border-radius:6px;flex:1;font-family:Consolas,monospace;font-size:14px;height:100%!important}.CodeMirror-scroll{max-height:100%;overflow:auto}.result{background:var(--panel);border-radius:8px;padding:12px;overflow:auto}.result h3{color:var(--accent);margin:0 0 8px;font-size:13px}#canvas{background:var(--input-bg);border-radius:6px;max-width:100%;display:block}#table{color:var(--muted);white-space:pre-wrap;font-size:12px}.grid-bar{color:var(--muted);align-items:center;gap:8px;margin-bottom:8px;font-size:12px;display:flex}.grid-bar button{background:var(--btn-bg);border:1px solid var(--btn-border);color:var(--text);cursor:pointer;border-radius:4px;padding:3px 10px;font-size:12px}.grid-bar input{background:var(--input-bg);color:var(--text);border:1px solid var(--border);border-radius:4px;padding:2px 4px}.clue-bar{flex-direction:column;gap:4px;margin-bottom:6px;padding:4px 0;display:flex}.clue-row{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.clue-lbl{color:var(--muted);width:18px;font-size:11px}.clue-inp{text-align:center;background:var(--input-bg);width:38px;color:var(--text);border:1px solid var(--border);border-radius:4px;padding:2px;font-size:13px}.clue-inp:focus{border-color:var(--accent)}.overlay{z-index:50;background:#355d738c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.overlay[hidden]{display:none}.overlay-card{background:var(--panel);border-radius:10px;width:min(720px,92vw);max-height:86vh;padding:20px 24px;position:relative;overflow:auto}.overlay-close{color:var(--muted);cursor:pointer;background:0 0;border:none;font-size:22px;position:absolute;top:8px;right:12px}.overlay-close:hover{color:var(--text)}.help-content{color:var(--text);font-size:13px;line-height:1.6}.help-content h2{color:var(--accent);margin:14px 0 6px;font-size:16px}.help-content h3{color:var(--accent);margin:10px 0 4px;font-size:13px}.help-content code{background:var(--hover-bg);color:var(--text);border-radius:3px;padding:1px 5px}.help-content pre{background:var(--input-bg);border-radius:6px;padding:8px;font-size:12px;overflow:auto}.help-content table{border-collapse:collapse;width:100%;margin:6px 0}.help-content th,.help-content td{border:1px solid var(--border);text-align:left;padding:4px 8px;font-size:12px}.help-content th{color:var(--accent)}#edTable td.clue-td{text-align:center;vertical-align:middle;border:none;width:36px;height:36px;padding:0}#edTable td.clue-td .clue-inp{border-radius:5px;width:34px;height:34px;font-size:15px}#edTable td.clue-spacer{background:0 0;border:none;width:36px;height:36px}.grid-editor{flex:1;justify-content:center;align-items:flex-start;padding:8px;display:flex;overflow:auto}.json-inline{flex:none;height:80px;min-height:60px;margin-top:4px;font-size:11px}.grid-area{flex:1;gap:12px;min-height:0;display:flex}.cage-panel{background:var(--btn-bg);border:1px solid var(--border);border-radius:6px;flex-shrink:0;width:200px;max-height:100%;padding:8px;overflow-y:auto}.cage-panel h4{color:var(--accent);margin:0 0 8px;font-size:12px}.cage-panel button{background:var(--panel);border:1px solid var(--btn-border);color:var(--text);cursor:pointer;border-radius:4px;width:100%;margin-bottom:6px;padding:4px 10px;font-size:12px}.cage-panel button:hover{border-color:var(--accent)}.cage-item{background:var(--cell-bg);border:1px solid var(--border);border-radius:6px;margin-bottom:6px;padding:8px;font-size:12px}.cage-item.selected{border-color:var(--accent)}.cage-item .cage-color{vertical-align:middle;border-radius:3px;width:12px;height:12px;margin-right:6px;display:inline-block}.cage-item .cage-info{color:var(--muted);margin:4px 0}.cage-item label{color:var(--muted);font-size:11px}.cage-item input{background:var(--input-bg);width:60px;color:var(--text);border:1px solid var(--border);border-radius:3px;margin-left:4px;padding:2px 4px;font-size:12px}.cage-item .cage-actions{gap:4px;margin-top:6px;display:flex}.cage-item .cage-actions button{width:auto;margin:0;padding:2px 8px;font-size:11px}.cage-item .cage-fields{margin:4px 0}.cage-item .cage-field{align-items:center;gap:4px;margin:2px 0;font-size:11px;display:flex}.cage-item .cage-field label{color:var(--muted);min-width:24px}.cage-item .cage-field input{background:var(--input-bg);width:52px;color:var(--text);border:1px solid var(--border);border-radius:3px;padding:2px 4px;font-size:11px}.cage-item .cage-field button{border:1px solid var(--btn-border);width:auto;color:var(--muted);background:0 0;margin:0;padding:1px 5px;font-size:10px}.cage-item .cage-field button:hover{border-color:var(--err);color:var(--err)}.field-templates{margin-bottom:8px;font-size:11px}.field-templates summary{color:var(--muted);cursor:pointer}.field-templates summary:hover{color:var(--text)}.field-templates .field-add{gap:4px;margin-top:4px;display:flex}.field-templates input{background:var(--input-bg);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:2px 4px;font-size:11px}.field-templates button{background:var(--btn-bg);border:1px solid var(--btn-border);color:var(--text);cursor:pointer;border-radius:3px;width:auto;margin:0;padding:2px 8px;font-size:11px}.field-tpl-item{color:var(--muted);align-items:center;gap:6px;padding:2px 0;display:flex}.field-tpl-item .tpl-key{color:var(--accent);font-family:monospace}.field-tpl-item button{border:1px solid var(--btn-border);color:var(--muted);cursor:pointer;background:0 0;border-radius:3px;width:auto;margin:0;padding:1px 5px;font-size:10px}.field-tpl-item button:hover{border-color:var(--err);color:var(--err)}#edTable td.cage-cell{padding:0}#edTable td.cage-cell input{border:none;border-radius:0}#edTable td.cage-edge-t input{box-shadow:inset 0 3px 0 0 var(--cage-color)}#edTable td.cage-edge-r input{box-shadow:inset -3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-b input{box-shadow:inset 0 -3px 0 0 var(--cage-color)}#edTable td.cage-edge-l input{box-shadow:inset 3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-t.cage-edge-r input{box-shadow:inset 0 3px 0 0 var(--cage-color), inset -3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-t.cage-edge-l input{box-shadow:inset 0 3px 0 0 var(--cage-color), inset 3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-b.cage-edge-r input{box-shadow:inset 0 -3px 0 0 var(--cage-color), inset -3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-b.cage-edge-l input{box-shadow:inset 0 -3px 0 0 var(--cage-color), inset 3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-t.cage-edge-b input{box-shadow:inset 0 3px 0 0 var(--cage-color), inset 0 -3px 0 0 var(--cage-color)}#edTable td.cage-edge-l.cage-edge-r input{box-shadow:inset 3px 0 0 0 var(--cage-color), inset -3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-t.cage-edge-r.cage-edge-b input{box-shadow:inset 0 3px 0 0 var(--cage-color), inset -3px 0 0 0 var(--cage-color), inset 0 -3px 0 0 var(--cage-color)}#edTable td.cage-edge-t.cage-edge-r.cage-edge-l input{box-shadow:inset 0 3px 0 0 var(--cage-color), inset -3px 0 0 0 var(--cage-color), inset 3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-t.cage-edge-b.cage-edge-l input{box-shadow:inset 0 3px 0 0 var(--cage-color), inset 0 -3px 0 0 var(--cage-color), inset 3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-r.cage-edge-b.cage-edge-l input{box-shadow:inset -3px 0 0 0 var(--cage-color), inset 0 -3px 0 0 var(--cage-color), inset 3px 0 0 0 var(--cage-color)}#edTable td.cage-edge-t.cage-edge-r.cage-edge-b.cage-edge-l input{box-shadow:inset 0 3px 0 0 var(--cage-color), inset -3px 0 0 0 var(--cage-color), inset 0 -3px 0 0 var(--cage-color), inset 3px 0 0 0 var(--cage-color)}#edTable td.cage-cell,#edTable td.cage-cell input{background:color-mix(in srgb, var(--cage-color) 18%, #fff)}#edTable td.cage-cell:hover input{border-color:var(--cage-color)}#edTable td.cage-active input{border-width:3px;border-color:var(--cage-color)!important}#edTable td.cage-active input:hover{background:color-mix(in srgb, var(--cage-color) 30%, #fff)}#edTable td.drawing input{cursor:crosshair}#edTable td.drawing input:hover{border-color:var(--accent);background:var(--hover-bg)}#edTable td.drawing.cell-blocked input{cursor:not-allowed}.vtx-cell{width:8px;height:8px;padding:0}.vtx-dot{background:#b8c4b0;border-radius:50%;width:4px;height:4px;margin:2px auto}.edge-cell{cursor:pointer;padding:0}.edge-h{height:8px}.edge-v{width:8px}.edge-indicator{border-radius:1px;margin:0 auto;transition:background .1s}.edge-h .edge-indicator{width:48px;height:6px}.edge-v .edge-indicator{width:6px;height:48px}.edge-unknown{background:var(--btn-border)}.edge-unknown:hover{background:#b8c4b0}.edge-on{background:var(--edge-on)}.edge-on:hover{background:#4a7d96}.edge-off{background:var(--btn-border)}.edge-off:after{content:"×";height:100%;color:var(--edge-off);justify-content:center;align-items:center;font-size:6px;font-weight:700;display:flex}.edge-off:hover{background:#b8c4b0}.edge-cell.edge-dragover .edge-indicator{outline:2px solid var(--accent);outline-offset:0px}#edTable{border-collapse:separate;border-spacing:0;-webkit-user-select:none;user-select:none}#edTable td{width:52px;height:52px;padding:0}#edTable td input{text-align:center;background:var(--cell-bg);width:100%;height:100%;color:var(--text);border:1px solid var(--border);border-radius:0;outline:none;font-family:inherit;font-size:20px;transition:border-color .12s,background .12s}#edTable td input:hover{border-color:var(--btn-border)}#edTable td input:focus{border-color:var(--accent);background:var(--hover-bg)}.mode-group{border:1px solid var(--btn-border);border-radius:4px;gap:2px;margin-left:12px;display:flex;overflow:hidden}.mode-btn{background:var(--btn-bg);color:var(--muted);cursor:pointer;border:none;border-right:1px solid var(--btn-border);border-radius:0;padding:3px 10px;font-size:12px}.mode-btn:last-child{border-right:none}.mode-btn:hover{color:var(--text)}.mode-btn.active{background:var(--accent);color:#fff;font-weight:600}#edTable{border-collapse:collapse}#edTable td input{border:none;outline:none}#edTable td{border:1px solid var(--grid-line)}#edTable td.eb-t-edge-on{border-top:3px solid var(--edge-on)}#edTable td.eb-r-edge-on{border-right:3px solid var(--edge-on)}#edTable td.eb-b-edge-on{border-bottom:3px solid var(--edge-on)}#edTable td.eb-l-edge-on{border-left:3px solid var(--edge-on)}#edTable td.eb-t-edge-off{border-top:2px dashed var(--edge-off)}#edTable td.eb-r-edge-off{border-right:2px dashed var(--edge-off)}#edTable td.eb-b-edge-off{border-bottom:2px dashed var(--edge-off)}#edTable td.eb-l-edge-off{border-left:2px dashed var(--edge-off)}#edTable.edge-mode td input{pointer-events:none}#edTable.edge-mode td{cursor:crosshair}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}#canvas{border:1px solid var(--border)}.err{color:var(--err)}.ok{color:var(--ok)}