:root{--color-pink-50: #fff5fa;--color-pink-100: #ffe5f0;--color-pink-200: #ffcfe1;--color-pink-300: #ffaecc;--color-pink-400: #ff8cb6;--color-pink-500: #f06aa1;--color-blue-50: #f1f7ff;--color-blue-100: #dceaff;--color-blue-200: #bdd6ff;--color-blue-300: #95bdff;--color-blue-400: #6ea3f5;--color-lavender-100: #efe7ff;--color-lavender-200: #ddd0ff;--color-lavender-300: #c4b1ff;--color-lavender-400: #a589f5;--color-mint-300: #a8e6cf;--color-peach-200: #ffd9c2;--color-cream: #fff9fc;--color-ink: #3d2a5c;--color-ink-soft: #6b5b8a;--color-ink-mute: #9b8eaf;--color-success: #4fbf94;--color-error: #e0598a;--gradient-dream: linear-gradient(135deg, var(--color-pink-200) 0%, var(--color-lavender-200) 50%, var(--color-blue-200) 100%);--gradient-sky: linear-gradient(180deg, var(--color-blue-100) 0%, var(--color-pink-100) 100%);--gradient-iridescent: linear-gradient(135deg, #ffd6e8 0%, #e0d4ff 25%, #c8e0ff 50%, #d6f0e8 75%, #ffe5d6 100%);--gradient-canvas: linear-gradient(180deg, #ffd6ec 0%, #e2d1ff 45%, #c8e0ff 100%);--gradient-button-primary: linear-gradient(135deg, var(--color-pink-300), var(--color-lavender-300));--gradient-button-success: linear-gradient(135deg, var(--color-mint-300), var(--color-blue-300));--shadow-soft: 0 4px 16px rgba(168, 138, 220, .18);--shadow-bloom: 0 8px 32px rgba(168, 138, 220, .25);--shadow-glow-pink: 0 0 20px rgba(255, 174, 204, .55);--shadow-glow-blue: 0 0 20px rgba(149, 189, 255, .5);--shadow-inset-light: inset 0 1px 0 rgba(255, 255, 255, .6);--glass-bg: rgba(255, 249, 252, .65);--glass-bg-strong: rgba(255, 249, 252, .85);--glass-border: rgba(255, 255, 255, .7);--glass-blur: blur(14px);--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--radius-xl: 28px;--radius-pill: 999px;--font-base: "Quicksand", "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-display: "Quicksand", "Nunito", system-ui, sans-serif;--transition-fast: .15s ease;--transition: .22s ease;--transition-slow: .4s ease;--z-canvas-overlay: 10;--z-modal: 100}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;font-family:var(--font-base);color:var(--color-ink);background:var(--gradient-sky);background-attachment:fixed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:radial-gradient(circle at 20% 30%,rgba(255,255,255,.6) 0,transparent 1.5px),radial-gradient(circle at 70% 60%,rgba(255,255,255,.5) 0,transparent 1.5px),radial-gradient(circle at 40% 80%,rgba(255,255,255,.55) 0,transparent 1.5px),radial-gradient(circle at 85% 20%,rgba(255,255,255,.4) 0,transparent 1.5px);background-size:220px 220px,320px 320px,180px 180px,260px 260px;opacity:.7;z-index:0}button{cursor:pointer;padding:9px 16px;border:1px solid var(--glass-border);background:var(--glass-bg-strong);color:var(--color-ink);border-radius:var(--radius-pill);font:inherit;font-weight:500;box-shadow:var(--shadow-soft),var(--shadow-inset-light);transition:transform var(--transition-fast),box-shadow var(--transition),background var(--transition);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}button:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--shadow-bloom),var(--shadow-glow-pink)}button:active:not(:disabled){transform:translateY(0)}button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}input,select{font:inherit;padding:10px 14px;border:1px solid var(--glass-border);border-radius:var(--radius-md);background:var(--glass-bg-strong);color:var(--color-ink);width:100%;transition:border-color var(--transition),box-shadow var(--transition)}input::placeholder{color:var(--color-ink-mute)}input:focus,select:focus{outline:none;border-color:var(--color-pink-300);box-shadow:var(--shadow-glow-pink)}a{color:var(--color-lavender-400);text-decoration:none;font-weight:500;transition:color var(--transition-fast)}a:hover{color:var(--color-pink-400)}.auth-card{position:relative;max-width:400px;margin:80px auto;padding:32px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-bloom),var(--shadow-inset-light);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);z-index:1}.auth-card h1{margin:0 0 20px;font-weight:600;background:var(--gradient-button-primary);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:.5px}.auth-card form{display:flex;flex-direction:column;gap:14px}.auth-card label{display:flex;flex-direction:column;gap:6px;font-size:14px}.auth-card label span{color:var(--color-ink-soft);font-weight:500}.auth-card .auth-error{color:var(--color-error);margin:0;font-size:14px;font-weight:500}.auth-card button[type=submit]{background:var(--gradient-button-primary);color:#fff;border:none;font-weight:600;letter-spacing:.3px;box-shadow:var(--shadow-bloom),var(--shadow-glow-pink)}.auth-card button[type=submit]:hover:not(:disabled){box-shadow:var(--shadow-bloom),var(--shadow-glow-pink),var(--shadow-glow-blue)}.auth-card p{color:var(--color-ink-soft);font-size:14px;margin:16px 0 0}.garden-page{display:flex;flex-direction:column;height:100vh;position:relative;z-index:1}.garden-hud{display:flex;align-items:center;gap:18px;padding:14px 28px;background:var(--glass-bg);border-bottom:1px solid var(--glass-border);box-shadow:var(--shadow-soft);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}.garden-hud h1{flex:1;font-size:22px;margin:0;font-weight:600;background:var(--gradient-button-primary);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.garden-hud .coins{font-variant-numeric:tabular-nums;font-weight:600;color:var(--color-ink)}.garden-hud .coins-rate{font-variant-numeric:tabular-nums;color:var(--color-success);font-size:13px;font-weight:500}.garden-canvas{flex:1;min-height:0;position:relative;background:var(--gradient-canvas)}.garden-hint{position:absolute;top:28px;left:50%;transform:translate(-50%);background:var(--glass-bg-strong);border:1px solid var(--glass-border);padding:12px 22px;border-radius:var(--radius-pill);box-shadow:var(--shadow-bloom),var(--shadow-glow-pink);pointer-events:none;font-weight:500;color:var(--color-ink);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}.garden-loading{padding:24px;color:var(--color-ink-soft)}.canvas-toggle{position:absolute;top:14px;right:14px;z-index:var(--z-canvas-overlay);display:inline-flex;align-items:center;gap:8px;padding:8px 14px;background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:var(--radius-pill);font-size:13px;cursor:pointer;-webkit-user-select:none;user-select:none;box-shadow:var(--shadow-soft);color:var(--color-ink);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}.canvas-toggle input{width:auto;padding:0;box-shadow:none;border:none;accent-color:var(--color-pink-400)}.watering-can,.harvest-mark{font-size:24px;-webkit-user-select:none;user-select:none;pointer-events:none;filter:drop-shadow(0 2px 6px rgba(149,189,255,.6))}.plant-label{background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:var(--radius-md);padding:4px 10px;text-align:center;white-space:nowrap;-webkit-user-select:none;user-select:none;pointer-events:auto;cursor:pointer;box-shadow:var(--shadow-soft);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);transition:box-shadow var(--transition)}.plant-label:hover{box-shadow:var(--shadow-glow-pink)}.plant-label-char{font-size:18px;line-height:1.1;color:var(--color-ink);font-weight:600}.plant-label-pinyin{font-size:11px;color:var(--color-ink-soft);line-height:1.2}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#ffaecc40,#95bdff40);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);animation:dream-fade-in var(--transition) ease-out}.modal-card{background:var(--glass-bg-strong);border:1px solid var(--glass-border);padding:28px;border-radius:var(--radius-xl);min-width:340px;max-width:480px;box-shadow:var(--shadow-bloom),var(--shadow-glow-pink),var(--shadow-inset-light);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);animation:dream-pop-in var(--transition-slow) cubic-bezier(.34,1.56,.64,1)}.modal-card h2{margin:0 0 16px;font-weight:600;color:var(--color-ink)}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}.cosmetics-list{display:flex;flex-direction:column;gap:12px}.cosmetics-empty{color:var(--color-ink-soft);font-size:14px;line-height:1.4}.cosmetics-empty code{background:#ffffff73;padding:1px 6px;border-radius:4px;font-size:13px}.cosmetics-items{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;max-height:320px;overflow-y:auto}.cosmetics-items li{padding:0}.cosmetics-item-btn{width:100%;padding:8px 12px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius);display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;font:inherit;color:inherit;text-align:left}.cosmetics-item-btn:hover:not(:disabled){background:var(--glass-bg-strong)}.cosmetics-item-btn:disabled{opacity:.6;cursor:default}.cosmetics-price{color:var(--color-ink-soft);font-size:13px}.cosmetics-error{color:#c33;font-size:13px;margin:0}.garden-hint-cancel{margin-left:8px;padding:2px 10px;font-size:13px}.placed-cosmetic h2{margin:0 0 8px}.plant-form{display:flex;flex-direction:column;gap:14px}.plant-form label{display:flex;flex-direction:column;gap:6px;font-size:14px}.plant-form label span{color:var(--color-ink-soft);font-weight:500}.plant-form .suggest-row{display:flex;align-items:flex-end;gap:10px;padding:14px;background:linear-gradient(135deg,#ffcfe166,#bdd6ff66);border:1px solid var(--glass-border);border-radius:var(--radius-lg)}.plant-form .suggest-row button{flex:1}.plant-form .suggest-level{flex:0 0 auto;min-width:90px}.plant-card,.quiz-card{text-align:center}.quiz-character{font-size:72px;line-height:1;background:var(--gradient-button-primary);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 12px rgba(255,174,204,.5))}.quiz-pinyin{font-size:22px;color:var(--color-ink-soft);margin:6px 0 18px;letter-spacing:.5px}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.quiz-options button{padding:14px;font-size:16px}.quiz-result{padding:12px 0}.quiz-result.ok p{color:var(--color-success);font-weight:600}.quiz-result.bad p{color:var(--color-error);font-weight:600}.plant-card .plant-translation{font-size:18px;margin:8px 0 18px;color:var(--color-ink)}.plant-stats{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:0;text-align:left;padding:14px 16px;background:linear-gradient(135deg,#ddd0ff59,#ffcfe159);border:1px solid var(--glass-border);border-radius:var(--radius-lg)}.plant-stats dt{color:var(--color-ink-mute);font-size:13px}.plant-stats dd{margin:0;color:var(--color-ink);font-weight:500}.btn-harvest{background:var(--gradient-button-success);color:#fff;border:none;font-weight:600;box-shadow:var(--shadow-bloom),var(--shadow-glow-blue)}.btn-harvest:hover:not(:disabled){box-shadow:var(--shadow-bloom),var(--shadow-glow-blue),var(--shadow-glow-pink)}.collection-page{position:relative;z-index:1;padding:32px;max-width:720px;margin:0 auto}.collection-page header{display:flex;gap:16px;align-items:baseline;margin-bottom:24px}.collection-page header h1{flex:1;margin:0;font-weight:600;background:var(--gradient-button-primary);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.collection-empty,.collection-loading{color:var(--color-ink-soft);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:20px 24px;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}.collection-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}.collection-item{display:flex;gap:16px;align-items:baseline;padding:14px 18px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);transition:box-shadow var(--transition),transform var(--transition-fast)}.collection-item:hover{transform:translateY(-1px);box-shadow:var(--shadow-bloom),var(--shadow-glow-pink)}.collection-item .character{font-size:28px;color:var(--color-ink);font-weight:600}.collection-item .pinyin{color:var(--color-ink-soft)}.collection-item .translation{flex:1;color:var(--color-ink)}.collection-item .date{color:var(--color-ink-mute);font-size:12px}@keyframes dream-fade-in{0%{opacity:0}to{opacity:1}}@keyframes dream-pop-in{0%{opacity:0;transform:scale(.92) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}@media (max-width: 640px){.garden-hud{flex-wrap:wrap;gap:6px 8px;padding:10px 12px}.garden-hud h1,.garden-hud .hud-user{display:none}.garden-hud .coins{font-size:14px}.garden-hud .coins-rate{font-size:11px}.garden-hud>:not(h1):not(.hud-user){font-size:13px}.garden-hud button,.garden-hud a{padding:6px 10px;font-size:13px}.canvas-toggle{top:auto;bottom:12px;right:12px;padding:6px 10px;font-size:12px}.garden-hint{top:12px;max-width:calc(100% - 24px);padding:10px 16px;font-size:13px;line-height:1.4;text-align:center}.garden-hint-cancel{margin-left:6px;padding:2px 8px;font-size:12px}.modal-card{min-width:0;width:calc(100vw - 24px);max-width:480px;padding:18px}.modal-actions{flex-wrap:wrap;gap:8px;justify-content:stretch}.modal-actions button{flex:1 1 auto;min-width:0}.plant-form .suggest-row{flex-direction:column;align-items:stretch;padding:12px}.plant-form .suggest-level{min-width:0}.quiz-options{grid-template-columns:1fr}.quiz-character{font-size:56px}.quiz-pinyin{font-size:18px}.auth-card{margin:24px 16px;padding:22px}.collection-page{padding:18px 16px}.collection-page header{margin-bottom:16px}.collection-item{flex-wrap:wrap;align-items:center;gap:6px 12px;padding:12px 14px}.collection-item .character{font-size:24px}.collection-item .translation{flex:1 1 100%}.collection-item .date{flex:0 0 auto;margin-left:auto}}