:root{--color-bg:#fbf4e8;--color-surface:#fff;--color-surface-alt:#fff8ee;--color-border:#e8dcc8;--color-text:#2b2420;--color-muted:#7a6f60;--color-accent:#ff8a5b;--color-accent-ink:#b84b22;--color-good:#3f8f5f;--color-warn:#c7453a;--color-warn-bg:#fbe9e6;--stat-hunger:#e2982a;--stat-energy:#3d8ab8;--stat-happiness:#e0588b;--stat-cleanliness:#2fa88c;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-8:3rem;--radius-sm:.5rem;--radius-md:.9rem;--radius-lg:1.5rem;--radius-pill:999px;--shadow:0 1px 2px #2b24200f, 0 8px 24px #2b242012;--font-display:ui-rounded, "SF Pro Rounded", "Segoe UI Rounded", "Hiragino Maru Gothic ProN", system-ui, sans-serif;--font-body:system-ui, sans-serif}*{box-sizing:border-box}body{background:radial-gradient(ellipse 60% 45% at 18% 0%, #fdf0dc 0%, transparent 60%), radial-gradient(ellipse 55% 40% at 100% 15%, #eef6ea 0%, transparent 65%), var(--color-bg);color:var(--color-text);font-family:var(--font-body);background-attachment:fixed;margin:0;line-height:1.6}a{color:var(--color-accent-ink)}a:focus-visible,button:focus-visible,.action-form button:focus-visible{outline:2px solid var(--color-accent-ink);outline-offset:2px;border-radius:var(--radius-sm)}.site-header{color:#fff;padding:var(--space-3) var(--space-5);background:#2b2420}.site-header a{color:#fff;font-weight:700;font-family:var(--font-display);letter-spacing:.01em;text-decoration:none}.site-header nav{gap:var(--space-4);margin-left:var(--space-5);display:inline-flex}.site-header nav a{font-weight:400;font-family:var(--font-body);opacity:.8}.site-header nav a:hover{opacity:1}main{max-width:42rem;padding:var(--space-5) var(--space-4) var(--space-8);margin:0 auto}main h1{font-family:var(--font-display);margin:0 0 var(--space-2);font-size:clamp(1.75rem,1.4rem + 1.2vw,2.25rem)}.intro{color:var(--color-muted);margin:0 0 var(--space-4)}main :where(h2){font-family:var(--font-display);margin:0 0 var(--space-2);font-size:1.2rem}main :where(h3){font-family:var(--font-display);font-size:1.05rem}main :where(p,li){color:inherit}main :where(blockquote){margin:var(--space-4) 0;padding:var(--space-2) var(--space-4);border-left:3px solid var(--color-accent);background:var(--color-surface-alt);border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:var(--color-muted)}main :where(code){background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:.3rem;padding:.1rem .35rem;font-size:.9em}main :where(pre){background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3);overflow-x:auto}main :where(pre code){background:0 0;border:none;padding:0}@media (width>=46rem){main{max-width:58rem}.app-main{column-gap:var(--space-6);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;display:grid}.app-main>.entry-page{grid-column:1/-1}.app-main>h1{grid-area:1/1/auto/-1}.app-main>.intro{grid-area:2/1/auto/-1}.app-main>.live-indicator{grid-area:3/1/auto/-1}#live-state{display:contents}.creature-panel{grid-area:4/1}.actions-panel{grid-area:5/1}.activities-panel{grid-area:6/1}.history-panel{grid-area:4/2/span 3}}@media (width>=72rem){main{max-width:78rem}.app-main{column-gap:var(--space-6);grid-template-columns:minmax(0,.9fr) minmax(0,1fr) minmax(0,1fr)}.creature-panel{grid-area:4/1/span 3}.actions-panel{grid-area:4/2}.activities-panel{grid-area:5/2}.history-panel{grid-area:4/3/span 3}}.panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:var(--space-5);margin-bottom:var(--space-5)}.panel-note{color:var(--color-muted);font-size:.9rem}.creature-panel{text-align:center}.creature-panel h2{margin-top:0}.creature-panel .stat-row,.creature-panel .condition,.creature-panel .last-action{text-align:left}.entry-page{gap:var(--space-6);padding:var(--space-6) 0;flex-direction:column;display:flex}.entry-shell{gap:var(--space-6);flex-direction:column;display:flex}@media (width>=64rem){.entry-shell{flex-direction:row;align-items:flex-start}.entry-welcome,.entry-panel{flex:1 1 0;min-width:0}}.entry-welcome{text-align:center;padding:0 var(--space-4);flex-direction:column;align-items:center;display:flex}@media (width>=64rem){.entry-welcome{text-align:left;padding:var(--space-4) 0;align-items:flex-start}}.entry-illustration{margin:var(--space-4) 0}.entry-illustration .milo-visual.milo-visual{width:clamp(10rem,28vw,14rem)}.entry-concept-note{color:var(--color-muted);max-width:32rem;margin:0 0 var(--space-4)}.entry-feature-list{justify-content:center;gap:var(--space-2) var(--space-4);color:var(--color-muted);flex-wrap:wrap;margin:0;padding:0;font-size:.9rem;list-style:none;display:flex}@media (width>=64rem){.entry-feature-list{justify-content:flex-start}}.entry-feature-list li{align-items:center;gap:.35rem;display:inline-flex}.entry-feature-list svg{width:1.1rem;height:1.1rem;color:var(--color-accent-ink)}.entry-panel h2{font-family:var(--font-display);margin:0 0 var(--space-1);font-size:1.3rem}.entry-panel-hint{color:var(--color-muted);margin:0 0 var(--space-4)}.entry-returning{background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);margin:0 0 var(--space-4);color:var(--color-muted);font-size:.9rem}.entry-returning strong{color:var(--color-text)}.entry-returning a{font-weight:600}.entry-choices{gap:var(--space-4);flex-direction:column;display:flex}.entry-card{background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4)}.entry-card h3{font-family:var(--font-display);margin:0 0 var(--space-1);font-size:1.1rem}.entry-card-hint{margin:0 0 var(--space-3);color:var(--color-muted);font-size:.85rem}.entry-or{color:var(--color-muted);text-transform:uppercase;letter-spacing:.05em;align-self:center;margin:0;font-size:.8rem;font-weight:600}.entry-form{gap:var(--space-2);flex-direction:column;display:flex}.entry-form label{color:var(--color-muted);font-size:.9rem;font-weight:600}.entry-form input{font:inherit;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);padding:.6rem .8rem}.entry-form input:focus-visible{outline:2px solid var(--color-accent-ink);outline-offset:1px}#join-code{text-transform:uppercase;letter-spacing:.08em;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.entry-form button{font:inherit;border-radius:var(--radius-pill);border:1px solid var(--color-accent);background:var(--color-accent);color:#fff;cursor:pointer;align-self:flex-start;min-height:2.75rem;padding:.55rem 1.3rem;font-weight:600;transition:transform .12s,opacity .12s}.entry-form button:hover{opacity:.9}.entry-form button:active{transform:scale(.96)}.entry-form button[data-loading]{opacity:.6;cursor:progress;pointer-events:none}.entry-error{color:var(--color-warn);background:var(--color-warn-bg);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);margin:var(--space-4) 0 0;border:1px solid #f2c9c3;font-size:.9rem}.entry-error[hidden]{display:none}.entry-devnotes{text-align:left}.entry-devnotes h2{font-family:var(--font-display);margin:0 0 var(--space-2);font-size:1.15rem}.entry-devnotes-title{margin:0 0 var(--space-2);font-weight:600}.entry-devnotes-summary{color:var(--color-muted);margin:0 0 var(--space-3)}.entry-patch-note{margin:0}.entry-patch-note a{color:var(--color-accent-ink);font-weight:600}.entry-patch-note a:after{content:" →"}.milo-age{font-family:var(--font-body);color:var(--color-muted);font-size:.8rem;font-weight:400;display:block}.milo-milestone{margin:0 0 var(--space-2);border-radius:var(--radius-pill);background:var(--color-surface-alt);color:var(--color-accent-ink);padding:.15rem .6rem;font-size:.8rem;font-weight:600;display:inline-block}.milo-dialogue{margin:var(--space-2) 0 0;color:var(--color-muted);font-size:.92rem;font-style:italic}.appearance-picker{gap:var(--space-2);margin:var(--space-3) 0;flex-wrap:wrap;justify-content:center;display:flex}.appearance-form{margin:0}.appearance-option{font:inherit;border-radius:var(--radius-pill);border:1px solid var(--color-border);background:var(--color-surface-alt);min-height:2.25rem;color:var(--color-text);cursor:pointer;padding:.4rem .85rem;font-size:.85rem;transition:border-color .12s,background .12s}.appearance-option:hover{border-color:var(--color-accent)}.appearance-option.selected{border-color:var(--color-accent);background:var(--color-accent);color:#fff;font-weight:600}.activity-badge{border-radius:var(--radius-pill);background:var(--color-surface-alt);color:var(--color-muted);margin:var(--space-2) 0 var(--space-4);align-items:center;gap:.3rem;padding:.2rem .75rem;font-size:.8rem;font-weight:600;display:inline-flex}.activity-badge.sleeping{color:#556070;background:#eef1f6}.stat-row{align-items:center;gap:var(--space-3);margin:var(--space-2) 0;grid-template-columns:7.5rem 1fr 2.75rem;font-size:.92rem;display:grid}.stat-label{align-items:center;gap:.4rem;display:inline-flex}.stat-icon{flex:none;width:1.05rem;height:1.05rem}.stat-row[data-stat=hunger] .stat-icon{color:var(--stat-hunger)}.stat-row[data-stat=energy] .stat-icon{color:var(--stat-energy)}.stat-row[data-stat=happiness] .stat-icon{color:var(--stat-happiness)}.stat-row[data-stat=cleanliness] .stat-icon{color:var(--stat-cleanliness)}.stat-bar{background:var(--color-border);border-radius:var(--radius-pill);height:.7rem;overflow:hidden}.stat-bar-fill{background:var(--color-accent);border-radius:inherit;height:100%;transition:width .4s}.stat-row[data-stat=hunger] .stat-bar-fill{background:var(--stat-hunger)}.stat-row[data-stat=energy] .stat-bar-fill{background:var(--stat-energy)}.stat-row[data-stat=happiness] .stat-bar-fill{background:var(--stat-happiness)}.stat-row[data-stat=cleanliness] .stat-bar-fill{background:var(--stat-cleanliness)}.stat-value{text-align:right;font-variant-numeric:tabular-nums;color:var(--color-muted);font-size:.85rem}.condition{color:var(--color-muted);margin-top:var(--space-3);font-size:.9rem}.milestone-progress{color:var(--color-muted);margin-top:var(--space-2);font-size:.9rem}.milestone-badge{margin-right:var(--space-2);border-radius:var(--radius-pill);background:var(--color-surface-alt);color:var(--color-accent-ink);padding:.1rem .5rem;font-size:.8rem;font-weight:600;display:inline-block}.milestone-bar{width:100%;margin-top:var(--space-1);display:block}.xp-progress{color:var(--color-muted);margin-top:var(--space-3);font-size:.9rem}.xp-bar{width:100%;margin-top:var(--space-1);display:block}.last-action{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px dashed var(--color-border);font-size:.95rem}.care-suggestion{align-items:center;gap:var(--space-2);margin-top:var(--space-2);color:var(--color-muted);font-size:.9rem;display:flex}.care-suggestion-icon{flex-shrink:0;width:1.1em;height:1.1em}.actions{gap:var(--space-2);margin-top:var(--space-4);flex-wrap:wrap;display:flex}.actions form{margin:0}.actions button{font:inherit;border-radius:var(--radius-pill);border:1px solid var(--color-border);background:var(--color-surface-alt);min-height:2.75rem;color:var(--color-text);cursor:pointer;align-items:center;gap:.4rem;padding:.55rem 1.1rem;font-weight:600;transition:transform .12s,border-color .12s,background .12s;display:inline-flex}.actions button svg{width:1.1rem;height:1.1rem;color:var(--color-accent-ink)}.actions button:hover{border-color:var(--color-accent);background:#fff}.actions button:active{transform:scale(.96)}.actions button[data-loading]{opacity:.6;cursor:progress;pointer-events:none}.actions button[data-loading]:after{content:"";opacity:.7;border:2px solid;border-top-color:#0000;border-radius:50%;width:.85rem;height:.85rem;animation:.7s linear infinite button-spin}@keyframes button-spin{to{transform:rotate(360deg)}}.action-error{color:var(--color-warn);background:var(--color-warn-bg);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);margin-top:var(--space-3);border:1px solid #f2c9c3;align-items:center;gap:.4rem;font-size:.9rem;display:flex}.action-error[hidden]{display:none}.wardrobe-slot-label{margin:var(--space-3) 0 var(--space-1);color:var(--color-muted);text-transform:uppercase;letter-spacing:.03em;font-size:.8rem;font-weight:600}.wardrobe-options{gap:var(--space-2);flex-wrap:wrap;display:flex}.wardrobe-options form{margin:0}.wardrobe-option{font:inherit;border-radius:var(--radius-pill);border:1px solid var(--color-border);background:var(--color-surface-alt);min-height:2.5rem;color:var(--color-text);cursor:pointer;padding:.45rem .9rem;font-size:.85rem;transition:border-color .12s,background .12s}.wardrobe-option:hover{border-color:var(--color-accent)}.wardrobe-option.selected{border-color:var(--color-accent);background:var(--color-accent);color:#fff;font-weight:600}.wardrobe-option:disabled,.wardrobe-option.locked{cursor:not-allowed;opacity:.55}.wardrobe-option:disabled:hover{border-color:var(--color-border)}.wardrobe-lock{color:var(--color-muted);font-size:.8em}.wardrobe-option.selected .wardrobe-lock{color:#ffffffd9}.adventure-form,.adventure-launch-button{margin-top:var(--space-4)}.adventure-form button,.adventure-launch-button{font:inherit;border-radius:var(--radius-pill);border:1px solid var(--color-border);background:var(--color-surface-alt);min-height:2.75rem;color:var(--color-text);cursor:pointer;align-items:center;gap:.4rem;padding:.55rem 1.1rem;font-weight:600;transition:transform .12s,border-color .12s,background .12s;display:inline-flex}.adventure-form button svg,.adventure-launch-button svg{width:1.1rem;height:1.1rem;color:var(--color-accent-ink)}.adventure-form button:hover,.adventure-launch-button:hover{border-color:var(--color-accent);background:#fff}.adventure-form button:active,.adventure-launch-button:active{transform:scale(.96)}.adventure-form button[data-loading]{opacity:.6;cursor:progress;pointer-events:none}.adventure-form button[data-loading]:after{content:"";opacity:.7;border:2px solid;border-top-color:#0000;border-radius:50%;width:.85rem;height:.85rem;animation:.7s linear infinite button-spin}.history-list{margin:var(--space-2) 0 0;color:var(--color-muted);padding:0;font-size:.9rem;list-style:none}.history-list li{border-bottom:1px solid var(--color-border);align-items:flex-start;gap:.5rem;padding:.5rem 0;display:flex}.history-list li:last-child{border-bottom:none}.history-time{white-space:nowrap;opacity:.8}.history-icon{width:1.2rem;height:1.2rem;color:var(--color-accent-ink);opacity:.8;flex:none;margin-top:.1rem}.live-indicator{color:var(--color-muted);background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-pill);margin:0 0 var(--space-4);align-items:center;padding:.2rem .75rem;font-size:.8rem;display:inline-flex}.live-indicator.connected:before,.live-indicator.disconnected:before{content:"";border-radius:50%;width:.5rem;height:.5rem;margin-right:.4rem}.live-indicator.connected:before{background:var(--color-good)}.live-indicator.disconnected:before{background:var(--color-warn)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}