:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;background:#f3f4f6;color:#111827;min-width:320px;min-height:100vh}*{box-sizing:border-box}.app{display:flex;flex-direction:column;width:100vw;height:100vh;background:#1a1a2e;color:#e0e0e0;font-family:Segoe UI,system-ui,-apple-system,sans-serif;overflow:hidden}.status-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:#0f0f23;border-bottom:1px solid #2a2a4a;flex-shrink:0}.game-time{font-size:14px;color:#f0c040;font-weight:600}.round-info{font-size:13px;color:#88a}.app-main{display:flex;flex:1;min-height:0}.app-sidebar-left{width:220px;flex-shrink:0;background:#16213e;border-right:1px solid #2a2a4a;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:16px}.app-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px;gap:12px;min-width:0}.app-sidebar-right{width:260px;flex-shrink:0;background:#16213e;border-left:1px solid #2a2a4a;overflow-y:auto;padding:12px}.spatial-view{display:flex;flex-direction:column;align-items:center;gap:8px}.room-title{margin:0;font-size:18px;color:#f0c040;font-weight:700;letter-spacing:.5px}.spatial-grid{border:2px solid #2a2a4a;border-radius:8px;background:#12122a;padding:2px;gap:1px}.spatial-cell{width:64px;height:64px;border:1px solid #252548;border-radius:4px;background:#1a1a38;position:relative;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s}.spatial-cell:hover{background:#242450;border-color:#f0c04066}.furniture-item{font-size:32px;line-height:1;text-align:center;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}.player-sprite{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.player-body{font-size:30px;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5));z-index:1}.player-sprite.facing-left .player-body{transform:scaleX(-1)}.player-sprite.facing-up .player-body{transform:translateY(-2px)}.player-sprite.facing-down .player-body{transform:translateY(2px)}.critter-sprite{display:flex;flex-direction:column;align-items:center;position:relative}.critter-body{font-size:32px;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}.critter-idle .critter-body{animation:critter-breathe 3s ease-in-out infinite}.critter-walking .critter-body{animation:critter-walk .6s ease-in-out infinite}.critter-sleeping .critter-body{animation:critter-sleep 2.5s ease-in-out infinite;opacity:.7}.critter-playing .critter-body{animation:critter-bounce .5s ease-in-out infinite}.critter-looking .critter-body{animation:critter-breathe 3s ease-in-out infinite}.emoji-bubble{position:absolute;top:-24px;left:-6px;font-size:16px;animation:bubble-bounce 1.2s ease-in-out infinite;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));pointer-events:none}.sense-bubble{position:absolute;top:-24px;right:-6px;font-size:14px;animation:bubble-bounce 1.2s ease-in-out infinite;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));pointer-events:none}.speech-bubble{position:absolute;top:-46px;left:50%;transform:translate(-50%);max-width:84px;padding:2px 6px;border:1px solid #2a2a4a;border-radius:10px;background:#14142aeb;color:#f2f2ff;font-size:10px;line-height:1.2;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:bubble-bounce 1.2s ease-in-out infinite;pointer-events:none}.interaction-indicator{position:absolute;bottom:-2px;left:50%;transform:translate(-50%);font-size:12px;animation:bubble-bounce 1.5s ease-in-out infinite;pointer-events:none;white-space:nowrap}.thinking-indicator{position:absolute;top:-20px;right:-8px;font-size:14px;animation:pulse 1.5s ease-in-out infinite;pointer-events:none}.critter-name{font-size:9px;color:#b0b0cc;text-align:center;white-space:nowrap;margin-top:1px;text-shadow:0 1px 2px rgba(0,0,0,.6)}.critter-needs-mini{display:flex;flex-direction:column;gap:1px;width:32px;margin:2px auto 0}.need-mini-bar{height:3px;background:#1e1e3cb3;border-radius:1.5px;overflow:hidden}.need-mini-fill{height:100%;border-radius:1.5px;transition:width .4s ease}.room-selector h3{margin:0 0 8px;font-size:14px;color:#f0c040}.room-selector{display:flex;flex-direction:column;gap:4px}.room-btn{width:100%;text-align:left;background:#1a1a38;border:1px solid #2a2a4a;border-radius:8px;padding:8px 10px;color:#c0c0d8;cursor:pointer;transition:background .15s,border-color .15s;display:flex;flex-direction:column;gap:2px}.room-btn:hover{background:#242450;border-color:#f0c04044}.room-btn.active{background:#2a1f0a;border-color:#f0c040;color:#f0c040}.room-name{font-size:13px;font-weight:600}.room-residents{font-size:11px;color:#88a}.room-btn.active .room-residents{color:#d4a830}.inventory-panel h3{margin:0 0 8px;font-size:14px;color:#f0c040}.inventory-panel .empty-hint{font-size:12px;color:#668;margin:0}.inventory-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}.inventory-item{display:flex;flex-direction:column;align-items:center;gap:2px;background:#1a1a38;border:1px solid #2a2a4a;border-radius:8px;padding:6px 4px;cursor:pointer;color:#c0c0d8;transition:background .15s,border-color .15s}.inventory-item:hover{background:#242450;border-color:#f0c04044}.inventory-item.selected{background:#2a1f0a;border-color:#f0c040;color:#f0c040}.item-emoji{font-size:20px}.item-name{font-size:10px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.critter-info-panel{display:flex;flex-direction:column;gap:12px}.critter-info-panel .empty-hint{font-size:13px;color:#668;text-align:center;margin-top:24px}.critter-info-panel h3{margin:0;font-size:16px;color:#f0c040}.critter-stats{display:flex;flex-direction:column;gap:8px}.stat{display:flex;flex-direction:column;gap:3px}.stat-label{font-size:11px;color:#88a;text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:14px;color:#e0e0e0}.trust-bar{position:relative;height:18px;background:#252548;border-radius:9px;overflow:hidden}.trust-fill{height:100%;background:linear-gradient(90deg,#e07020,#f0c040);border-radius:9px;transition:width .4s ease}.trust-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:10px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}.needs-section h4{margin:0 0 6px;font-size:13px;color:#88a}.need-row{display:flex;align-items:center;gap:6px;margin-bottom:4px}.need-label{font-size:11px;color:#b0b0cc;width:52px;flex-shrink:0}.need-bar{flex:1;height:12px;background:#252548;border-radius:6px;overflow:hidden}.need-fill{height:100%;border-radius:6px;transition:width .4s ease,background-color .4s ease}.need-value{font-size:10px;color:#88a;width:24px;text-align:right;flex-shrink:0}.critter-actions{display:flex;gap:8px}.action-btn{flex:1;padding:8px 0;background:#2a1f0a;border:1px solid #f0c04066;border-radius:8px;color:#f0c040;font-size:13px;cursor:pointer;transition:background .15s,border-color .15s}.action-btn:hover{background:#3a2a10;border-color:#f0c040}.recent-events h4{margin:0 0 6px;font-size:13px;color:#88a}.recent-events ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.recent-events li{font-size:12px;color:#b0b0cc;padding:4px 8px;background:#1a1a38;border-radius:6px;border-left:3px solid #f0c04044}.toast-container{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:1000;pointer-events:none}.toast-message{padding:10px 18px;background:#2a1f0a;border:1px solid #f0c040;border-radius:10px;color:#f0c040;font-size:13px;font-weight:600;box-shadow:0 4px 16px #0006;animation:toast-slide-in .3s ease-out;pointer-events:auto}.dialogue-overlay{position:fixed;inset:0;background:#0006;display:flex;align-items:flex-end;justify-content:center;z-index:2000;animation:dialogue-fade-in .2s ease-out;cursor:pointer}.dialogue-bottom-box{width:100%;max-width:800px;margin:0 auto 24px;background:linear-gradient(180deg,#1a1a38,#0f0f23);border:2px solid #f0c04066;border-radius:16px;padding:0;box-shadow:0 -4px 32px #00000080;cursor:default;overflow:hidden}.dialogue-nameplate{padding:10px 20px 6px;font-size:15px;font-weight:700;color:#f0c040;letter-spacing:.5px}.dialogue-content{padding:4px 20px 16px;font-size:16px;line-height:1.7;color:#e0e0e0;min-height:48px}.dialogue-content .dialogue-text{display:block;white-space:pre-line}.dialogue-typing{color:#88a;animation:pulse 1.5s ease-in-out infinite}.dialogue-continue-hint{padding:6px 20px 10px;text-align:right;font-size:12px;color:#88a;cursor:pointer;animation:dialogue-hint-blink 1.5s ease-in-out infinite}.dialogue-continue-hint:hover{color:#f0c040}@keyframes dialogue-hint-blink{0%,to{opacity:1}50%{opacity:.4}}@keyframes dialogue-fade-in{0%{opacity:0}to{opacity:1}}@keyframes bubble-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.9)}}@keyframes toast-slide-in{0%{transform:translate(100px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes critter-breathe{0%,to{transform:scaleY(1)}50%{transform:scaleY(1.04)}}@keyframes critter-walk{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(-2px) rotate(-3deg)}75%{transform:translate(2px) rotate(3deg)}}@keyframes critter-sleep{0%,to{transform:scaleY(1) rotate(0)}50%{transform:scaleY(.92) rotate(-5deg)}}@keyframes critter-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@media(max-width:900px){.app-main{flex-direction:column}.app-sidebar-left,.app-sidebar-right{width:100%;flex-direction:row;overflow-x:auto;overflow-y:hidden;border-right:none;border-left:none;border-bottom:1px solid #2a2a4a}.app-sidebar-left{flex-direction:row;gap:12px}.spatial-cell{width:48px;height:48px}.furniture-item,.critter-body{font-size:24px}}.speech-bubble-overlay{position:fixed;top:60px;right:20px;display:flex;flex-direction:column;gap:12px;z-index:1500;pointer-events:none;max-width:360px}.floating-speech-bubble{background:linear-gradient(180deg,#1a1a38,#0f0f23);border:2px solid #f0c04088;border-radius:16px;padding:0;box-shadow:0 4px 24px #00000080,0 0 0 1px #f0c0401a;animation:bubble-slide-in .3s ease-out;pointer-events:auto;cursor:pointer;overflow:hidden}.floating-bubble-header{display:flex;align-items:center;gap:8px;padding:10px 12px 6px;border-bottom:1px solid rgba(240,192,64,.15)}.floating-bubble-emoji{font-size:18px}.floating-bubble-name{flex:1;font-size:14px;font-weight:700;color:#f0c040;letter-spacing:.3px}.floating-bubble-close{background:transparent;border:none;color:#668;font-size:14px;cursor:pointer;padding:2px 6px;border-radius:4px;transition:color .2s,background .2s}.floating-bubble-close:hover{color:#f0c040;background:#f0c0401a}.floating-bubble-content{padding:10px 14px 14px;font-size:14px;line-height:1.65;color:#e0e0e0;white-space:pre-line}@keyframes bubble-slide-in{0%{transform:translate(100px);opacity:0}to{transform:translate(0);opacity:1}}