:root{--primary-color: #8a2be2;--secondary-color: #483d8b;--accent-color: #9370db;--text-color: #e0e0e0;--background-color: #1a1a2e;--card-background: #2a2a40;--border-color: #6a5acd;--highlight-color: #ba55d3;--energy-bar-bg: #3a3a50;--energy-bar-fill: linear-gradient(90deg, #7fff00, #00ff00);--shadow-color: rgba(0, 0, 0, .5);--neon-glow: 0 0 5px var(--highlight-color), 0 0 10px var(--highlight-color), 0 0 15px var(--primary-color), 0 0 20px var(--primary-color);--button-hover-bg: rgba(255, 255, 255, .1);--input-bg: #30304a;--input-border: var(--border-color);--placeholder-color: #aaa}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:var(--background-color);color:var(--text-color);margin:0;padding:0;display:flex;justify-content:center;align-items:center;min-height:100vh;overflow:hidden;background-image:linear-gradient(135deg,var(--secondary-color) 0%,var(--primary-color) 100%)}.app-container{position:relative;width:100%;max-width:900px;height:90vh;max-height:700px;background-color:var(--background-color);border-radius:15px;box-shadow:0 10px 30px var(--shadow-color),inset 0 0 10px var(--border-color);overflow:hidden;display:flex;justify-content:center;align-items:center;text-align:center;border:2px solid var(--border-color)}.loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#1a1a2ee6;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:15px}.loading-overlay .spinner{width:50px;height:50px;color:var(--accent-color);animation:spin 1.5s linear infinite;margin-bottom:15px}.loading-overlay p{font-size:1.1em;color:var(--text-color)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}button{background:linear-gradient(90deg,var(--primary-color),var(--highlight-color));color:var(--text-color);border:none;padding:10px 20px;border-radius:8px;cursor:pointer;font-size:1em;font-weight:700;transition:all .3s ease;box-shadow:0 4px 15px #8a2be266;display:inline-flex;align-items:center;gap:8px}button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #8a2be299,0 0 8px var(--highlight-color)}button:active{transform:translateY(0);box-shadow:0 2px 10px #8a2be24d}.cta-button{background:linear-gradient(90deg,#ff6b6b,#feca57);box-shadow:0 4px 15px #ff6b6b66}.cta-button:hover{box-shadow:0 6px 20px #ff6b6b99,0 0 8px #feca57}.secondary-button{background:linear-gradient(90deg,var(--secondary-color),var(--accent-color));box-shadow:0 4px 15px #483d8b66}.secondary-button:hover{box-shadow:0 6px 20px #483d8b99,0 0 8px var(--accent-color)}.cta-button.small,.secondary-button.small{padding:8px 15px;font-size:.9em}.escape-button{background:linear-gradient(90deg,#ff4757,#ff6b6b);box-shadow:0 4px 15px #ff475766}.escape-button:hover{box-shadow:0 6px 20px #ff475799,0 0 8px #ff6b6b}.save-button{background:linear-gradient(90deg,#2ecc71,#3498db);box-shadow:0 4px 15px #2ecc7166}.save-button:hover{box-shadow:0 6px 20px #2ecc7199,0 0 8px #3498db}button .icon{width:18px;height:18px}.start-screen,.pet-selection-screen,.gameover-screen{padding:30px;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;position:absolute;top:0;left:0;background-color:#1a1a2ecc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:15px}.start-screen h1{font-size:3em;margin-bottom:15px;color:var(--highlight-color);text-shadow:var(--neon-glow)}.start-screen p{font-size:1.2em;margin-bottom:30px;color:var(--text-color)}.pet-selection-screen h2{font-size:2.2em;margin-bottom:25px;color:var(--accent-color)}.pet-options{display:flex;justify-content:center;gap:30px;margin-bottom:30px;flex-wrap:wrap}.pet-option{background-color:var(--card-background);border:2px solid transparent;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;min-width:120px;box-shadow:0 5px 15px var(--shadow-color)}.pet-option:hover{transform:translateY(-5px);box-shadow:0 8px 25px var(--shadow-color);border-color:var(--highlight-color)}.pet-option.selected{border-color:var(--highlight-color);box-shadow:0 0 15px var(--highlight-color),0 5px 15px var(--shadow-color);transform:scale(1.05)}.pet-option img,.pet-option .pet-fallback{width:80px;height:80px;font-size:4em;display:block;margin:0 auto 10px;object-fit:contain}.pet-option p{font-size:1.1em;margin:0;color:var(--text-color)}.selection-controls{display:flex;gap:20px;margin-top:20px}.gameover-screen h2{font-size:3em;color:#ff6b6b;margin-bottom:15px;text-shadow:0 0 10px rgba(255,107,107,.7)}.gameover-screen p{font-size:1.2em;margin-bottom:10px}.shortcut-hint{margin-top:20px;font-size:.9em;color:var(--placeholder-color);background-color:#0000004d;padding:5px 10px;border-radius:5px}.playing-screen{width:100%;height:100%;display:flex;flex-direction:column;background-size:cover;background-position:center;position:relative;border-radius:15px;overflow:hidden}.playing-screen .overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:1}.game-header{display:flex;justify-content:space-between;align-items:center;padding:15px 25px;background-color:#282840b3;border-bottom:1px solid var(--border-color);position:relative;z-index:2;border-radius:15px 15px 0 0}.game-header .header-section{display:flex;align-items:center;gap:15px}.cloud-sync{font-size:.8em;color:var(--placeholder-color);background-color:#0006;padding:4px 8px;border-radius:4px}.game-title{font-size:1.8em;color:var(--highlight-color);text-shadow:var(--neon-glow);margin:0}.stat-item{display:flex;align-items:center;gap:8px}.stat-label{font-size:1em;color:var(--text-color);opacity:.8}.stat-value{font-size:1.1em;font-weight:700;color:var(--highlight-color)}.energy-bar-container{display:flex;align-items:center;background-color:var(--energy-bar-bg);border-radius:10px;padding:5px 10px;width:150px;height:28px;overflow:hidden;position:relative;box-shadow:inset 0 0 5px #0000004d}.energy-bar{height:100%;background:var(--energy-bar-fill);border-radius:8px;transition:width .5s ease-out;box-shadow:0 0 8px #7fff00b3}.energy-value{position:absolute;right:10px;font-size:.9em;font-weight:700;color:var(--text-color);text-shadow:0 0 5px rgba(0,0,0,.5)}.game-content{flex-grow:1;display:flex;justify-content:space-around;align-items:center;padding:20px;position:relative;z-index:2;gap:20px;flex-wrap:wrap}.pet-display-area{flex-basis:30%;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#2a2a40b3;padding:20px;border-radius:12px;box-shadow:inset 0 0 10px var(--border-color),0 5px 15px var(--shadow-color);min-height:250px;border:1px solid var(--border-color)}.pet-image,.selected-pet-display{width:150px;height:150px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(255,255,255,.5))}.selected-pet-display{width:200px;height:200px}.pet-fallback{font-size:5em;line-height:1;color:var(--accent-color)}.pet-name{font-size:1.4em;font-weight:700;margin-top:15px;color:var(--highlight-color);text-shadow:0 0 8px var(--highlight-color)}.actions-area{flex-basis:60%;display:flex;flex-direction:column;gap:20px;align-items:stretch;background-color:#2a2a40b3;padding:25px;border-radius:12px;box-shadow:inset 0 0 10px var(--border-color),0 5px 15px var(--shadow-color);border:1px solid var(--border-color)}.actions-area h3{font-size:1.6em;color:var(--accent-color);margin-bottom:15px;display:flex;align-items:center;gap:10px;justify-content:center;text-shadow:0 0 5px var(--accent-color)}.actions-area h3 .icon{width:20px;height:20px;color:var(--highlight-color)}.plan-section{display:flex;flex-direction:column;gap:10px}.plan-list{list-style:none;padding:0;margin:0;text-align:left}.plan-item{display:flex;align-items:center;gap:10px;padding:10px;margin-bottom:8px;background-color:var(--input-bg);border-radius:8px;border:1px solid var(--input-border);transition:all .3s ease}.plan-item.done{text-decoration:line-through;color:var(--placeholder-color);background-color:#3a3a5080;opacity:.7}.plan-item input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border:2px solid var(--border-color);border-radius:5px;cursor:pointer;position:relative;background-color:var(--input-bg);transition:background-color .3s ease}.plan-item input[type=checkbox]:checked{background-color:var(--highlight-color);border-color:var(--highlight-color)}.plan-item input[type=checkbox]:checked:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--text-color);font-size:14px;font-weight:700}.plan-text{flex-grow:1;font-size:1em;color:var(--text-color)}.plan-item.done .plan-text{color:var(--placeholder-color)}.delete-button{background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:5px;opacity:.6;transition:opacity .3s ease,color .3s ease}.delete-button:hover{opacity:1;color:#ff6b6b}.plan-controls{display:flex;justify-content:center;gap:10px;margin-top:10px}.add-plan-section{display:flex;gap:10px;margin-top:15px}.add-plan-input{flex-grow:1;padding:10px;background-color:var(--input-bg);border:1px solid var(--input-border);border-radius:8px;color:var(--text-color);font-size:1em;outline:none}.add-plan-input::placeholder{color:var(--placeholder-color)}.empty-state{background-color:var(--card-background);padding:20px;border-radius:10px;text-align:center;border:1px dashed var(--border-color)}.empty-state p{margin-bottom:15px;color:var(--placeholder-color)}.translation-section{display:flex;flex-direction:column;gap:10px}.translation-input{width:100%;padding:10px;background-color:var(--input-bg);border:1px solid var(--input-border);border-radius:8px;color:var(--text-color);font-size:1em;resize:none;outline:none}.translation-input::placeholder{color:var(--placeholder-color)}.translation-output{margin-top:10px;padding:10px;background-color:var(--card-background);border-radius:8px;text-align:left;border:1px solid var(--border-color)}.translation-output h4{margin:0 0 5px;color:var(--accent-color);font-size:1em}.translation-output p{margin:0;font-size:1em;color:var(--text-color);min-height:20px}.other-actions{display:flex;justify-content:center;gap:15px;margin-top:20px}.game-footer{padding:10px 20px;background-color:#282840b3;position:relative;z-index:2;border-radius:0 0 15px 15px;font-size:.9em;color:var(--placeholder-color)}.loading-message{font-style:italic;color:var(--placeholder-color)}@media (max-width: 768px){.app-container{height:95vh;max-height:none;border-radius:0}.playing-screen{border-radius:0}.game-header{flex-direction:column;gap:10px;padding:10px;border-radius:0}.game-title{font-size:1.5em}.game-content{flex-direction:column;padding:15px;gap:15px}.pet-display-area,.actions-area{flex-basis:auto;width:100%}.pet-display-area{min-height:180px}.pet-image,.selected-pet-display{width:120px;height:120px}.selected-pet-display{width:150px;height:150px}.actions-area{padding:20px}.plan-item{padding:8px}.plan-text{font-size:.95em}.add-plan-section{flex-direction:column}.add-plan-input{width:calc(100% - 20px)}.game-footer{border-radius:0}.start-screen h1,.gameover-screen h2{font-size:2.5em}.pet-option{padding:15px;min-width:100px}.pet-option img,.pet-option .pet-fallback{width:60px;height:60px;font-size:3em}}@media (max-width: 480px){.game-title{font-size:1.3em}.start-screen h1,.gameover-screen h2{font-size:2em}.pet-options{flex-direction:column;gap:15px}.pet-option{width:80%;margin:0 auto}.selection-controls{flex-direction:column;width:80%;margin:0 auto}button{width:100%}}