.badge{display:inline-block;background:var(--accent-light);color:var(--accent);padding:.35rem .85rem;border-radius:99px;font-size:.85rem;font-weight:700;margin-bottom:.8rem;border:1px solid rgba(226,133,110,.2)}.puzzle-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:520px;height:100dvh;overflow:hidden;margin:0 auto;padding-top:60px;font-family:Pretendard Variable,sans-serif;padding-bottom:90px}.header-area{text-align:center;margin-bottom:max(1rem,3vh);margin-top:max(.5rem,2vh)}.header-area h1{font-size:clamp(1.4rem,3.5vh,1.85rem);font-weight:800;margin-bottom:max(.2rem,1vh);color:var(--text);letter-spacing:-.5px}.header-area .subtitle{font-size:.95rem;color:var(--text-secondary);line-height:1.4;word-break:keep-all}.grid-board{display:grid;grid-template-columns:repeat(4,1fr);gap:max(6px,1.2vh);width:100%;padding:0 1rem;max-width:min(440px,50vh,100vw);margin:0 auto max(1.5rem,3vh) auto}@media(max-width:480px){.grid-board{gap:max(4px,1vh)}}.tile{aspect-ratio:1.1 / 1;background-color:var(--bg-card);border:2px solid var(--border-subtle);box-shadow:0 4px 14px var(--shadow-color);border-radius:14px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:700;font-size:clamp(.85rem,2.8vw,1.05rem);color:var(--text);cursor:pointer;user-select:none;transition:all .2s cubic-bezier(.175,.885,.32,1.275);word-break:keep-all;padding:8px;position:relative;overflow:hidden}.tile:hover{transform:translateY(-2px);box-shadow:0 6px 18px var(--shadow-color)}.tile:active{transform:scale(.95)}.tile.selected{background-color:var(--accent);color:#fff;border-color:var(--accent);transform:scale(.95);box-shadow:0 0 16px #e2856e66}.action-footer{display:flex;flex-direction:column;align-items:center;gap:max(.8rem,1.5vh);width:100%}.mistakes-area{display:flex;align-items:center;gap:12px;font-size:1rem;font-weight:700;color:var(--text);background:var(--bg-card);padding:.8rem 1.8rem;border-radius:99px;box-shadow:0 4px 16px var(--shadow-color);border:1px solid var(--border-subtle)}.lives-dots{display:flex;gap:8px}.dot{width:14px;height:14px;border-radius:50%;background-color:var(--accent);transition:all .3s cubic-bezier(.4,0,.2,1)}.dot.lost{background-color:transparent!important;border:2px solid var(--border-subtle);transform:scale(.8)}.controls-area{display:flex;gap:12px}.btn-glass{font-family:inherit;font-weight:600;font-size:.95rem;background:var(--bg-card);border:1px solid var(--border-subtle);color:var(--text-secondary);padding:.7rem 1.5rem;border-radius:99px;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px var(--shadow-color)}.btn-glass:hover{background:var(--bg-main);color:var(--text);border-color:var(--text-secondary);transform:translateY(-1px)}.submit-wrapper{position:fixed;bottom:2.5rem;left:50%;transform:translate(-50%) translateY(200%);transition:transform .6s cubic-bezier(.175,.885,.32,1.275);z-index:100}.submit-wrapper.show{transform:translate(-50%) translateY(0)}.btn-submit{font-family:inherit;font-size:1.15rem;font-weight:800;background:var(--text);color:var(--bg-main);border:1px solid var(--text);padding:1.1rem 3.5rem;border-radius:99px;cursor:pointer;box-shadow:0 12px 30px #3a35324d;transition:transform .2s,box-shadow .2s,background .2s}.btn-submit:hover{transform:scale(1.05);box-shadow:0 16px 36px #3a353266;background:#252220}.btn-submit:active{transform:scale(.95)}.completed-board{display:flex;flex-direction:column;width:100%;max-width:440px;margin:0 auto 1.5rem;gap:12px}.solved-row{border-radius:14px;padding:1.4rem;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;animation:popIn .4s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 4px 16px #0000000a}.solved-title{font-weight:800;font-size:1.2rem;margin-bottom:.5rem;letter-spacing:-.3px}.solved-items{font-size:.95rem;font-weight:600;opacity:.85}.color-yellow{background-color:#fcdf7c;color:#5b4a10}.color-green{background-color:#a4d976;color:#2e4e10}.color-blue{background-color:#aacdff;color:#1e3a8a}.color-purple{background-color:#d4b2d8;color:#4a154b}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-8px) rotate(-1deg)}40%,80%{transform:translate(8px) rotate(1deg)}}.shake{animation:shake .45s}@keyframes popIn{0%{transform:scale(.85) translateY(15px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.animate-pop-in{animation:popIn .5s cubic-bezier(.175,.885,.32,1.275)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .6s ease-out}.toast{position:fixed;top:24px;left:50%;transform:translate(-50%) translateY(-20px);background:var(--text);color:var(--bg-main);padding:14px 28px;border-radius:99px;font-size:1.05rem;font-weight:700;opacity:0;pointer-events:none;transition:all .3s cubic-bezier(.175,.885,.32,1.275);z-index:2000;box-shadow:0 8px 24px #0003}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.modal{display:none;position:fixed;inset:0;background:#fdfbf7d9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1000;align-items:center;justify-content:center}.modal-content{background:var(--bg-card);padding:2.5rem 2rem;border-radius:28px;text-align:center;width:90%;max-width:380px;border:1px solid var(--border-subtle);box-shadow:0 24px 48px var(--shadow-color)}.modal-icon{font-size:4rem;margin-bottom:1rem;animation:popIn .5s ease}.modal-content h2{font-size:2rem;font-weight:800;margin-bottom:.5rem;color:var(--text)}.result-subtitle{color:var(--text-secondary);margin-bottom:2rem;font-size:1.1rem;font-weight:600}.modal-actions{display:flex;flex-direction:column;gap:12px}.btn-solid-large{font-family:inherit;font-size:1.1rem;font-weight:700;background:var(--accent);color:#fff;border:none;padding:1.1rem;border-radius:14px;cursor:pointer;width:100%;transition:all .2s;box-shadow:0 4px 14px #e2856e4d}.btn-solid-large:hover{transform:translateY(-2px);box-shadow:0 6px 20px #e2856e66}.btn-glass-large{font-family:inherit;font-size:1.05rem;font-weight:600;background:transparent;color:var(--text-secondary);border:2px solid var(--border-subtle);padding:1rem;border-radius:14px;cursor:pointer;width:100%;transition:all .2s}.btn-glass-large:hover{background:var(--bg-main);color:var(--text);border-color:var(--text-secondary)}
