:root{--primary-color: #3498db;--secondary-color: #95a5a6;--background-color: #f4f7f9;--surface-color: #ffffff;--card-background: #fafafa;--text-color: #333;--heading-color: #2c3e50;--border-color: #e0e0e0}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Roboto,sans-serif;background-color:var(--background-color);color:var(--text-color);line-height:1.6;padding:20px}.container{max-width:1400px;margin:0 auto;background:var(--surface-color);padding:2rem;border-radius:12px;box-shadow:0 4px 20px #0000000d}header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--border-color);padding-bottom:1rem;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.header-actions{display:flex;align-items:center;gap:1rem}.header-actions .import-export-buttons{display:flex;gap:.5rem}h1{font-family:Playfair Display,serif;color:var(--heading-color);font-size:2.5rem}h2{font-family:Playfair Display,serif;color:#34495e;margin-bottom:1rem;border-bottom:1px solid #eee;padding-bottom:.5rem}h3{font-family:Playfair Display,serif;color:#2c3e50;font-size:1.5rem;margin-top:1rem}.settings-button{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--secondary-color);transition:color .3s}.settings-button:hover{color:var(--primary-color)}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:#fff;padding:2rem;border-radius:8px;box-shadow:0 5px 15px #0000004d;width:90%;max-width:500px}.modal-content h2{margin-top:0}.modal-buttons{display:flex;justify-content:flex-end;gap:1rem;margin-top:1rem}.error-message{background-color:#f8d7da;color:#721c24;padding:1rem;border:1px solid #f5c6cb;border-radius:8px;margin-bottom:1.5rem}.character-manager{margin-bottom:2rem}.character-manager-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.add-char-buttons{display:flex;gap:1rem}.character-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:2rem;margin-bottom:2rem}.card{background:var(--card-background);padding:1.5rem;border-radius:8px;border:1px solid var(--border-color);position:relative;display:flex;flex-direction:column}.card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.card-header h2{margin-bottom:1rem;margin-top:0;flex-grow:1;border-bottom:none;padding-bottom:0}.remove-button{position:static;flex-shrink:0;background:none;border:none;padding:0;cursor:pointer;color:#e74c3c;transition:color .3s ease;display:flex;justify-content:center;align-items:center}.remove-button svg{width:20px;height:20px}.remove-button:hover:not(:disabled){background:none;color:#c0392b}.remove-button:disabled{background:none;color:#bdc3c7;cursor:not-allowed}.form-group{margin-bottom:1rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:700;color:#555}input[type=text],input[type=password],input[type=number],select,textarea{width:100%;padding:.75rem;border:1px solid #ccc;border-radius:4px;font-size:1rem;font-family:Roboto,sans-serif}textarea{resize:vertical}button{background-color:var(--primary-color);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:4px;cursor:pointer;font-size:1rem;transition:background-color .3s ease;font-weight:700}button:hover:not(:disabled){background-color:#2980b9}button:disabled{background-color:#bdc3c7;cursor:not-allowed}button.secondary{background-color:var(--secondary-color)}button.secondary:hover:not(:disabled){background-color:#7f8c8d}.modal-buttons button{padding:.5rem 1rem}.generate-button{width:100%}.describe-button{width:100%;margin-top:auto;padding-top:1rem}.divider{border:none;border-top:1px solid #eee;margin:1.5rem 0}.scene-generator{background:var(--card-background);padding:2rem;border-radius:8px;border:1px solid var(--border-color);margin-bottom:2rem}.scene-selection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin-top:1rem}.scene-checkbox{display:flex;align-items:center;gap:.5rem;background:var(--surface-color);padding:.5rem;border-radius:4px;border:1px solid #ddd}.scene-checkbox input{width:auto}.scene-checkbox label{font-weight:400;margin-bottom:0}.custom-scene-input-group{display:flex;gap:.5rem;margin-top:1rem}.custom-scene-input-group input{flex-grow:1}.custom-scene-input-group button{flex-shrink:0;padding:.75rem}.generated-content{margin-top:2rem;background:var(--card-background);padding:2rem;border-radius:8px;border:1px solid var(--border-color)}.generated-content-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.generated-content-header h2{border:none;margin:0}.action-buttons{display:flex;gap:.5rem;flex-wrap:wrap}.copy-button{background-color:#7f8c8d;font-size:.8rem;padding:.5rem 1rem}.copy-button:hover:not(:disabled){background-color:#6c7a7b}.chapter-header{display:flex;justify-content:space-between;align-items:center;gap:1rem}.regenerate-button{background-color:#f39c12;font-size:.8rem;padding:.5rem 1rem}.regenerate-button:hover:not(:disabled){background-color:#e67e22}.chapter-content:not(:first-child){margin-top:2rem;padding-top:2rem;border-top:2px dashed var(--border-color)}.generated-content pre{white-space:pre-wrap;word-wrap:break-word;font-family:Roboto,sans-serif;font-size:1rem;line-height:1.8;color:#444}footer{text-align:center;margin-top:2rem;padding-top:1rem;border-top:1px solid var(--border-color);color:#777}.pin-container{display:flex;justify-content:center;align-items:center;height:100vh;background-color:#f4f7f9;font-family:Roboto,sans-serif}.pin-box{background:#fff;padding:2rem 3rem;border-radius:12px;box-shadow:0 4px 20px #0000001a;text-align:center}.pin-box h1{font-family:Playfair Display,serif;color:#2c3e50;font-size:2rem;margin-bottom:.5rem}.pin-box h2{font-family:Roboto,sans-serif;font-weight:300;color:#34495e;margin-bottom:2rem;border:none}.pin-input{width:150px;padding:.75rem;font-size:1.5rem;text-align:center;letter-spacing:.5em;border:1px solid #ccc;border-radius:4px;margin-bottom:1rem}.pin-box button{width:100%;background-color:#3498db;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:4px;cursor:pointer;font-size:1rem;transition:background-color .3s ease;font-weight:700}.pin-box button:hover{background-color:#2980b9}.pin-error{color:#e74c3c;margin-top:1rem}
