.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem;position:relative;background:radial-gradient(ellipse 90% 60% at 50% 0%,rgba(242,199,107,.22) 0%,transparent 65%),radial-gradient(circle at bottom,rgba(123,31,50,.45),transparent 60%),linear-gradient(180deg,var(--bg-dark) 0%,var(--bg-dark-alt) 45%,#050716 100%)}.auth-curtain{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(242,199,107,.35) 0%,transparent 55%),radial-gradient(circle at 20% 70%,rgba(255,228,163,.16),transparent 55%),radial-gradient(circle at 80% 35%,rgba(255,228,163,.12),transparent 55%);pointer-events:none}.auth-box{position:relative;width:100%;max-width:400px;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:2rem;box-shadow:0 0 0 1px #f2c76b29,0 14px 45px #000000b3,0 0 32px #ffe4a324}.auth-title{text-align:center;margin:0 0 .25rem;font-size:1.85rem}.auth-subtitle{text-align:center;color:var(--text-muted);margin:0 0 1.5rem;font-size:.95rem}.auth-form label{display:block;margin-bottom:1rem;font-size:.9rem;color:var(--text-muted)}.auth-form input{width:100%;margin-top:.35rem;padding:.65rem .85rem;background:var(--bg-input);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:1rem}.auth-form input:focus{outline:none;border-color:var(--accent-gold);box-shadow:0 0 0 2px #f2c76b47}.auth-form .btn{width:100%;margin-top:.5rem;padding:.75rem 1rem}.auth-error{background:#c94a4a26;border:1px solid var(--danger);color:#f0a0a0;padding:.6rem .85rem;border-radius:6px;margin-bottom:1rem;font-size:.9rem}.auth-switch{text-align:center;margin:1.25rem 0 0;font-size:.9rem;color:var(--text-muted)}.auth-switch a{font-weight:600}.profile-page{min-height:100%}.profile-banner{position:relative;height:140px;margin:-2rem -2.5rem 2rem;overflow:hidden}.profile-banner-gold{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#b8923e,#d4a84b,#f2c76b,#d4a84b,#9a6b2e);box-shadow:inset 0 2px 20px #ffecb466,inset 0 -2px 12px #0003}.profile-notes{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.profile-notes-layer{display:flex;width:100%;height:100%;position:relative}.profile-note{position:absolute;font-size:26px;color:#000;opacity:0;transform-origin:center;animation:profile-note-float 11s ease-in-out infinite,profile-note-spin 9s ease-in-out infinite,profile-note-fade 11s ease-in-out infinite;animation-delay:calc(var(--note-i) * -.9s)}.profile-note[data-variant="1"]{font-size:30px}.profile-note[data-variant="2"]{font-size:34px}.profile-note[data-variant="3"]{font-size:24px}.profile-note:nth-child(odd){animation-duration:12s,10s,12s}.profile-note:nth-child(2n){animation-duration:9s,7.5s,9s}@keyframes profile-note-float{0%{transform:translate3d(-18px,10px,0)}25%{transform:translate3d(-8px,-4px,0)}50%{transform:translate3d(0,-10px,0)}75%{transform:translate3d(8px,-4px,0)}to{transform:translate3d(18px,10px,0)}}@keyframes profile-note-spin{0%{transform:rotate(0)}50%{transform:rotate(10deg)}to{transform:rotate(-8deg)}}@keyframes profile-note-fade{0%,to{opacity:0}15%,70%{opacity:.85}}.profile-content{max-width:420px}.profile-card{text-align:center;padding:2rem 1.5rem;margin-bottom:1.5rem}.profile-avatar{width:72px;height:72px;margin:0 auto 1rem;border-radius:50%;background:linear-gradient(135deg,var(--accent-gold) 0%,var(--accent-gold-dim) 100%);color:var(--bg-dark);font-family:var(--font-display);font-size:2rem;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px #f2c76b59}.profile-name-form{margin:0 0 1rem;text-align:left}.profile-name-form label{display:block;margin-bottom:.35rem;font-size:.9rem;color:var(--text-muted)}.profile-name-row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}.profile-name-input{flex:1;min-width:160px;padding:.5rem .75rem;background:var(--bg-input);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:1rem}.profile-name-input:focus{outline:none;border-color:var(--accent-gold)}.profile-name-display-row{justify-content:space-between}.profile-name-display{font-size:1.1rem;font-weight:600}.profile-name-edit-btn{padding:.4rem .75rem;font-size:.85rem}.profile-save-msg{margin:.5rem 0 0;font-size:.9rem;color:var(--text-muted)}.profile-save-msg-ok{color:#6bcf7b}.profile-email{margin:0 0 1.5rem;font-size:.95rem;color:var(--text-muted)}.profile-stats{margin:0;padding:1rem 1.25rem;background:#0003;border-radius:8px;display:inline-block}.profile-stats dt{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:.25rem}.profile-stats dd{margin:0;font-size:2rem;font-weight:700;color:var(--accent-gold)}.dashboard{display:flex;min-height:100vh}.sidebar{width:240px;min-width:240px;background:radial-gradient(circle at top,rgba(242,199,107,.12),transparent 60%),radial-gradient(circle at bottom,rgba(123,31,50,.35),transparent 65%),var(--bg-card);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:1.5rem 0}.sidebar-header{padding:0 1.25rem 1.25rem;border-bottom:1px solid var(--border);margin-bottom:1rem}.sidebar-logo{margin:0;font-size:1.35rem;color:var(--accent-gold)}.sidebar-tagline{margin:.25rem 0 0;font-size:.8rem;color:var(--text-muted)}.sidebar-nav{flex:1;display:flex;flex-direction:column;gap:.25rem;padding:0 .75rem}.sidebar-link{padding:.6rem .75rem;border-radius:6px;color:var(--text-muted);font-family:var(--font-display);font-size:.95rem;transition:color .15s,background .15s}.sidebar-link:hover{color:var(--text);background:#c9a22714}.sidebar-link.active{color:var(--accent-gold);background:#c9a2271f}.sidebar-footer{padding:1rem 1.25rem 0;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:.5rem}.sidebar-profile-btn{display:block;padding:.5rem .75rem;border-radius:6px;font-size:.8rem;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;text-decoration:none;transition:color .15s,background .15s}.sidebar-profile-btn:hover,.sidebar-profile-btn.active{color:var(--accent-gold);background:#c9a22714}.sidebar-profile-btn.active{background:#c9a2271f}.sidebar-profile-email{display:block;overflow:hidden;text-overflow:ellipsis}.main-content{flex:1;padding:2rem 2.5rem;overflow-y:auto;background:var(--bg-dark)}.dashboard-loading{display:flex;align-items:center;justify-content:center;min-height:100vh;color:var(--text-muted)}.btn{padding:.5rem 1rem;border-radius:6px;font-size:.95rem;font-weight:600;border:none;transition:background .15s,color .15s}.btn-gold{background:var(--accent-gold);color:var(--bg-dark)}.btn-gold:hover:not(:disabled){background:var(--accent-gold-bright)}.btn-ghost{background:transparent;color:var(--text-muted)}.btn-ghost:hover{color:var(--text);background:#ffffff0f}.btn-small{padding:.35rem .65rem;font-size:.85rem}.btn-danger{background:#c94a4a33;color:#e88}.btn-danger:hover{background:#c94a4a59}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:1.25rem 1.5rem;margin-bottom:1.25rem}.card h2{margin:0 0 1rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}.card label{display:block;margin-bottom:.5rem;font-size:.9rem;color:var(--text-muted)}.card input[type=text],.card input[type=number],.card textarea{width:100%;padding:.6rem .85rem;background:var(--bg-input);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:1rem;margin-bottom:1rem}.card textarea{min-height:100px;resize:vertical}.card input:focus,.card textarea:focus{outline:none;border-color:var(--accent-gold)}.story-builder-actions{display:flex;align-items:center;gap:1rem;margin-top:1.25rem;flex-wrap:wrap}.story-builder-actions .btn{margin-bottom:0}.save-confirmation{font-size:.95rem;font-weight:500}.save-confirmation-success{color:#6bcf7b}.musical-picker-wrap{margin-bottom:1.5rem}.musical-picker{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.musical-picker-label{font-size:.9rem;color:var(--text-muted);font-weight:500}.musical-picker-select{min-width:220px;max-width:100%;padding:.5rem .75rem;background:var(--bg-input);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:1rem}.musical-picker-select:focus{outline:none;border-color:var(--accent-gold)}.story-builder-top-actions{margin-bottom:1.5rem}.btn-new-musical{font-size:.95rem}.my-musicals{margin-bottom:2rem}.my-musicals-title{font-size:1rem;font-weight:600;color:var(--text-muted);margin:0 0 .75rem;text-transform:uppercase;letter-spacing:.04em}.my-musicals-grid{display:flex;flex-wrap:wrap;gap:.75rem}.my-musical-card{position:relative;display:block;text-align:left;padding:.85rem 2.25rem .85rem 1.15rem;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:1rem;font-family:inherit;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s}.my-musical-card:hover{border-color:var(--accent-gold);background:#c9a2270f}.my-musical-card.active{border-color:var(--accent-gold);background:#c9a2271f;box-shadow:0 0 0 1px var(--accent-gold)}.my-musical-card-title{font-weight:500}.my-musical-card-delete{position:absolute;top:.5rem;right:.5rem;width:1.75rem;height:1.75rem;padding:0;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:6px;color:var(--text-muted);cursor:pointer;opacity:0;transition:opacity .15s,color .15s,background .15s}.my-musical-card:hover .my-musical-card-delete,.my-musical-card-delete:focus{opacity:1}.my-musical-card-delete:hover{color:#e88;background:#c94a4a1f}.my-musical-card-delete:focus{outline:none;box-shadow:0 0 0 2px var(--accent-gold)}:root{--bg-dark: #05091a;--bg-dark-alt: #0b1430;--bg-card: #11142a;--bg-input: #181b33;--accent-gold: #f2c76b;--accent-gold-dim: #c79c4a;--accent-gold-bright: #ffe4a3;--accent-red: #7b1f32;--text: #f5f3ff;--text-muted: #a9a7c0;--border: #2a2f57;--danger: #d46a7c;--font-display: "Cinzel", Georgia, serif;--font-body: "Source Serif 4", Georgia, serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top center,rgba(242,199,107,.14),transparent 55%),radial-gradient(circle at bottom right,rgba(123,31,50,.25),transparent 55%),linear-gradient(160deg,var(--bg-dark) 0%,var(--bg-dark-alt) 60%,#050716 100%);color:var(--text);font-family:var(--font-body);font-size:1rem;line-height:1.6;min-height:100vh;position:relative;overflow-x:hidden}#root{min-height:100vh;position:relative;z-index:1;max-width:calc(100% - 240px);margin:0 auto}body:before,body:after{content:"";position:fixed;top:0;bottom:0;width:120px;pointer-events:none;z-index:4;background-image:linear-gradient(90deg,#3b0c16,#7b1f32,#3b0c16,#7b1f32 42%,#3b0c16,#7b1f32 78%,#3b0c16),radial-gradient(circle at 100% 50%,rgba(0,0,0,.65),transparent 55%);background-size:100% 100%,140px 100%;background-repeat:no-repeat;box-shadow:0 0 30px #000000d9,inset -8px 0 18px #000000a6;animation-duration:2.8s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}body:before{left:0;transform-origin:left center;animation-name:curtain-open-left}body:after{right:0;transform-origin:right center;background-image:linear-gradient(270deg,#3b0c16,#7b1f32,#3b0c16,#7b1f32 42%,#3b0c16,#7b1f32 78%,#3b0c16),radial-gradient(circle at 0% 50%,rgba(0,0,0,.65),transparent 55%);background-size:100% 100%,140px 100%;animation-name:curtain-open-right}@keyframes curtain-open-left{0%{left:0;width:52vw}70%{left:0;width:130px}to{left:0;width:120px}}@keyframes curtain-open-right{0%{right:0;width:52vw}70%{right:0;width:130px}to{right:0;width:120px}}h1,h2,h3{font-family:var(--font-display);font-weight:600;letter-spacing:.02em}h1{font-size:1.75rem;color:var(--accent-gold)}h2{font-size:1.35rem;color:var(--accent-gold-dim)}h3{font-size:1.1rem}a{color:var(--accent-gold-bright);text-decoration:none}a:hover{text-decoration:underline}button{font-family:var(--font-body);cursor:pointer}input,textarea{font-family:var(--font-body)}.gold{color:var(--accent-gold)}.muted{color:var(--text-muted)}.page-title{margin:0 0 .5rem;font-size:1.75rem}.character-list,.song-list{list-style:none;margin:0;padding:0}.character-item{border:1px solid var(--border);border-radius:6px;padding:1rem;margin-bottom:.75rem;background:linear-gradient(135deg,rgba(123,31,50,.25),transparent 55%),var(--bg-input)}.character-main{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-bottom:.5rem}.character-name-input{font-family:var(--font-display);font-size:1.05rem;font-weight:600;color:var(--accent-gold);background:transparent!important;border:none!important;padding:.25rem 0!important;max-width:200px}.character-name-input:focus{box-shadow:none!important;outline:none!important}.character-role{font-size:.85rem;color:var(--text-muted);padding:.2rem .5rem;background:#c9a22726;border-radius:4px}.character-desc-input{width:100%;margin-bottom:.5rem!important;font-size:.95rem}.song-item{border:1px solid var(--border);border-radius:6px;padding:1rem;margin-bottom:.75rem;background:linear-gradient(135deg,rgba(123,31,50,.25),transparent 55%),var(--bg-input)}.song-header{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-bottom:.5rem}.song-title-input{font-family:var(--font-display);font-size:1.05rem;color:var(--accent-gold);background:transparent!important;border:none!important;padding:.25rem 0!important;flex:1;min-width:140px}.song-title-input:focus{box-shadow:none!important;outline:none!important}.song-act-scene{font-size:.85rem;color:var(--text-muted)}.song-act-input,.song-scene-input{width:56px!important;margin-bottom:0!important}.song-notes-input{width:100%;font-size:.9rem;margin-top:.25rem}.script-card{padding:0;overflow:hidden}.script-toolbar{padding:.5rem 1rem;border-bottom:1px solid var(--border);background:var(--bg-input)}.script-textarea{display:block;width:100%;min-height:420px;padding:1rem 1.25rem;background:var(--bg-dark)!important;border:none!important;border-radius:0!important;color:var(--text);font-size:1rem;line-height:1.7;resize:vertical}.script-textarea:focus{outline:none!important;box-shadow:none!important}.suggestion-card .suggestion-text{margin:0;font-size:1.05rem;line-height:1.6;color:var(--text);white-space:pre-wrap}.sparkle-layer{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:3}.sparkle-cross{position:absolute;width:var(--sparkle-size, 14px);height:var(--sparkle-size, 14px);animation:sparkle-rotate var(--sparkle-rotate-duration, 18s) linear var(--sparkle-delay, 0s) infinite}.sparkle-cross-inner{display:block;position:relative;width:100%;height:100%;transform-origin:center center;opacity:0;animation:sparkle-twinkle var(--sparkle-duration, 7s) ease-in-out var(--sparkle-delay, 0s) infinite}.sparkle-cross-inner:before{content:"";position:absolute;left:0;top:50%;width:100%;height:2px;min-height:12%;background:linear-gradient(90deg,transparent 0%,rgba(255,236,179,.5) 20%,rgba(255,228,163,.95) 50%,rgba(242,199,107,1) 50%,rgba(255,228,163,.95) 80%,rgba(255,236,179,.5) 100%,transparent 100%);border-radius:2px;transform:translateY(-50%);box-shadow:0 0 6px #f2c76b99}.sparkle-cross-inner:after{content:"";position:absolute;top:0;left:50%;width:2px;min-width:12%;height:100%;background:linear-gradient(180deg,transparent 0%,rgba(255,236,179,.5) 20%,rgba(255,228,163,.95) 50%,rgba(242,199,107,1) 50%,rgba(255,228,163,.95) 80%,rgba(255,236,179,.5) 100%,transparent 100%);border-radius:2px;transform:translate(-50%);box-shadow:0 0 6px #f2c76b99}@keyframes sparkle-twinkle{0%,18%{opacity:0;transform:scale(.6)}28%{opacity:.9;transform:scale(1)}40%{opacity:1;transform:scale(1.02)}55%{opacity:.5;transform:scale(.95)}72%,to{opacity:0;transform:scale(.6)}}@keyframes sparkle-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fairy-wrap{position:fixed;left:0;top:0;width:64px;height:80px;margin-left:-32px;margin-top:-40px;pointer-events:none;z-index:10;animation:fairy-fly 5s ease-in-out 3s forwards}.fairy-figure{position:absolute;right:0;top:50%;transform:translateY(-50%);width:56px;height:70px;filter:drop-shadow(0 0 8px rgba(255,236,179,.5)) drop-shadow(0 0 4px rgba(255,255,255,.4))}.fairy-svg{width:100%;height:100%;display:block}.fairy-trail{position:absolute;right:100%;top:50%;transform:translateY(-50%);width:80px;height:20px;margin-right:4px}.fairy-trail-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ffecb3f2,#f2c76bcc 50%,#c79c4a66);box-shadow:0 0 6px #f2c76bb3;top:50%;left:calc(var(--trail-index) * 100% / var(--trail-total));transform:translate(-50%,-50%) scale(calc(1 - var(--trail-index) * .06));opacity:calc(1 - var(--trail-index) * .09)}@keyframes fairy-fly{0%{left:-8%;top:22%;opacity:0}5%{opacity:1}22%{left:22%;top:38%}45%{left:48%;top:48%}72%{left:78%;top:36%}92%{left:108%;top:28%}to{left:118%;top:26%;opacity:0}}
