:root{--ink: #22272c;--ink-2: #4b535b;--mortar: #848c94;--rule: #c9cfd3;--paper: #f6f7f5;--paper-2: #eceeeb;--tape: #f0bf2c;--tape-ink: #2a2306;--ok: #3f72d6;--bad: #d4473a;--shade: rgba(20, 24, 28, .55);--r-ctl: 6px;--r-sheet: 3px;--font: "IBM Plex Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;--step--1: 12px;--step-0: 14px;--step-1: 16px;--step-2: 20px;--step-3: 28px;--step-4: 40px;color-scheme:light}*{box-sizing:border-box}html,body,#app{margin:0;height:100%;overflow:hidden;background:#1d2125}body{font-family:var(--font);color:var(--ink);font-size:var(--step-0);-webkit-font-smoothing:antialiased;touch-action:none;word-break:keep-all;overflow-wrap:anywhere}button,input,select{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--ok);outline-offset:2px}.stage{position:fixed;inset:0}.stage canvas{display:block;width:100%;height:100%;outline:none}.sheet{background:var(--paper);border:1px solid var(--ink);border-radius:var(--r-sheet);box-shadow:4px 4px #22272c2e}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 14px;border:1px solid var(--ink);border-radius:var(--r-ctl);background:var(--paper);color:var(--ink);font-size:var(--step-0);font-weight:500;white-space:nowrap}.btn:hover{background:var(--paper-2)}.btn:disabled{opacity:.45;cursor:default}.btn.primary{background:var(--tape);color:var(--tape-ink);border-color:var(--tape-ink);font-weight:600}.btn.primary:hover{background:#f5cb4a}.btn.quiet{border-color:var(--rule)}.btn.danger{color:var(--bad);border-color:var(--bad)}.btn.on{background:var(--ink);color:var(--paper)}.btn.icon{width:40px;padding:0}.btn.small{min-height:32px;padding:0 10px;font-size:var(--step--1)}.kc{display:inline-block;min-width:17px;padding:0 4px;border:1px solid currentColor;border-bottom-width:2px;border-radius:3px;font:600 10px/14px var(--font);letter-spacing:0;text-align:center;opacity:.55;white-space:nowrap}.btn:disabled .kc{opacity:.35}.keys .kc{opacity:.8;margin-right:2px}@media(pointer:coarse){.kc,.keys{display:none}}.titleblock{position:fixed;top:16px;left:16px;z-index:10;display:grid;grid-template-columns:auto auto;align-items:stretch;pointer-events:auto}.titleblock .unit{padding:8px 12px;border-right:1px solid var(--ink);display:flex;flex-direction:column;justify-content:center}.titleblock .unit b{font-size:var(--step-1);letter-spacing:-.01em}.titleblock .unit small{color:var(--ink-2);font-size:var(--step--1)}.titleblock .room{padding:6px 14px;display:flex;flex-direction:column;justify-content:center;min-width:120px}.titleblock .room span{font-size:var(--step--1);color:var(--mortar)}.titleblock .room strong{font-size:var(--step-2);font-weight:600;letter-spacing:-.02em}.topright{position:fixed;top:16px;right:16px;z-index:10;display:flex;gap:8px;align-items:flex-start}.modes{display:flex;padding:3px;gap:3px}.modes button{border:0;background:transparent;border-radius:4px;padding:7px 12px;font-weight:500;color:var(--ink-2)}.modes button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.actionbar{position:fixed;left:50%;bottom:18px;transform:translate(-50%);z-index:10;display:flex;gap:6px;padding:6px;align-items:center}.actionbar .sep{width:1px;align-self:stretch;background:var(--rule);margin:0 2px}.count{font-variant-numeric:tabular-nums;color:var(--ink-2);font-size:var(--step--1);padding:0 6px;white-space:nowrap}.hint{position:fixed;left:50%;bottom:84px;transform:translate(-50%);z-index:9;padding:6px 12px;border-radius:4px;background:var(--shade);color:#fff;font-size:var(--step--1);pointer-events:none;white-space:nowrap;max-width:calc(100vw - 32px);overflow:hidden;text-overflow:ellipsis}.toast{position:fixed;left:50%;top:82px;transform:translate(-50%);z-index:30;padding:9px 14px;font-size:var(--step-0);max-width:min(560px,calc(100vw - 32px));text-align:center;animation:toastIn .18s ease-out}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,-6px)}}@media(prefers-reduced-motion:reduce){.toast{animation:none}}.crosshair{position:fixed;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #00000073;z-index:5;pointer-events:none}.minimap{position:fixed;right:16px;top:66px;z-index:9;padding:6px}.minimap canvas{display:block;width:260px;height:172px;cursor:crosshair}.minimap .caption{display:flex;justify-content:space-between;font-size:var(--step--1);color:var(--ink-2);padding:2px 2px 4px}.intro{position:fixed;inset:0;z-index:40;display:grid;place-items:center;background:linear-gradient(180deg,#1d212540,#1d2125a6)}.intro .card{width:min(560px,calc(100vw - 32px));padding:28px 28px 22px}.intro h1{font-size:var(--step-4);line-height:1.12;margin:0 0 6px;letter-spacing:-.035em;font-weight:700}.intro .lede{margin:0 0 22px;color:var(--ink-2);font-size:var(--step-1);line-height:1.55}.intro .choices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.intro .choice{text-align:left;padding:14px;border:1px solid var(--ink);border-radius:var(--r-ctl);background:var(--paper);display:flex;flex-direction:column;gap:4px;min-height:92px}.intro .choice b{font-size:var(--step-1)}.intro .choice span{color:var(--ink-2);font-size:var(--step--1);line-height:1.45}.intro .choice.primary{background:var(--tape);border-color:var(--tape-ink)}.intro .choice:disabled{opacity:.5}.intro .fine{margin-top:16px;font-size:var(--step--1);color:var(--mortar);line-height:1.5}.intro .fine button{border:0;background:none;padding:0;color:var(--ink-2);text-decoration:underline;font-size:inherit}.tape{position:relative;height:34px;border:1px solid var(--tape-ink);border-radius:3px;background:#fffdf4;overflow:hidden}.tape .fill{position:absolute;inset:0 auto 0 0;background:var(--tape);transition:width .25s ease-out}.tape .ticks{position:absolute;inset:0;background-image:repeating-linear-gradient(90deg,var(--tape-ink) 0 1px,transparent 1px 10px),repeating-linear-gradient(90deg,var(--tape-ink) 0 1px,transparent 1px 50px);background-size:100% 7px,100% 14px;background-repeat:no-repeat;background-position:0 0,0 0;opacity:.7}.tape .label{position:absolute;right:8px;bottom:4px;font-variant-numeric:tabular-nums;font-size:var(--step--1);font-weight:600;color:var(--tape-ink)}.loadtext{margin-top:8px;font-size:var(--step--1);color:var(--ink-2);min-height:18px}.drawer{position:fixed;top:0;right:0;bottom:0;width:min(920px,100vw);z-index:30;display:grid;grid-template-columns:1fr 360px;border-right:0;border-top:0;border-bottom:0;border-radius:0}.drawer .list{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--rule)}.drawer header{padding:16px 16px 10px;display:flex;flex-direction:column;gap:10px}.drawer header .row{display:flex;gap:8px;align-items:center}.drawer h2{margin:0;font-size:var(--step-2);letter-spacing:-.02em;flex:1}.search{flex:1;height:40px;border:1px solid var(--ink);border-radius:var(--r-ctl);padding:0 12px;background:#fff}.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{flex:none;border:1px solid var(--rule);background:#fff;border-radius:999px;padding:5px 11px;font-size:var(--step--1)}.chip[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.filters{display:flex;gap:12px;align-items:center;font-size:var(--step--1);color:var(--ink-2)}.filters label{display:flex;gap:6px;align-items:center}.filters select{border:1px solid var(--rule);border-radius:4px;background:#fff;padding:3px 6px}.grid{overflow-y:auto;padding:4px 16px 16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(156px,1fr));gap:10px;align-content:start}.card-item{display:flex;flex-direction:column;gap:6px;text-align:left;padding:8px;border:1px solid var(--rule);border-radius:var(--r-ctl);background:#fff}.card-item[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.card-item img{width:100%;aspect-ratio:4 / 3;object-fit:contain;background:#e3e6e8;border-radius:3px}.card-item b{font-size:var(--step--1);font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-item span{font-size:11px;color:var(--mortar)}.resultline{padding:0 16px 6px;font-size:var(--step--1);color:var(--mortar)}.detail{display:flex;flex-direction:column;min-height:0}.detail .scroll{overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;flex:1}.detail h3{margin:0;font-size:var(--step-1);line-height:1.35;letter-spacing:-.01em}.preview3d{position:relative;width:100%;aspect-ratio:16 / 10;background:#dfe3e6;border-radius:3px;overflow:hidden}.preview3d img,.preview3d canvas{width:100%;height:100%;object-fit:contain;display:block}.preview3d .spinner{position:absolute;inset:auto 8px 8px auto;font-size:11px;color:var(--ink-2)}.dims{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1px dashed var(--tape-ink);background:#fffbea;border-radius:3px}.dims .k{font-size:11px;color:var(--ink-2)}.dims .v{font-size:var(--step-1);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.desc{white-space:pre-line;font-size:var(--step--1);line-height:1.6;color:var(--ink-2)}.opt{display:grid;grid-template-columns:88px 1fr;gap:8px;align-items:center;font-size:var(--step--1)}.opt select,.opt input[type=number]{width:100%;height:34px;border:1px solid var(--rule);border-radius:4px;background:#fff;padding:0 8px}.opt .slider{display:flex;gap:8px;align-items:center}.opt .slider input[type=range]{flex:1;accent-color:var(--ink)}.opt .slider output{min-width:52px;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}.detail footer{padding:12px 16px;border-top:1px solid var(--rule);display:flex;gap:8px}.detail footer .btn.primary{flex:1}a.source{color:var(--ink-2);font-size:var(--step--1)}.placement{position:fixed;right:16px;bottom:16px;z-index:20;width:360px;padding:14px;display:flex;flex-direction:column;gap:10px}.placement .btn{padding:0 10px}.placement .btn.small{padding:0 8px}.placement .head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.placement .head b{font-size:var(--step-0);line-height:1.35}.state{font-size:var(--step--1);padding:2px 8px;border-radius:999px;white-space:nowrap}.state.ok{color:var(--ok);border:1px solid var(--ok)}.state.bad{color:var(--bad);border:1px solid var(--bad)}.ruler{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--tape-ink);border-radius:3px;background:#fffbea}.ruler div{padding:6px 8px;display:flex;flex-direction:column}.ruler div+div{border-left:1px dashed var(--tape-ink)}.ruler span{font-size:11px;color:var(--ink-2)}.ruler b{font-variant-numeric:tabular-nums;font-size:var(--step-1)}.row2{display:grid;grid-template-columns:1fr 1fr;gap:6px}.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.angle{display:flex;align-items:center;gap:8px;font-size:var(--step--1)}.angle input[type=range]{flex:1;accent-color:var(--ink)}.angle output{width:54px;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}.keys{font-size:11px;color:var(--mortar);line-height:1.5}.selection{position:fixed;left:50%;bottom:84px;transform:translate(-50%);z-index:20;padding:12px;width:min(520px,calc(100vw - 32px));display:flex;flex-direction:column;gap:10px}.selection .title{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.selection .title b{font-size:var(--step-0);line-height:1.35}.selection .title small{color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}.selection .actions{display:flex;gap:6px;flex-wrap:wrap}.modal-back{position:fixed;inset:0;z-index:50;background:#14181c73;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding:16px}.modal{width:min(720px,100%);min-width:0;max-height:calc(100vh - 32px);display:flex;flex-direction:column}.modal header{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--rule)}.modal header h2{margin:0;font-size:var(--step-2);letter-spacing:-.02em}.modal .body{padding:16px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}.modal footer{padding:12px 16px;border-top:1px solid var(--rule);display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}.slot{display:flex;flex-direction:column;gap:6px;text-align:left;padding:8px;border:1px solid var(--rule);border-radius:var(--r-ctl);background:#fff}.slot[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.slot img,.slot .noimg{width:100%;aspect-ratio:16 / 9;object-fit:cover;border-radius:3px;background:#e3e6e8}.slot b{font-size:var(--step--1)}.slot span{font-size:11px;color:var(--mortar)}.field{display:flex;flex-direction:column;gap:6px;font-size:var(--step--1);color:var(--ink-2)}.field input[type=text]{height:40px;border:1px solid var(--ink);border-radius:var(--r-ctl);padding:0 12px;background:#fff;color:var(--ink);font-size:var(--step-0)}.field .error{color:var(--bad)}.segmented{display:flex;border:1px solid var(--ink);border-radius:var(--r-ctl);overflow:hidden}.segmented button{flex:1;border:0;background:#fff;padding:9px 8px;font-size:var(--step--1)}.segmented button+button{border-left:1px solid var(--rule)}.segmented button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.sub{font-size:11px;color:var(--mortar);line-height:1.5}.sharebox{display:flex;flex-wrap:wrap;gap:8px}.sharebox input{flex:1 1 180px;min-width:0;height:40px;border:1px solid var(--rule);border-radius:var(--r-ctl);padding:0 10px;background:#fff;font-size:var(--step--1)}.prose{font-size:var(--step-0);line-height:1.7;color:var(--ink-2)}.prose h3{color:var(--ink);font-size:var(--step-1);margin:4px 0 0}.prose p{margin:0}.prose ul{margin:0;padding-left:18px}.joy{position:fixed;left:22px;bottom:96px;width:124px;height:124px;border-radius:50%;z-index:12;border:1.5px solid rgba(255,255,255,.75);background:#14181c38;touch-action:none}.joy .knob{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:#ffffffe6;box-shadow:0 1px 6px #0000004d}.looktip{position:fixed;right:16px;left:160px;text-align:right;bottom:150px;z-index:11;color:#fff;font-size:var(--step--1);text-shadow:0 1px 3px rgba(0,0,0,.6);pointer-events:none}.pausebar{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:15;padding:16px 18px;display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center;width:min(360px,calc(100vw - 32px))}.pausebar p{margin:0;color:var(--ink-2);font-size:var(--step--1);line-height:1.5}.fps{position:fixed;left:16px;bottom:16px;z-index:9;font-size:11px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7);font-variant-numeric:tabular-nums;pointer-events:none}@media(max-width:760px){.titleblock{top:10px;left:10px}.titleblock .unit{display:none}.titleblock .room strong{font-size:var(--step-1)}.topright{top:10px;right:10px}.modes button{padding:7px 9px;font-size:var(--step--1)}.minimap{top:58px;right:10px}.minimap canvas{width:190px;height:126px}.actionbar{left:8px;right:8px;bottom:8px;transform:none;overflow-x:auto;justify-content:flex-start}.actionbar .btn{padding:0 10px;font-size:var(--step--1)}.hint{bottom:70px}.drawer{grid-template-columns:1fr;grid-template-rows:1fr auto;width:100vw}.drawer .list{border-right:0;min-height:0}.drawer .detail{position:absolute;inset:0;background:var(--paper);z-index:2}.drawer .detail.closed{display:none}.placement{left:8px;right:8px;bottom:8px;width:auto;max-height:46vh;overflow-y:auto;padding:10px;gap:8px}.placement .dir{display:none}.placement .ruler div{flex-direction:row;align-items:baseline;gap:6px;padding:4px 8px}.placement .ruler b{font-size:var(--step-0)}.selection{bottom:70px}.intro h1{font-size:var(--step-3)}.intro .choices{grid-template-columns:1fr}.joy{bottom:86px}}@media(max-width:345px){.titleblock{top:58px}.minimap{top:112px}}
