@import url('/assets/fonts/fonts.css');

:root{color-scheme:dark;--bg:#111510;--panel:#1a1f18;--line:#30362c;--muted:#8e9886;--text:#f1f3e9;--lime:#c4f56a;--board-size:min(35.4vh,342px);font-family:'Pretendard','Segoe UI',sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);min-width:320px}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.4}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--lime);outline-offset:5px}button{border:0}a{color:inherit;text-decoration:none}button[hidden],[hidden]{display:none!important}svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 48% 22%,#7484450e,transparent 60%);z-index:-1}.shell{width:min(1200px,calc(100% - 96px));margin:auto}.site-header{height:112px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{display:flex;gap:10px;align-items:center;font-weight:800;font-size:23px;letter-spacing:-1px}.brand-mark{display:grid;grid-template-columns:6px 6px;gap:2px;transform:rotate(-8deg);margin-right:2px}.brand-mark i{height:6px;background:var(--lime);border-radius:1px}.brand-mark i:first-child{background:#e9efdc}.brand-divider{height:17px;width:1px;background:#42493c;margin:0 7px}.arcade{font-size:10px;letter-spacing:2.5px;font-weight:500;color:var(--muted)}.header-actions{display:flex;align-items:center;gap:23px}.icon-button{display:flex;align-items:center;gap:8px;background:none;font-size:11px;color:#b6bead;padding:8px 0}.icon-button:hover{color:var(--lime)}.help-icon{border:1.5px solid currentColor;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:12px}.gear{border-left:1px solid var(--line);padding-left:23px}.game-layout{display:grid;grid-template-columns:minmax(235px,1fr) var(--board-size) minmax(150px,205px);gap:48px;align-items:start;padding:36px 0 28px}.intro{padding-top:10px;max-width:310px}.eyebrow{font-size:9px;letter-spacing:1.65px;font-weight:600;display:flex;align-items:center;gap:8px;color:#a5b195}.status-dot{width:5px;height:5px;border-radius:50%;background:var(--lime);display:inline-block;box-shadow:0 0 10px #c4f54c33;flex-shrink:0}h1{font-family:'Outfit',sans-serif;font-size:clamp(58px,6.1vw,83px);font-weight:800;line-height:1;margin:15px 0 22px;letter-spacing:-5px}.title-period{color:var(--lime)}.intro h2{font-size:29px;letter-spacing:-1.3px;line-height:1.45;font-weight:600;margin:0 0 13px}.intro-copy{font-size:12px;line-height:1.9;color:#939d88;margin:0}.art-frame{position:relative;margin:8px 0 20px;height:183px;overflow:hidden}.block-art{width:238px;height:238px;object-fit:contain;display:block;position:absolute;top:-26px;left:8px;mix-blend-mode:lighten;animation:levitate 7s ease-in-out infinite;filter:saturate(.87)}.art-caption{position:absolute;bottom:0;left:0;font-size:7px;color:#65735a;letter-spacing:1.5px}.section-label{font-size:9px;letter-spacing:1.7px;color:#95a287;font-weight:600;display:flex;align-items:center;justify-content:space-between}.mode-section{max-width:278px}.mode-tabs{display:flex;gap:5px;margin:12px 0 9px;background:#0d110d;border:1px solid var(--line);border-radius:7px;padding:4px}.mode-tabs button{background:transparent;border-radius:4px;font-size:11px;white-space:nowrap;padding:10px 9px;flex:1;display:flex;align-items:center;justify-content:space-between;color:#8f9b84;gap:8px;transition:background .2s,color .2s}.mode-tabs button.selected{background:#303d24;color:var(--lime);box-shadow:inset 0 0 0 1px #c4f56a18}.mode-tabs span{font-family:monospace;font-size:14px}.mode-section p{font-size:10px;color:#7e8a73;margin:0}.personal-best{max-width:278px;border-top:1px solid var(--line);display:flex;gap:12px;align-items:center;margin-top:21px;padding-top:18px}.personal-best svg{color:#a9b992;width:23px;height:23px}.personal-best div{display:flex;flex-direction:column;gap:5px}.personal-best div span{font-size:10px;color:#849079}.personal-best strong{font-family:'Outfit',sans-serif;font-size:23px;font-weight:500;letter-spacing:1px}.best-unit{font-size:9px;color:#8d997f;margin-left:auto;align-self:flex-end;padding-bottom:4px;letter-spacing:1px}.board-topline{height:27px;display:flex;justify-content:space-between;font-family:'Outfit',sans-serif;font-size:9px;letter-spacing:1.4px;color:#9aa98b}.board-topline>span:first-child{display:flex;align-items:center;gap:7px;align-self:flex-start}.board-topline>span:last-child{font-size:8px;color:#747f69;padding-top:1px}.board-frame{position:relative;width:100%;aspect-ratio:1/2;border:1px solid #536047;border-radius:9px;background:#0a100c;box-shadow:0 0 0 5px #1a2117,0 0 0 6px #303b26,0 15px 55px #0004;isolation:isolate;overflow:hidden}.board-frame>canvas{display:block;width:100%;height:100%}.board-edge{position:absolute;inset:0;pointer-events:none;border-radius:8px;box-shadow:inset 0 1px 0 #ddff9c33,inset 1px 0 0 #c4f56a10}.board-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#111910db,#121b12e8 55%,#111810b0);backdrop-filter:blur(3px);z-index:2;transition:opacity .2s}.overlay-content{text-align:center;padding:24px;width:100%}.overlay-symbol{display:grid;grid-template-columns:13px 13px 13px;grid-template-rows:13px 13px;gap:3px;width:45px;height:29px;margin:0 auto 22px;filter:drop-shadow(0 0 15px #c4f54422)}.overlay-symbol i{background:var(--lime);border-radius:2px;box-shadow:inset 0 2px 0 #f1ffd399}.overlay-symbol i:last-child{grid-column:2}.overlay-kicker{font-family:'Outfit',sans-serif;font-size:8px;letter-spacing:2.6px;color:#a7b99a}.overlay-content h2{font-family:'Outfit',sans-serif;font-size:44px;line-height:1.04;letter-spacing:-1.5px;font-weight:800;margin:17px 0 18px}.overlay-content p{font-size:11px;color:#a1af94;line-height:1.8;margin:0 0 27px;white-space:pre-line}.primary-button{display:flex;align-items:center;justify-content:space-between;border-radius:5px;background:var(--lime);color:#203112;font-size:12px;font-weight:700;padding:16px 18px;width:100%;transition:background .2s,transform .15s}.primary-button:hover{background:#d2ff85;transform:translateY(-2px)}.primary-button:active{transform:translateY(0)}.primary-button span{font-size:17px;font-weight:400}.overlay-content .primary-button{max-width:218px;margin:auto}.secondary-button{display:block;background:transparent;border:1px solid #657655;color:#c4d4b4;font-size:11px;padding:12px;width:100%;max-width:218px;margin:10px auto 0;border-radius:5px}.start-hint{display:block;font-size:8px;color:#6b7c61;margin:14px 0 0;letter-spacing:.3px}.board-bottomline{display:flex;align-items:center;justify-content:space-between;margin-top:16px;font-size:9px;color:#87957b;gap:8px}.board-bottomline>span{display:flex;align-items:center;gap:6px}kbd{font:9px 'Outfit',monospace;background:#20291c;color:#b0bc9f;padding:3px 5px;border:1px solid #394330;border-radius:3px;white-space:nowrap}.board-bottomline button{background:none;display:flex;align-items:center;gap:6px;font-size:9px;padding:0;color:#b8c4a9}.dashboard{padding-top:27px}.score-card{border:1px solid var(--line);border-radius:7px;padding:20px;background:linear-gradient(135deg,#222c1b44,transparent)}.small-cross{color:#627353;font-size:13px}.score-card strong{display:block;color:var(--lime);font-family:'Outfit',monospace;font-size:37px;font-weight:500;letter-spacing:1px;line-height:1.1;margin:15px 0 8px;font-variant-numeric:tabular-nums}.score-caption{font-size:10px;color:#70835e}.metrics{display:flex;justify-content:space-between;margin:25px 3px 13px}.metrics>div{width:50%}.metrics>div+div{border-left:1px solid var(--line);padding-left:24px}.metrics strong{font-family:'Outfit',sans-serif;display:block;font-size:28px;font-weight:400;margin-top:8px}.level-track{height:3px;background:#283222;border-radius:3px;overflow:hidden}.level-track>div{width:0;height:100%;background:var(--lime);transition:width .35s}.level-caption{font-size:8px;color:#758567;margin-top:8px;text-align:right}.piece-card{border:1px solid var(--line);border-radius:6px;padding:15px 18px;background:#18201666}.next-card{margin-top:24px}.section-label>span:not(.small-cross){font-size:8px;letter-spacing:0;color:#65775a;font-weight:400}.piece-card canvas{width:100%;display:block}.next-card canvas{height:160px}.hold-card{display:block;width:100%;text-align:initial;margin-top:13px;padding:12px 18px 9px;transition:border-color .2s,opacity .2s}.hold-card:hover{border-color:#748e52}.hold-card canvas{height:55px}.hold-caption{font-size:8px;display:block;text-align:center;color:#718361}.time-card{display:flex;justify-content:space-between;align-items:center;padding:18px 3px}.time-card>span:last-child{font-family:'Outfit',monospace;font-size:12px;letter-spacing:1px;color:#a9b999}.footer{border-top:1px solid var(--line);min-height:67px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:9px;color:#738267}.footer b{font-weight:400;color:#9fac92;margin-left:7px}.keyboard-guide{display:flex;gap:13px}.keyboard-guide>span{display:flex;align-items:center;gap:4px}.footer-note{font-family:'Outfit',sans-serif;font-size:8px;letter-spacing:1.4px}.touch-controls{display:none}.event-toast{position:absolute;top:38%;left:0;right:0;text-align:center;pointer-events:none;font-family:'Outfit',sans-serif;font-size:28px;font-weight:800;color:#efffd3;text-shadow:0 0 20px #93ff4780;opacity:0;z-index:3;letter-spacing:1px}.event-toast.show{animation:toast 1s ease-out forwards}.score-card.pulse strong{animation:scorepop .25s ease-out}.board-frame.shake{animation:impact .18s ease-out}.modal{max-width:420px;width:calc(100% - 32px);border:1px solid #536343;border-radius:12px;padding:32px;color:var(--text);background:#1a2217;box-shadow:0 20px 90px #0007}.modal::backdrop{background:#070d09c9;backdrop-filter:blur(8px)}.dialog-close{position:absolute;right:16px;top:12px;background:none;color:#95a488;font-size:25px}.modal h2{font-size:25px;line-height:1.4;letter-spacing:-.7px;font-weight:600;margin:18px 0}.modal p{font-size:12px;line-height:1.85;color:#a6b19b}.help-grid{display:grid;grid-template-columns:1fr auto;align-items:center;gap:15px;font-size:11px;margin:22px 0}.help-grid>kbd{justify-self:end}.help-note{font-size:10px!important;color:#829474!important;margin:20px 0!important}.setting-row{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:20px 0}.setting-row strong{font-size:12px;font-weight:500;display:block}.setting-row small{font-size:10px;color:#91a082;display:block;margin-top:7px}.setting-row input{width:17px;height:17px;accent-color:var(--lime);cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes levitate{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-7px) rotate(1deg)}}@keyframes impact{0%{transform:translateY(0)}35%{transform:translateY(4px)}75%{transform:translateY(-1px)}100%{transform:translateY(0)}}@keyframes toast{0%{opacity:0;transform:translateY(12px) scale(.9)}18%,65%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-20px) scale(1.03)}}@keyframes scorepop{0%{transform:scale(1)}40%{transform:scale(1.07);color:#f0ffc9}100%{transform:scale(1)}}
@media(min-height:1000px) and (min-width:1000px){.game-layout{padding-top:48px;padding-bottom:40px}.intro{padding-top:15px}.art-frame{height:210px}.block-art{width:260px;height:260px}.intro h2{font-size:33px}}
@media(max-width:1100px){.shell{width:calc(100% - 64px)}.game-layout{gap:30px;grid-template-columns:minmax(210px,1fr) var(--board-size) 175px}.score-card{padding:15px}.score-card strong{font-size:31px}.header-actions{gap:17px}.keyboard-guide{gap:8px}.footer-note{display:none}.intro h2{font-size:27px}}
@media(max-width:900px){:root{--board-size:min(37vh,300px)}.shell{width:calc(100% - 40px)}.game-layout{grid-template-columns:1fr var(--board-size) 148px;gap:22px}.site-header{height:84px}.intro h1{font-size:55px;letter-spacing:-3px}.intro h2{font-size:24px}.intro-copy{font-size:10px}.intro .eyebrow{font-size:7px;letter-spacing:1px}.block-art{width:190px;height:190px;left:0;top:-12px}.art-frame{height:164px}.mode-tabs{flex-direction:column;gap:3px}.mode-tabs button{padding:8px}.mode-section p{line-height:1.6}.score-card strong{font-size:26px}.score-card{padding:13px}.piece-card{padding:12px}.next-card canvas{height:140px}.metrics>div+div{padding-left:14px}.section-label{font-size:8px;letter-spacing:1.4px}.footer{font-size:8px}.keyboard-guide{display:none}.personal-best{margin-top:16px;padding-top:14px}.overlay-content h2{font-size:38px}}
@media(max-width:740px){:root{--board-size:min(56vw,calc((100svh - 222px)/2),300px)}.shell{width:calc(100% - 32px);max-width:460px}.site-header{height:64px}.brand{font-size:19px}.arcade{font-size:8px;letter-spacing:1.7px}.brand-divider{margin:0 1px}.header-actions{gap:16px}.icon-button>span:not(.help-icon){display:none}.gear{padding-left:0;border:0}.icon-button svg{width:19px;height:19px}.game-layout{display:grid;grid-template-columns:var(--board-size) minmax(85px,1fr);gap:15px;padding:43px 4px 14px;justify-content:center;position:relative}.intro{display:contents}.intro>*{display:none}.intro .mode-section{display:block;position:absolute;top:10px;left:0;right:0;max-width:none}.mode-section .section-label,.mode-section p{display:none}.mode-tabs{flex-direction:row;border:0;background:none;padding:0;gap:18px;margin:0;justify-content:center}.mode-tabs button{flex:0;padding:5px 12px;font-size:9px;gap:12px}.mode-tabs span{font-size:12px}.play-area{grid-column:1}.board-topline{height:22px;font-size:7px;letter-spacing:1px}.board-topline>span:last-child{font-size:6px}.board-frame{border-radius:5px;box-shadow:0 0 0 3px #1a2117,0 0 0 4px #303b26,0 10px 30px #0003}.dashboard{padding-top:22px;grid-column:2}.score-card{padding:10px 9px;border-radius:5px}.score-card strong{font-size:clamp(19px,5vw,28px);letter-spacing:0;margin:12px 0 0}.score-caption,.small-cross{display:none}.section-label{font-size:7px;letter-spacing:1px}.metrics{margin:14px 0 10px}.metrics strong{font-size:21px;margin-top:6px}.metrics>div+div{padding-left:11px}.level-caption{font-size:6px;margin-top:6px;white-space:nowrap}.next-card{margin-top:15px}.piece-card{padding:9px}.section-label>span:not(.small-cross){display:none}.next-card canvas{height:clamp(92px,18svh,132px)}.hold-card{margin-top:10px;padding-bottom:6px}.hold-card canvas{height:42px}.hold-caption{font-size:6px}.time-card{padding:12px 0}.time-card>span:last-child{font-size:10px}.time-card .section-label{font-size:6px}.board-bottomline{font-size:7px;margin-top:11px}.board-bottomline>span{font-size:0;gap:0}.board-bottomline>span kbd{display:none}.board-bottomline>span:after{content:'↓ 빈틈없이, 차곡차곡.';font-size:7px}.board-bottomline kbd{display:none}.board-bottomline button{font-size:8px}.overlay-content{padding:15px}.overlay-content h2{font-size:clamp(29px,8vw,43px);margin:14px 0}.overlay-symbol{margin-bottom:18px}.overlay-content p{font-size:10px;margin-bottom:20px}.overlay-kicker{font-size:7px;letter-spacing:2px}.primary-button{font-size:11px;padding:13px}.start-hint{display:none}.touch-controls{display:grid;grid-template-columns:.8fr 1fr 1fr 1fr .8fr 1fr;gap:6px;margin:0 0 14px;touch-action:none;user-select:none}.touch-controls button{border:1px solid #3b4c2e;background:#212d1b;height:49px;border-radius:7px;color:#c7d8b7;font-size:23px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;touch-action:none;user-select:none}.touch-controls button:active,.touch-controls button.pressed{background:#3b532a;transform:translateY(1px)}.touch-controls button small{font-size:7px;line-height:1}.touch-controls .drop-button{background:var(--lime);color:#1e3210;border-color:#c4f56a}.footer{min-height:40px;font-size:8px;justify-content:center;padding-bottom:env(safe-area-inset-bottom)}.footer b{font-size:8px}.event-toast{font-size:22px}}
@media(max-width:370px){.shell{width:calc(100% - 22px)}.header-actions{gap:12px}.game-layout{gap:12px}.brand{gap:7px}.arcade{letter-spacing:1px}.next-card canvas{height:100px}.hold-caption{display:none}.time-card .section-label{display:none}}
.game-layout{grid-template-columns:minmax(210px,280px) var(--board-size) minmax(150px,190px);justify-content:center;gap:56px}
@media(min-width:741px){:root{--board-size:min(calc((100svh - 258px)/2),342px)}.site-header{height:96px}.game-layout{padding-top:28px;padding-bottom:22px}.footer{min-height:52px}}
@media(min-width:741px) and (max-height:850px){:root{--board-size:max(226px,min(calc((100svh - 220px)/2),300px))}.site-header{height:76px}.game-layout{padding-top:24px;padding-bottom:20px;gap:44px}.intro{padding-top:5px}.intro h1{font-size:65px;margin:12px 0 16px}.intro h2{font-size:24px;line-height:1.3;margin-bottom:10px}.intro-copy{font-size:10px}.art-frame{height:138px;margin:4px 0 15px}.block-art{width:193px;height:193px;top:-27px;left:12px}.mode-tabs{margin-top:9px}.mode-tabs button{padding:8px}.personal-best{padding-top:12px;margin-top:15px}.personal-best strong{font-size:20px}.score-card{padding:14px}.score-card strong{font-size:30px;margin:12px 0 5px}.metrics{margin-top:17px;margin-bottom:10px}.metrics strong{font-size:24px;margin-top:6px}.next-card{margin-top:16px}.next-card canvas{height:116px}.hold-card{margin-top:10px;padding-top:9px;padding-bottom:7px}.hold-card canvas{height:42px}.time-card{padding:14px 3px}.footer{min-height:42px}.piece-card{padding-left:14px;padding-right:14px}.overlay-content h2{font-size:38px}.overlay-symbol{margin-bottom:17px}.overlay-content p{margin-bottom:20px}.overlay-content{padding:20px}.primary-button{padding:13px 16px}}
@media(min-width:741px) and (max-width:1000px){.game-layout{gap:28px;grid-template-columns:minmax(185px,240px) var(--board-size) 155px}.intro h1{font-size:58px}}
@media(max-width:740px){.game-layout{grid-template-columns:var(--board-size) minmax(85px,1fr);gap:15px}}
@media(min-width:371px) and (max-width:740px){:root{--board-size:min(61vw,calc((100svh - 222px)/2),300px)}}
.effects-off .block-art{animation:none}
@media(max-width:950px) and (max-height:520px){:root{--board-size:calc((100svh - 104px)/2)}.shell{max-width:none;width:calc(100% - 32px)}.site-header{height:47px}.brand{font-size:18px}.header-actions span:not(.help-icon){display:none}.game-layout{grid-template-columns:var(--board-size) 130px;justify-content:center;gap:17px;padding:9px 0 0}.intro{display:contents}.intro>*{display:none}.intro .mode-section{display:block;position:absolute;top:50px;left:0;width:135px}.mode-section .section-label,.mode-section p{display:none}.mode-tabs{flex-direction:column;margin:0;border:0;background:none;gap:8px}.mode-tabs button{padding:10px;font-size:9px}.play-area{grid-column:1}.board-topline{height:20px;font-size:6px;letter-spacing:.8px}.board-topline>span:last-child{font-size:6px}.dashboard{grid-column:2;padding-top:20px}.score-card{padding:8px 10px}.score-card strong{font-size:22px;margin:6px 0 0}.score-caption{display:none}.section-label{font-size:7px}.metrics{margin:10px 0 5px}.metrics strong{font-size:18px;margin:3px 0}.level-caption{font-size:6px;margin-top:3px}.next-card{margin-top:8px;padding:7px 10px}.next-card canvas{height:61px}.section-label>span:not(.small-cross){display:none}.hold-card{margin-top:6px;padding:5px 10px}.hold-card canvas{height:27px}.hold-caption{display:none}.time-card{padding:7px 0}.time-card>span:last-child{font-size:9px}.overlay-content{padding:12px}.overlay-symbol{display:none}.overlay-kicker{font-size:6px}.overlay-content h2{font-size:28px;margin:9px 0}.overlay-content p{font-size:8px;margin-bottom:12px}.primary-button{padding:10px;font-size:9px}.start-hint{display:none}.secondary-button{padding:8px;font-size:9px}.board-bottomline{margin-top:8px}.board-bottomline>span{display:none}.board-bottomline button{font-size:7px;margin-left:auto}.touch-controls{position:absolute;right:16px;top:113px;width:132px;display:grid;grid-template-columns:1fr 1fr;gap:7px;touch-action:none}.touch-controls button{height:49px;background:#28361f;border:1px solid #405331;border-radius:6px;font-size:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;touch-action:none}.touch-controls small{font-size:7px}.touch-controls .drop-button{color:#203112;background:var(--lime)}.footer{display:none}.event-toast{font-size:17px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.event-toast.show{opacity:1}.block-art{transform:none}}