:root{--primary-color: #8B5A2B;--secondary-color: #4A2511;--accent-color: #D4AF37;--bg-color: #2C1B0F;--text-color: #E8DBBE;--panel-bg: rgba(35, 25, 15, .85);--panel-bg-opacity1: rgba(35, 25, 15, 1);--panel-bg-footer: rgba(30, 20, 10, 1);--panel-border: #8B5A2B}html{height:100%}body{display:flex;flex-direction:column;overflow-y:hidden!important;overflow-x:hidden!important;background-image:url(/assets/img/dnd/background.webp);background-size:cover;background-position:center;background-repeat:repeat-y;background-attachment:fixed;color:var(--text-color);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;min-height:100vh;position:relative}.container.is-fluid.main-container{padding:0}.fog-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-image:url(/assets/img/fog-overlay.webp);background-size:cover;opacity:.1;pointer-events:none;z-index:10}.main-container{display:flex;flex-direction:column;flex-grow:1;padding:2rem;position:relative;z-index:1}@media screen and (min-width: 1024px){.initial-section{display:flex;justify-content:space-between;width:100%}.left-section{flex-basis:50%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:1rem}}@media screen and (max-width: 1023px){.initial-section{display:flex;flex-direction:column;width:100%}.left-section{width:100%;padding-top:1rem}.main-container{padding:1rem}}.auth-loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-image:url(/assets/img/bg-login.png);background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed;display:flex;align-items:center;justify-content:center;z-index:9999}.auth-loading-content{text-align:center;color:#fff;padding:2rem;border-radius:15px;background:#ffffff1a;backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 32px #0000004d}.loading-spinner{font-size:3rem;color:var(--accent-color, #ffd700);margin-bottom:1rem;animation:pulse 2s infinite}.loading-spinner .fa-spin{animation:spin 1s ease-in-out infinite!important}.loading-text{font-size:1.2rem;font-weight:500;margin:0 0 .5rem;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.5)}.loading-subtext{font-size:.9rem;font-weight:400;margin:0;color:#fffc;text-shadow:0 1px 2px rgba(0,0,0,.5);opacity:.9}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}.auth-loading-overlay.hidden,.auth-hidden{opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}#mainContent.visible{opacity:1;visibility:visible;transition:opacity .5s ease,visibility .5s ease;animation:fadeIn .5s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.medieval-title{font-family:MedievalSharp,cursive;color:var(--accent-color);text-shadow:2px 2px 4px rgba(0,0,0,.7)}.box{background-color:var(--panel-bg);border:2px solid var(--panel-border);box-shadow:0 0 15px #00000080;color:var(--text-color);border-radius:8px}.hidden{opacity:0;pointer-events:none;visibility:hidden;transition:opacity .3s ease,visibility 0s linear .3s}.fade-in{opacity:1;pointer-events:auto;visibility:visible;transition:opacity .3s ease,visibility 0s linear 0s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.hero{background-color:transparent;width:100%;text-align:center;margin:1.5rem 0}.hero-body{padding:0;margin-top:0}.hero .title{font-size:3.5rem;letter-spacing:2px;margin-bottom:.5rem}.hero .subtitle{color:var(--text-color);font-size:1.5rem}.label{color:var(--accent-color);font-weight:700}.input,.textarea,.select select{background-color:#281e14b3;border-color:var(--panel-border);color:var(--text-color);transition:all .3s}.input:focus,.textarea:focus,.select select:focus{border-color:var(--accent-color);box-shadow:0 0 0 .125em #d4af3740}#charName::placeholder{color:var(--text-color);opacity:.5}#charBackground::placeholder{color:var(--text-color);opacity:.5}@keyframes highlightBackground{0%{background-color:#23190fb3}50%{background-color:#d4af3733}to{background-color:#23190fb3}}.highlight{animation:highlightBackground 1s ease}.button{font-family:MedievalSharp,cursive;text-transform:uppercase;letter-spacing:1px;transition:all .3s ease}.button:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003}.button.is-primary{background:linear-gradient(145deg,var(--primary-color),var(--secondary-color))}.button.is-primary:hover{background:linear-gradient(145deg,var(--secondary-color),var(--primary-color))}.button.is-info{background-color:#4a6fa5}.button.is-info:hover{background-color:#3a5a8c}.logout-btn{position:absolute;top:1rem;right:1rem;background:#23190fcc;border:1px solid var(--panel-border);border-radius:50%;width:45px;height:45px;display:flex;align-items:center;justify-content:center;color:var(--accent-color);font-size:1.1rem;cursor:pointer;transition:all .3s ease;z-index:1000;opacity:.8;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.logout-btn:hover{background:#23190ff2;border-color:var(--accent-color);transform:scale(1.05);opacity:1;box-shadow:0 0 15px #d4af3766}.logout-btn:active{transform:scale(.95)}.logout-btn:focus{outline:2px solid var(--accent-color);outline-offset:2px}#logoutModal .modal-card{border:2px solid var(--panel-border);border-radius:12px;box-shadow:0 0 20px #000c}#logoutModal .modal-card-body strong{color:var(--accent-color)!important;font-weight:700}#logoutModal .modal-card-body em{color:var(--text-color)!important;font-style:italic}#logoutModal .modal-card-body .fas.fa-scroll{color:var(--accent-color)!important}#logoutModal .fa-shield{animation:none!important;transform:none!important}@media (max-width: 768px){.logout-btn{width:50px;height:50px;font-size:1.2rem;top:1rem;right:1rem;opacity:.9;padding:5px;margin:-5px;touch-action:manipulation;-webkit-touch-callout:none;user-select:none}.logout-btn:hover{transform:none;box-shadow:0 0 10px #d4af374d}.logout-btn:active{transform:scale(.9);background:#23190f;box-shadow:0 0 20px #d4af3799}.hero .hero-body{padding-top:2rem;padding-left:4rem;padding-right:4rem}.title.is-1.medieval-title{margin-top:1rem;line-height:1.2}}@media (max-width: 480px){.logout-btn{width:55px;height:55px;font-size:1.3rem;top:.75rem;right:.75rem;border-width:2px}.hero .hero-body{padding-top:2rem!important;padding-left:2rem!important;padding-right:2rem!important}.title.is-1.medieval-title{font-size:2.5rem!important;margin-top:1.5rem!important;line-height:1.1!important}.subtitle.medieval-title{margin-top:.5rem;font-size:1.1rem!important}}@media (hover: none) and (pointer: coarse){.logout-btn{min-width:48px;min-height:48px;width:55px;height:55px;font-size:1.3rem}.logout-btn:hover{transform:none;opacity:.9}.hero .hero-body{padding-top:2rem;padding-left:3rem;padding-right:3rem}}@media (max-width: 768px) and (orientation: landscape){.logout-btn{top:.5rem;right:.5rem;width:45px;height:45px;font-size:1.1rem}.hero .hero-body{padding-top:1.5rem!important;padding-bottom:1rem!important}.title.is-1.medieval-title{font-size:2rem!important;margin-top:.5rem!important}}.character-creation-section{display:flex;position:relative;width:90%;min-height:600px;border-radius:15px;align-self:center}.character-panel-container{width:100%;z-index:9000}.character-panel{max-width:800px;margin:0 auto}#characterForm{display:flex;gap:2rem;padding:1rem}.basic-info-column{flex:0 0 58%;border-right:2px solid var(--panel-border);padding-right:2rem}.attributes-column{flex:1}.attributes-container{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1rem}.attributes-container .field{margin-bottom:.5rem}.attributes-container .input{text-align:center;font-size:1.2rem;height:2.5rem}.attributes-title{grid-column:span 2;margin-bottom:1rem!important}#rollAttributes{grid-column:span 2;margin-top:1rem}.attributes-container{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.attributes-container .button{grid-column:span 2;margin-top:.5rem}.character-card{background-color:#23190fe6;border:2px solid var(--panel-border);border-radius:8px;padding:1rem;margin:.5rem;width:200px;cursor:pointer;transition:all .3s}.character-card:hover{transform:translateY(-5px);box-shadow:0 5px 15px #00000080;border-color:var(--accent-color)}.character-card .card-header{background-color:#1e140acc;border-radius:5px 5px 0 0;padding:.5rem}.character-card .card-content{padding:.5rem}.character-card .subtitle{color:var(--text-color)}.character-avatar{background-color:var(--bg-color);border:2px solid var(--panel-border);border-radius:50%;width:80px;height:80px;margin:0 auto;display:flex;align-items:center;justify-content:center}.character-avatar i{font-size:2.5rem;color:var(--accent-color)}.empty-list-message{color:#e8dbbe99;font-style:italic;text-align:center;padding:2rem}.saved-characters-section{background-color:var(--panel-bg-opacity1);width:100vw;padding:2rem 0;margin-top:2rem;position:relative}.new-character-highlight{transition:all .5s ease-in-out!important;box-shadow:0 0 20px 8px var(--accent-color)!important;transform:scale(1.05)!important;border-color:var(--accent-color)!important}.companion-container{transition:transform .1s ease,top .3s ease,bottom .3s ease,right .3s ease,left .3s ease,opacity .5s ease;will-change:transform,opacity;opacity:1}.companion-avatar{transition:transform .3s ease,box-shadow .3s ease}.companion-avatar.dragging{transform:scale(1.05);box-shadow:0 0 15px var(--accent-color)}.companion-speech-bubble{transition:opacity .3s ease,transform .3s ease;box-shadow:0 4px 15px #0003}.companion-speech-bubble.hidden{opacity:0;transform:scale(.8);pointer-events:none}.companion-speech-bubble p{word-wrap:break-word}@media screen and (min-width: 1024px){.companion-container{width:69%;min-height:150vh;position:absolute;top:-1%;right:-12%;left:auto;z-index:0;transform:none!important;touch-action:auto;opacity:1!important;overflow:hidden}.companion-avatar{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;cursor:default;border-radius:0;border:none;box-shadow:none;background-color:transparent;z-index:-1}.companion-speech-bubble{background:#ffffffe6;border:2px solid var(--panel-border);border-radius:15px;padding:15px;width:280px;position:absolute;top:13%;left:20%;color:var(--secondary-color);font-family:MedievalSharp,cursive;z-index:5;transform-origin:center center}.companion-speech-bubble:after{content:"";position:absolute;bottom:-10px;right:30px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid var(--panel-border)}.saved-characters-section{position:relative;z-index:1}}@media screen and (max-width: 1023px){.companion-container{position:fixed!important;inset:auto 20px 20px auto!important;transform:none!important;width:80px;height:80px;z-index:9990!important;touch-action:auto;transition:opacity .4s ease;opacity:1;will-change:opacity}.companion-container.companion-fade-out{opacity:0!important;pointer-events:none}.companion-avatar{width:80px;height:80px;border-radius:50%;border:2px solid var(--accent-color);box-shadow:0 2px 10px #0000004d;object-fit:cover;background-color:var(--panel-bg);cursor:pointer!important;-webkit-tap-highlight-color:transparent;position:relative;z-index:9991!important;transition:opacity .4s ease}.companion-container.companion-fade-out .companion-avatar{opacity:0}.companion-speech-bubble{position:absolute;bottom:90px;right:0;width:250px;max-width:calc(100vw - 60px);background:var(--panel-bg);border:2px solid var(--accent-color);border-radius:15px;padding:15px;z-index:9992!important;transform-origin:bottom right;transition:opacity .3s ease,transform .3s ease}.companion-speech-bubble.hidden{opacity:0;transform:scale(.8);pointer-events:none}.companion-speech-bubble:after{content:"";position:absolute;bottom:-10px;right:30px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid var(--accent-color)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.companion-avatar.pulse{animation:pulse 1s infinite}.companion-speech-bubble.fade-in{animation:fadeInUp .3s forwards}.companion-container.magical-glow{animation:magicalEyeGlow 3s ease-in-out}.companion-container.magical-glow:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;background:radial-gradient(circle,rgba(255,255,255,.8) 0%,rgba(138,43,226,.6) 30%,transparent 70%);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:1;animation:magicalPulse 3s ease-in-out}.companion-container.glow-merlin,.companion-container.glow-marques{animation:intenseWhiteGlow 4s ease-in-out}.companion-container.glow-merlin:before,.companion-container.glow-marques:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;background:radial-gradient(circle,rgba(255,255,255,.8) 0%,rgba(255,255,255,.6) 20%,rgba(255,255,255,.4) 40%,transparent 70%);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:1;animation:intenseWhitePulse 4s ease-in-out}.companion-container.glow-vorlan,.companion-container.glow-marek,.companion-container.glow-crequi,.companion-container.glow-igris{animation:blueGlow 4s ease-in-out}.companion-container.glow-vorlan:before,.companion-container.glow-marek:before,.companion-container.glow-crequi:before,.companion-container.glow-igris:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;background:radial-gradient(circle,rgba(0,150,255,.6) 0%,rgba(0,100,200,.4) 30%,rgba(0,50,150,.3) 60%,transparent 80%);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:1;animation:bluePulse 4s ease-in-out}.companion-container.glow-malthas{animation:redGlow 4s ease-in-out}.companion-container.glow-malthas:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;background:radial-gradient(circle,rgba(255,0,0,.6) 0%,rgba(200,0,0,.4) 30%,rgba(150,0,0,.3) 60%,transparent 80%);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:1;animation:redPulse 4s ease-in-out}.companion-container.glow-rashid{animation:goldGlow 4s ease-in-out}.companion-container.glow-rashid:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;background:radial-gradient(circle,rgba(255,215,0,.6) 0%,rgba(255,165,0,.4) 30%,rgba(255,140,0,.3) 60%,transparent 80%);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:1;animation:goldPulse 4s ease-in-out}.companion-container.glow-azariel{animation:angelicGlow 4s ease-in-out}.companion-container.glow-azariel:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;background:radial-gradient(circle,rgba(255,255,255,.7) 0%,rgba(240,248,255,.5) 30%,rgba(230,240,255,.3) 60%,transparent 80%);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:1;animation:angelicPulse 4s ease-in-out}.companion-container.glow-samuca{animation:purpleGlow 4s ease-in-out}.companion-container.glow-samuca:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;background:radial-gradient(circle,rgba(138,43,226,.6) 0%,rgba(128,0,128,.4) 30%,rgba(75,0,130,.3) 60%,transparent 80%);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:1;animation:purplePulse 4s ease-in-out}@keyframes magicalEyeGlow{0%{filter:brightness(1) drop-shadow(0 0 5px rgba(138,43,226,.3))}50%{filter:brightness(1.2) drop-shadow(0 0 15px rgba(138,43,226,.8)) drop-shadow(0 0 25px rgba(255,255,255,.6))}to{filter:brightness(1) drop-shadow(0 0 5px rgba(138,43,226,.3))}}@keyframes magicalPulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}50%{opacity:.8;transform:translate(-50%,-50%) scale(1.2)}to{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}@keyframes intenseWhiteGlow{0%{filter:brightness(1) drop-shadow(0 0 3px rgba(255,255,255,.3))}25%{filter:brightness(1.2) drop-shadow(0 0 10px rgba(255,255,255,.6)) drop-shadow(0 0 20px rgba(255,255,255,.4))}50%{filter:brightness(1.1) drop-shadow(0 0 8px rgba(255,255,255,.5)) drop-shadow(0 0 15px rgba(255,255,255,.3))}75%{filter:brightness(1.3) drop-shadow(0 0 12px rgba(255,255,255,.7)) drop-shadow(0 0 25px rgba(255,255,255,.5))}to{filter:brightness(1) drop-shadow(0 0 3px rgba(255,255,255,.3))}}@keyframes intenseWhitePulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.3)}50%{opacity:.8;transform:translate(-50%,-50%) scale(1.1)}75%{opacity:1;transform:translate(-50%,-50%) scale(1.4)}to{opacity:0;transform:translate(-50%,-50%) scale(1.6)}}@keyframes blueGlow{0%{filter:brightness(1) drop-shadow(0 0 3px rgba(0,150,255,.3))}50%{filter:brightness(1.15) drop-shadow(0 0 8px rgba(0,150,255,.5)) drop-shadow(0 0 15px rgba(0,100,200,.3))}to{filter:brightness(1) drop-shadow(0 0 3px rgba(0,150,255,.3))}}@keyframes bluePulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}50%{opacity:.9;transform:translate(-50%,-50%) scale(1.2)}to{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}@keyframes redGlow{0%{filter:brightness(1) drop-shadow(0 0 3px rgba(255,0,0,.3))}50%{filter:brightness(1.15) drop-shadow(0 0 8px rgba(255,0,0,.5)) drop-shadow(0 0 15px rgba(200,0,0,.3))}to{filter:brightness(1) drop-shadow(0 0 3px rgba(255,0,0,.3))}}@keyframes redPulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}50%{opacity:.9;transform:translate(-50%,-50%) scale(1.2)}to{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}@keyframes goldGlow{0%{filter:brightness(1) drop-shadow(0 0 3px rgba(255,215,0,.3))}50%{filter:brightness(1.15) drop-shadow(0 0 8px rgba(255,215,0,.5)) drop-shadow(0 0 15px rgba(255,165,0,.3))}to{filter:brightness(1) drop-shadow(0 0 3px rgba(255,215,0,.3))}}@keyframes goldPulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}50%{opacity:.9;transform:translate(-50%,-50%) scale(1.2)}to{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}@keyframes angelicGlow{0%{filter:brightness(1) drop-shadow(0 0 3px rgba(255,255,255,.3))}50%{filter:brightness(1.2) drop-shadow(0 0 8px rgba(255,255,255,.6)) drop-shadow(0 0 15px rgba(240,248,255,.4))}to{filter:brightness(1) drop-shadow(0 0 3px rgba(255,255,255,.3))}}@keyframes angelicPulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}50%{opacity:.95;transform:translate(-50%,-50%) scale(1.2)}to{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}@keyframes purpleGlow{0%{filter:brightness(1) drop-shadow(0 0 3px rgba(138,43,226,.3))}50%{filter:brightness(1.15) drop-shadow(0 0 8px rgba(138,43,226,.5)) drop-shadow(0 0 15px rgba(128,0,128,.3))}to{filter:brightness(1) drop-shadow(0 0 3px rgba(138,43,226,.3))}}@keyframes purplePulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}50%{opacity:.9;transform:translate(-50%,-50%) scale(1.2)}to{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}.modal-card-head,.modal-card-foot{background-color:var(--bg-color);border-color:var(--panel-border)}.modal-background-blocked{overflow:hidden!important}.modal-background-blocked>*:not(.modal){pointer-events:none!important;user-select:none!important}.modal-background-blocked .modal{pointer-events:auto!important}.modal-background-blocked .container,.modal-background-blocked .main-container,.modal-background-blocked .initial-section,.modal-background-blocked .left-section,.modal-background-blocked .right-section,.modal-background-blocked .character-creation-section,.modal-background-blocked .saved-characters-section,.modal-background-blocked .companion-container,.modal-background-blocked .world-selector,.modal-background-blocked .logout-btn,.modal-background-blocked .fog-overlay{pointer-events:none!important;user-select:none!important}.modal-background-blocked .modal,.modal-background-blocked .modal *{pointer-events:auto!important;user-select:auto!important}.modal-background{background-color:#000c!important;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.modal.is-active{pointer-events:auto!important;z-index:9999!important}.modal.is-active .modal-card,.modal.is-active .modal-content{pointer-events:auto!important;user-select:auto!important}.modal-background-blocked .modal{pointer-events:auto!important;z-index:9999!important}.modal-background-blocked .modal *{pointer-events:auto!important}.modal-background{background-color:#000c!important;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);pointer-events:auto!important}.modal.is-active .modal-card-body::-webkit-scrollbar{width:8px}.modal.is-active .modal-card-body::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}.modal.is-active .modal-card-body::-webkit-scrollbar-thumb{background:var(--accent-color);border-radius:4px}.modal.is-active .modal-card-body::-webkit-scrollbar-thumb:hover{background:var(--secondary-color)}.modal-card-body{background-color:var(--panel-bg);color:var(--text-color)}#characterDetails p,#characterDetails p strong,#characterDetails title{color:var(--text-color)}#characterDetails .medieval-title{color:var(--accent-color)}#loadingModal{z-index:9999;display:none;position:fixed;top:0;left:0;width:100%;height:100%;align-items:center;justify-content:center;background-color:#000000b3;padding:2vw;box-sizing:border-box}#loadingModal.is-active{display:flex}#loadingModal .modal-content{background-color:var(--panel-bg);border:3px solid var(--panel-border);border-radius:12px;padding:2rem;width:auto;max-width:90vw;text-align:center;box-shadow:0 0 20px #00000080;opacity:0;transform:scale(.9);transition:opacity .5s ease,transform .5s ease;margin:0 auto}#loadingModal.is-active .modal-content{opacity:1;transform:scale(1)}#loadingModal .modal-content p{font-size:1.2rem;color:var(--text-color);margin-top:1rem}#loadingModal .box{background-color:transparent!important;border:none!important;box-shadow:none!important;padding:1.5rem!important}@keyframes indeterminateProgress{0%{width:30%;left:-30%}to{width:30%;left:100%}}#loadingModal .progress{height:12px;border-radius:6px;overflow:hidden;position:relative}#loadingModal .progress::-webkit-progress-bar{background-color:#0003}#loadingModal .progress::-webkit-progress-value{background-color:var(--accent-color);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:1rem 1rem;animation:progress-bar-stripes 1s linear infinite}#loadingModal .medieval-title{color:var(--accent-color);font-size:1.5rem}#logoutLoadingModal{z-index:9999;display:none;position:fixed;top:0;left:0;width:100%;height:100%;align-items:center;justify-content:center;background-color:#000000b3;padding:2vw;box-sizing:border-box}#logoutLoadingModal.is-active{display:flex}#logoutLoadingModal .modal-content{background-color:var(--panel-bg);border:3px solid var(--panel-border);border-radius:12px;padding:2rem;width:auto;max-width:90vw;text-align:center;box-shadow:0 0 20px #00000080;opacity:0;transform:scale(.9);transition:opacity .5s ease,transform .5s ease;margin:0 auto}#logoutLoadingModal.is-active .modal-content{opacity:1;transform:scale(1)}#logoutLoadingModal .box{background-color:transparent!important;border:none!important;box-shadow:none!important;padding:1.5rem!important}#logoutLoadingModal .logout-loading-spinner{font-size:3rem;color:var(--accent-color, #ffd700);margin-bottom:1rem;animation:pulse 2s infinite}#logoutLoadingModal .logout-loading-spinner .fa-shield-alt{animation:spin 1s ease-in-out infinite}#logoutLoadingModal .loading-text{font-size:1.2rem;font-weight:500;margin:0 0 .5rem;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.5)}#logoutLoadingModal .loading-subtext{font-size:.9rem;font-weight:400;margin:0;color:#fffc;text-shadow:0 1px 2px rgba(0,0,0,.5);opacity:.9}@keyframes spin{to{transform:rotate(360deg)}}#characterModal{z-index:9999;overflow-y:auto}#characterModal .modal-background{position:fixed}#characterModal .modal-card{max-width:90%;width:800px;margin:2rem auto;background-color:var(--panel-bg);border:3px solid var(--panel-border);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);max-height:90vh;overflow-y:auto}#characterModal .modal-card-head,#characterModal .modal-card-foot{background-color:var(--secondary-color);border-color:var(--panel-border);position:sticky}#characterModal .modal-card-head{top:0;z-index:1}#characterModal .modal-card-foot{bottom:0;z-index:1}#characterModal .modal-card-body{background-color:var(--panel-bg);color:var(--text-color);padding:1.5rem}#characterModal .content.mt-4{width:100%;grid-column:1 / -1;margin-top:2rem!important}#characterModal .content.mt-4 h4{margin-bottom:1rem}#characterModal .content.mt-4 p{text-align:justify;line-height:1.6;padding:1rem;background:#0003;border-radius:8px;border:1px solid var(--panel-border)}#worldLoadingModal{z-index:9999;position:fixed;top:0;left:0;width:100%;height:100%;align-items:center;justify-content:center;background-color:#000000b3;padding:2vw;box-sizing:border-box}#worldLoadingModal.is-active{display:flex}#worldLoadingModal .modal-content{background-color:var(--panel-bg);border:3px solid var(--panel-border);border-radius:12px;padding:2rem;width:auto;max-width:90vw;text-align:center;box-shadow:0 0 20px #00000080;opacity:0;transform:scale(.9);transition:opacity .5s ease,transform .5s ease;margin:0 auto}#worldLoadingModal.is-active .modal-content{opacity:1;transform:scale(1)}#worldLoadingModal .box{background-color:transparent!important;border:none!important;box-shadow:none!important;padding:1.5rem!important}#worldLoadingModal .medieval-title{color:var(--accent-color);font-size:1.5rem}#worldLoadingModal .progress{height:12px;border-radius:6px;overflow:hidden;position:relative}#worldLoadingModal .progress::-webkit-progress-bar{background-color:#0003}#worldLoadingModal .progress::-webkit-progress-value{background-color:var(--accent-color);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:1rem 1rem;animation:progress-bar-stripes 1s linear infinite}@keyframes progress-bar-stripes{0%{background-position:1rem 0}to{background-position:0 0}}.world-notification{box-shadow:0 5px 15px #0000004d;border-left:5px solid var(--accent-color);animation:slide-in .3s ease forwards}@keyframes slide-in{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slide-out{0%{transform:translate(0)}to{transform:translate(100%)}}.world-notification.hiding{animation:slide-out .3s ease forwards}.world-notification button.delete{background-color:#fff3}.world-notification button.delete:hover{background-color:#fff6}.modal-background-blocked *:not(.modal):not(.modal *){pointer-events:none!important;user-select:none!important}.modal.is-active .modal-background{pointer-events:none!important;cursor:default!important}.lore-generation-modal{background:linear-gradient(135deg,var(--bg-color) 0%,var(--panel-bg) 100%);border:2px solid var(--accent-color);border-radius:15px;box-shadow:0 10px 30px #00000080;padding:2rem;max-width:500px;margin:0 auto}.book-animation{display:flex;justify-content:center;margin-bottom:2rem}.book{position:relative;width:120px;height:80px;perspective:1000px;display:flex;align-items:center;justify-content:center;animation:bookFloat 4s ease-in-out infinite}.book-cover{position:absolute;left:0;width:50%;height:100%;background:linear-gradient(45deg,#8b4513,sienna);border-radius:5px 0 0 5px;display:flex;align-items:center;justify-content:center;color:gold;font-size:1.5rem;box-shadow:0 4px 8px #0000004d;border:2px solid #654321;border-right:none;z-index:10}.book-back-cover{position:absolute;right:0;width:50%;height:100%;background:linear-gradient(45deg,sienna,#8b4513);border-radius:0 5px 5px 0;box-shadow:0 4px 8px #0000004d;border:2px solid #654321;border-left:none;z-index:5}.book-pages{position:absolute;width:100%;height:100%;transform-style:preserve-3d;z-index:20}.page{position:absolute;width:45%;height:90%;background:#fff;border-radius:2px;box-shadow:0 1px 3px #0003;transform-origin:left center;border:1px solid #E0E0E0;left:50%;top:5%}.page-1{animation:pageFlip1 6s ease-in-out infinite;z-index:25}.page-2{animation:pageFlip2 6s ease-in-out infinite;animation-delay:2s;z-index:24}.page-3{animation:pageFlip3 6s ease-in-out infinite;animation-delay:4s;z-index:23}.page-4{animation:pageFlip4 6s ease-in-out infinite;animation-delay:6s;z-index:22}.page-5{animation:pageFlip5 6s ease-in-out infinite;animation-delay:8s;z-index:21}@keyframes bookFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}@keyframes pageFlip1{0%,to{transform:rotateY(0);opacity:1}15%{transform:rotateY(-45deg);opacity:1}30%{transform:rotateY(-90deg);opacity:1}45%{transform:rotateY(-135deg);opacity:1}60%{transform:rotateY(-180deg);opacity:1}75%{transform:rotateY(-135deg);opacity:1}90%{transform:rotateY(-90deg);opacity:1}to{transform:rotateY(0);opacity:1}}@keyframes pageFlip2{0%,to{transform:rotateY(0);opacity:1}15%{transform:rotateY(-45deg);opacity:1}30%{transform:rotateY(-90deg);opacity:1}45%{transform:rotateY(-135deg);opacity:1}60%{transform:rotateY(-180deg);opacity:1}75%{transform:rotateY(-135deg);opacity:1}90%{transform:rotateY(-90deg);opacity:1}to{transform:rotateY(0);opacity:1}}@keyframes pageFlip3{0%,to{transform:rotateY(0);opacity:1}15%{transform:rotateY(-45deg);opacity:1}30%{transform:rotateY(-90deg);opacity:1}45%{transform:rotateY(-135deg);opacity:1}60%{transform:rotateY(-180deg);opacity:1}75%{transform:rotateY(-135deg);opacity:1}90%{transform:rotateY(-90deg);opacity:1}to{transform:rotateY(0);opacity:1}}@keyframes pageFlip4{0%,to{transform:rotateY(0);opacity:1}15%{transform:rotateY(-45deg);opacity:1}30%{transform:rotateY(-90deg);opacity:1}45%{transform:rotateY(-135deg);opacity:1}60%{transform:rotateY(-180deg);opacity:1}75%{transform:rotateY(-135deg);opacity:1}90%{transform:rotateY(-90deg);opacity:1}to{transform:rotateY(0);opacity:1}}@keyframes pageFlip5{0%,to{transform:rotateY(0);opacity:1}15%{transform:rotateY(-45deg);opacity:1}30%{transform:rotateY(-90deg);opacity:1}45%{transform:rotateY(-135deg);opacity:1}60%{transform:rotateY(-180deg);opacity:1}75%{transform:rotateY(-135deg);opacity:1}90%{transform:rotateY(-90deg);opacity:1}to{transform:rotateY(0);opacity:1}}.loading-content{text-align:center}.loading-content .subtitle{color:var(--text-color);margin-bottom:1.5rem;font-style:italic}.loading-messages{position:relative;height:60px;margin:1.5rem 0}.loading-message{position:absolute;width:100%;text-align:center;color:var(--accent-color);font-weight:500;opacity:0;transform:translateY(20px);transition:all .5s ease}.loading-message.active{opacity:1;transform:translateY(0)}.progress-container{position:relative;margin-top:1.5rem}.progress-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-weight:700;color:var(--accent-color);font-size:.9rem}.hibernation-notification{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;padding:1rem;border-radius:10px;margin:1rem 0;text-align:center;animation:pulse 2s ease-in-out infinite;border:2px solid #FFD700}.hibernation-notification i{margin-right:.5rem;animation:spin 2s linear infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.footer{background-color:var(--panel-bg-footer);border-top:1px solid var(--panel-border);padding:1.5rem;position:relative;z-index:1}#footer-text strong{color:var(--text-color)}@media screen and (max-width: 1023px){.main-container{flex-direction:column;padding:1rem;padding-bottom:120px}.left-section{width:100%;padding-top:1rem}.character-creation-section{width:100%}.companion-container{position:fixed!important;inset:auto 20px 20px auto!important;transform:none!important;width:80px;height:80px;touch-action:auto;display:block}.companion-avatar{width:80px;height:80px;border-radius:50%;border:2px solid var(--accent-color);box-shadow:0 2px 10px #0000004d;object-fit:cover;object-position:center top;background-color:var(--panel-bg);cursor:pointer!important;-webkit-tap-highlight-color:transparent;position:relative}.companion-avatar:active{cursor:pointer;transform:scale(.95)}.companion-speech-bubble{position:absolute;bottom:90px;right:0;width:250px;max-width:calc(100vw - 60px);background:var(--panel-bg);border:2px solid var(--accent-color);border-radius:15px;padding:15px;transform-origin:bottom right;color:var(--text-color);font-family:MedievalSharp,cursive}.companion-speech-bubble p{color:var(--text-color)!important;margin:0;padding:0;line-height:1.4;font-size:1rem;word-wrap:break-word}.companion-speech-bubble:after{content:"";position:absolute;bottom:-10px;right:30px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid var(--accent-color)}}@media screen and (max-width: 768px){body{overflow-x:hidden}.main-container{padding:1rem;width:100%;overflow-x:hidden;margin-bottom:60px}#characterForm{flex-direction:column;padding:.5rem;gap:1rem}.basic-info-column{flex:1;border-right:none;border-bottom:1px solid var(--panel-border);padding-right:0;padding-bottom:1rem;margin-bottom:1rem}.attributes-column{padding-left:0}.attributes-container{grid-template-columns:repeat(2,1fr);gap:.75rem}.attributes-container .input{font-size:1rem;height:2.2rem;padding:.25rem .5rem}.character-card{margin:.25rem}#savedCharactersList{gap:.5rem}.field.is-grouped.is-grouped-centered{flex-direction:column;width:100%;align-items:stretch;padding:0 1rem}.field.is-grouped.is-grouped-centered .control{width:100%;margin:.25rem 0!important}.field.is-grouped.is-grouped-centered .control .button{width:100%;justify-content:center;height:3rem}.field.is-grouped.is-grouped-centered .control:nth-child(1){order:3}.field.is-grouped.is-grouped-centered .control:nth-child(2){order:1}.field.is-grouped.is-grouped-centered .control:nth-child(3){order:2}#characterModal .modal-card{width:95%;margin:1rem auto;max-height:90vh}#loadingModal .modal-content{max-width:95%;overflow-y:auto}.saved-characters-section{padding-top:1rem!important;margin-top:1rem!important}.saved-characters-section .title{margin-bottom:1rem!important}.hero{margin-bottom:.5rem!important}.hero .title{font-size:2.5rem;margin-bottom:.5rem!important}.hero .subtitle{font-size:1.2rem;margin-top:0!important;margin-bottom:1rem!important}.companion-speech-bubble{width:calc(100vw - 55px);bottom:85px;right:5px;padding:10px;font-size:.9rem}.companion-speech-bubble:after{right:20px}.character-panel .title.is-3{margin-bottom:1rem!important}#characterForm .field:first-of-type{margin-top:0}.footer{padding-bottom:10px}}@media screen and (max-width: 480px){.main-container{padding:.5rem;padding-bottom:110px}.character-card{width:100%;margin:.5rem 0}.attributes-container{gap:.5rem}.attributes-container .input{height:2rem;font-size:.9rem}.field.is-grouped.is-grouped-centered .control .button{height:2.8rem;font-size:.9rem}#characterModal .modal-card{margin:.5rem auto}#characterModal .modal-card-body{padding:1rem}#characterModal .modal-card-foot .button{font-size:.8rem}}@media screen and (max-width: 320px){.companion-speech-bubble{width:calc(100vw - 45px);min-width:auto;right:2px;bottom:82px;padding:8px;font-size:.85rem}.companion-speech-bubble:after{right:15px}.hero,.title{margin-bottom:.5rem!important}.subtitle{margin-top:0!important;margin-bottom:0!important}.form-title{margin-bottom:0!important}.field:first-of-type{margin-top:0}.field.is-grouped.is-grouped-centered .control .button{height:2.5rem;font-size:.8rem}}.world-selector{position:absolute;top:600px;right:250px;width:400px;padding:1.2rem;display:flex;flex-direction:column;align-items:center;z-index:10}.world-selector-row{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;margin-bottom:1rem;gap:1rem}#worldIconContainer{position:relative;width:800px;display:flex;align-items:center;justify-content:center}.side-world{width:250px;display:flex;align-items:center;justify-content:center}#worldIconContainer:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:220px;border-radius:50%;opacity:.3;z-index:-1;transition:opacity .3s ease}#worldIconContainer:hover:before{opacity:.7}.world-icon{width:100%;height:100%;border-radius:50%;object-fit:contain;transition:transform .3s,box-shadow .3s;cursor:pointer}.world-icon.side{width:100%;height:100%;opacity:.7}.world-icon.side:hover{transform:scale(1.1)!important;box-shadow:none}.world-icon:hover{transform:scale(1.1)}.arrow-button{background-color:#281e1400;border:0px solid var(--panel-border);border-radius:50%;width:35px;height:35px;min-width:35px;min-height:35px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:var(--accent-color);cursor:pointer;transition:all .3s ease;padding:0}.arrow-button:hover{transform:scale(1.1);background-color:#46321eb3;border-color:var(--accent-color);box-shadow:0 0 10px #d4af374d}.arrow-button:active{transform:scale(.95)}.world-title{font-family:MedievalSharp,cursive;color:var(--accent-color);text-shadow:2px 2px 4px rgba(0,0,0,.7);text-align:center;margin-top:.5rem;margin-bottom:.5rem;font-size:1rem}.world-confirm-button{font-family:MedievalSharp,cursive;text-transform:uppercase;letter-spacing:1px;transition:all .3s ease;width:90%;font-size:1rem;z-index:10}.world-confirm-button:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003;background:linear-gradient(145deg,var(--secondary-color),var(--primary-color));border-color:var(--accent-color)}.world-confirm-button:active{transform:translateY(0)}@media screen and (max-width: 1300px){.world-selector{position:static;width:100%;max-width:600px;margin:0;padding:1rem;right:auto;top:auto;border-radius:12px}.world-selector-row{width:100%;justify-content:space-between}#worldIconContainer{width:120px}.side-world{width:80px}.world-icon{max-width:100%;height:auto}.world-confirm-button{margin-top:1rem;max-width:300px}}@media screen and (min-width: 1024px) and (max-width: 1300px){.world-selector{position:relative;left:50%;transform:translate(-50%);width:80%;max-width:600px;margin-top:1rem;margin-bottom:1rem}}@media screen and (max-width: 1023px){.world-selector{position:static;width:90%;min-width:90%;max-width:90%;margin:.5rem auto 1rem;padding:1rem 1rem 1.5rem;z-index:0}.world-selector-row{width:100%;justify-content:space-around;gap:.5rem}#worldIconContainer{width:140px}.side-world{width:100px}.world-icon{max-width:100%;height:auto}.arrow-button{width:40px;height:40px;min-width:40px;min-height:40px;font-size:1.3rem}.world-confirm-button{padding:.6rem 1rem;font-size:1rem;max-width:100%;margin-top:1.5rem;height:3rem;position:relative;z-index:0}}@media screen and (max-width: 480px){.world-selector{width:95%;min-width:95%;max-width:95%;padding:.8rem .8rem 1.5rem;margin-bottom:60px}}