*,:after,:before{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}:root{--white:#fff;--surface:#fafaf8;--surface-2:#f0efec;--border:#e5e5e3;--border-dark:#d0cfcc;--green:#1c3d22;--green-light:#e8f0e9;--gold:#c9a84c;--gold-light:#fdf6e3;--text:#1a1a1a;--text-muted:#6b7280;--text-light:#9ca3af;--tile-correct-bg:#1c3d22;--tile-correct-txt:#fff;--tile-close-bg:#c9a84c;--tile-close-txt:#fff;--tile-wrong-bg:#d9dcd8;--tile-wrong-txt:#1a1a1a;--tile-empty-bg:#f0efec;--tile-empty-border:#d0cfcc;--font-display:"DM Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-body:"DM Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-ui:"DM Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--sat:env(safe-area-inset-top,0px);--sar:env(safe-area-inset-right,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--shadow-sm:0 1px 0 rgba(28,61,34,.06);--shadow-md:0 4px 14px rgba(28,61,34,.08),0 12px 40px rgba(28,61,34,.06);--shadow-lg:0 8px 30px rgba(0,0,0,.1),0 24px 48px rgba(28,61,34,.08);--shadow-inset:inset 0 1px 0 hsla(0,0%,100%,.22);--ease-premium:cubic-bezier(0.22,1,0.36,1);--radius-sm:8px;--radius-md:12px;--radius-lg:16px}html{text-size-adjust:100%;height:100%}body{font-family:var(--font-ui);background-color:var(--surface);background-image:radial-gradient(120% 80% at 50% -20%,rgba(201,168,76,.09),transparent 55%),radial-gradient(90% 60% at 50% 120%,rgba(28,61,34,.04),transparent 50%);color:var(--text);overscroll-behavior:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-shell,body{min-height:100dvh;min-height:-webkit-fill-available}.app-shell{display:flex;flex-direction:column;padding:var(--sat) var(--sar) max(var(--sab),env(safe-area-inset-bottom,0px)) var(--sal);max-width:480px;margin:0 auto;background:var(--white);box-shadow:var(--shadow-md)}.app-shell--loading{align-items:center;justify-content:center}.loading-brand{display:flex;flex-direction:column;align-items:center;gap:20px}.loading-logo{width:72px;height:72px;object-fit:contain;animation:logoPulse 1.6s ease-in-out infinite;filter:drop-shadow(0 6px 20px rgba(28,61,34,.12))}.loading-dots{display:flex;gap:8px;align-items:center}.loading-dots span{width:6px;height:6px;border-radius:50%;background:var(--gold);opacity:.35;animation:dotWave 1s ease-in-out infinite}.loading-dots span:nth-child(2){animation-delay:.15s}.loading-dots span:nth-child(3){animation-delay:.3s}@keyframes logoPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.88;transform:scale(.97)}}@keyframes dotWave{0%,to{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}.header{justify-content:space-between;padding:14px 18px 12px;border-bottom:1px solid var(--border);background:hsla(0,0%,100%,.82);backdrop-filter:blur(14px) saturate(1.15);-webkit-backdrop-filter:blur(14px) saturate(1.15);position:-webkit-sticky;position:sticky;top:var(--sat);z-index:50;box-shadow:var(--shadow-sm),0 4px 20px rgba(28,61,34,.06)}.header,.header-brand{display:flex;align-items:center;gap:10px}.header-brand{min-width:0}.header-mark{width:40px;height:40px;flex-shrink:0;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(28,61,34,.1))}.header-logo{display:flex;flex-direction:column;gap:1px;min-width:0}.header-logo img{height:28px;width:auto}.header-game-name{font-family:"DM Serif Display",Georgia,Times New Roman,serif;font-size:1.62rem;font-weight:600;color:var(--green);letter-spacing:-.02em;line-height:1}.header-platform{font-family:var(--font-body);font-size:.6rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);line-height:1}.header-actions{display:flex;gap:6px}.icon-btn{width:44px;height:44px;border:1px solid var(--border);background:linear-gradient(180deg,#fff 0,var(--surface) 100%);border-radius:var(--radius-md);color:var(--text-muted);font-size:1rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .18s var(--ease-premium),border-color .18s var(--ease-premium),color .18s var(--ease-premium),box-shadow .18s var(--ease-premium),transform .12s var(--ease-premium);box-shadow:0 1px 2px rgba(0,0,0,.04)}.icon-btn:hover{color:var(--green);border-color:var(--border-dark);box-shadow:0 2px 8px rgba(28,61,34,.08)}.icon-btn:active{background:var(--surface-2);border-color:var(--border-dark);transform:scale(.96)}.icon-btn-svg{display:block;color:inherit}.main{flex:1 1;display:flex;flex-direction:column;padding:18px 18px max(20px,env(safe-area-inset-bottom,0px));gap:16px;overflow-y:auto;-webkit-overflow-scrolling:touch;overflow-x:hidden}.attempts-row{display:flex;align-items:center;gap:5px;padding:2px 0}.attempt-pip{width:8px;height:8px;border-radius:50%;background:var(--border-dark);transition:background .2s;flex-shrink:0}.attempt-pip.used{background:var(--green)}.attempt-pip.current{background:var(--gold)}.attempts-label{font-size:.72rem;color:var(--text-muted);margin-left:4px;font-family:var(--font-body);letter-spacing:.03em}.streak-bar{display:flex;gap:0;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:linear-gradient(180deg,#fdfcfa 0,var(--surface) 100%);box-shadow:0 1px 3px rgba(0,0,0,.04),inset 0 1px 0 hsla(0,0%,100%,.8)}.streak-item{display:flex;flex-direction:column;align-items:center;padding:10px 8px;flex:1 1;border-right:1px solid var(--border)}.streak-item:last-child{border-right:none}.streak-value{font-family:var(--font-display);font-size:1.4rem;font-weight:900;color:var(--green);line-height:1;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.streak-label{font-size:.58rem;text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);margin-top:2px;font-family:var(--font-body)}.search-wrapper{position:relative;z-index:20}.search-input{width:100%;height:54px;box-sizing:border-box;background:var(--white);border:1.5px solid var(--border-dark);border-radius:var(--radius-md);color:var(--text);font-family:var(--font-ui);font-size:max(16px,1rem);padding:0 44px 0 16px;line-height:1.25;outline:none;transition:border-color .2s var(--ease-premium),box-shadow .2s var(--ease-premium);-moz-appearance:none;appearance:none;-webkit-appearance:none;box-shadow:0 1px 2px rgba(0,0,0,.04)}.search-input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(28,61,34,.12),0 2px 10px rgba(28,61,34,.06),0 1px 3px rgba(0,0,0,.06)}.search-input::placeholder{color:var(--text-light);font-size:1.05rem}.search-input:disabled{background:var(--surface);color:var(--text-muted);cursor:not-allowed}.search-icon{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--text-light);pointer-events:none;font-size:1rem}.autocomplete-list{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--white);border:1.5px solid var(--border-dark);border-radius:var(--radius-md);overflow:hidden;z-index:100;max-height:220px;overflow-y:auto;-webkit-overflow-scrolling:touch;box-shadow:var(--shadow-lg)}.autocomplete-item{padding:12px 16px;cursor:pointer;display:flex;align-items:center;gap:10px;font-size:.95rem;border-bottom:1px solid var(--border);min-height:50px;transition:background .08s}.autocomplete-item:last-child{border-bottom:none}.autocomplete-item:active{background:var(--surface)}.autocomplete-flag{font-size:1.1rem;flex-shrink:0}.autocomplete-name{flex:1 1;font-weight:500;color:var(--text);font-size:.95rem}.autocomplete-nat{font-size:.78rem;color:var(--text-muted);font-family:var(--font-body);letter-spacing:.02em}.guess-table-wrapper{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.guess-table{width:100%;border-collapse:separate;border-spacing:4px 6px;min-width:340px;perspective:520px}.guess-table thead th{font-family:var(--font-body);font-size:.58rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);padding:8px 2px 10px;text-align:center;white-space:nowrap;border-bottom:1px solid var(--border);background:linear-gradient(180deg,hsla(60,17%,98%,.9),hsla(0,0%,100%,0))}.guess-table thead th:first-child{text-align:left;padding-left:4px}.tile{padding:8px 6px;text-align:center;font-family:var(--font-body);font-size:.78rem;line-height:1.25;letter-spacing:.01em;transform-origin:center center;transform-style:preserve-3d;backface-visibility:hidden;-webkit-backface-visibility:hidden}.tile,.tile-name{font-weight:700;border-radius:var(--radius-sm)}.tile-name{text-align:left;padding-left:6px;font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}.tile.correct{background:var(--tile-correct-bg);color:var(--tile-correct-txt);box-shadow:var(--shadow-inset),0 2px 6px rgba(28,61,34,.25)}.tile.close{background:var(--tile-close-bg);color:var(--tile-close-txt);box-shadow:var(--shadow-inset),0 2px 6px rgba(201,168,76,.35)}.tile.wrong{background:var(--tile-wrong-bg);color:var(--tile-wrong-txt);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.5)}.tile-arrow{display:block;font-size:.62rem;opacity:.85;margin-top:2px}.empty-tile,.empty-tile-name{min-height:40px;height:100%;background:linear-gradient(165deg,hsla(0,0%,100%,.55) 0,transparent 42%),linear-gradient(var(--tile-empty-bg),var(--surface-2));border:1px solid var(--tile-empty-border);border-radius:var(--radius-sm);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.65)}.empty-tile-name{max-width:80px}@keyframes slideIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes tileFlip{0%{transform:rotateX(90deg);opacity:.35}to{transform:rotateX(0deg);opacity:1}}@keyframes rowShake{0%,to{transform:translateX(0)}12%{transform:translateX(-7px)}28%{transform:translateX(6px)}44%{transform:translateX(-5px)}60%{transform:translateX(4px)}76%{transform:translateX(-3px)}88%{transform:translateX(2px)}}@keyframes tileWinBounce{0%,to{transform:rotateX(0deg) translateY(0)}35%{transform:rotateX(0deg) translateY(-6px)}65%{transform:rotateX(0deg) translateY(0)}}.guess-cell{padding:0;vertical-align:middle;transform-style:preserve-3d}.guess-row:not(.guess-row--win) .guess-cell .tile{animation:tileFlip .5s var(--ease-premium) forwards;animation-delay:var(--cell-delay,0s);opacity:0}.guess-row--shake .guess-cell{animation:rowShake .4s ease both}.guess-row--win .guess-cell .tile{animation-name:tileFlip,tileWinBounce;animation-duration:.5s,.42s;animation-timing-function:var(--ease-premium),ease;animation-delay:var(--cell-delay,0s),var(--bounce-delay,.55s);animation-fill-mode:forwards,both;opacity:0}.guess-row td{padding:0}.empty-row td{padding:2px}.result-banner{background:linear-gradient(165deg,#fdfcfa 0,var(--surface) 55%,#f5f4f1 100%);border:1px solid var(--border-dark);border-radius:var(--radius-lg);padding:20px 18px;display:flex;flex-direction:column;gap:12px;animation:bannerReveal .45s var(--ease-premium) forwards;box-shadow:var(--shadow-md),inset 0 1px 0 hsla(0,0%,100%,.85)}@keyframes bannerReveal{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.result-score{font-family:var(--font-display);font-size:1.5rem;font-weight:900;color:var(--green)}.result-subtitle{font-size:.82rem;color:var(--text-muted);margin-top:-6px}.result-player-name{font-size:1.05rem;font-weight:600;color:var(--text)}.result-player-detail{font-size:.8rem;color:var(--text-muted);margin-left:4px}.result-actions{display:flex;gap:8px}.btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:13px 16px;border-radius:10px;font-family:var(--font-ui);font-size:.88rem;font-weight:600;border:none;cursor:pointer;transition:opacity .12s,transform .08s;flex:1 1;min-height:48px}.btn:active{opacity:.8;transform:scale(.98)}.btn-primary{background:linear-gradient(180deg,#234a2a 0,var(--green) 55%,#152a19 100%);color:var(--white);box-shadow:0 2px 8px rgba(28,61,34,.35),inset 0 1px 0 hsla(0,0%,100%,.12)}.btn-secondary{background:linear-gradient(180deg,#fff 0,var(--surface) 100%);color:var(--text);border:1.5px solid var(--border-dark);box-shadow:0 1px 3px rgba(0,0,0,.05)}.modal-overlay{position:fixed;inset:0;background:rgba(22,28,24,.52);z-index:200;display:flex;align-items:flex-end;justify-content:center;padding-bottom:var(--sab);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.modal-sheet{background:linear-gradient(180deg,#fff,#fafaf8);border-radius:22px 22px 0 0;padding:20px 18px 32px;width:100%;max-width:480px;max-height:85dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;animation:sheetUp .32s cubic-bezier(.32,1.2,.32,1) forwards;box-shadow:0 -8px 40px rgba(0,0,0,.12),inset 0 1px 0 hsla(0,0%,100%,.95);border-top:1px solid rgba(201,168,76,.2)}@keyframes sheetUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.modal-handle{width:40px;height:4px;background:linear-gradient(90deg,transparent,var(--border-dark),transparent);border-radius:2px;margin:0 auto 18px;opacity:.85}.modal-title{font-family:var(--font-display);font-size:1.3rem;font-weight:900;color:var(--green);margin-bottom:14px}.modal-body{display:flex;flex-direction:column;gap:12px;font-size:.87rem;color:var(--text-muted);line-height:1.65}.modal-body strong{color:var(--text)}.modal-section-divider{border-top:1px solid var(--border);padding-top:12px;margin-top:4px}.stats-modal-note{text-align:center;font-size:.78rem}.stats-modal-muted{color:var(--text-light)}.legend-block{display:flex;flex-direction:column;gap:8px;padding:4px 0}.legend-row{gap:10px}.legend-row,.legend-tile{display:flex;align-items:center}.legend-tile{width:30px;height:30px;border-radius:var(--radius-sm);flex-shrink:0;justify-content:center;font-size:.75rem;font-weight:700;color:#fff;box-shadow:var(--shadow-inset),0 2px 6px rgba(0,0,0,.12)}.legend-tile--correct{background:var(--tile-correct-bg);color:var(--tile-correct-txt)}.legend-tile--close{background:var(--tile-close-bg);color:var(--tile-close-txt)}.legend-tile--wrong{background:var(--tile-wrong-bg);color:var(--tile-wrong-txt)}.toast{position:fixed;top:calc(var(--sat) + 68px);left:50%;transform:translateX(-50%);background:linear-gradient(180deg,#2a2a2a,#1a1a1a);color:var(--white);padding:10px 20px;border-radius:999px;font-size:.85rem;font-weight:600;z-index:300;white-space:nowrap;pointer-events:none;animation:toastIn .18s ease,toastOut .25s ease 1.75s forwards;box-shadow:0 6px 24px rgba(0,0,0,.2),inset 0 1px 0 hsla(0,0%,100%,.08)}@keyframes toastIn{0%{opacity:0;transform:translateX(-50%) translateY(-6px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}@keyframes toastOut{to{opacity:0;transform:translateX(-50%) translateY(-6px)}}.gold-divider{height:1px;background:var(--gold);opacity:.3;margin:2px 0}@media (max-height:500px) and (orientation:landscape){.header{padding:6px 14px}.main{padding:10px 14px max(12px,env(safe-area-inset-bottom,0px));gap:10px}}::-webkit-scrollbar{width:3px;height:3px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-dark);border-radius:2px}::selection{background:var(--green);color:#fff}