:root{--bg-floor:#15110d;--surface:#fff5e10d;--surface-sel:#5a4a36;--ink:#ece0c8;--muted:#9d8c71;--hairline:#dcc8a029;--track:#dcc8a01f;--board-line:#2a1c0e;--coord-ink:#f3e6cb8c;--cho:#1b4f7a;--han:#a82a1c;--gold:#c0913f;--last-move:#c0913f29;--danger-text:#d98b7d;--sp-2xs:2px;--sp-xs:4px;--sp-sm:8px;--sp-md:16px;--sp-lg:24px;--sp-xl:32px;--sp-2xl:48px;--sp-3xl:64px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--font-serif:"Nanum Myeongjo", "Noto Serif KR", ui-serif, Georgia, serif;--font-sans:Pretendard, system-ui, -apple-system, "Apple SD Gothic Neo", sans-serif;--font-mono:ui-monospace, "SF Mono", monospace}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:radial-gradient(80% 55% at 50% 30%, #ffbe6e14, #0000 70%), linear-gradient(170deg, #1d1813, var(--bg-floor)) fixed;color:var(--ink);font-family:var(--font-sans);min-height:100dvh;font-size:17px}.app{padding:var(--sp-lg) var(--sp-md);align-items:center;gap:var(--sp-md);flex-direction:column;min-height:100dvh;display:flex}.hero{font-family:var(--font-serif);color:var(--ink);letter-spacing:-.01em;font-size:28px;font-weight:600}.material{gap:var(--sp-lg);font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink);font-size:15px;display:flex}.material .mat b{margin-right:var(--sp-xs);font-weight:700}.material .cho b{color:var(--cho)}.material .han b{color:var(--han)}.board{box-sizing:border-box;width:min(calc(100vw - var(--sp-md) * 2), 468px);border-radius:var(--radius-md);background:radial-gradient(120% 90% at 50% 26%,#ffe2b021,#0000 70%),radial-gradient(55% 130% at 36% 52%,#a5764233,#0000 60%),radial-gradient(48% 120% at 72% 48%,#50341a26,#0000 58%),repeating-linear-gradient(90.4deg,#2d1a0a14 0 1.5px,#0000 1.5px 5px),repeating-linear-gradient(89.4deg,#2816080f 0 1px,#0000 1px 13px),repeating-linear-gradient(90.9deg,#22120717 0 2px,#0000 2px 31px),linear-gradient(93deg,#9a6e44 0%,#aa7e52 24%,#8e6640 50%,#a37a4c 74%,#8a623c 100%);border:1px solid #5e4226;padding:clamp(22px,7.5%,34px);position:relative;box-shadow:inset 0 0 0 1.5px #28180a73,inset 0 0 54px #1c0f055c,0 8px 30px #0009}.board-grid{aspect-ratio:8/9;width:100%;position:relative}.board-lines{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.board-lines line{stroke:var(--board-line);stroke-width:1.4px;stroke-linecap:round;vector-effect:non-scaling-stroke}.coord{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--coord-ink);opacity:.9;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:clamp(8px,1.9vw,11px);font-weight:600;line-height:1;position:absolute}.coord.file{margin-top:clamp(18px,7%,28px);top:100%;transform:translate(-50%,-50%)}.coord.rank{margin-left:calc(-1*clamp(18px,7%,28px));left:0;transform:translate(-50%,-50%)}.cell{aspect-ratio:1;cursor:default;justify-content:center;align-items:center;width:12.5%;display:flex;position:absolute;transform:translate(-50%,-50%)}:is(.cell:has(.piece),.cell:has(.legal-dot)){cursor:pointer}.piece{object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;pointer-events:none;filter:drop-shadow(1.5px 4px 2.5px #0f08008c);width:110%;height:110%}.piece.small{width:92%;height:92%}.cell.sel .piece{filter:drop-shadow(1.5px 4px 2.5px #0f08008c)drop-shadow(0 0 3px #fff4d6f2)}.legal-dot{pointer-events:none;background:#3a2f226b;border-radius:50%;width:26%;height:26%;position:absolute}.arrow-overlay{pointer-events:none;filter:drop-shadow(0 0 6px #c0913f8c);width:100%;height:100%;position:absolute;inset:0;overflow:visible}.evalbar{align-items:center;gap:var(--sp-sm);width:min(calc(100vw - var(--sp-md) * 2), 468px);display:flex}.evalbar-track{border-radius:var(--radius-sm);background:var(--track);border:1px solid var(--hairline);flex:1;height:8px;position:relative;overflow:hidden}.evalbar-fill{background:var(--muted);height:100%;transition:width .35s}.evalbar-label{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink);text-align:right;min-width:3.2em;font-size:15px}.pvline{align-items:center;gap:var(--sp-sm);width:min(calc(100vw - var(--sp-md) * 2), 468px);min-height:28px;font-family:var(--font-sans);display:flex}.pv-depth{color:var(--muted);min-width:3ch;font-size:12px}.pv-moves{gap:var(--sp-sm);margin:0;padding:0;list-style:none;display:flex;overflow-x:auto}.pv-move{color:var(--muted);white-space:nowrap;font-size:15px;font-family:var(--font-mono)}.pv-move.top{color:var(--gold);font-weight:700}.pv-pending{color:var(--muted);font-size:15px}.status-banner-group{gap:var(--sp-xs);width:min(calc(100vw - var(--sp-md) * 2), 468px);flex-direction:column;display:flex}.status-banner{align-items:center;gap:var(--sp-sm);padding:var(--sp-sm) var(--sp-md);border-radius:var(--radius-md);border:1px solid var(--hairline);font-size:13px;font-family:var(--font-sans);display:flex}.status-banner--warning{background:var(--surface);color:#d8b271;border-color:#c0913f80}.status-banner--loading{background:var(--surface);border-color:var(--hairline);color:var(--muted)}.status-banner--error{background:var(--surface);color:var(--danger-text);border-color:#a82a1c8c}.status-banner__text{flex:1}.status-banner__icon{flex-shrink:0}@keyframes spinner-rotate{to{transform:rotate(360deg)}}.status-banner__spinner{border:2px solid var(--hairline);border-top-color:var(--muted);border-radius:50%;flex-shrink:0;width:14px;height:14px;animation:.8s linear infinite spinner-rotate;display:inline-block}.status-banner__retry{padding:var(--sp-2xs) var(--sp-sm);color:var(--danger-text);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:1px solid #a82a1c8c;flex-shrink:0;font-size:13px}.status-banner__retry:hover{background:#a82a1c1f}.controls{gap:var(--sp-sm);display:flex}.ctrl{font-family:var(--font-sans);color:var(--ink);background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-md);padding:var(--sp-sm) var(--sp-md);cursor:pointer;font-size:15px;transition:background .12s,box-shadow .12s}.ctrl:hover{border-color:var(--muted)}.ctrl:active{box-shadow:inset 1px 1px 3px #0006}.ctrl.on{background:var(--surface-sel);color:#f0e6cf;border-color:var(--surface-sel)}.ctrl.danger{color:var(--danger-text);border-color:#a82a1c80}.ctrl.primary:disabled{opacity:.4;cursor:not-allowed}.editor{gap:var(--sp-sm);width:min(calc(100vw - var(--sp-md) * 2), 468px);flex-direction:column;display:flex}.palette{gap:var(--sp-2xs);flex-direction:column;align-items:center;display:flex}.palette-row{gap:var(--sp-sm);display:flex}.palette-chip{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:48px;height:48px;padding:0;display:flex}.palette-chip img{object-fit:contain;-webkit-user-drag:none;width:100%;height:100%}.palette-chip.sel{filter:drop-shadow(0 0 3px #fff4d6f2)}.editor-row{gap:var(--sp-sm);flex-wrap:wrap;justify-content:center;display:flex}.seg{border:1px solid var(--hairline);border-radius:var(--radius-sm);display:flex;overflow:hidden}.seg-btn{background:var(--surface);color:var(--muted);cursor:pointer;border:none;padding:6px 12px}.seg-btn.on{background:var(--surface-sel);color:#f0e6cf}.editor-hint{color:var(--muted);text-align:center;font-size:13px}.time-presets,.rule-presets{gap:var(--sp-sm);width:min(calc(100vw - var(--sp-md) * 2), 468px);flex-wrap:wrap;justify-content:center;display:flex}.time-chip,.rule-chip{font-family:var(--font-sans);color:var(--ink);border-radius:var(--radius-sm);cursor:pointer;background:#fff5e112;border:1px solid #dcc8a052;padding:6px 14px;font-size:14px;transition:background .12s,box-shadow .12s}.time-chip:active,.rule-chip:active{box-shadow:inset 1px 1px 3px #0006}.time-chip.on,.rule-chip.on{background:var(--surface-sel);color:#f0e6cf;border-color:var(--surface-sel);font-weight:600}.time-chip:disabled,.rule-chip:disabled{opacity:.4;cursor:not-allowed}.piece-picker{gap:var(--sp-sm);flex-direction:column;align-items:center;display:flex}.cell-picker{z-index:10;border:1px solid var(--hairline);border-radius:var(--radius-sm);background:#211a12;max-width:calc(100% - 12px);padding:6px;position:absolute;box-shadow:0 6px 24px #0000008c}.cell-picker .piece-picker{width:auto}