html,body{overscroll-behavior-x:none}.game{--pane-ink: #d8d2c2;--tip-bg: #1a1830;--tip-ink: #d6ccef;--hover: #18204a;--tabs-bg: #0c1024;--note-bg: #efe6c8;--note-ink: #2a2010;--note-shadow: #a89a70;--note-title: #7a3a1a;--pin-shadow: #6a1a14;--cert-bg: #0b0f20;--title-bg: #05060c;--cork: #8a5a34;--cork-frame: #5b3a22;--paper: #efe6c8;--paper-line: #d8cba4;--paper-ink: #2a2010;--paper-dim: #6a5a40;--thread: #e0584c;--thread-on: #ff7a6a;--thread-ink: #8a2a1c}.game-header{display:flex;align-items:center;gap:var(--gap-l);flex-wrap:wrap;margin-bottom:var(--gap-m)}.game-header .logo{margin:0;text-decoration:none}.progress{display:flex;gap:6px;flex:1;flex-wrap:wrap;justify-content:center;list-style:none;margin:0;padding:0}.stats{display:flex;gap:var(--gap-m);font-family:var(--vt);font-size:20px;color:var(--dim)}.stats b{color:var(--ink);font-weight:400}.grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-areas:"stage console" "tools console";grid-template-rows:auto 1fr;gap:14px;align-items:start}.grid>.stage{grid-area:stage}.grid>.tools{grid-area:tools}.grid>.console{grid-area:console;position:sticky;top:12px;display:flex;flex-direction:column;height:calc(100vh - 24px);height:calc(100svh - 24px);min-height:480px;overflow:hidden}.console .editor{flex:0 0 auto;height:clamp(96px,22vh,180px)}.console .results{flex:1 1 auto;min-height:0;max-height:none}@media(max-width:980px){.grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"stage" "console" "tools";grid-template-rows:none}.grid>.console{position:static;height:auto;min-height:0}.console .results{max-height:60vh}}.stage{position:relative;overflow:hidden}.stage-view{position:relative}.hotspot{position:absolute;background:none;border:var(--border) dashed transparent;padding:0;cursor:zoom-in}.hotspot:hover,.hotspot:focus-visible{border-color:var(--amber);outline:none}.place{position:absolute;left:10px;top:10px;font-family:var(--pix);font-size:8px;background:#05070ec7;border:var(--border) solid var(--line);padding:6px 8px;color:var(--amber);margin:0}.dialog{display:flex;gap:var(--gap-m);padding:var(--gap-m);border-top:var(--border) solid var(--line);background:var(--row-alt);min-height:132px;position:relative}.dialog.clickable{cursor:pointer}.portrait{flex:0 0 72px;width:72px;height:78px;background:var(--portrait);border:var(--border) solid var(--line);image-rendering:pixelated}.dtext{flex:1;min-width:0}.who{font-family:var(--pix);font-size:9px;margin-bottom:6px}.say{font-family:var(--vt);font-size:23px;line-height:1.12;color:var(--ink);min-height:52px;margin:0}.say .btn{margin-left:var(--gap-s);vertical-align:middle}.next{position:absolute;right:12px;bottom:8px;font-family:var(--pix);font-size:8px;color:var(--amber);animation:blink 1s steps(2) infinite}.skip{position:absolute;right:10px;top:8px;font-family:var(--pix);font-size:7px;background:none;border:1px solid var(--line);color:var(--dim);padding:4px 6px}@keyframes blink{50%{opacity:0}}.task{padding:var(--gap-m);border-top:var(--border) solid var(--line)}.task .goal{font-family:var(--pix);font-size:8px;color:var(--teal);margin-bottom:var(--gap-s)}.task .q{font-family:var(--vt);font-size:24px;margin:0 0 var(--gap-s);font-weight:400}.answer{display:flex;gap:var(--gap-s)}.answer input,.title-box input{flex:1;min-width:0;background:var(--well);border:var(--border) solid var(--line);color:var(--ink);font-family:var(--vt);font-size:22px;padding:6px 10px;border-radius:var(--radius-sm)}.answer input:focus,.title-box input:focus{outline:none;border-color:var(--amber)}.feedback{font-family:var(--vt);font-size:20px;margin-top:6px;min-height:22px}.feedback.bad{color:var(--red)}.feedback.good{color:var(--green)}.shake{animation:shake .35s}@keyframes shake{20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(3px)}}.term-head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap-s);padding:10px var(--gap-m);border-bottom:var(--border) solid var(--line)}.term-title{font-family:var(--pix);font-size:8px;color:var(--green);flex:1;margin:0}.term-head .btn{white-space:nowrap}.term-title span{color:var(--dim)}@media(max-width:1200px){.term-title span{display:none}}.editor{height:150px;background:var(--editor);border-bottom:var(--border) solid var(--line)}.editor .cm-editor{height:100%}.editor .cm-editor.cm-focused{outline:none}.results{max-height:280px;overflow:auto;background:var(--results)}.rmeta{font-family:var(--vt);font-size:18px;color:var(--dim);padding:6px var(--gap-m);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:var(--gap-s);position:sticky;left:0}.rnote{padding:6px var(--gap-m);font-family:var(--vt);font-size:18px;color:var(--teal);border-bottom:1px solid var(--line)}.rnote-inline{color:var(--teal)}.err{padding:var(--gap-m);color:var(--err-ink);font-family:var(--vt);font-size:20px;background:var(--err-well);border-left:4px solid var(--red)}.warn{padding:var(--gap-s) var(--gap-m);color:var(--tip-ink);font-family:var(--vt);font-size:19px;background:var(--tip-bg);border-left:4px solid var(--violet)}.empty{padding:var(--gap-l) var(--gap-m);color:var(--dim);font-family:var(--vt);font-size:20px}.results table{border-collapse:collapse;width:100%;font-family:var(--mono);font-size:12.5px}.results th{position:sticky;top:0;background:var(--th);color:var(--amber);text-align:left;padding:6px 10px;font-weight:600;border-bottom:var(--border) solid var(--line);white-space:nowrap}.results thead tr.filters th{top:29px;padding:3px 6px;background:var(--th)}.results .filters input{width:100%;min-width:60px;background:var(--well);border:1px solid var(--line);color:var(--ink);font-family:var(--mono);font-size:11px;padding:2px 4px}.results td{white-space:nowrap;padding:5px 10px;border-bottom:1px solid var(--td-line);vertical-align:top;max-width:420px}.results tr:nth-child(2n) td{background:var(--row-alt)}.results tr:hover td{background:var(--hover)}.results td.long{white-space:normal;min-width:260px}.results td.num{color:var(--sql-num);text-align:right}.results .null{color:var(--sql-comment)}.tabs{display:flex;border-bottom:var(--border) solid var(--line);background:var(--tabs-bg);overflow-x:auto}.tab{font-family:var(--pix);font-size:7px;padding:11px 12px;background:none;border:none;color:var(--dim);border-bottom:3px solid transparent;white-space:nowrap}.tab[aria-selected=true]{color:var(--amber);border-bottom-color:var(--amber)}.tab .dot{display:inline-block;width:6px;height:6px;background:var(--red);margin-left:5px;vertical-align:middle}.pane{padding:14px;font-size:14.5px;line-height:1.55}.pane h4{font-family:var(--pix);font-size:10px;color:var(--amber);margin:0 0 10px;line-height:1.6}.pane p{margin:0 0 10px;color:var(--pane-ink)}.pane pre{background:var(--editor);border:1px solid var(--line);padding:10px 12px;border-radius:var(--radius-sm);font-size:13px;margin:0 0 10px;white-space:pre-wrap;position:relative}.pane code{background:var(--th);padding:1px 5px;border-radius:var(--radius-sm);color:var(--sql-fn);font-size:13px}.pane pre code{background:none;padding:0;color:var(--sql-text)}.try{position:absolute;right:6px;top:6px;font-family:var(--pix);font-size:6px;padding:5px 6px;background:var(--teal);color:#062022;border:none}.tip{background:var(--tip-bg);border-left:3px solid var(--violet);padding:8px 10px;color:var(--tip-ink);margin:0 0 10px;font-size:13.5px}.schema{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}.tbl{background:var(--results);border:1px solid var(--line);border-radius:var(--radius-sm)}.tbl button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:flex;justify-content:space-between;gap:var(--gap-s)}.tbl .tbl-name{padding:7px 9px;background:var(--th);font-family:var(--mono);font-size:13px;color:var(--teal)}.tbl .tbl-name small{color:var(--dim)}.tbl .tbl-col{padding:3px 9px;font-family:var(--mono);font-size:12px;color:var(--sql-text)}.tbl button:hover,.tbl button:focus-visible{background:var(--hover)}.tbl i{color:var(--dim);font-style:normal;font-size:11px}.tbl .tbl-desc{padding:3px 9px 6px;color:var(--dim);font-size:11px}.clues{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;list-style:none;padding:6px 0 0;margin:0}.note{background:var(--note-bg);color:var(--note-ink);padding:10px 12px 12px;font-family:var(--vt);font-size:19px;line-height:1.1;position:relative;box-shadow:0 3px 0 var(--note-shadow);transform:rotate(var(--r, 0deg))}.note:before{content:"";position:absolute;top:-5px;left:50%;width:10px;height:10px;background:var(--red);border-radius:50%;box-shadow:0 1px 0 var(--pin-shadow)}.note b{display:block;font-family:var(--pix);font-size:7px;margin-bottom:6px;color:var(--note-title)}.hint{border:1px dashed var(--line);padding:10px;margin-bottom:10px;border-radius:var(--radius-sm);display:flex;justify-content:space-between;align-items:center;gap:var(--gap-s)}.hint.open{display:block}.hint.locked{color:var(--dim)}.hint .btn{font-size:7px;padding:7px 8px}.hint-title{color:var(--amber);font-family:var(--pix);font-size:8px}.notebook{list-style:none;padding:0;margin:0}.notebook li{margin-bottom:10px}.notebook .row{display:flex;gap:var(--gap-s)}.notebook .btn{font-size:7px;padding:7px 8px}.board-wrap .red{color:var(--red)}.board{position:relative;background:var(--cork);border:6px solid var(--cork-frame);border-radius:var(--radius-sm);padding:18px 14px 14px}.board-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:26px 30px;align-items:start}.table-note{position:relative;background:var(--paper);color:var(--paper-ink);box-shadow:0 3px 0 var(--note-shadow);transform:rotate(var(--r, 0deg));padding:4px 0 6px}.table-note:before{content:"";position:absolute;top:-6px;left:50%;width:10px;height:10px;background:var(--red);border-radius:50%;box-shadow:0 1px 0 var(--pin-shadow)}.table-note button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:flex;justify-content:space-between;gap:var(--gap-s);font-family:var(--mono)}.table-note .tn-name{padding:6px 9px 5px;font-size:13px;font-weight:600;color:var(--note-title);border-bottom:1px solid var(--paper-line)}.table-note .tn-name small{font-weight:400;color:var(--paper-dim)}.table-note .tn-col{padding:2px 9px;font-size:12px}.table-note .tn-col.has-thread{color:var(--thread-ink)}.table-note .tn-col.linked{background:var(--amber);color:var(--paper-ink)}.table-note button:hover,.table-note button:focus-visible{background:var(--paper-line)}.table-note i{color:var(--paper-dim);font-style:normal;font-size:11px}.table-note .tn-desc{padding:4px 9px 0;font-size:11px;color:var(--paper-dim)}.threads{position:absolute;inset:0 auto auto 0;pointer-events:none;overflow:visible}.thread{cursor:pointer}.thread-hit{fill:none;stroke:transparent;stroke-width:12px;pointer-events:stroke}.thread-line{fill:none;stroke:var(--thread);stroke-width:2px;opacity:.85}.thread.on .thread-line{stroke:var(--thread-on);stroke-width:3px;opacity:1}.thread-pin{fill:var(--red);stroke:var(--pin-shadow)}.thread-tip{position:absolute;transform:translate(-50%,-130%);background:var(--panel2);border:var(--border) solid var(--red);color:var(--sql-text);font-family:var(--mono);font-size:12px;padding:4px 8px;white-space:nowrap;pointer-events:none;z-index:2}.board-h{font-family:var(--pix);font-size:8px;color:var(--amber);margin:18px 0 8px}.board .board-h{color:var(--paper)}.board .board-empty{color:var(--paper);margin:0}.thread-list{list-style:none;padding:0;margin:0;display:grid;gap:4px}.thread-list button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;padding:5px 8px;border:1px solid var(--line);font-family:var(--mono);font-size:12px;color:var(--sql-text);display:flex;flex-wrap:wrap;gap:4px 12px}.thread-list button:hover,.thread-list button:focus-visible,.thread-list button.on{border-color:var(--red);background:var(--hover)}.thread-list code{background:none;padding:0;color:var(--dim)}.modal.modal-board{max-width:1280px;max-height:94vh;padding:16px 18px 20px}.modal-board-head{display:flex;justify-content:space-between;align-items:center;gap:var(--gap-m);margin-bottom:var(--gap-s);position:sticky;top:-16px;background:var(--panel);padding:8px 0;z-index:3}.modal-board-head h2{margin:0}.modal-board-head .btn{white-space:nowrap}.modal-board .board-cards{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:34px 40px}.modal-board .board-wrap>p{color:var(--pane-ink)}.board-expand{float:right;margin:0 0 8px 12px;font-size:7px}.badges{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}.badge{border:var(--border) solid var(--line);padding:10px;display:flex;gap:10px;align-items:flex-start}.badge.earned{border-color:var(--amber);background:var(--panel2)}.badge.locked{opacity:.55}.badge .icon{font-size:26px;line-height:1}.badge.locked .icon{filter:grayscale(1)}.badge b{display:block;font-family:var(--pix);font-size:8px;line-height:1.5;color:var(--amber);margin-bottom:4px}.badge.locked b{color:var(--dim)}.badge p{margin:0;font-size:13px}.cert-badges{margin-top:14px;font-size:22px;letter-spacing:6px}.game-footer{margin-top:18px;display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap}.game-footer .btn{font-size:7px}.game-footer label{font-family:var(--vt);font-size:19px;color:var(--dim);display:flex;gap:6px;align-items:center}.modal{background:var(--panel);color:var(--ink);border:3px solid var(--amber);max-width:760px;width:calc(100% - 32px);max-height:90vh;overflow:auto;padding:22px;box-shadow:0 10px 0 var(--void)}.modal::backdrop{background:#03040ad1}.modal h2{font-family:var(--pix);font-size:14px;color:var(--amber);margin:0 0 14px;line-height:1.6}.modal h3{font-family:var(--pix);font-size:9px;color:var(--teal);margin:18px 0 8px;line-height:1.6}.modal p,.modal li{line-height:1.55;color:var(--pane-ink)}.modal pre{background:var(--editor);border:1px solid var(--line);padding:10px;font-size:12.5px;white-space:pre-wrap}.modal-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px}.title-screen{position:fixed;inset:0;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:20px;text-align:center;background:var(--title-bg)}.title-screen .pixel-canvas{object-position:50% 100%;position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;opacity:.9}@media(max-aspect-ratio:1/1){.title-screen .pixel-canvas{object-position:25% 100%}}.title-box{position:relative;background:#060812d1;border:3px solid var(--amber);padding:26px 28px;max-width:560px;box-shadow:0 10px #0009}.title-box h1{font-family:var(--pix);color:var(--amber);font-size:22px;line-height:1.5;margin:0 0 6px;text-shadow:0 3px 0 var(--amber-shadow)}.title-box .sub{font-family:var(--pix);font-size:9px;color:var(--teal);margin-bottom:18px}.title-box p{font-family:var(--vt);font-size:22px;line-height:1.15;color:var(--ink);margin:0 0 16px}.title-box input{width:100%;font-size:24px;padding:8px 12px;margin-bottom:14px;text-align:center}.title-box .row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.title-box .saved{font-size:20px;color:var(--teal)}.title-box .saved b{color:var(--ink);font-weight:400}.restart-name{width:100%;background:var(--well);border:var(--border) solid var(--line);color:var(--ink);font-family:var(--vt);font-size:22px;padding:6px 10px}.loading{font-family:var(--vt);font-size:20px;color:var(--dim);margin-top:10px}.loading.error{color:var(--red)}.cert{border:4px double var(--amber);padding:20px;text-align:center;background:var(--cert-bg)}.cert .kicker{font-family:var(--pix);font-size:8px;color:var(--teal)}.cert .big{font-family:var(--pix);font-size:16px;color:var(--amber);line-height:1.6;margin:10px 0}.cert p{font-family:var(--vt);font-size:21px;margin:0;color:var(--ink)}.cert .name{font-family:var(--vt);font-size:36px;color:var(--ink);margin:6px 0 14px}.cert .row{display:flex;justify-content:center;gap:26px;font-family:var(--vt);font-size:22px;color:var(--dim);flex-wrap:wrap;margin-top:16px}.cert .row b{display:block;font-size:34px;color:var(--ink);font-weight:400}.stamp{display:inline-block;margin-top:16px;font-family:var(--pix);font-size:10px;color:var(--red);border:3px solid var(--red);padding:8px 12px;transform:rotate(-6deg)}.cert-note{text-align:center;font-family:var(--vt);font-size:18px;color:var(--dim);margin-top:12px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%) translateY(120px);background:var(--green-well);border:var(--border) solid var(--green);color:var(--green);font-family:var(--pix);font-size:9px;padding:12px 16px;z-index:60;transition:transform .3s}.toast.on{transform:translate(-50%) translateY(0)}@media(max-width:600px){.say{font-size:20px}.task .q{font-size:21px}.progress{justify-content:flex-start}.title-box h1{font-size:17px}.title-box p{font-size:19px}.dialog{min-height:110px}.portrait{flex-basis:52px;width:52px;height:56px}}
