:root{--bg:#efe8da;--surface:#faf6ee;--board-bg:#c9b99c;--board-edge:#a8967a;--cell-bg:#e8dfcc;--cell-edge:#5c46261f;--text:#2b2621;--muted:#7b6f60;--accent:#2c4a86;--good:#3d7a3a;--bad:#b8403a;--c0:#c8473d;--c1:#2f4f8f;--c2:#e2ac35;--c3:#5d8b4c;--c4:#7b3f6f;--c5:#5ea9a0;--motif-light:#fff9edeb;--motif-dark:#482c0e9e;--thread:#fbf6ea;--paper:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.36 0 0 0 0 0.29 0 0 0 0 0.18 0 0 0 0.07 0'/%3E%3C/filter%3E%3Cfilter id='b'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.0153846 0.2' numOctaves='2' seed='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.45 0 0 0 0 0.38 0 0 0 0 0.26 0 0 0 0.22 -0.08'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3Crect width='100%25' height='100%25' filter='url(%23b)'/%3E%3C/svg%3E");--font-body:"Gowun Dodum", system-ui, -apple-system, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;--font-display:"Gowun Batang", "Apple SD Gothic Neo", "Noto Serif KR", serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:var(--font-body);color:var(--text);background:var(--bg);-webkit-tap-highlight-color:transparent}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#17181c;--surface:#22242a;--board-bg:#3a3630;--board-edge:#4d473f;--cell-bg:#2b2a29;--cell-edge:#ffffff12;--text:#efe8da;--muted:#a89f92;--accent:#6f8fd6;--paper:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#17181c;--surface:#22242a;--board-bg:#3a3630;--board-edge:#4d473f;--cell-bg:#2b2a29;--cell-edge:#ffffff12;--text:#efe8da;--muted:#a89f92;--accent:#6f8fd6;--paper:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--paper), var(--bg);height:100%;color:var(--text);overscroll-behavior:none;margin:0}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button{font:inherit;color:inherit;cursor:pointer}.app{flex-direction:column;gap:8px;max-width:460px;min-height:100%;margin:0 auto;padding:10px 16px;display:flex}.top{justify-content:space-between;align-items:center;display:flex}.top h1{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:21px;font-weight:700}.stat .value,.final-score,.home-title,.modal h2,.score-float strong,.banner strong,.ranking .score{font-family:var(--font-display)}.icon-btn{border:1px solid var(--board-bg);background:var(--surface);border-radius:50%;place-items:center;width:36px;height:36px;padding:0;display:grid}.icon-btn.plain{background:0 0;border:none}.icon{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.brand{align-items:center;gap:8px;min-width:0;display:flex}.chip{background:var(--board-bg);color:var(--muted);white-space:nowrap;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:700}.chip.daily{background:color-mix(in srgb, var(--accent) 16%, var(--surface));color:var(--accent)}.top-actions{gap:6px;display:flex}.progress{background:var(--board-bg);border-radius:2px;height:3px;margin-top:4px;display:block;overflow:hidden}.progress span{background:var(--accent);height:100%;transition:width .4s;display:block}.tutorial-callout{background:color-mix(in srgb, var(--accent) 12%, var(--surface));border-radius:12px;align-items:center;gap:10px;padding:10px 12px;font-size:13px;line-height:1.45;display:flex}.tutorial-callout p{flex:1;margin:0}.tutorial-callout button{border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:10px;flex:none;padding:8px 12px;font-weight:700}.tutorial-callout button.link{color:var(--muted);background:0 0;border:none;font-weight:600}.stats{grid-template-columns:1fr 1fr 1.2fr;gap:6px;display:grid}.stat{background:var(--surface);border-radius:10px;flex-direction:column;padding:6px 10px;display:flex}.stat .label{color:var(--muted);font-size:11px}.stat .value{font-variant-numeric:tabular-nums;font-size:20px;font-weight:700}.stat .value.small{margin-top:5px;font-size:13px;font-weight:600}.meta{color:var(--muted);justify-content:space-between;font-size:12px;display:flex}.combo.on{color:var(--accent);font-weight:700}.board-wrap{align-self:center;width:min(100%,440px,100dvh - 350px);min-width:260px;position:relative}.board{aspect-ratio:1;background:var(--board-bg);width:100%;box-shadow:0 0 0 5px var(--board-bg), 0 0 0 6px var(--board-edge), 0 6px 18px #3c280a2e;touch-action:none;border-radius:6px;grid-template-rows:repeat(7,1fr);grid-template-columns:repeat(7,1fr);display:grid}.cell{padding:2px;position:relative}.cell:before{content:"";background:var(--cell-bg);box-shadow:inset 0 0 0 1px var(--cell-edge);border-radius:3px;position:absolute;inset:1.5px}.cell.invalid:before{background:color-mix(in srgb, var(--bad) 35%, var(--cell-bg))}.tile{--tile-c:var(--c0);--motif:var(--motif-light);width:100%;height:100%;position:relative}.tile svg{filter:drop-shadow(0 1.2px #321e0a47);width:100%;height:100%;display:block;overflow:visible}.tile .cloth{fill:var(--tile-c)}.tile .weave{fill:url(#weave)}.tile .stitch{fill:none;stroke:#fffaee99;stroke-width:.75px;stroke-dasharray:1.7 1.3;stroke-linecap:round}.tile .embroidery path{fill:none;stroke-linecap:round}.tile .embroidery{filter:drop-shadow(0 .35px #1e0f0559)}.tile .knot-sheen{fill:#ffffff8c}.tile.c0{--tile-c:var(--c0)}.tile.c1{--tile-c:var(--c1)}.tile.c2{--tile-c:var(--c2);--motif:var(--motif-dark)}.tile.c3{--tile-c:var(--c3)}.tile.c4{--tile-c:var(--c4)}.tile.c5{--tile-c:var(--c5);--motif:var(--motif-dark)}.tile.c2 .stitch,.tile.c5 .stitch{stroke:#50320f66}.tile.ghost{opacity:.6}.tile.pop{animation:.24s cubic-bezier(.3,1.6,.5,1) pop-in}@keyframes pop-in{0%{filter:brightness(1.25);transform:scale(1.18)}to{filter:brightness();transform:scale(1)}}.cell.hint:before{background:color-mix(in srgb, var(--accent) 30%, var(--cell-bg));animation:.9s ease-in-out infinite alternate hint}@keyframes hint{0%{box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--accent) 40%, transparent)}to{box-shadow:inset 0 0 0 3px var(--accent)}}.slot.hint-slot{border-color:var(--accent);animation:.9s ease-in-out infinite alternate hint-slot}@keyframes hint-slot{to{transform:translateY(-3px)}}.fx-layer{pointer-events:none;z-index:5;position:absolute;inset:0}.particle{border-radius:2px;animation:.6s cubic-bezier(.2,.7,.4,1) forwards burst;position:absolute;transform:translate(-50%,-50%)}.particle.scrap{outline-offset:-2.5px;outline:1px dashed #fffaee8c;animation:1.05s cubic-bezier(.2,.6,.35,1) .1s both flutter}@keyframes flutter{0%{opacity:0;transform:translate(-50%,-50%)rotate(0)scale(.6)}12%{opacity:1}55%{transform:translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) rotate3d(1, .4, .2, 200deg) scale(1);opacity:1}to{transform:translate(calc(-50% + var(--dx) * 1.3), calc(-50% + var(--dy) * .6 + 12px)) rotate3d(1, .6, .2, 400deg) scale(.7);opacity:0}}.thread{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.thread line{stroke:var(--thread);stroke-width:.075px;stroke-linecap:round;stroke-dasharray:.2 .11;filter:drop-shadow(0 .02px .02px #00000080);animation:.85s ease-out both thread}@keyframes thread{0%{opacity:0;stroke-dashoffset:.6px}15%{opacity:1}60%{opacity:1;stroke-dashoffset:0}to{opacity:0;stroke-dashoffset:-.3px}}.particle.c0{background:var(--c0)}.particle.c1{background:var(--c1)}.particle.c2{background:var(--c2)}.particle.c3{background:var(--c3)}.particle.c4{background:var(--c4)}.particle.c5{background:var(--c5)}@keyframes burst{to{transform:translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) rotate(160deg) scale(.3);opacity:0}}.score-float{color:var(--text);text-shadow:0 1px 0 var(--bg), 0 0 8px var(--bg);white-space:nowrap;flex-direction:column;align-items:center;animation:.95s ease-out forwards float-up;display:flex;position:absolute;transform:translate(-50%,-50%)}.score-float strong{font-size:26px;font-weight:800}.score-float.big strong{color:var(--accent);font-size:34px}.score-float span{color:var(--accent);font-size:12px;font-weight:700}@keyframes float-up{0%{opacity:0;transform:translate(-50%,-30%)scale(.7)}18%{opacity:1;transform:translate(-50%,-55%)scale(1.08)}70%{opacity:1}to{opacity:0;transform:translate(-50%,-140%)scale(1)}}.banner{background:var(--accent);color:#fff;text-align:center;border-radius:14px;flex-direction:column;align-items:center;gap:4px;width:86%;padding:16px;animation:1.8s forwards banner;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 10px 30px #0000004d}.banner strong{font-size:28px;font-weight:800}.banner span{opacity:.9;font-size:13px;font-weight:600}@keyframes banner{0%{opacity:0;transform:translate(-50%,-50%)scale(.8)}12%{opacity:1;transform:translate(-50%,-50%)scale(1.04)}20%{transform:translate(-50%,-50%)scale(1)}82%{opacity:1}to{opacity:0;transform:translate(-50%,-58%)}}.board-wrap.shake-a{animation:.28s shake-a}.board-wrap.shake-b{animation:.28s shake-b}@keyframes shake-a{20%{transform:translate(-4px,1px)}40%{transform:translate(4px,-1px)}60%{transform:translate(-2px)}80%{transform:translate(2px)}}@keyframes shake-b{20%{transform:translate(4px,1px)}40%{transform:translate(-4px,-1px)}60%{transform:translate(2px)}80%{transform:translate(-2px)}}.combo.on{animation:.3s combo-bump}@keyframes combo-bump{50%{transform:scale(1.12)}}.cell.will-clear .tile{animation:.6s ease-in-out infinite alternate pulse}.tile.clearing{animation:.4s ease-in 80ms both clear}@keyframes pulse{0%{filter:brightness();transform:scale(1)}to{filter:brightness(1.3);transform:scale(.88)}}@keyframes clear{0%{transform:none}35%{filter:brightness(1.15);transform:scale(1.08)rotate(-2deg)}to{opacity:0;transform:perspective(160px)rotateX(78deg)translateY(-18%)scale(.55)}}.feedback{text-align:center;min-height:22px;color:var(--muted);font-size:14px;font-weight:600}.feedback.good{color:var(--good);animation:.25s ease-out pop}.feedback.info{color:var(--accent)}@keyframes pop{0%{opacity:.3;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.hand{grid-template-columns:repeat(3,1fr);align-self:center;gap:8px;width:min(100%,440px,100dvh - 350px);min-width:260px;display:grid}.slot{background:var(--surface);touch-action:none;cursor:grab;border:2px solid #0000;border-radius:12px;place-items:center;display:grid}.slot.selected{border-color:var(--accent)}.slot.no-fit .piece{opacity:.3}.slot.dragging .piece{opacity:.15}.piece{pointer-events:none;position:relative}.piece-cell{padding:1.5px;position:absolute}.piece-cell .tile{border-radius:5px}.drag-ghost{z-index:20;pointer-events:none;opacity:.92;filter:drop-shadow(0 6px 10px #00000040);position:fixed}.drag-ghost .piece-cell{padding:2px}.drag-ghost .piece-cell .tile{border-radius:7px}.actions{grid-template-columns:1fr 1fr;gap:8px;display:grid}.actions button,.modal button{border:1px solid var(--board-bg);background:var(--surface);border-radius:10px;padding:11px;font-weight:600}button:disabled{opacity:.4;cursor:default}.foot{text-align:center;color:var(--muted);font-size:11px}.practice{color:var(--bad)}.overlay{z-index:30;background:#00000073;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--surface);border-radius:16px;flex-direction:column;gap:8px;width:min(100%,360px);padding:20px;display:flex}.modal h2{margin:0;font-size:20px}.modal h3{color:var(--muted);letter-spacing:.02em;margin:8px 0 0;font-size:13px}.modal-head{justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px;display:flex}.modal{max-height:calc(100dvh - 32px);overflow-y:auto}.final-score{text-align:center;font-variant-numeric:tabular-nums;letter-spacing:-.02em;font-size:44px;font-weight:800}.button-row{grid-template-columns:1fr 1fr;gap:8px;display:grid}.modal button.with-sub{flex-direction:column;align-items:center;gap:2px;display:flex}.modal button.with-sub span{color:var(--muted);font-size:12px;font-weight:500}.toggle{border-bottom:1px solid var(--board-bg);justify-content:space-between;align-items:center;padding:8px 2px;font-size:15px;font-weight:600;display:flex}.toggle input{width:20px;height:20px;accent-color:var(--accent)}.rules-box summary{cursor:pointer;padding:8px 2px;font-weight:600}.rules{margin:0 0 8px;padding-left:18px;font-size:14px;line-height:1.55}.danger-box{background:color-mix(in srgb, var(--bad) 10%, var(--surface));border-radius:10px;flex-direction:column;gap:8px;padding:10px;display:flex}.modal button.danger{background:var(--bad);border-color:var(--bad);color:#fff}.small{font-size:12px}.modal p{margin:0;font-size:13px}.record{color:var(--good);font-weight:700}.muted{color:var(--muted)}.summary{flex-direction:column;gap:4px;margin:4px 0 8px;font-size:15px;display:flex}.summary-row{justify-content:space-between;gap:12px;display:flex}.summary dt{color:var(--muted)}.summary dd{text-align:right;font-variant-numeric:tabular-nums;margin:0;font-weight:700}.modal button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.modal button.link{color:var(--muted);background:0 0;border:none;padding:4px;font-size:13px}@media (prefers-reduced-motion:reduce){.cell.will-clear .tile,.feedback.good,.tile.pop,.cell.hint:before,.slot.hint-slot,.combo.on,.board-wrap{animation:none}.score-float,.banner{animation-name:fade-only}@keyframes fade-only{0%,70%{opacity:1}to{opacity:0}}.cell.will-clear .tile{filter:brightness(1.3)}.tile.clearing{animation-duration:60ms}}.home{max-width:460px;height:100dvh;min-height:100%;padding:12px 16px calc(20px + env(safe-area-inset-bottom,0px));flex-direction:column;margin:0 auto;display:flex}.home-top{justify-content:flex-end;display:flex}.home-hero{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:10px;padding-bottom:8vh;display:flex}.logo{grid-template-columns:repeat(4,1fr);gap:2px;width:min(62vw,240px);margin-bottom:14px;display:grid}.logo-cell{aspect-ratio:1;animation:2.4s ease-in-out infinite logo-bob}.logo-cell .tile svg{filter:drop-shadow(0 2px #321e0a4d)}@keyframes logo-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.home-title{letter-spacing:-.03em;margin:0;font-size:clamp(40px,12.5vw,58px);font-weight:700;line-height:1.05}.home-en{font-family:var(--font-display);letter-spacing:.32em;text-transform:uppercase;color:var(--muted);margin:-2px 0 0;font-size:13px}.home-tagline{color:var(--muted);margin:0;font-size:15px}.home-best{background:var(--surface);font-variant-numeric:tabular-nums;border-radius:999px;margin:6px 0 0;padding:4px 12px;font-size:13px;font-weight:700}.home-actions{grid-template-columns:1fr 1.25fr 1fr;align-items:end;gap:10px;display:grid}.home-side,.home-main{text-align:center;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;gap:4px;font-weight:700;display:flex}.home-side{border:1px solid var(--board-bg);background:var(--surface);min-height:104px;padding:12px 6px}.home-side .icon{width:26px;height:26px;color:var(--accent)}.home-side strong{font-size:14px}.home-side span,.home-main span{color:var(--muted);font-variant-numeric:tabular-nums;font-size:11px;font-weight:600}.home-main-wrap{flex-direction:column;align-items:stretch;gap:4px;display:flex}.home-main{background:var(--accent);color:#fff;min-height:128px;box-shadow:0 8px 0 color-mix(in srgb, var(--accent) 60%, #000), 0 14px 24px #0000002e;border:none;padding:14px 8px;transition:transform 80ms,box-shadow 80ms;transform:translateY(-8px)}.home-main:active{box-shadow:0 2px 0 color-mix(in srgb, var(--accent) 60%, #000), 0 6px 12px #0000002e;transform:translateY(-2px)}.home-main .icon{fill:currentColor;width:34px;height:34px}.home-main strong{font-size:18px}.home-main span{color:#ffffffd9}.link.home-new{color:var(--muted);background:0 0;border:none;margin-top:-4px;padding:4px;font-size:12px;font-weight:600}.home-side:focus-visible,.home-main:focus-visible,.icon-btn:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 50%, transparent);outline-offset:2px}.tabs{background:var(--board-bg);border-radius:10px;grid-auto-columns:1fr;grid-auto-flow:column;padding:3px;display:grid}.modal .tabs button{white-space:nowrap;color:var(--muted);background:0 0;border:none;border-radius:8px;padding:8px 2px;font-size:13px}.modal .tabs button.on{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #0000001f}.ranking{flex-direction:column;gap:2px;margin:4px 0;padding:0;list-style:none;display:flex}.ranking li{border-bottom:1px solid var(--board-bg);font-variant-numeric:tabular-nums;grid-template-columns:28px 1fr auto auto;align-items:baseline;gap:10px;padding:8px 6px;display:grid}.ranking .rank{color:var(--muted);text-align:center;font-weight:800}.ranking .top1 .rank{color:var(--c2)}.ranking .top2 .rank{color:var(--muted)}.ranking .top3 .rank{color:var(--c0)}.ranking .score{font-size:17px;font-weight:800}.ranking .detail,.ranking .date{color:var(--muted);font-size:12px}.ranking.daily li{grid-template-columns:1fr auto}.ranking .today .date-label{color:var(--accent);font-weight:800}.empty{text-align:center;color:var(--muted);margin:12px 0;font-size:14px}.brand .icon-btn{width:34px;height:34px}@media (prefers-reduced-motion:reduce){.logo-cell{animation:none}}.ranking-caption{color:var(--muted);margin:2px 0 0;font-size:12px;font-weight:700}