:root{--color-bg: #0f1f18;--color-surface: #1a3328;--color-surface-2: #234535;--color-border: #2d6a4f40;--color-primary: #52b788;--color-primary-dark: #2d6a4f;--color-primary-glow: #52b78840;--color-accent: #f4a261;--color-accent-dark: #e76f51;--color-text: #d8f3dc;--color-text-muted: #74c69d;--color-text-dim: #40916c;--color-error: #e07070;--color-success: #52b788;--color-warning: #f4a261;--font-sans: "Outfit", system-ui, sans-serif;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-xl: 32px;--radius-full: 9999px;--shadow-sm: 0 1px 3px #00000040;--shadow-md: 0 4px 16px #00000050;--shadow-glow: 0 0 24px var(--color-primary-glow);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1);--duration-fast: .15s;--duration-base: .25s;--duration-slow: .4s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);min-height:100dvh;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.2;color:var(--color-text)}p{line-height:1.6}a{color:var(--color-primary);text-decoration:none;transition:color var(--duration-fast) var(--ease-smooth)}a:hover{color:var(--color-text)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.auth-page{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:var(--space-6);background:radial-gradient(ellipse 80% 60% at 50% 0%,#2d6a4f22 0%,transparent 70%),var(--color-bg)}.auth-card{width:100%;max-width:420px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-10) var(--space-8);box-shadow:var(--shadow-md),var(--shadow-glow);animation:fadeSlideUp var(--duration-slow) var(--ease-spring)}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.auth-logo{text-align:center;margin-bottom:var(--space-8)}.auth-logo-icon{font-size:3.5rem;display:block;margin-bottom:var(--space-2);filter:drop-shadow(0 0 12px #52b78880);animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.auth-logo h1{font-size:1.75rem;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-logo p{color:var(--color-text-muted);font-size:.9rem;margin-top:var(--space-1)}.auth-form{display:flex;flex-direction:column;gap:var(--space-4)}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-group label{font-size:.85rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em}.form-group input{background:var(--color-surface-2);border:1.5px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);color:var(--color-text);font-family:var(--font-sans);font-size:1rem;transition:border-color var(--duration-fast),box-shadow var(--duration-fast);outline:none}.form-group input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-glow)}.form-group input::placeholder{color:var(--color-text-dim)}.form-group input.error-field{border-color:var(--color-error);box-shadow:0 0 0 3px #e0707030}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-family:var(--font-sans);font-size:1rem;font-weight:600;border:none;border-radius:var(--radius-md);padding:var(--space-3) var(--space-6);cursor:pointer;transition:transform var(--duration-fast) var(--ease-spring),box-shadow var(--duration-fast),background var(--duration-fast)}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:disabled:active{transform:none}.btn-primary{background:linear-gradient(135deg,var(--color-primary),var(--color-primary-dark));color:#fff;box-shadow:0 4px 16px var(--color-primary-glow)}.btn-primary:hover:not(:disabled){box-shadow:0 6px 24px var(--color-primary-glow);transform:translateY(-1px)}.btn-full{width:100%}.alert{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:.9rem;font-weight:500}.alert-error{background:#e0707020;border:1px solid #e0707050;color:var(--color-error)}.alert-success{background:#52b78820;border:1px solid #52b78850;color:var(--color-success)}.auth-tabs{display:flex;background:var(--color-surface-2);border-radius:var(--radius-md);padding:var(--space-1);margin-bottom:var(--space-6);gap:var(--space-1)}.auth-tab{flex:1;padding:var(--space-2) var(--space-3);border:none;border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:.9rem;font-weight:600;cursor:pointer;transition:all var(--duration-base) var(--ease-smooth);background:transparent;color:var(--color-text-dim)}.auth-tab.active{background:var(--color-primary-dark);color:var(--color-text);box-shadow:var(--shadow-sm)}.spinner{width:18px;height:18px;border:2px solid #ffffff40;border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.dashboard{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-6);padding:var(--space-8)}.dashboard-greeting{text-align:center}.dashboard-greeting h1{font-size:2rem;margin-bottom:var(--space-2)}.dashboard-greeting p{color:var(--color-text-muted)}.dashboard-stats{display:flex;gap:var(--space-4);flex-wrap:wrap;justify-content:center}.stat-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5) var(--space-6);text-align:center;min-width:120px;box-shadow:var(--shadow-sm)}.stat-card .stat-icon{font-size:1.75rem;display:block;margin-bottom:var(--space-2)}.stat-card .stat-value{font-size:1.5rem;font-weight:700;color:var(--color-primary)}.stat-card .stat-label{font-size:.8rem;color:var(--color-text-muted);margin-top:var(--space-1)}.coming-soon-banner{background:var(--color-surface-2);border:1px dashed var(--color-border);border-radius:var(--radius-lg);padding:var(--space-8);text-align:center;max-width:480px;width:100%}.coming-soon-banner h2{font-size:1.25rem;color:var(--color-accent);margin-bottom:var(--space-2)}.coming-soon-banner p{color:var(--color-text-muted);font-size:.9rem}.game-root{position:relative;width:100vw;height:100dvh;overflow:hidden;background:radial-gradient(ellipse 120% 80% at 50% 110%,#2d6a4f18 0%,transparent 60%),radial-gradient(ellipse 60% 40% at 80% 10%,#52b78810 0%,transparent 50%),var(--color-bg)}.farm-root{position:relative;width:100%;height:100%}.farm-canvas-container{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.farm-canvas-container canvas{display:block;width:100%!important;height:100%!important}.farm-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);color:var(--color-text-muted);background:var(--color-bg);z-index:10}.farm-loading,.farm-error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);color:var(--color-text-muted)}.farm-loading-icon{font-size:3rem;animation:float 2s ease-in-out infinite}.hud-root{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between}.hud-topbar,.hud-bottom,.hud-toast,.hud-plot-popover{pointer-events:auto}.hud-topbar{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:linear-gradient(to bottom,#0f1f18ee,transparent);padding-top:env(safe-area-inset-top,var(--space-3));gap:var(--space-3)}.hud-stats{display:flex;gap:var(--space-2);align-items:center}.hud-stat{display:flex;align-items:center;gap:var(--space-1);font-size:.88rem;font-weight:600;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:5px 12px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hud-stat-icon{font-size:1rem}.hud-stat-level{flex-direction:row;gap:var(--space-2);padding:5px 14px 5px 10px}.hud-stat-xp{display:flex;flex-direction:column;gap:3px;font-size:.82rem}.hud-xp-bar{width:52px;height:4px;background:var(--color-surface-2);border-radius:var(--radius-full);overflow:hidden}.hud-xp-fill{height:100%;background:linear-gradient(90deg,#f4a261,#e9c46a);border-radius:var(--radius-full);transition:width .6s var(--ease-smooth)}.hud-ready-alert{display:flex;align-items:center;gap:var(--space-1);font-size:.82rem;font-weight:700;color:var(--color-primary);background:var(--color-surface);border:1.5px solid var(--color-primary);border-radius:var(--radius-full);padding:4px 12px;animation:pulse-border 1.5s ease-in-out infinite;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);white-space:nowrap}@keyframes pulse-border{0%,to{box-shadow:0 0 0 0 var(--color-primary-glow)}50%{box-shadow:0 0 0 4px var(--color-primary-glow)}}.hud-bottom{background:linear-gradient(to top,#0f1f18f5 0%,#0f1f18cc 80%,transparent 100%);padding:var(--space-4);padding-bottom:max(env(safe-area-inset-bottom,0px),var(--space-4))}.hud-slot-panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-5) var(--space-6);max-width:480px;margin:0 auto;box-shadow:var(--shadow-md);animation:fadeSlideUp .2s var(--ease-spring)}.hud-slot-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}.hud-slot-title{font-size:1rem;font-weight:600;color:var(--color-text)}.hud-close-btn{background:none;border:none;color:var(--color-text-dim);font-size:1rem;cursor:pointer;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);transition:color var(--duration-fast)}.hud-close-btn:hover{color:var(--color-text)}.hud-progress-section{margin-bottom:var(--space-4)}.hud-timer-row{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2);min-height:22px}.hud-timer-icon{font-size:1rem}.hud-timer-value{font-size:1.05rem;font-weight:700;color:var(--color-accent);font-variant-numeric:tabular-nums}.hud-timer-sub{font-size:.78rem;color:var(--color-text-dim)}.hud-ready-badge{font-size:.9rem;font-weight:700;color:var(--color-primary)}.hud-progress-stats{display:flex;justify-content:space-between;margin-top:var(--space-2);font-size:.78rem;color:var(--color-text-dim)}.hud-progress-stats strong{color:var(--color-text-muted)}.hud-progress-bar{height:8px;background:var(--color-surface-2);border-radius:var(--radius-full);overflow:hidden}.hud-progress-fill{height:100%;border-radius:var(--radius-full);transition:width 1s linear}.hud-actions{display:flex;flex-direction:column;gap:var(--space-2)}.hud-hint{font-size:.85rem;color:var(--color-text-dim);text-align:center;padding:var(--space-2)}.btn-full{width:100%;justify-content:center}.btn-harvest{background:linear-gradient(135deg,#52b788,#2d6a4f);color:#fff;box-shadow:0 4px 16px #52b78840;font-size:1.05rem;padding:var(--space-4) var(--space-6);border:none;border-radius:var(--radius-md);font-family:var(--font-sans);font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:var(--space-2);transition:transform var(--duration-fast) var(--ease-spring),box-shadow var(--duration-fast)}.btn-harvest:hover:not(:disabled){transform:translateY(-2px) scale(1.02);box-shadow:0 8px 24px #52b78860}.btn-harvest:active{transform:scale(.97)}.btn-harvest:disabled{opacity:.5;cursor:not-allowed}.btn-seed{background:var(--color-surface-2);border:1.5px solid var(--color-primary-dark);color:var(--color-text);font-family:var(--font-sans);font-size:.95rem;font-weight:600;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);cursor:pointer;display:inline-flex;align-items:center;transition:all var(--duration-fast) var(--ease-smooth)}.btn-seed:hover:not(:disabled){background:var(--color-primary-dark);border-color:var(--color-primary)}.btn-seed:disabled{opacity:.5;cursor:not-allowed}.btn-seed-inner{display:flex;align-items:center;justify-content:space-between;width:100%}.btn-seed-qty{font-size:.8rem;color:var(--color-text-muted);background:var(--color-surface);border-radius:var(--radius-full);padding:2px 8px}.btn-danger{background:linear-gradient(135deg,#e07070,#b94040);color:#fff;box-shadow:0 4px 12px #e0707030;border:none;border-radius:var(--radius-md);font-family:var(--font-sans);font-size:.95rem;font-weight:600;padding:var(--space-3) var(--space-6);cursor:pointer;display:inline-flex;align-items:center;gap:var(--space-2)}.btn-danger:hover:not(:disabled){box-shadow:0 6px 20px #e0707050}.hud-toast{position:absolute;top:70px;left:50%;transform:translate(-50%);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:var(--space-2) var(--space-5);font-size:.9rem;font-weight:600;white-space:nowrap;box-shadow:var(--shadow-md);animation:toastIn .25s var(--ease-spring);z-index:100}.hud-toast.success{border-color:var(--color-primary);color:var(--color-primary)}.hud-toast.error{border-color:var(--color-error);color:var(--color-error)}@keyframes toastIn{0%{opacity:0;transform:translate(-50%) translateY(-10px) scale(.9)}to{opacity:1;transform:translate(-50%) translateY(0) scale(1)}}.menu-toggle-btn{position:absolute;top:max(env(safe-area-inset-top,0px),var(--space-3));right:var(--space-4);z-index:50;background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);font-size:1.1rem;cursor:pointer;transition:background var(--duration-fast)}.menu-toggle-btn:hover{background:var(--color-surface-2)}.game-menu{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;justify-content:flex-end}.game-menu-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000070;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.game-menu-panel{position:relative;z-index:1;width:min(320px,85vw);height:100%;max-height:100dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--color-surface);border-left:1px solid var(--color-border);padding:var(--space-6) var(--space-5);display:flex;flex-direction:column;gap:var(--space-3);animation:slideInRight .25s var(--ease-spring)}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.game-menu-panel h2{font-size:1.25rem;color:var(--color-primary);margin-bottom:var(--space-4)}.game-menu-panel nav{display:flex;flex-direction:column;gap:var(--space-2);flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.menu-item{background:none;border:1px solid transparent;border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);font-family:var(--font-sans);font-size:.95rem;font-weight:600;color:var(--color-text);cursor:pointer;text-align:left;transition:all var(--duration-fast)}.menu-item:hover:not(:disabled){background:var(--color-surface-2);border-color:var(--color-border)}.menu-item.disabled{color:var(--color-text-dim);cursor:not-allowed}.menu-item-danger{color:var(--color-error)}.menu-item-danger:hover:not(:disabled){background:#e0707015;border-color:#e0707030}.menu-divider{height:1px;background:var(--color-border);margin:var(--space-2) 0}.shop-overlay,.shop-modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;z-index:9999;display:flex;align-items:center;justify-content:center;padding:10px;background:#0a0f14bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:fadeIn .2s ease-out forwards;pointer-events:auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.shop-card,.shop-modal{width:100%;max-width:720px;max-height:90vh;background:var(--color-surface);border:1px solid rgba(255,255,255,.15);border-radius:var(--radius-xl);display:flex;flex-direction:column;box-shadow:0 12px 40px #000000b3,var(--shadow-glow);animation:modalScaleUp .25s cubic-bezier(.34,1.56,.64,1) forwards;overflow:hidden}@keyframes modalScaleUp{0%{opacity:0;transform:scale(.92) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}.shop-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--color-border)}.shop-header h2{font-size:1.2rem;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.shop-close-btn{background:none;border:none;color:var(--color-text-dim);font-size:1.2rem;cursor:pointer;padding:4px 8px;border-radius:var(--radius-sm);transition:color var(--duration-fast)}.shop-close-btn:hover{color:var(--color-text)}.shop-tabs{display:flex;background:var(--color-surface-2);border-bottom:1px solid var(--color-border);padding:4px}.shop-tab{flex:1;background:none;border:none;color:var(--color-text-dim);font-family:var(--font-sans);font-size:.9rem;font-weight:600;padding:var(--space-3);cursor:pointer;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-smooth)}.shop-tab.active{background:var(--color-primary-dark);color:var(--color-text)}.shop-content{flex:1;overflow-y:auto;padding:var(--space-4) var(--space-6)}.shop-list{display:flex;flex-direction:column;gap:var(--space-3);padding:2px 0}.shop-item{display:flex;align-items:center;justify-content:space-between;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);gap:var(--space-4);transition:border-color var(--duration-fast)}.shop-item:hover{border-color:var(--color-primary-dark)}.shop-item.locked{opacity:.7}.shop-item-info{display:flex;align-items:center;gap:var(--space-3)}.shop-item-icon{font-size:1.5rem}.shop-item-name{font-weight:600;font-size:.95rem;color:var(--color-text);display:flex;align-items:center;gap:var(--space-2)}.shop-item-desc{font-size:.8rem;color:var(--color-text-dim);margin-top:2px}.shop-item-actions{display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-2);min-width:100px}.shop-item-price{font-size:.9rem;font-weight:700;color:var(--color-accent)}.btn-sm{padding:5px 12px;font-size:.8rem;border-radius:var(--radius-sm)}.locked-badge{font-size:.72rem;color:var(--color-error);background:#e0707026;border:1px solid rgba(224,112,112,.3);border-radius:var(--radius-sm);padding:1px 6px;text-transform:uppercase}.shop-empty-hint{text-align:center;font-size:.85rem;color:var(--color-text-dim);padding:var(--space-8) 0}.shop-loading,.shop-error{display:flex;align-items:center;justify-content:center;gap:var(--space-2);color:var(--color-text-muted);font-size:.9rem;padding:var(--space-12) 0}.shop-footer{padding:var(--space-4) var(--space-6);border-top:1px solid var(--color-border);background:var(--color-surface-2);font-size:.9rem;color:var(--color-text-muted);text-align:right}