*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}:root{--bg: #b8e39c;--bg-2: #a5d98a;--tile-face: #fdf9e8;--tile-edge: #d9cfa3;--tile-covered: #8a9a78;--ink: #2f3e2a;--accent: #3f8efc;--accent-2: #ffb03a;--danger: #e5484d;--rack-wood: #a9743f;--rack-wood-dark: #7d5127}html,body{margin:0;padding:0;height:100%}body{font-family:Nunito,Quicksand,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:radial-gradient(circle at 20% 15%,#cdeeb4 0%,transparent 45%),radial-gradient(circle at 85% 80%,#9fd786 0%,transparent 50%),linear-gradient(160deg,var(--bg) 0%,var(--bg-2) 100%);background-attachment:fixed;min-height:100%;-webkit-user-select:none;user-select:none}#root,.app{min-height:100vh;display:flex;flex-direction:column}.header{display:flex;justify-content:space-between;align-items:center;padding:10px 16px}.header-left,.header-right{display:flex;align-items:center;gap:10px}.logo{margin:0;font-size:1.5rem;font-weight:900;letter-spacing:-.5px}.logo span{color:var(--accent)}.date-badge,.attempt-badge{background:#0000008c;color:#fff;border-radius:999px;padding:3px 12px;font-size:.8rem;font-weight:700}.attempt-badge{background:var(--accent-2);color:#5b3b00}.icon-btn{background:#ffffffbf;border:2px solid rgba(0,0,0,.12);border-radius:12px;font-size:1.15rem;width:40px;height:40px;cursor:pointer;transition:transform .12s ease}.icon-btn:hover{transform:scale(1.08)}.board-wrap{flex:1;display:flex;justify-content:center;align-items:flex-start;padding:8px 12px 0;overflow:hidden}.board-scale{position:relative}.board{position:absolute;top:0;left:0;transform-origin:top left}.tile{position:absolute;display:flex;align-items:center;justify-content:center;border:none;padding:0;background:transparent;cursor:pointer;font-size:1.65rem}.tile-inner,.rack-tile,.board-tile{border-radius:10px}.board-tile .tile-inner{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,var(--tile-face) 0%,#f1e9c8 100%);border:2px solid rgba(0,0,0,.18);border-bottom-width:5px;border-bottom-color:var(--tile-edge);border-radius:10px;box-shadow:0 3px 6px #00000040}.tile-face{pointer-events:none;line-height:1;filter:drop-shadow(0 1px 1px rgba(0,0,0,.2))}.bottom-area{padding:6px 12px calc(14px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:14px}.rack{position:relative;width:362px;max-width:96vw;height:74px;background:linear-gradient(180deg,var(--rack-wood) 0%,var(--rack-wood-dark) 100%);border-radius:14px;border:3px solid #5f3d1c;box-shadow:inset 0 4px 8px #00000059,0 4px 10px #00000040}.rack-slots{position:absolute;inset:6px;display:flex;gap:4px;padding:0}.rack-slot{width:46px;height:100%;border-radius:8px;background:#00000038;box-shadow:inset 0 2px 4px #0000004d}.rack-tiles{position:absolute;inset:6px}.rack-tile{position:absolute;top:2px;width:46px;height:56px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,var(--tile-face) 0%,#f1e9c8 100%);border:2px solid rgba(0,0,0,.18);border-bottom-width:4px;border-bottom-color:var(--tile-edge);border-radius:8px;font-size:1.4rem;box-shadow:0 2px 5px #0000004d}.rack-tile.matched{animation:matched-glow .5s ease infinite alternate}@keyframes matched-glow{0%{box-shadow:0 0 6px 2px #ffd93db3}to{box-shadow:0 0 14px 5px #ffd93d}}.sparkle{position:absolute;color:#ffd93d;font-size:.7rem;pointer-events:none;animation:sparkle-pop .6s ease-out infinite}.sparkle.s1{top:-8px;left:-4px}.sparkle.s2{top:-12px;right:-2px;animation-delay:.15s}.sparkle.s3{bottom:-6px;right:6px;animation-delay:.3s}@keyframes sparkle-pop{0%{transform:scale(.4);opacity:0}50%{transform:scale(1.2);opacity:1}to{transform:scale(.5);opacity:0}}.helper-bar{display:flex;gap:18px}.helper-btn{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:84px;padding:8px 14px 7px;border-radius:14px;border:3px solid #1d5fb8;background:linear-gradient(180deg,#62a8ff 0%,var(--accent) 60%,#2a6fd9 100%);color:#fff;font-weight:800;font-size:.85rem;cursor:pointer;box-shadow:0 4px #1d4e96,0 6px 10px #00000040;transition:transform .1s ease,box-shadow .1s ease,filter .2s ease}.helper-btn:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px #1d4e96}.helper-btn:disabled{filter:grayscale(.9) brightness(.85);cursor:not-allowed}.helper-icon{font-size:1.35rem}.helper-plus{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;background:var(--accent-2);color:#5b3b00;border:2px solid #fff;font-weight:900;display:flex;align-items:center;justify-content:center;font-size:.95rem}.modal-backdrop,.overlay{position:fixed;inset:0;background:#14280f8c;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px}.modal{position:relative;background:#fffdf4;border-radius:20px;border:3px solid rgba(0,0,0,.15);box-shadow:0 18px 50px #00000059;padding:22px 24px;width:100%;max-width:400px;max-height:86vh;overflow-y:auto;text-align:center}.modal h2{margin:0 0 10px;font-size:1.3rem}.modal-close{position:absolute;top:10px;right:10px;width:32px;height:32px;border-radius:50%;border:2px solid rgba(0,0,0,.15);background:#fff;font-weight:900;cursor:pointer}.hint{font-size:.85rem;color:#6b7362;margin:8px 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:12px;border:none;padding:11px 18px;font-size:.95rem;font-weight:800;cursor:pointer;transition:transform .1s ease,filter .15s ease;width:100%;margin-top:8px}.btn small{font-weight:600;opacity:.85}.btn:hover:not(:disabled){filter:brightness(1.06)}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{filter:grayscale(.6) brightness(.9);cursor:not-allowed}.btn-primary{background:linear-gradient(180deg,#62a8ff,var(--accent));color:#fff;box-shadow:0 3px #1d4e96}.btn-secondary{background:linear-gradient(180deg,#ffc76b,var(--accent-2));color:#5b3b00;box-shadow:0 3px #b57712}.btn-ghost{background:transparent;color:#6b7362;box-shadow:none}.helper-subtitle{font-size:.9rem;color:#4c563f;margin:12px 0 6px}.unlock-options{display:flex;flex-direction:column}.demo-stage{position:relative;width:220px;height:130px;margin:8px auto 0;background:linear-gradient(160deg,#cdeeb4,#a5d98a);border-radius:14px;border:2px solid rgba(0,0,0,.12);overflow:hidden}.demo-rack{position:absolute;left:22px;right:22px;bottom:10px;height:40px;border-radius:8px;background:linear-gradient(180deg,var(--rack-wood),var(--rack-wood-dark));border:2px solid #5f3d1c}.demo-board-spot{position:absolute;left:40px;top:12px;width:36px;height:42px;border-radius:8px;border:2px dashed rgba(0,0,0,.25)}.demo-float{position:absolute;top:12px}.demo-tile{display:flex;align-items:center;justify-content:center;width:36px;height:42px;background:linear-gradient(180deg,var(--tile-face),#f1e9c8);border:2px solid rgba(0,0,0,.18);border-bottom-width:4px;border-radius:8px;font-size:1.15rem;box-shadow:0 2px 4px #00000040}.share-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:6px 0}.share-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;border:2px solid rgba(0,0,0,.12);background:#fff;font-weight:700;font-size:.82rem;cursor:pointer;transition:transform .1s ease,border-color .15s ease}.share-btn:hover{transform:scale(1.03);border-color:var(--accent)}.share-icon{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:8px;background:var(--ink);color:#fff;font-size:.85rem;font-weight:900}.ad-status{padding:10px 0 4px}.spinner{width:34px;height:34px;margin:0 auto 8px;border-radius:50%;border:4px solid rgba(0,0,0,.12);border-top-color:var(--accent)}.loading{flex:1;display:flex;align-items:center;justify-content:center}.score-total{font-size:2.1rem;font-weight:900;color:var(--accent);margin:4px 0 10px}.name-entry input{width:100%;padding:11px 14px;border-radius:12px;border:2px solid rgba(0,0,0,.18);font-size:.95rem;font-family:inherit;text-align:center}.name-entry input:focus{outline:none;border-color:var(--accent)}.rank-line{font-weight:900;color:var(--accent);font-size:1.05rem}.confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden}.confetti span{position:absolute;top:0;border-radius:2px}.leaderboard h3{margin:4px 0 10px;font-size:1.05rem}.leaderboard table{width:100%;border-collapse:collapse;font-size:.86rem}.leaderboard th{text-align:left;padding:6px;color:#6b7362;border-bottom:2px solid rgba(0,0,0,.12);font-size:.75rem;text-transform:uppercase;letter-spacing:.4px}.leaderboard td{padding:6px;border-bottom:1px solid rgba(0,0,0,.07)}.leaderboard tr.you td{background:#3f8efc24;font-weight:800}.leaderboard tr:nth-child(1) td:first-child:after{content:" 🥇"}.leaderboard tr:nth-child(2) td:first-child:after{content:" 🥈"}.leaderboard tr:nth-child(3) td:first-child:after{content:" 🥉"}@media(max-width:420px){.helper-bar{gap:10px}.helper-btn{min-width:74px;padding:7px 10px 6px}}