:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:var(--text-primary);background-color:var(--bg-body);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg-body: #110d0a;--bg-surface: #1a1410;--bg-card: #231b17;--bg-card-light: #2a211c;--bg-surface-light: #1e1712;--bg-surface-rgb: 26, 20, 16;--border: #332a24;--border-muted: #4a3e37;--text-primary: #ede5dc;--text-secondary: #c9bdb0;--text-muted: #a8978a;--text-dim: #6b5c52;--accent: #4ead6b;--accent-light: #5fbe7c;--accent-soft: #6cc889;--accent-dark: #0f2118;--accent-bg: #1a3626;--accent-border: #26503a;--accent-highlight: #2a3d2a;--accent-rgb: 78, 173, 107}body{margin:0;padding:0;background-color:var(--bg-body);background-image:radial-gradient(ellipse at 50% 40%,var(--bg-surface) 0%,var(--bg-body) 70%);min-height:100vh}#root{width:100%;position:relative}#root:before{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:128px 128px}.game-container{width:100%;max-width:100%;margin:0 auto;padding:0 12px;box-sizing:border-box}@media(min-width:528px){.game-container{max-width:480px;padding:0}}@media(min-width:816px){.game-container{max-width:768px}}@media(min-width:1072px){.game-container{max-width:1024px}}.game-layout{display:flex;flex-direction:column;height:calc(100dvh - 64px);gap:0}.game-layout:has(.game-results){height:auto;min-height:calc(100dvh - 64px)}.game-layout:has(.game-results) .game-panels{flex:none;height:calc(100dvh - 64px)}.game-panels{display:flex;flex-direction:column;flex:1 1 0;min-height:0;gap:0;border-radius:12px;overflow:hidden;position:relative;z-index:1}.ambilight{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}.ambilight img{width:100%;height:100%;object-fit:cover;filter:blur(64px) saturate(1.5);opacity:.3;transform:scale(1.2);transition:opacity 1s ease}.ambilight--hidden img{opacity:0}.panel-divider{flex:0 0 12px;display:flex;align-items:center;justify-content:center;cursor:row-resize;background:linear-gradient(to right,var(--bg-surface),var(--bg-card) 50%,var(--bg-surface));border-top:1px solid rgba(255,255,255,.04);border-bottom:1px solid rgba(0,0,0,.3);z-index:10;touch-action:none}.panel-divider__handle{width:40px;height:4px;border-radius:2px;background:var(--border-muted);transition:background-color .15s ease}.panel-divider:hover .panel-divider__handle{background:var(--text-muted)}.game-panel{position:relative;width:100%;border-radius:12px;overflow:hidden}.game-panel:not(.game-panels .game-panel){aspect-ratio:16 / 9}.game-panels .game-panel{height:100%;border-radius:0}.game-panels .game-panel--image{border-radius:0}@media(min-width:816px){.game-panel:not(.game-panels .game-panel){aspect-ratio:5 / 2}}@media(min-width:1072px){.game-panel:not(.game-panels .game-panel){aspect-ratio:3 / 1}}.game-panel--image{background-color:var(--bg-surface);border:1px solid var(--bg-card)}.game-panel--map{border:2px solid rgba(255,255,255,.15);box-shadow:0 8px 24px #00000080;transition:border-color .5s ease}.game-panel--map-result{border-color:rgba(var(--accent-rgb),.3)}.game-panel__fill{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.game-panel--thumbnail:not(.game-panels .game-panel--thumbnail){aspect-ratio:2 / 1}.game-panels .game-panel--thumbnail{height:100%}.game-panel__loading{background:var(--bg-body);display:flex;align-items:center;justify-content:center;z-index:5}.loading-spinner{width:36px;height:36px;border:3px solid rgba(255,255,255,.15);border-top-color:#fffc;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.game-panel__skip-btn{position:absolute;bottom:12px;left:12px;z-index:10;padding:10px 16px;cursor:pointer;border-radius:8px;border:1px solid var(--border);background:linear-gradient(to bottom,var(--bg-card-light) 0%,var(--bg-card) 100%);color:var(--text-primary);font-weight:600;box-shadow:0 2px 8px #0000004d}.game-header{text-align:center;margin:8px 0}.game-header__subtitle{margin-top:0;opacity:.6;font-size:13px}.game-header__badge{display:inline-block;background-color:var(--accent-highlight);padding:4px 14px;border-radius:8px;border:1px solid #3a5a3a;font-size:13px}.game-results__distance{text-align:center;padding:14px;background-color:var(--accent-bg);border-radius:10px;border:1px solid var(--accent-border)}.game-results__distance h3{margin:0;font-size:18px}.game-results__next-dock{position:fixed;bottom:0;left:0;right:0;z-index:900;display:flex;justify-content:center;padding:12px 12px 16px;background:linear-gradient(to top,var(--bg-body) 60%,transparent);pointer-events:none}.game-results__next-btn{width:100%;max-width:calc(100% - 24px);padding:16px 24px;cursor:pointer;border-radius:10px;border:none;background:linear-gradient(to bottom,var(--accent-light) 0%,var(--accent) 100%);color:var(--accent-dark);font-weight:700;font-size:18px;text-align:center;box-shadow:0 2px 8px #0000004d,0 0 16px rgba(var(--accent-rgb),.4);transition:transform .15s ease,box-shadow .15s ease;pointer-events:auto}@media(min-width:528px){.game-results__next-btn{max-width:480px}}@media(min-width:816px){.game-results__next-btn{max-width:768px}}@media(min-width:1072px){.game-results__next-btn{max-width:1024px}}.game-results__next-btn:hover{transform:translateY(-2px);box-shadow:0 4px 20px rgba(var(--accent-rgb),.5)}.game-results__next-btn:active{transform:translateY(0);box-shadow:0 0 12px rgba(var(--accent-rgb),.3)}.game-results{display:flex;flex-direction:column;gap:12px;width:100%;padding-bottom:96px}.guess-map-container{height:100%}.guess-map__toggle-btn{position:absolute;top:6px;right:6px;z-index:1000;background-color:rgba(var(--bg-surface-rgb),.9);color:var(--text-primary);padding:4px 10px;border-radius:9999px;font-weight:700;font-size:11px;letter-spacing:.3px;box-shadow:0 2px 8px #0006;border:none;cursor:pointer;transition:background-color .15s ease}.guess-map__toggle-btn:hover{background-color:#2d231ef2}.difficulty-selector{display:flex;gap:8px;justify-content:center;padding:8px 0}.difficulty-selector__btn{flex:1;max-width:140px;padding:10px 8px;border-radius:10px;border:2px solid var(--border);background:linear-gradient(to bottom,var(--bg-surface-light) 0%,var(--bg-surface) 100%);color:var(--text-primary);cursor:pointer;text-align:center;font-weight:600;font-size:14px;box-shadow:0 2px 6px #00000040;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.difficulty-selector__btn:hover{border-color:var(--text-dim)}.difficulty-selector__btn--active{border-color:var(--accent);background:var(--accent-bg)}.difficulty-selector__detail{display:block;font-size:11px;font-weight:400;opacity:.6;margin-top:2px}.difficulty-badge{display:inline-block;padding:2px 10px;border-radius:9999px;font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}.difficulty-badge--easy{background:#1a3626;color:#6cc889;border:1px solid #26503a}.difficulty-badge--medium{background:#78350f;color:#fbbf24;border:1px solid #92400e}.difficulty-badge--hard{background:#7f1d1d;color:#f87171;border:1px solid #991b1b}.guess-map__confirm-btn{position:absolute;bottom:12px;left:50%;transform:translate(-50%);z-index:1000;padding:10px 28px;border-radius:10px;border:none;background:linear-gradient(to bottom,var(--accent-light) 0%,var(--accent) 100%);color:var(--accent-dark);font-weight:700;font-size:15px;cursor:pointer;box-shadow:0 2px 8px #0000004d,0 0 12px rgba(var(--accent-rgb),.4);transition:transform .1s ease}.guess-map__confirm-btn:hover{transform:translate(-50%) translateY(-1px)}.guess-map__giveup-btn{position:absolute;bottom:12px;right:12px;z-index:1000;padding:6px 14px;border-radius:8px;border:1px solid #991b1b;background:#7f1d1dcc;color:#fca5a5;font-weight:600;font-size:12px;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background-color .15s ease}.guess-map__giveup-btn:hover{background:#991b1bf2}.guess-nav{position:absolute;top:6px;left:50%;transform:translate(-50%);z-index:1000;display:flex;align-items:center;gap:4px;background-color:rgba(var(--bg-surface-rgb),.9);padding:4px 6px;border-radius:9999px;box-shadow:0 2px 8px #0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.guess-nav__arrow{width:20px;height:20px;border-radius:50%;border:none;background:#ffffff1a;color:var(--text-primary);font-size:14px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:background-color .15s ease;flex-shrink:0}.guess-nav__arrow:hover:not(:disabled){background:#ffffff40}.guess-nav__arrow:disabled{opacity:.25;cursor:default}.guess-nav__dot{width:12px;height:12px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0;transition:transform .15s ease,border-color .15s ease;flex-shrink:0}.guess-nav__dot:hover{transform:scale(1.2)}.guess-nav__dot--selected{width:16px;height:16px;border-color:var(--text-primary);box-shadow:0 0 6px #fff6}.guess-nav__sep{width:1px;height:14px;background:#fff3;margin:0 2px;flex-shrink:0}.guess-nav__lb-toggle{border:none;background:#ffffff1a;color:var(--text-muted);font-size:10px;font-weight:700;padding:2px 8px;border-radius:9999px;cursor:pointer;white-space:nowrap;transition:background-color .15s ease,color .15s ease;flex-shrink:0}.guess-nav__lb-toggle:hover{background:#fff3;color:var(--text-primary)}.guess-nav__lb-toggle--active{background:rgba(var(--accent-rgb),.3);color:var(--accent-soft)}.guess-nav__lb-toggle--active:hover{background:rgba(var(--accent-rgb),.45)}.distance-tooltip-gm{background:rgba(var(--bg-surface-rgb),.85);border-radius:6px;color:var(--text-primary);font-size:11px;font-weight:700;padding:2px 8px;box-shadow:0 2px 6px #0006;white-space:nowrap;pointer-events:none}.circle-marker-label{background:rgba(var(--bg-surface-rgb),.85);border-radius:6px;color:var(--text-primary);font-size:10px;font-weight:700;padding:1px 6px;box-shadow:0 2px 6px #0006;white-space:nowrap;margin-bottom:2px}.photo-overlay{position:absolute;z-index:10;pointer-events:none}.photo-overlay--tl{top:12px;left:14px}.photo-overlay--tr{top:12px;right:14px;text-align:right}.photo-overlay--bl{bottom:12px;left:14px}.photo-overlay--br{bottom:12px;right:14px}.photo-overlay--tr .score-overlay__divider{margin-left:auto}.score-overlay{position:absolute;top:12px;z-index:10;pointer-events:none}.score-overlay--left{left:14px}.score-overlay--right{right:14px;text-align:right}.score-overlay--right .score-overlay__divider{margin-left:auto}.score-overlay__number{font-size:44px;font-weight:800;line-height:1;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.6)}.score-overlay__number--gaveup{color:#fca5a5}.score-overlay__divider{width:28px;height:3px;border-radius:2px;background:#ffffff80;margin:5px 0 4px}.score-overlay__label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#ffffffb3;text-shadow:0 1px 6px rgba(0,0,0,.5)}.score-overlay__bottom{position:absolute;bottom:10px;right:12px;z-index:10;display:flex;gap:6px}.score-overlay__react{display:flex;align-items:center;gap:4px;padding:4px 10px;border-radius:9999px;border:none;background:#00000073;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fffc;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s ease}.score-overlay__react:hover:not(:disabled){background:#000000a6;color:#fff}.score-overlay__react:disabled{cursor:default}.score-overlay__react--active-love{background:rgba(var(--accent-rgb),.3);color:#8fd4a0}.score-overlay__react--active-hate{background:#f8717140;color:#fca5a5}@media(max-width:480px){.photo-overlay--tl,.score-overlay{top:8px}.photo-overlay--tl,.score-overlay--left{left:10px}.photo-overlay--tr,.score-overlay--right{right:10px}.photo-overlay--bl{bottom:8px;left:10px}.photo-overlay--br{bottom:8px;right:10px}.score-overlay__number{font-size:36px}.score-overlay__bottom{bottom:8px;right:8px}.stats-card{min-width:96px;padding:6px 8px 5px}.stats-card__sparkline{height:22px}.stats-card__value{font-size:10px}}.previous-play{text-align:center;padding:18px 14px;background:var(--bg-surface);border-radius:10px;border:1px solid var(--bg-card)}.previous-play__text{margin:0 0 14px;font-size:14px;color:var(--text-secondary)}.previous-play__actions{display:flex;gap:10px;justify-content:center}.previous-play__btn{padding:10px 20px;border-radius:8px;border:none;font-weight:600;font-size:14px;cursor:pointer;transition:transform .1s ease}.previous-play__btn:hover{transform:translateY(-1px)}.previous-play__btn--submit{background:linear-gradient(to bottom,var(--accent-light) 0%,var(--accent) 100%);color:var(--accent-dark);box-shadow:0 2px 8px #0000004d,0 0 10px rgba(var(--accent-rgb),.3)}.previous-play__btn--skip{background:linear-gradient(to bottom,var(--bg-card-light) 0%,var(--bg-card) 100%);color:var(--text-primary);border:1px solid var(--border);box-shadow:0 2px 8px #0000004d}.warmth-bar{display:flex;align-items:center;gap:10px;padding:0 4px}.warmth-bar__label{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;flex-shrink:0;width:30px;text-align:center}.warmth-bar__label--cold{color:#3b82f6}.warmth-bar__label--hot{color:#ef4444}.warmth-bar__track{flex:1;position:relative}.warmth-bar__trend{height:24px;margin-bottom:2px}.warmth-bar__buckets{display:flex;gap:3px;height:12px}.warmth-bar__bucket{flex:1;border-radius:3px;background:#ffffff14;transition:background-color .4s ease}.warmth-bar__bucket:first-child{border-radius:5px 3px 3px 5px}.warmth-bar__bucket:last-child{border-radius:3px 5px 5px 3px}.warmth-bar__bucket--filled{box-shadow:0 0 4px #0000004d}.compass-indicator{position:absolute;top:10px;right:10px;z-index:8;pointer-events:none;opacity:.85}.compass-3d{position:absolute;top:50%;left:50%;transform:translate(-50%,-35%) perspective(300px) rotateX(55deg);width:180px;z-index:8;pointer-events:none;opacity:.3;filter:drop-shadow(0 3px 12px rgba(0,0,0,.5));transition:opacity .3s ease}.game-panel--panning .compass-3d{opacity:.95}.compass-3d svg{width:100%;height:auto;overflow:visible}@media(max-width:480px){.compass-3d{width:140px}}.stats-card{background:#0000008c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:10px;padding:8px 10px 6px;pointer-events:none;min-width:110px}.stats-card__sparkline{height:28px;margin-bottom:4px}.stats-card__row{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.stats-card__label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:#ffffff80}.stats-card__value{font-size:11px;font-weight:700;color:#ffffffd9;text-shadow:0 1px 4px rgba(0,0,0,.4)}.stats-card__divider{width:100%;height:1px;background:#ffffff1f;margin:4px 0 3px}.game-panel--zoomed{touch-action:none}.game-panel--image{user-select:none;-webkit-user-select:none}.pano-strip{position:absolute;top:0;left:0;height:100%;display:flex;will-change:transform}.pano-strip img{height:100%;width:auto;flex-shrink:0;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;pointer-events:none}@media(max-width:480px){.game-panel:not(.game-panels .game-panel){border-radius:8px}.game-panels{border-radius:8px}.compass-indicator{top:6px;right:6px}.compass-indicator svg{width:26px;height:26px}.game-header{margin:4px 0}.game-header__subtitle{font-size:12px}.difficulty-selector{padding:4px 0;gap:6px}.difficulty-selector__btn{padding:6px;font-size:13px}}.navbar{position:relative;z-index:1000}.navbar__bar{display:flex;align-items:center;justify-content:space-between;width:100%;height:64px;padding:0 16px;background:linear-gradient(to bottom,var(--bg-surface-light) 0%,var(--bg-surface) 100%);border-bottom:none;box-shadow:0 2px 12px #00000080,0 1px #ffffff08 inset;box-sizing:border-box}.navbar__logo{display:flex;align-items:center;gap:10px;color:var(--text-primary);text-decoration:none;font-weight:800;font-size:18px;flex-shrink:0;letter-spacing:-.3px;text-shadow:0 0 12px rgba(var(--accent-rgb),.3)}.navbar__logo-svg{width:30px;height:30px;flex-shrink:0}.navbar__page-title{position:absolute;left:50%;transform:translate(-50%);font-size:17px;font-weight:700;color:var(--text-primary);white-space:nowrap;pointer-events:none;letter-spacing:-.2px}.navbar__hamburger{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:none;border-radius:10px;background:transparent;color:var(--text-primary);cursor:pointer;flex-shrink:0;transition:background-color .15s ease}.navbar__hamburger:hover{background-color:var(--bg-card)}.navbar__backdrop{position:fixed;inset:64px 0 0;background:#00000080;z-index:998}.navbar__menu{position:absolute;top:64px;left:0;right:0;z-index:999;background-color:var(--bg-surface);border-bottom:none;box-shadow:0 4px 16px #0006;padding:8px 0;transform:translateY(-100%);opacity:0;pointer-events:none;transition:transform .25s ease,opacity .25s ease}.navbar__menu--open{transform:translateY(0);opacity:1;pointer-events:auto}.navbar__menu-item{display:flex;align-items:center;gap:12px;width:100%;padding:12px 20px;color:var(--text-primary);text-decoration:none;font-size:15px;font-weight:500;border:none;background:none;cursor:pointer;transition:background-color .15s ease,border-color .15s ease;box-sizing:border-box;border-left:3px solid transparent}.navbar__menu-item:hover{background-color:var(--bg-card);border-left-color:var(--accent)}.navbar__menu-item--btn{font-family:inherit;text-align:left}.navbar__menu-divider{height:1px;margin:8px 20px;background-color:var(--bg-card)}.home{max-width:640px;margin:0 auto;padding:48px 20px 64px}.home__hero{text-align:center;margin-bottom:40px}.home__title{font-size:40px;font-weight:800;margin:0 0 8px;letter-spacing:-.5px;background:linear-gradient(135deg,var(--text-primary) 0%,#d4b896 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.home__tagline{font-size:18px;color:var(--accent);font-weight:600;margin:0 0 12px;text-shadow:0 0 16px rgba(var(--accent-rgb),.25)}.home__description{font-size:15px;color:var(--text-muted);margin:0;line-height:1.6}.home__tiles{display:flex;flex-direction:column;gap:12px;margin-bottom:40px}.home__tile{display:flex;align-items:flex-start;gap:16px;padding:20px;background:linear-gradient(135deg,var(--bg-card-light) 0%,var(--bg-card) 100%);border:1px solid var(--border);border-radius:12px;text-decoration:none;color:var(--text-primary);box-shadow:0 2px 8px #0000004d,0 8px 24px #00000026;transition:border-color .2s ease,transform .15s ease,box-shadow .25s ease}.home__tile:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 4px 16px rgba(var(--accent-rgb),.15),0 12px 32px #00000040}.home__tile--locked{opacity:.7}.home__tile--locked:hover{border-color:var(--text-dim);box-shadow:0 4px 12px #6b5c521a,0 8px 24px #0003}.home__tile-icon{flex-shrink:0;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background-color:var(--bg-surface);border-radius:10px;color:var(--accent);box-shadow:0 0 10px rgba(var(--accent-rgb),.1)}.home__tile-body{flex:1;min-width:0}.home__tile-title{margin:0 0 4px;font-size:17px;font-weight:700;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.home__tile-badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:9999px;background-color:var(--border);color:var(--text-muted)}.home__tile-desc{margin:0;font-size:13px;color:var(--text-muted);line-height:1.5}.home__footnote{text-align:center;font-size:13px;color:var(--text-dim);font-style:italic;margin:0}@media(max-width:480px){.home{padding:32px 16px 48px}.home__title{font-size:30px}.home__tagline{font-size:16px}.home__tile{padding:16px}.navbar__logo-text{display:none}}