:root{--bg-color: #f9f9f7;--text-primary: #1a1a1a;--text-secondary: #6b6b6b;--card-bg: #efefe6;--card-hover-bg: #e2e2d8;--card-selected-bg: #3d3c32;--card-selected-color: #ffffff;--level-1: #f9df6d;--level-2: #a0c35a;--level-3: #b0c4ef;--level-4: #ba81c5;--border-color: #e0e0d8;--radius: 8px;--modal-bg: #ffffff}[data-theme=dark]{--bg-color: #121212;--text-primary: #e8e8e0;--text-secondary: #9a9a8a;--card-bg: #2a2a24;--card-hover-bg: #35352e;--card-selected-bg: #d4d0b8;--card-selected-color: #121212;--level-1: #b8a230;--level-2: #5e8a2a;--level-3: #5878b8;--level-4: #8040a0;--border-color: #3a3a32;--modal-bg: #1e1e18}[data-holiday=valentine]{--bg-color: #fff5f7;--card-bg: #ffe4ea;--card-hover-bg: #ffd0da;--card-selected-bg: #c41e3a;--card-selected-color: #ffffff;--level-1: #ffb7c5;--level-2: #ff6b8b;--level-3: #c41e3a;--level-4: #8b0000;--border-color: #ffb7c5;--modal-bg: #fff5f7}[data-theme=dark][data-holiday=valentine]{--bg-color: #1a0a0d;--card-bg: #2a0d12;--card-hover-bg: #3a1218;--card-selected-bg: #ff6b8b;--card-selected-color: #1a0a0d;--level-1: #8b0000;--level-2: #c41e3a;--level-3: #ff6b8b;--level-4: #ffb7c5;--border-color: #5a1a25;--modal-bg: #1a0a0d}[data-holiday=newyear]{--bg-color: #0d0d2b;--text-primary: #f0f0ff;--text-secondary: #9090c0;--card-bg: #1a1a40;--card-hover-bg: #242460;--card-selected-bg: #f5c518;--card-selected-color: #0d0d2b;--level-1: #c0a020;--level-2: #e8c840;--level-3: #f5c518;--level-4: #fff0a0;--border-color: #2a2a5a;--modal-bg: #0d0d2b}[data-theme=dark][data-holiday=newyear]{--bg-color: #060618;--card-bg: #111130;--card-hover-bg: #1a1a48;--card-selected-bg: #f5c518;--card-selected-color: #060618;--level-1: #8a7010;--level-2: #c0a020;--level-3: #f5c518;--level-4: #fff0a0;--border-color: #1a1a40;--modal-bg: #060618}[data-holiday=patrick]{--bg-color: #f0fff4;--card-bg: #d4f5e2;--card-hover-bg: #c0ecd2;--card-selected-bg: #1a6e38;--card-selected-color: #ffffff;--level-1: #a8e6bc;--level-2: #4caf70;--level-3: #1a6e38;--level-4: #0d3d1e;--border-color: #a8e6bc;--modal-bg: #f0fff4}[data-theme=dark][data-holiday=patrick]{--bg-color: #071410;--card-bg: #0d2018;--card-hover-bg: #142e22;--card-selected-bg: #4caf70;--card-selected-color: #071410;--level-1: #0d3d1e;--level-2: #1a6e38;--level-3: #4caf70;--level-4: #a8e6bc;--border-color: #0d2018;--modal-bg: #071410}[data-holiday=easter]{--bg-color: #fffdf5;--card-bg: #fef4d6;--card-hover-bg: #fce8b0;--card-selected-bg: #8a4fa0;--card-selected-color: #ffffff;--level-1: #b0e0a8;--level-2: #f4d06e;--level-3: #f4a8d0;--level-4: #a8c8f4;--border-color: #f4d06e;--modal-bg: #fffdf5}[data-theme=dark][data-holiday=easter]{--bg-color: #1a1510;--card-bg: #2a2018;--card-hover-bg: #352a20;--card-selected-bg: #c080d8;--card-selected-color: #1a1510;--level-1: #386030;--level-2: #886020;--level-3: #884060;--level-4: #304880;--border-color: #3a2e20;--modal-bg: #1a1510}[data-holiday=halloween]{--bg-color: #0d0800;--text-primary: #ff8c00;--text-secondary: #c06000;--card-bg: #1e1000;--card-hover-bg: #2e1800;--card-selected-bg: #ff6a00;--card-selected-color: #0d0800;--level-1: #4a2080;--level-2: #c04000;--level-3: #ff6a00;--level-4: #ffaa00;--border-color: #3a2000;--modal-bg: #0d0800}[data-theme=dark][data-holiday=halloween]{--bg-color: #080500;--card-bg: #140c00;--card-hover-bg: #1e1200;--card-selected-bg: #ff6a00;--card-selected-color: #080500;--level-1: #380e60;--level-2: #a03800;--level-3: #ff6a00;--level-4: #ffaa00;--border-color: #281800;--modal-bg: #080500}[data-holiday=christmas]{--bg-color: #f5fff8;--card-bg: #e0f5e8;--card-hover-bg: #c8edda;--card-selected-bg: #b80000;--card-selected-color: #ffffff;--level-1: #a8d8b0;--level-2: #e83030;--level-3: #b80000;--level-4: #c0a030;--border-color: #a8d8b0;--modal-bg: #f5fff8}[data-theme=dark][data-holiday=christmas]{--bg-color: #091410;--card-bg: #102018;--card-hover-bg: #182e22;--card-selected-bg: #e83030;--card-selected-color: #091410;--level-1: #1a5028;--level-2: #8b0000;--level-3: #e83030;--level-4: #c0a030;--border-color: #142a1c;--modal-bg: #091410}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:var(--bg-color);color:var(--text-primary);display:flex;justify-content:center;min-height:100dvh;overflow-x:hidden}.app{width:100%;max-width:620px;padding:1rem;display:flex;flex-direction:column;gap:0;overflow-x:hidden}.header{border-bottom:1px solid var(--border-color);padding-bottom:.75rem;margin-bottom:1.25rem}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.title{margin:0;font-size:clamp(1.5rem,5vw,2rem);font-weight:800;letter-spacing:-.5px}.subtitle{color:var(--text-secondary);margin-top:.2rem;font-size:clamp(.8rem,3vw,.95rem)}.puzzle-date{font-size:.78rem;color:var(--text-secondary);margin-top:.4rem;text-align:right}.archive-btn{flex-shrink:0;padding:.4rem .75rem;border:1px solid var(--border-color);border-radius:2rem;background:var(--modal-bg);color:var(--text-primary);font-size:.82rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s}.archive-btn:hover{background:var(--card-bg);border-color:#bbb}.message-toast{background:var(--text-primary);color:#fff;padding:.65rem 1.2rem;border-radius:2rem;position:fixed;top:4rem;left:50%;transform:translate(-50%);z-index:200;font-weight:600;font-size:.9rem;white-space:nowrap;animation:fadein .2s;box-shadow:0 4px 16px #0000002e}@keyframes fadein{0%{opacity:0;top:3.5rem}to{opacity:1;top:4rem}}.main-content{flex:1}.game-board{margin-bottom:1.5rem}.solved-categories{display:flex;flex-direction:column;gap:.4rem;margin-bottom:.4rem}.solved-row{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.85rem 1rem;border-radius:var(--radius);font-weight:700;animation:pop-in .3s cubic-bezier(.34,1.56,.64,1)}@keyframes pop-in{0%{transform:scale(.95);opacity:.5}to{transform:scale(1);opacity:1}}.solved-row .cat-title{font-size:.95rem;margin-bottom:.2rem;text-transform:uppercase;letter-spacing:.04em}.solved-row .cat-words{font-size:.82rem;font-weight:500;opacity:.85}.solved-row.level-1{background-color:var(--level-1)}.solved-row.level-2{background-color:var(--level-2)}.solved-row.level-3{background-color:var(--level-3)}.solved-row.level-4{background-color:var(--level-4)}.word-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem;margin-bottom:1.5rem}.word-card{aspect-ratio:4 / 3;border:none;background-color:var(--card-bg);color:var(--text-primary);font-weight:700;font-size:clamp(.6rem,2.5vw,.9rem);border-radius:var(--radius);cursor:pointer;text-transform:uppercase;letter-spacing:.02em;padding:.25rem;line-height:1.2;transition:transform .1s,background-color .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.word-card:hover:not(:disabled){background-color:var(--card-hover-bg);box-shadow:0 2px 8px #0000001a;transform:translateY(-1px)}.word-card:active:not(:disabled){transform:scale(.95)}.word-card.selected{background-color:var(--card-selected-bg);color:var(--card-selected-color);box-shadow:0 2px 10px #0003}.word-card.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}.controls{display:flex;flex-direction:column;align-items:center;gap:1rem}.mistakes{display:flex;align-items:center;gap:.5rem;color:var(--text-secondary);font-size:.88rem;font-weight:500}.bubbles{display:flex;gap:.3rem}.bubble{width:14px;height:14px;border-radius:50%;background-color:var(--card-selected-bg);transition:opacity .3s,transform .3s}.bubble.lost{opacity:.18;transform:scale(.85)}.actions{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.actions .btn{padding:.6rem 1.1rem;border-radius:2rem;font-weight:700;cursor:pointer;font-size:clamp(.8rem,2.5vw,.95rem);border:2px solid var(--text-primary);background:transparent;color:var(--text-primary);transition:background .15s,color .15s,opacity .15s,transform .1s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.actions .btn:hover:not(:disabled){background:var(--card-bg);transform:translateY(-1px)}.actions .btn:active:not(:disabled){transform:scale(.96)}.actions .btn:disabled{opacity:.4;cursor:not-allowed}.actions .btn.filled{background:var(--text-primary);color:var(--bg-color)}.actions .btn.filled:hover:not(:disabled){opacity:.85}.ad-unit{margin-top:1.5rem;width:100%;overflow:hidden}.header-actions{display:flex;gap:.5rem;flex-shrink:0}.how-to-play-modal{max-width:480px}.how-to-play-body{padding:1.25rem;overflow-y:auto;-webkit-overflow-scrolling:touch;font-size:.92rem;line-height:1.6;color:var(--text-primary)}.how-to-play-body p{margin:0 0 .75rem}.how-to-play-steps{margin:0 0 .75rem;padding-left:1.4rem}.how-to-play-steps li{margin-bottom:.4rem}.how-to-play-tip{background:var(--card-bg);border-radius:var(--radius);padding:.75rem 1rem;margin-bottom:1rem!important}.how-to-play-legend{border-top:1px solid var(--border-color);padding-top:1rem}.how-to-play-legend-title{font-weight:700;margin:0 0 .6rem;font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary)}.how-to-play-swatch-list{display:flex;flex-direction:column;gap:.35rem}.how-to-play-swatch{padding:.5rem .85rem;border-radius:var(--radius);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em}.how-to-play-swatch.level-1{background-color:var(--level-1)}.how-to-play-swatch.level-2{background-color:var(--level-2)}.how-to-play-swatch.level-3{background-color:var(--level-3)}.how-to-play-swatch.level-4{background-color:var(--level-4)}.archive-overlay{position:fixed;inset:0;background:#00000073;z-index:300;display:flex;align-items:center;justify-content:center;padding:1rem;animation:overlay-in .2s}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}.archive-modal{background:var(--modal-bg);border-radius:12px;width:100%;max-width:420px;max-height:80dvh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 8px 40px #0003;animation:modal-in .25s cubic-bezier(.34,1.56,.64,1)}@keyframes modal-in{0%{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}.archive-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--border-color);flex-shrink:0}.archive-title{margin:0;font-size:1.1rem;font-weight:800}.archive-close{background:none;border:none;font-size:1.1rem;cursor:pointer;color:var(--text-secondary);padding:.2rem .4rem;border-radius:4px;transition:color .15s,background .15s}.archive-close:hover{color:var(--text-primary);background:var(--card-bg)}.archive-list{list-style:none;margin:0;padding:.5rem;overflow-y:auto;-webkit-overflow-scrolling:touch}.archive-list li+li{margin-top:.25rem}.archive-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.75rem 1rem;border:none;border-radius:var(--radius);background:none;cursor:pointer;text-align:left;font-size:.9rem;color:var(--text-primary);transition:background .15s;-webkit-tap-highlight-color:transparent}.archive-item:hover{background:var(--card-bg)}.archive-item.active{background:var(--card-selected-bg);color:#fff}.archive-item-date{font-weight:600}.archive-item-label{font-size:.78rem;opacity:.7}.archive-empty{padding:1.5rem;text-align:center;color:var(--text-secondary);font-size:.9rem;margin:0}.mode-selector{display:flex;gap:.4rem;margin-top:.6rem}.mode-btn{flex:1;padding:.4rem .75rem;border:2px solid var(--border-color);border-radius:2rem;background:transparent;color:var(--text-secondary);font-size:.82rem;font-weight:700;cursor:pointer;transition:background .15s,border-color .15s,color .15s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.mode-btn:hover:not(.active){background:var(--card-bg);color:var(--text-primary)}.mode-btn.active{color:var(--bg-color);border-color:transparent}.mode-btn.active.mode-easy{background:var(--level-2)}.mode-btn.active.mode-medium{background:var(--level-3)}.mode-btn.active.mode-hard{background:var(--level-4)}@media(max-width:480px){.app{padding:.75rem 1rem}.header-inner{flex-wrap:wrap;row-gap:.5rem}.btn-label{display:none}.archive-btn{padding:.4rem .6rem;font-size:1rem;line-height:1}.header-actions,.word-grid{gap:.35rem}.word-card{padding:.35rem .15rem;font-size:clamp(.55rem,3.8vw,.82rem)}.actions .btn{padding:.55rem .9rem}}@media(max-width:360px){.app{padding:.6rem .75rem}.mode-btn{padding:.35rem .5rem;font-size:.76rem}}
