:root{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-tertiary: #0f3460;--text-primary: #eaeaea;--text-secondary: #b8b8b8;--accent-primary: #e94560;--accent-secondary: #ff6b6b;--gold: #d4af37;--gold-dark: #b8941f;--border-color: #2a2a4a;--success: #4caf50;--error: #f44336}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary) 100%);color:var(--text-primary);min-height:100vh;line-height:1.6}#root{min-height:100vh}button{cursor:pointer;font-family:inherit}input,select,textarea{font-family:inherit}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}@media print{body{background:#fff;color:#000;font-size:10pt}.no-print{display:none!important}.print-only{display:block!important}}.print-only{display:none}.character-form{background:var(--bg-secondary);border-radius:12px;overflow:hidden;border:1px solid var(--border-color)}.form-header{background:var(--bg-tertiary);padding:1.5rem;display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--gold);flex-wrap:wrap;gap:1rem}.form-header h2{margin:0;color:var(--gold)}.form-actions{display:flex;gap:.75rem}.form-tabs{display:flex;background:var(--bg-primary);border-bottom:1px solid var(--border-color);overflow-x:auto}.form-tabs button{flex:1;padding:1rem 1.5rem;background:transparent;border:none;color:var(--text-secondary);font-size:.95rem;border-bottom:3px solid transparent;transition:all .2s;white-space:nowrap}.form-tabs button:hover{color:var(--text-primary);background:#ffffff0d}.form-tabs button.active{color:var(--gold);border-bottom-color:var(--gold)}.form-content{padding:1.5rem}.form-section h3{color:var(--gold);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.form-row{display:flex;gap:1.5rem;margin-bottom:1.5rem}.form-group{flex:1;min-width:0}.form-group.flex-grow{flex:2}.form-group label{display:block;margin-bottom:.5rem;color:var(--text-secondary);font-size:.9rem;font-weight:500}.form-group input,.form-group select,.form-group textarea{width:100%;padding:.75rem;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary);font-size:1rem}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--gold)}.form-group input[type=number]{width:100px}.form-group textarea{resize:vertical;min-height:80px}.input-with-button{display:flex;gap:.5rem}.input-with-button input{flex:1}.input-with-button button{padding:.75rem;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary);font-size:1.2rem;transition:all .2s}.input-with-button button:hover{background:var(--gold);border-color:var(--gold)}.field-info{margin-top:.5rem;font-size:.8rem;color:var(--text-secondary)}.helper-text{color:var(--text-secondary);font-size:.9rem;margin-bottom:1rem}.abilities-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.abilities-header h3{margin-bottom:0;border-bottom:none;padding-bottom:0}.ability-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem;margin-bottom:2rem}.ability-card{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;padding:1rem;text-align:center}.ability-card label{display:block;text-transform:uppercase;font-size:.75rem;letter-spacing:1px;color:var(--text-secondary);margin-bottom:.5rem}.ability-card input{width:70px;text-align:center;font-size:1.5rem;font-weight:700;padding:.5rem;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary)}.ability-card input:focus{outline:none;border-color:var(--gold)}.ability-modifier{font-size:1.2rem;font-weight:700;color:var(--gold);margin-top:.5rem}.racial-bonus{font-size:.75rem;color:var(--success);margin-top:.25rem}.derived-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem}.stat-box{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;padding:1rem;text-align:center}.stat-box label{display:block;font-size:.8rem;color:var(--text-secondary);margin-bottom:.5rem}.stat-value{font-size:1.5rem;font-weight:700;color:var(--gold)}.stat-detail{font-size:.75rem;color:var(--text-secondary);margin-top:.25rem}.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.5rem}.skill-row{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;cursor:pointer;transition:all .2s}.skill-row:hover{border-color:var(--gold)}.skill-row.proficient{background:#d4af371a;border-color:var(--gold-dark)}.skill-row input[type=checkbox]{width:18px;height:18px;cursor:pointer}.skill-modifier{font-weight:700;min-width:35px;text-align:center;color:var(--gold)}.skill-name{flex:1;color:var(--text-primary)}.skill-ability{color:var(--text-secondary);font-size:.8rem}.skill-tag{font-size:.65rem;padding:.2rem .4rem;border-radius:3px;text-transform:uppercase}.skill-tag.class{background:var(--bg-tertiary);color:var(--accent-primary)}.skill-tag.background{background:var(--bg-tertiary);color:var(--success)}.suggestions{margin-top:.5rem;display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.suggestions strong{font-size:.8rem;color:var(--text-secondary)}.suggestions button{font-size:.75rem;padding:.3rem .6rem;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:4px;color:var(--text-secondary);cursor:pointer;transition:all .2s}.suggestions button:hover{background:var(--gold);color:var(--bg-primary);border-color:var(--gold)}.equipment-suggestions,.features-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.equipment-tag,.feature-tag{background:var(--bg-tertiary);border:1px solid var(--border-color);padding:.4rem .8rem;border-radius:4px;font-size:.85rem;color:var(--text-primary)}.feature-tag{background:#d4af371a;border-color:var(--gold-dark);color:var(--gold)}@media(max-width:768px){.form-header{flex-direction:column;align-items:flex-start}.form-actions{width:100%}.form-actions button{flex:1}.form-row{flex-direction:column;gap:1rem}.form-group input[type=number]{width:100%}.ability-grid{grid-template-columns:repeat(2,1fr)}.skills-grid{grid-template-columns:1fr}}.character-sheet-container{max-width:1100px;margin:0 auto}.sheet-actions{display:flex;gap:.75rem;margin-bottom:1.5rem;justify-content:flex-end}.sheet-actions button{padding:.75rem 1.5rem;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);border-radius:6px;font-size:.95rem;transition:all .2s}.sheet-actions button:hover{border-color:var(--gold)}.sheet-actions .btn-primary{background:var(--gold);color:var(--bg-primary);border-color:var(--gold)}.character-sheet{background:#f5f0e1;color:#2c2c2c;border-radius:8px;overflow:hidden;box-shadow:0 4px 20px #0000004d;font-family:Georgia,serif}.sheet-header{background:linear-gradient(135deg,#8b0000,#4a0000);color:#fff;padding:1.5rem;border-bottom:4px solid #d4af37}.character-name-box{margin-bottom:1rem}.character-name{font-size:2rem;font-weight:700;font-family:Cinzel,Georgia,serif;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.character-name-box label{font-size:.75rem;text-transform:uppercase;letter-spacing:1px;opacity:.8}.character-info-row{display:flex;gap:1rem;flex-wrap:wrap}.info-box{flex:1;min-width:120px;background:#0003;padding:.5rem;border-radius:4px}.info-value{font-size:1rem;font-weight:600}.info-box label{font-size:.65rem;text-transform:uppercase;letter-spacing:.5px;opacity:.8}.sheet-body{display:grid;grid-template-columns:200px 1fr 280px;gap:1rem;padding:1.5rem}.sheet-column{display:flex;flex-direction:column;gap:1rem}.ability-scores-column{display:flex;flex-direction:column;gap:.5rem}.ability-block{background:#fff;border:2px solid #4a0000;border-radius:8px;padding:.5rem;text-align:center;position:relative}.ability-name{font-size:.7rem;font-weight:700;text-transform:uppercase;color:#4a0000;letter-spacing:1px}.ability-modifier{font-size:1.5rem;font-weight:700;color:#2c2c2c}.ability-score{position:absolute;bottom:-8px;left:50%;transform:translate(-50%);background:#fff;border:2px solid #4a0000;border-radius:50%;width:28px;height:28px;line-height:24px;font-size:.8rem;font-weight:700}.stats-section{background:#fff;border:2px solid #4a0000;border-radius:8px;padding:.75rem}.stat-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;font-size:.85rem}.checkbox{width:14px;height:14px;border:1px solid #4a0000;border-radius:3px}.checkbox.filled{background:#4a0000}.stat-circle{width:32px;height:32px;border:2px solid #4a0000;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem}.saving-throws,.skills-section{margin-top:.75rem;padding-top:.75rem;border-top:1px solid #ccc}.saving-throws h4,.skills-section h4{font-size:.75rem;text-transform:uppercase;color:#4a0000;margin-bottom:.5rem;text-align:center}.save-row,.skill-row{display:flex;align-items:center;gap:.4rem;font-size:.75rem;padding:.15rem 0}.save-mod,.skill-mod{min-width:24px;font-weight:700;text-align:right}.save-name,.skill-name{flex:1}.skill-ability{font-size:.65rem;color:#666}.passive-perception{background:#fff;border:2px solid #4a0000;border-radius:8px;padding:.5rem;text-align:center}.pp-value{font-size:1.5rem;font-weight:700}.passive-perception label{font-size:.65rem;text-transform:uppercase;color:#666}.combat-stats{display:flex;gap:.5rem}.combat-stat-box{flex:1;background:#fff;border:2px solid #4a0000;border-radius:8px;padding:.75rem;text-align:center}.combat-value{font-size:1.5rem;font-weight:700}.combat-stat-box label{font-size:.65rem;text-transform:uppercase;color:#666;display:block;margin-top:.25rem}.hp-section{background:#fff;border:2px solid #4a0000;border-radius:8px;overflow:hidden}.hp-max{background:#4a0000;color:#fff;padding:.5rem;display:flex;justify-content:space-between;align-items:center;font-size:.8rem}.hp-max label{font-size:.65rem;text-transform:uppercase}.hp-current,.hp-temp{padding:.5rem;border-bottom:1px solid #ccc}.hp-box{height:40px;border:1px dashed #ccc;border-radius:4px;margin-bottom:.25rem}.hp-current label,.hp-temp label{font-size:.65rem;text-transform:uppercase;color:#666}.hit-dice-section{display:flex;gap:.5rem}.hit-dice,.death-saves{flex:1;background:#fff;border:2px solid #4a0000;border-radius:8px;padding:.5rem;text-align:center;font-size:.75rem}.hit-dice label{display:block;font-size:.6rem;text-transform:uppercase;color:#666}.hit-dice span{font-weight:700}.dice-box{height:30px;border:1px dashed #ccc;border-radius:4px;margin:.25rem 0}.death-saves label{font-size:.65rem;text-transform:uppercase;color:#666;display:block;margin-bottom:.5rem}.save-bubbles{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:.25rem}.save-bubbles span{font-size:.6rem;min-width:50px;text-align:right}.bubbles{display:flex;gap:.25rem}.bubble{width:12px;height:12px;border:1px solid #4a0000;border-radius:50%}.attacks-section,.equipment-section{background:#fff;border:2px solid #4a0000;border-radius:8px;padding:.75rem;flex:1}.attacks-section h4,.equipment-section h4{font-size:.75rem;text-transform:uppercase;color:#4a0000;margin-bottom:.5rem;text-align:center}.attacks-table{width:100%;border-collapse:collapse;font-size:.75rem}.attacks-table th{background:#f0e6d3;padding:.25rem;text-align:left;font-size:.65rem;text-transform:uppercase}.attacks-table td{padding:.5rem .25rem;border-bottom:1px solid #ccc}.equipment-list{font-size:.8rem;line-height:1.4}.equipment-item{padding:.25rem 0;border-bottom:1px dotted #ccc}.equipment-empty{color:#999;font-style:italic}.personality-section{display:flex;flex-direction:column;gap:.5rem}.personality-box{background:#fff;border:2px solid #4a0000;border-radius:8px;padding:.75rem}.personality-box h4{font-size:.7rem;text-transform:uppercase;color:#4a0000;margin-bottom:.5rem}.personality-box p{font-size:.8rem;line-height:1.4;color:#444}.features-section{background:#fff;border:2px solid #4a0000;border-radius:8px;padding:.75rem;flex:1}.features-section h4{font-size:.75rem;text-transform:uppercase;color:#4a0000;margin-bottom:.5rem;text-align:center}.features-list{font-size:.8rem}.feature-item{padding:.25rem 0;border-bottom:1px dotted #ccc}.sheet-footer{background:#e8e0d0;padding:1.5rem;border-top:2px solid #4a0000}.appearance-section h4,.backstory-section h4{font-size:.85rem;text-transform:uppercase;color:#4a0000;margin-bottom:.75rem}.appearance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.5rem}.appearance-item{font-size:.85rem}.appearance-item .label{font-weight:700;color:#666}.backstory-section{margin-top:1rem}.backstory-section p{font-size:.9rem;line-height:1.6;white-space:pre-wrap}@media print{.character-sheet-container{max-width:none}.character-sheet{box-shadow:none;border-radius:0}.sheet-header{background:#8b0000!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}.sheet-body{grid-template-columns:180px 1fr 240px}.ability-block,.stats-section,.combat-stat-box,.hp-section,.hit-dice,.death-saves,.attacks-section,.equipment-section,.personality-box,.features-section,.passive-perception{border-color:#000}.checkbox.filled{background:#000!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}}@media(max-width:900px){.sheet-body{grid-template-columns:1fr}.sheet-column.left{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.ability-scores-column{flex-direction:row;flex-wrap:wrap;justify-content:center}.ability-block{min-width:70px}}@media(max-width:600px){.sheet-header{padding:1rem}.character-name{font-size:1.5rem}.sheet-body{padding:1rem}.combat-stats,.hit-dice-section{flex-direction:column}}.character-list{width:100%}.character-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.character-list-header h2{color:var(--gold);font-size:1.5rem;margin:0}.character-list-actions{display:flex;gap:.75rem}.btn-primary{background:var(--gold);color:var(--bg-primary);border:none;padding:.75rem 1.5rem;border-radius:6px;font-weight:600;font-size:1rem;transition:all .2s}.btn-primary:hover{background:var(--gold-dark);transform:translateY(-1px)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:2px solid var(--gold);padding:.75rem 1.5rem;border-radius:6px;font-weight:600;font-size:1rem;transition:all .2s}.btn-secondary:hover{background:var(--gold);color:var(--bg-primary)}.empty-state{text-align:center;padding:4rem 2rem;background:var(--bg-secondary);border-radius:12px;border:2px dashed var(--border-color)}.empty-icon{font-size:4rem;margin-bottom:1rem}.empty-state h3{color:var(--gold);margin-bottom:.5rem}.empty-state p{color:var(--text-secondary);max-width:400px;margin:0 auto}.character-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.character-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;overflow:hidden;transition:all .2s}.character-card:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.character-card-header{background:var(--bg-tertiary);padding:1rem 1.25rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color)}.character-card-header h3{margin:0;font-size:1.1rem;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}.character-level{background:var(--gold);color:var(--bg-primary);padding:.25rem .5rem;border-radius:4px;font-size:.8rem;font-weight:600}.character-card-body{padding:1.25rem}.character-race-class{font-size:1rem;color:var(--text-primary);margin-bottom:.5rem}.character-alignment{color:var(--text-secondary);font-size:.9rem;margin-bottom:1rem}.character-stats-preview{display:flex;gap:1.5rem;color:var(--text-secondary);font-size:.9rem}.character-card-actions{display:flex;gap:.5rem;padding:1rem 1.25rem;border-top:1px solid var(--border-color);background:#0000001a}.character-card-actions button{flex:1;padding:.5rem;border:1px solid var(--border-color);background:var(--bg-tertiary);color:var(--text-primary);border-radius:4px;font-size:.85rem;transition:all .2s}.character-card-actions button:hover{background:var(--bg-primary);border-color:var(--gold)}.character-card-actions .btn-danger{background:transparent;border-color:var(--error);color:var(--error)}.character-card-actions .btn-danger:hover{background:var(--error);color:#fff}@media(max-width:768px){.character-list-header{flex-direction:column;align-items:flex-start}.character-list-actions{width:100%}.character-list-actions button{flex:1}.character-grid{grid-template-columns:1fr}}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:var(--bg-secondary);border-bottom:2px solid var(--gold);padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.app-header h1{color:var(--gold);font-size:1.8rem;text-shadow:2px 2px 4px rgba(0,0,0,.3);margin:0}.app-nav{display:flex;gap:.5rem}.app-nav button{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary);padding:.5rem 1rem;border-radius:4px;font-size:.9rem;transition:all .2s}.app-nav button:hover{background:var(--bg-primary);border-color:var(--gold)}.app-nav button.active{background:var(--gold-dark);color:var(--bg-primary);border-color:var(--gold)}.app-main{flex:1;padding:2rem;max-width:1400px;margin:0 auto;width:100%}.app-footer{background:var(--bg-secondary);border-top:1px solid var(--border-color);padding:1rem 2rem;text-align:center;color:var(--text-secondary);font-size:.9rem}.app-footer a{color:var(--gold);text-decoration:none}.app-footer a:hover{text-decoration:underline}@media(max-width:768px){.app-header{padding:1rem}.app-header h1{font-size:1.4rem}.app-main{padding:1rem}.app-nav button{padding:.4rem .8rem;font-size:.85rem}}