.onboarding{width:100%;height:100%;padding:calc(var(--spacing-unit) * 3 + var(--safe-top)) calc(var(--spacing-unit) * 3) calc(var(--spacing-unit) * 3 + var(--safe-bottom));justify-content:center;align-items:center;display:flex;overflow-y:auto}.onboarding-content{width:100%;max-width:360px;margin:auto}.onboarding h1{letter-spacing:-.03em;margin-bottom:calc(var(--spacing-unit) * 4);text-align:center;font-size:26px;font-weight:700}.onboarding h2{font-size:var(--text-md);margin-bottom:var(--spacing-unit);font-weight:700}.onboarding button[type=submit]{width:100%}.form-group{margin-bottom:calc(var(--spacing-unit) * 3)}.form-group label{margin-bottom:var(--spacing-unit);font-size:var(--text-sm);color:var(--color-text);font-weight:600;display:block}.form-group small{margin-top:var(--spacing-unit);color:var(--color-text-secondary);font-size:var(--text-xs);line-height:1.4;display:block}.form-group select{width:100%;padding:calc(var(--spacing-unit) * 1.5);border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-background);color:var(--color-text);font-family:inherit;font-size:16px}.error{background-color:var(--color-error);color:#fff;padding:var(--spacing-unit) calc(var(--spacing-unit) * 1.5);border-radius:var(--radius-sm);margin-bottom:calc(var(--spacing-unit) * 2);font-size:var(--text-sm)}.privacy-notice{background-color:var(--color-surface);padding:calc(var(--spacing-unit) * 2.5);border-radius:var(--radius-md);margin-bottom:calc(var(--spacing-unit) * 3);font-size:var(--text-sm);color:var(--color-text-secondary)}.privacy-notice p+p{margin-top:var(--spacing-unit)}.privacy-notice ul{margin:var(--spacing-unit) 0;padding-left:calc(var(--spacing-unit) * 2.5)}.privacy-notice li{margin-bottom:4px}.privacy-notice .warning{margin-top:calc(var(--spacing-unit) * 2);padding:calc(var(--spacing-unit) * 1.5);background-color:var(--color-warning);color:#fff;border-radius:var(--radius-sm)}.creating{text-align:center;padding:calc(var(--spacing-unit) * 4);font-size:var(--text-sm);color:var(--color-text-secondary)}.creating .loading-spinner{margin:0 auto calc(var(--spacing-unit) * 2)}.chat{background-color:var(--color-surface);border-radius:var(--radius-lg);flex-direction:column;flex:1;min-height:132px;display:flex;overflow:hidden}.chat-messages{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:calc(var(--spacing-unit) * 1.25);scrollbar-width:thin;flex-direction:column;flex:1;gap:6px;display:flex;overflow-y:auto}.chat-messages>:first-child{margin-top:auto}.chat-empty{font-size:var(--text-sm);color:var(--color-text-secondary);margin:auto}.message{max-width:88%;display:flex}.message-user{align-self:flex-end}.message-assistant{align-self:flex-start}.message-content{font-size:var(--text-sm);border-radius:var(--radius-md);word-wrap:break-word;overflow-wrap:anywhere;padding:7px 10px;line-height:1.35}.message-user .message-content{background-color:var(--color-primary);color:#fff;border-bottom-right-radius:5px}.message-assistant .message-content{background-color:var(--color-background);color:var(--color-text);box-shadow:var(--shadow-sm);border-bottom-left-radius:5px}.message-pending .message-content{align-items:center;gap:4px;padding:11px 12px;display:flex}.typing-dot{background-color:var(--color-text-secondary);width:5px;height:5px;animation:typing-bounce 1.2s var(--ease-out) infinite;border-radius:50%}.typing-dot:nth-child(2){animation-delay:.15s}.typing-dot:nth-child(3){animation-delay:.3s}@keyframes typing-bounce{0%,60%,to{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}@media (prefers-reduced-motion:reduce){.typing-dot{opacity:.6;animation:none}}.chat-error{padding:0 calc(var(--spacing-unit) * 1.25) 4px;color:var(--color-error);font-size:var(--text-xs)}.chat-input-form{border-top:1px solid var(--color-border);align-items:center;gap:6px;padding:6px;display:flex}.chat-input{border-radius:var(--radius-pill);background-color:var(--color-background);border:1px solid #0000;flex:1;min-width:0;height:34px;padding:0 12px;font-size:16px}.chat-input::placeholder{font-size:var(--text-sm);color:var(--color-text-secondary)}.chat-input:disabled{opacity:.6}.chat-send-button{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:34px;min-width:0;height:34px;min-height:0;padding:0;display:flex}.camera-modal{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:900;background-color:#080a0e99;align-items:flex-end;display:flex;position:absolute;inset:0}.camera-content{background-color:var(--color-background);border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100%;max-height:88%;padding-bottom:var(--safe-bottom);animation:sheet-up .26s var(--ease-out);flex-direction:column;display:flex;overflow:hidden}@keyframes sheet-up{0%{opacity:0;transform:translateY(12%)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.camera-content{animation:none}}.camera-header{justify-content:space-between;align-items:center;gap:var(--spacing-unit);padding:calc(var(--spacing-unit) * 1.5) calc(var(--spacing-unit) * 2);display:flex}.camera-header h2{font-size:var(--text-md);letter-spacing:-.01em;margin:0;font-weight:700}.camera-close{color:var(--color-text-secondary);cursor:pointer;background:0 0;border:none;min-width:32px;min-height:32px;padding:0;font-size:26px;line-height:1}.camera-close:hover:not(:disabled){color:var(--color-text);background:0 0}.camera-capture{padding:0 calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) * 3);gap:calc(var(--spacing-unit) * 2);flex-direction:column;display:flex}.camera-instructions{color:var(--color-text-secondary);font-size:var(--text-sm)}.camera-file-input{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.camera-button{justify-content:center;align-items:center;gap:var(--spacing-unit);width:100%;font-size:var(--text-md);display:flex}.camera-preview{padding:0 calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) * 2);gap:calc(var(--spacing-unit) * 2);flex-direction:column;display:flex;overflow:hidden}.preview-image{object-fit:contain;border-radius:var(--radius-md);background-color:var(--color-surface);width:100%;max-height:46dvh}.camera-actions{gap:var(--spacing-unit);display:flex}.camera-actions button{flex:1}.button-secondary{background-color:var(--color-surface);color:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-border)}.button-secondary:hover:not(:disabled){background-color:var(--color-surface-strong)}.button-primary{background-color:var(--color-primary);color:#fff}.camera-processing{padding:calc(var(--spacing-unit) * 3) calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) * 5);align-items:center;gap:calc(var(--spacing-unit) * 2);font-size:var(--text-sm);color:var(--color-text-secondary);flex-direction:column;display:flex}.sleep-container{width:100%;height:100%;padding:calc(var(--spacing-unit) * 3);justify-content:center;align-items:center;display:flex}.sleep-content{text-align:center;width:100%;max-width:320px}.sleep-icon{margin-bottom:calc(var(--spacing-unit) * 2);font-size:56px;line-height:1;animation:4s ease-in-out infinite float}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@media (prefers-reduced-motion:reduce){.sleep-icon{animation:none}}.sleep-content h2{letter-spacing:-.02em;margin-bottom:calc(var(--spacing-unit) * 2);font-size:20px;font-weight:700}.sleep-message{color:var(--color-text-secondary);margin-bottom:calc(var(--spacing-unit) * 3);font-size:var(--text-sm)}.timer-display{color:var(--color-primary);font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin-bottom:2px;font-size:40px;font-weight:700}.timer-label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-secondary)}.sleep-ready{gap:calc(var(--spacing-unit) * 2);flex-direction:column;display:flex}.evolution-button{font-size:var(--text-md);background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.evolution-container{width:100%;height:100%;padding:calc(var(--spacing-unit) * 3);background:linear-gradient(135deg,#667eea1a 0%,#764ba21a 100%);justify-content:center;align-items:center;display:flex}.evolution-content{text-align:center;width:100%;max-width:320px}.evolution-animation{width:140px;height:140px;margin:0 auto calc(var(--spacing-unit) * 4);position:relative}.evolution-video{aspect-ratio:1;width:100%;margin:0 auto calc(var(--spacing-unit) * 3);border-radius:var(--radius-lg);object-fit:cover;background:#000;display:block}.evolution-video::-webkit-media-controls{display:none!important}.evolution-video::-webkit-media-controls-enclosure{display:none!important}.evolution-orb{opacity:.6;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:50%;width:56px;height:56px;animation:4s ease-in-out infinite orbit;position:absolute}.evolution-orb:first-child{animation-delay:0s;top:0;left:50%;transform:translate(-50%)}.evolution-orb:nth-child(2){animation-delay:1.33s;top:50%;left:0;transform:translateY(-50%)}.evolution-orb:nth-child(3){animation-delay:2.66s;top:50%;right:0;transform:translateY(-50%)}@keyframes orbit{0%,to{opacity:.6;transform:scale(1)translateY(0)}50%{opacity:1;transform:scale(1.5)translateY(-20px)}}@media (prefers-reduced-motion:reduce){.evolution-orb{opacity:.8;animation:none}}.evolution-content h2{letter-spacing:-.02em;margin-bottom:var(--spacing-unit);background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:24px;font-weight:700}.evolution-status{color:var(--color-text-secondary);font-size:var(--text-sm)}.evolution-warning{margin-top:calc(var(--spacing-unit) * 2);color:var(--color-text-secondary);font-size:var(--text-sm)}.evolution-continue{width:100%;margin-top:calc(var(--spacing-unit) * 3)}.evolution-error{margin-top:calc(var(--spacing-unit) * 4);padding:calc(var(--spacing-unit) * 2.5);background-color:var(--color-error);color:#fff;border-radius:var(--radius-md);font-size:var(--text-sm)}.evolution-error p{margin-bottom:calc(var(--spacing-unit) * 2)}.evolution-error button{color:var(--color-error);background-color:#fff}.creature-view{flex-direction:column;width:100%;height:100%;display:flex;overflow:hidden}.creature-view-loading{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.creature-stage{flex:none;width:100%;position:relative;overflow:hidden}.creature-image{aspect-ratio:1;object-fit:cover;object-position:center 45%;width:100%;max-height:46dvh;animation:7s ease-in-out infinite creature-breathe;display:block}.creature-stage:after{content:"";background:linear-gradient(to top, var(--color-background), transparent);pointer-events:none;height:56px;position:absolute;bottom:0;left:0;right:0}@keyframes creature-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.025)}}@media (prefers-reduced-motion:reduce){.creature-image{animation:none}}@media (width>=600px){.creature-stage{border-top-left-radius:31px;border-top-right-radius:31px}}.creature-panel{gap:calc(var(--spacing-unit) * 1.5);min-height:0;padding:6px calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) + var(--safe-bottom));flex-direction:column;flex:1;display:flex}.creature-identity{align-items:center;gap:var(--spacing-unit);flex-wrap:wrap;display:flex}.creature-name{letter-spacing:-.02em;font-size:19px;font-weight:700;line-height:1.2}.creature-tags{align-items:center;gap:4px;display:flex}.tag{text-transform:uppercase;letter-spacing:.06em;border-radius:var(--radius-pill);background-color:var(--color-surface);color:var(--color-text-secondary);white-space:nowrap;padding:3px 7px;font-size:10px;font-weight:600}.tag-mood.mood-happy{color:#0f9d76;background-color:#10b98124}.tag-mood.mood-sad{color:var(--color-primary);background-color:#6366f124}.tag-mood.mood-anxious{color:#b7791f;background-color:#f59e0b29}@media (prefers-color-scheme:dark){.tag-mood.mood-happy{color:#34d399}.tag-mood.mood-anxious{color:#fbbf24}}.creature-stats{gap:var(--spacing-unit) calc(var(--spacing-unit) * 1.5);grid-template-columns:1fr 1fr;display:grid}.stat{flex-direction:column;gap:5px;display:flex}.stat-head{justify-content:space-between;align-items:center;gap:6px;display:flex}.stat-label{text-transform:uppercase;letter-spacing:.07em;color:var(--color-text-secondary);font-size:10px;font-weight:600}.stat-value{font-variant-numeric:tabular-nums;color:var(--color-text);font-size:11px;font-weight:700}.stat-bar{background-color:var(--color-surface-strong);border-radius:var(--radius-pill);height:5px;overflow:hidden}.stat-bar-fill{border-radius:var(--radius-pill);height:100%;transition:width .4s var(--ease-out)}.stat-bar-fill.hunger{background:linear-gradient(90deg,#fbbf24,#ef4444)}.stat-bar-fill.happiness{background:linear-gradient(90deg,#34d399,#10b981)}.creature-actions{gap:var(--spacing-unit);display:flex}.action-button{min-height:38px;padding:0 calc(var(--spacing-unit) * 1.5);font-size:var(--text-sm);flex:1;justify-content:center;align-items:center;gap:6px;font-weight:600;display:flex}.action-button svg{flex-shrink:0}.look-button{background-color:var(--color-surface);color:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-border)}.look-button:hover:not(:disabled){background-color:var(--color-surface-strong)}.feed-button{background-color:var(--color-success)}.feed-button:hover:not(:disabled){background-color:#0d9668}.dev-settings{z-index:1200;background:var(--color-background);flex-direction:column;display:flex;position:absolute;inset:0}.dev-settings-header,.dev-settings-footer{justify-content:space-between;align-items:center;gap:calc(var(--spacing-unit) * 2);padding:calc(var(--spacing-unit) * 2);border-color:var(--color-border);background:color-mix(in srgb, var(--color-background) 92%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);flex:none;display:flex}.dev-settings-header{padding-top:calc(var(--safe-top) + var(--spacing-unit) * 2);border-bottom:1px solid var(--color-border)}.dev-settings-header h1{font-size:22px;line-height:1.2}.dev-settings-kicker{color:var(--color-primary);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;margin-bottom:2px;font-weight:700;display:block}button.dev-settings-close{background:var(--color-surface);width:40px;min-height:40px;color:var(--color-text);padding:0;font-size:26px;line-height:1}.dev-settings-body{padding:calc(var(--spacing-unit) * 2);padding-bottom:calc(var(--spacing-unit) * 4);flex:auto;overflow-y:auto}.dev-settings-section+.dev-settings-section{margin-top:calc(var(--spacing-unit) * 3)}.dev-settings-section h2{margin-bottom:calc(var(--spacing-unit) * 1.5);font-size:16px}.dev-settings-section label{color:var(--color-text-secondary);font-size:var(--text-sm);margin-bottom:6px;font-weight:600;display:block}.dev-settings-section select{width:100%;min-height:44px;padding:0 calc(var(--spacing-unit) * 1.5);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-background);color:var(--color-text);font:inherit}.dev-settings-field+.dev-settings-field{margin-top:calc(var(--spacing-unit) * 2)}.dev-settings-field textarea{resize:vertical;min-height:84px;line-height:1.45}.dev-settings-gallery>p{margin-bottom:calc(var(--spacing-unit) * 2);color:var(--color-text-secondary);font-size:var(--text-sm)}.dev-settings-gallery-stage+.dev-settings-gallery-stage{margin-top:calc(var(--spacing-unit) * 2)}.dev-settings-gallery-stage h3{margin-bottom:var(--spacing-unit);color:var(--color-text-secondary);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase}.dev-settings-gallery-grid{gap:var(--spacing-unit);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.dev-settings-gallery-grid figure{min-width:0}.dev-settings-gallery-grid img{aspect-ratio:1;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);object-fit:cover;width:100%;display:block}.dev-settings-gallery-grid figcaption{color:var(--color-text-secondary);text-align:center;text-overflow:ellipsis;white-space:nowrap;margin-top:4px;font-size:10px;overflow:hidden}.dev-settings-re-evolve{padding:calc(var(--spacing-unit) * 2);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.dev-settings-re-evolve>p{margin-bottom:calc(var(--spacing-unit) * 1.5);color:var(--color-text-secondary);font-size:var(--text-sm)}.dev-settings-previews{gap:var(--spacing-unit);margin-bottom:calc(var(--spacing-unit) * 1.5);grid-template-columns:1fr 1fr;display:grid}.dev-settings-previews img{aspect-ratio:1;border-radius:var(--radius-sm);object-fit:cover;background:var(--color-background);width:100%;display:block}.dev-settings-video{width:100%;margin-bottom:calc(var(--spacing-unit) * 1.5);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-background);display:block}.dev-settings-status{font-weight:600;color:var(--color-text)!important}.dev-settings-re-evolve progress{width:100%;height:8px;margin-bottom:calc(var(--spacing-unit) * 1.5);accent-color:var(--color-primary);display:block}button.dev-settings-re-evolve-button{width:100%}.dev-settings-error{margin-top:calc(var(--spacing-unit) * 2);padding:calc(var(--spacing-unit) * 1.5);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--color-error) 12%, transparent);color:var(--color-error);font-size:var(--text-sm)}.dev-settings-footer{padding-bottom:calc(var(--safe-bottom) + var(--spacing-unit) * 2);border-top:1px solid var(--color-border);justify-content:stretch}.dev-settings-footer button{width:100%}:root{--color-primary:#6366f1;--color-primary-dark:#4f46e5;--color-background:#fff;--color-surface:#f4f4f6;--color-surface-strong:#e9e9ee;--color-text:#16181d;--color-text-secondary:#71757f;--color-border:#e4e4e9;--color-error:#ef4444;--color-success:#10b981;--color-warning:#f59e0b;--spacing-unit:8px;--border-radius:12px;--radius-sm:8px;--radius-md:14px;--radius-lg:22px;--radius-pill:999px;--text-xs:11px;--text-sm:13px;--text-md:15px;--shadow-sm:0 1px 2px #1012170f;--shadow-md:0 8px 24px #1012171a;--shadow-lg:0 24px 60px #1012172e;--transition-duration:.2s;--ease-out:cubic-bezier(.22, 1, .36, 1);--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--app-max-width:430px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}@media (prefers-color-scheme:dark){:root{--color-background:#0d0f14;--color-surface:#191c23;--color-surface-strong:#232732;--color-text:#f4f5f7;--color-text-secondary:#9096a3;--color-border:#262a34;--shadow-sm:0 1px 2px #0006;--shadow-md:0 8px 24px #00000073;--shadow-lg:0 24px 60px #0009}}*{box-sizing:border-box;margin:0;padding:0}html,body{overscroll-behavior:none;width:100%;height:100%;overflow:hidden}body{font-family:var(--font-family);background-color:var(--color-background);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;line-height:1.45}#root{width:100%;height:100dvh}.app{background-color:var(--color-background);flex-direction:column;width:100%;height:100%;display:flex;position:relative;overflow:hidden}@media (width>=600px){body{background-color:var(--color-surface)}.app{width:var(--app-max-width);border:1px solid var(--color-border);max-height:900px;box-shadow:var(--shadow-lg);border-radius:32px;margin:auto}#root{padding:calc(var(--spacing-unit) * 3);display:flex}}.app-loading{justify-content:center;align-items:center;gap:calc(var(--spacing-unit) * 2);width:100%;height:100%;color:var(--color-text-secondary);font-size:var(--text-sm);flex-direction:column;display:flex}.loading-spinner{border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.loading-spinner{border-top-color:var(--color-primary);animation:none}}.offline-banner{padding:calc(var(--spacing-unit) + var(--safe-top)) var(--spacing-unit) var(--spacing-unit);background-color:var(--color-warning);color:#fff;text-align:center;font-size:var(--text-xs);letter-spacing:.02em;z-index:1000;font-weight:600;position:absolute;top:0;left:0;right:0}.app-version{top:calc(var(--safe-top) + 6px);z-index:800;border-radius:var(--radius-pill);color:#ffffffd9;letter-spacing:.03em;font-variant-numeric:tabular-nums;pointer-events:none;-webkit-user-select:text;user-select:text;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1012178c;padding:3px 6px;font-size:9px;font-weight:600;line-height:1;position:absolute;right:8px}button.app-version-button{cursor:pointer;pointer-events:auto;border:0;min-height:0;font-family:inherit}button.app-version-button:hover:not(:disabled){background:#101217bf}button.app-version-button:active:not(:disabled){transform:scale(.96)}button,.button{min-height:44px;padding:calc(var(--spacing-unit) * 1.5) calc(var(--spacing-unit) * 3);background-color:var(--color-primary);color:#fff;border-radius:var(--radius-pill);font-size:var(--text-md);cursor:pointer;transition:background-color var(--transition-duration) var(--ease-out), transform var(--transition-duration) var(--ease-out), opacity var(--transition-duration) var(--ease-out);border:none;font-family:inherit;font-weight:600}button:hover:not(:disabled){background-color:var(--color-primary-dark)}button:active:not(:disabled){transform:scale(.97)}button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}button:disabled{opacity:.4;cursor:not-allowed}@media (prefers-reduced-motion:reduce){button:active:not(:disabled){transform:none}}input,textarea{padding:calc(var(--spacing-unit) * 1.5);border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-background);color:var(--color-text);width:100%;font-family:inherit;font-size:16px}input:focus,textarea:focus{border-color:var(--color-primary);outline:none}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
