:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.logo-screen{width:100%;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);animation:fadeIn .5s ease-out;position:relative;overflow:hidden}.logo-background-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:0}.logo-background-image{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;z-index:0}.logo-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(180deg,#0000004d,#00000080 40%,#000000b3);z-index:1}.logo-container{text-align:center;animation:scaleIn .8s ease-out;position:relative;z-index:2}@keyframes scaleIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.logo-icon{margin-bottom:1.5rem}.logo-emoji{font-size:5rem;display:inline-block;animation:bounce 2s ease-in-out infinite;filter:drop-shadow(0 4px 20px rgba(34,197,94,.4))}.logo-icon-image{width:120px;height:120px;object-fit:contain;animation:bounce 2s ease-in-out infinite;filter:drop-shadow(0 4px 20px rgba(34,197,94,.5))}.logo-icon-svg{width:120px;height:120px;animation:bounce 2s ease-in-out infinite;filter:drop-shadow(0 4px 20px rgba(34,197,94,.5))}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.logo-title{font-size:2.5rem;font-weight:700;margin:0;letter-spacing:.02em}.logo-frog{color:#22c55e;text-shadow:0 2px 10px rgba(34,197,94,.5)}.logo-games{color:#fff}.logo-ai{color:#818cf8;font-weight:300;text-shadow:0 2px 10px rgba(129,140,248,.5)}.logo-tagline{margin-top:1rem;margin-bottom:.25rem;color:#ffffffe6;font-size:1.1rem;font-weight:500;letter-spacing:.05em;animation:fadeInUp 1s ease-out .3s both}.logo-subtitle{margin:0;color:#fff9;font-size:.9rem;font-style:italic;animation:fadeInUp 1s ease-out .5s both}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.logo-loading{position:absolute;bottom:3rem}.loading-dots{display:flex;gap:.5rem}.loading-dots span{width:8px;height:8px;background:#ffffff80;border-radius:50%;animation:dotPulse 1.4s infinite ease-in-out both}.loading-dots span:nth-child(1){animation-delay:-.32s}.loading-dots span:nth-child(2){animation-delay:-.16s}@keyframes dotPulse{0%,80%,to{transform:scale(.6);opacity:.5}40%{transform:scale(1);opacity:1}}.logo-buttons{display:flex;flex-direction:column;gap:1rem;margin-top:3rem;align-items:center;position:relative;z-index:2}.logo-continue-button{padding:1rem 2.5rem;font-size:1.2rem;font-weight:600;color:#1a1a2e;background:linear-gradient(135deg,#fbbf24,#f59e0b);border:none;border-radius:2rem;cursor:pointer;box-shadow:0 4px 20px #fbbf2466;transition:all .3s ease;animation:fadeInUp 1s ease-out .4s both,pulseContinue 2s ease-in-out 1.5s infinite}.logo-continue-button:hover{transform:scale(1.05);box-shadow:0 6px 30px #fbbf2499}.logo-continue-button:active{transform:scale(.98)}@keyframes pulseContinue{0%,to{box-shadow:0 4px 20px #fbbf2466}50%{box-shadow:0 4px 30px #fbbf24b3}}.logo-start-button{padding:1rem 2.5rem;font-size:1.2rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#22c55e,#16a34a);border:none;border-radius:2rem;cursor:pointer;box-shadow:0 4px 20px #22c55e66;transition:all .3s ease;animation:fadeInUp 1s ease-out .5s both,pulse 2s ease-in-out 1.5s infinite}.logo-start-button:hover{transform:scale(1.05);box-shadow:0 6px 30px #22c55e99}.logo-start-button:active{transform:scale(.98)}@keyframes pulse{0%,to{box-shadow:0 4px 20px #22c55e66}50%{box-shadow:0 4px 30px #22c55eb3}}.logo-footer{position:absolute;bottom:1.5rem;left:0;right:0;display:flex;justify-content:center;align-items:center;gap:2rem;z-index:2;animation:fadeIn 1s ease-out 1s both}.logo-version{color:#fff6;font-size:.75rem;font-family:monospace}.logo-powered{color:#fff6;font-size:.75rem;display:flex;align-items:center;gap:.25rem}@media(max-width:640px){.logo-emoji{font-size:4rem}.logo-icon-image,.logo-icon-svg{width:80px;height:80px}.logo-title{font-size:2rem}.logo-tagline{font-size:.95rem}.logo-subtitle{font-size:.8rem}.logo-start-button,.logo-continue-button{padding:.875rem 2rem;font-size:1.1rem}.logo-footer{gap:1rem;font-size:.65rem}}.animated-background{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;z-index:0}.animated-bg-gradient{position:absolute;inset:0;width:100%;height:100%;z-index:1}.animated-bg-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;opacity:0;transition:opacity .5s ease-in-out}.animated-bg-image.loaded{opacity:1}.animated-bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:3;opacity:0;transition:opacity 1s ease-in-out;pointer-events:none}.animated-bg-video.ready{opacity:1}.animated-bg-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:4;background:linear-gradient(to bottom,#0003,#0000001a 30% 70%,#0000004d);pointer-events:none}.animated-bg-indicator{position:absolute;bottom:12px;right:12px;z-index:5;pointer-events:none}.animated-bg-indicator-dot{width:8px;height:8px;background:#fff9;border-radius:50%;animation:animated-bg-pulse 2s ease-in-out infinite}@keyframes animated-bg-pulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.8;transform:scale(1.2)}}.dm-selection-screen{width:100%;height:100vh;height:100dvh;display:flex;flex-direction:column;position:relative;overflow:hidden}.dm-background{position:absolute;inset:0;z-index:0;overflow:hidden}.dm-background-layer{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);opacity:0;transition:opacity .8s ease;filter:brightness(.4) saturate(1.2)}.dm-background-layer.active{opacity:1}.dm-background-layer .animated-bg-image,.dm-background-layer .animated-bg-video{object-fit:cover}.dm-background-image{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);object-fit:cover;opacity:0;transition:opacity .8s ease,transform .3s ease;filter:brightness(.4) saturate(1.2)}.dm-background-image.active{opacity:1}.dm-background:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0009,#0000004d 30% 70%,#000000b3);pointer-events:none}.dm-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}.particle{position:absolute;width:4px;height:4px;border-radius:50%;opacity:.4;left:var(--x);bottom:-10px;animation:float-up var(--duration) var(--delay) infinite ease-out}@keyframes float-up{0%{transform:translateY(0) scale(1);opacity:0}10%{opacity:.6}90%{opacity:.3}to{transform:translateY(-100vh) scale(.5);opacity:0}}.dm-header{position:relative;z-index:10;text-align:center;padding:1.5rem 1rem .75rem;flex-shrink:0}.dm-header h1{font-size:1.6rem;font-weight:800;color:#fff;margin:0 0 .4rem;text-transform:uppercase;letter-spacing:2px;text-shadow:0 0 20px var(--dm-glow, rgba(167, 139, 250, .6)),0 0 40px var(--dm-glow, rgba(167, 139, 250, .3)),0 2px 10px rgba(0,0,0,.8);transition:text-shadow .5s ease}.dm-header p{font-size:.85rem;color:#fff9;margin:0;font-style:italic;letter-spacing:.5px}.dm-carousel{flex:1;position:relative;z-index:5;display:flex;flex-direction:column;overflow:hidden;touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none}.dm-cards-container{flex:1;position:relative;display:flex;align-items:center;justify-content:center;padding:0 1rem}.dm-card-wrapper{position:absolute;width:calc(100% - 2rem);max-width:400px;height:100%;max-height:500px;will-change:transform,opacity}.dm-card{width:100%;height:100%;border-radius:20px;overflow:hidden;position:relative;border:3px solid transparent;transition:border-color .3s ease,box-shadow .3s ease}.dm-card-media{position:absolute;inset:0;z-index:0}.dm-video,.dm-image{width:100%;height:100%;object-fit:cover}.dm-card-overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.95) 0%,rgba(0,0,0,.6) 40%,rgba(0,0,0,.2) 70%,transparent 100%)}.dm-card-content{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;padding:1.5rem}.dm-name{font-size:1.75rem;font-weight:700;color:#fff;margin:0 0 .25rem;letter-spacing:.5px}.dm-tagline{font-size:1rem;color:#fffc;font-style:italic;margin:0 0 1rem}.dm-greeting{background:#ffffff14;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-left:4px solid;padding:.875rem 1rem;margin-bottom:1rem;border-radius:0 12px 12px 0;animation:fade-in .4s ease}@keyframes fade-in{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.dm-greeting p{margin:0;color:#fffffff2;font-style:italic;font-size:.95rem;line-height:1.5}.dm-style-badges{display:flex;flex-wrap:wrap;gap:.5rem}.dm-badge{padding:.25rem .75rem;background:#0000004d;border:1px solid;border-radius:999px;font-size:.75rem;text-transform:capitalize;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.dm-nav-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:none;background:#ffffff1a;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:50%;color:#fff;font-size:1.5rem;cursor:pointer;z-index:30;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.dm-nav-arrow:hover{background:#fff3;transform:translateY(-50%) scale(1.1)}.dm-nav-arrow.left{left:.5rem}.dm-nav-arrow.right{right:.5rem}.dm-footer{position:relative;z-index:10;padding:.75rem 1rem;display:flex;justify-content:center;align-items:center;flex-shrink:0}.dm-hint{font-size:.75rem;color:#ffffff80;margin:0}.dm-mute-button{position:absolute;bottom:1rem;right:1rem;width:44px;height:44px;border:none;background:#ffffff1a;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:50%;font-size:1.25rem;cursor:pointer;transition:all .2s ease}.dm-mute-button:hover{background:#fff3}@media(max-width:640px){.dm-header h1{font-size:1.25rem}.dm-header p{font-size:.8rem}.dm-card-wrapper{max-height:450px}.dm-name{font-size:1.5rem}.dm-tagline{font-size:.9rem}.dm-greeting{padding:.75rem}.dm-greeting p{font-size:.875rem}.dm-nav-arrow{width:36px;height:36px;font-size:1.25rem}}@media(min-width:768px){.dm-card-wrapper{max-width:450px;max-height:600px}.dm-name{font-size:2rem}.dm-nav-arrow{width:52px;height:52px}.dm-nav-arrow.left{left:2rem}.dm-nav-arrow.right{right:2rem}}.dm-card-wrapper.active .dm-card{animation:subtle-pulse 3s ease-in-out infinite}@keyframes subtle-pulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.05)}}.dm-video{background:#1a1a2e}.dm-card-media:empty:before,.dm-image[src=""]:before,.dm-video[src=""]:before{content:"";display:block;width:100%;height:100%;background:linear-gradient(135deg,#2d3748,#1a202c)}.cutscene-transition{position:fixed;inset:0;z-index:1000;background:#000;display:flex;align-items:center;justify-content:center;cursor:pointer}.cutscene-transition.fade-in{animation:cutscene-fade-in .8s ease-out forwards}.cutscene-transition.fade-out{animation:cutscene-fade-out .8s ease-in forwards}@keyframes cutscene-fade-in{0%{opacity:0}to{opacity:1}}@keyframes cutscene-fade-out{0%{opacity:1}to{opacity:0}}.cutscene-video{width:100%;height:100%;object-fit:cover}.cutscene-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.4) 100%)}.cutscene-transition:before,.cutscene-transition:after{content:"";position:absolute;left:0;right:0;height:8%;background:#000;z-index:10}.cutscene-transition:before{top:0}.cutscene-transition:after{bottom:0}.cutscene-skip{position:absolute;bottom:15%;left:50%;transform:translate(-50%);z-index:20;animation:skip-pulse 2s ease-in-out infinite}.cutscene-skip span{display:inline-block;padding:.5rem 1.5rem;background:#0009;border:1px solid rgba(255,255,255,.3);border-radius:2rem;color:#fffc;font-size:.85rem;text-transform:uppercase;letter-spacing:1px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@keyframes skip-pulse{0%,to{opacity:.6}50%{opacity:1}}@media(min-width:768px){.cutscene-transition:before,.cutscene-transition:after{height:12%}.cutscene-skip{bottom:18%}}.voice-selection-screen{position:relative;width:100%;min-height:100vh;display:flex;flex-direction:column;overflow:hidden;color:#fff;-webkit-user-select:none;user-select:none}.voice-background{position:fixed;inset:0;z-index:0;overflow:hidden}.voice-background-layer{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);opacity:0;transition:opacity .8s ease;filter:brightness(.4) saturate(1.2)}.voice-background-layer.active{opacity:1}.voice-background-layer .animated-bg-image,.voice-background-layer .animated-bg-video{object-fit:cover}.voice-background-layer .voice-background-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1}.voice-background:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0009,#0000004d 30% 70%,#000000b3);pointer-events:none}.voice-particles{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}.voice-particles .particle{position:absolute;width:4px;height:4px;border-radius:50%;opacity:.6;left:var(--x);animation:voice-float var(--duration) ease-in-out infinite;animation-delay:var(--delay)}@keyframes voice-float{0%,to{transform:translateY(100vh) scale(0);opacity:0}10%{opacity:.6}90%{opacity:.6}to{transform:translateY(-20vh) scale(1);opacity:0}}.voice-header{position:relative;z-index:10;text-align:center;padding:1.5rem 1rem .75rem;flex-shrink:0}.voice-back-btn{position:absolute;left:1rem;top:1.5rem;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:#0000004d;color:#fff;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:20}.voice-back-btn:hover{background:#ffffff1a;border-color:#ffffff80}.voice-header h1{font-size:1.6rem;font-weight:800;color:#fff;margin:0 0 .4rem;text-transform:uppercase;letter-spacing:2px;text-shadow:0 0 20px var(--voice-glow, rgba(99, 102, 241, .6)),0 0 40px var(--voice-glow, rgba(99, 102, 241, .3)),0 2px 10px rgba(0,0,0,.8);transition:text-shadow .5s ease}.voice-header p{font-size:.85rem;color:#fff9;margin:0;font-style:italic;letter-spacing:.5px}.voice-dm-message{position:relative;z-index:10;display:flex;gap:.75rem;align-items:center;padding:.75rem 1rem;margin:0 1rem;background:#0006;border-radius:1rem;border:1px solid rgba(255,255,255,.1)}.voice-dm-portrait{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--voice-primary, #6366f1);box-shadow:0 0 10px var(--voice-glow, rgba(99, 102, 241, .3));flex-shrink:0}.voice-dm-speech{font-size:.85rem;font-style:italic;color:#ffffffd9;margin:0;line-height:1.4}.voice-intro-speech{font-size:.95rem;font-style:italic;color:#ffffffe6;margin:0;line-height:1.5;text-align:center;padding:.5rem 1rem}.voice-carousel{position:relative;z-index:10;flex:1;display:flex;flex-direction:column;align-items:center;padding:1rem 0;touch-action:pan-y}.voice-cards-container{position:relative;width:100%;flex:1;display:flex;align-items:center;justify-content:center}.voice-card-wrapper{position:absolute;width:85%;max-width:340px;max-height:420px;will-change:transform,opacity}.voice-card{background:#0f0f19e6;border-radius:1.5rem;border:2px solid transparent;overflow:hidden;transition:border-color .3s ease,box-shadow .3s ease}.voice-card.playing{animation:voice-card-pulse 1s ease-in-out infinite}@keyframes voice-card-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.voice-card-visual{position:relative;height:100px;overflow:hidden}.voice-card-image{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.voice-icon{font-size:4rem;opacity:.3;font-weight:700}.voice-card-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,rgba(15,15,25,.8) 80%,rgba(15,15,25,1) 100%)}.voice-sound-waves{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:6px;z-index:5}.wave-bar{width:6px;border-radius:3px;animation:wave-animate .6s ease-in-out infinite;animation-delay:var(--wave-delay)}@keyframes wave-animate{0%,to{height:20px}50%{height:60px}}.voice-card-content{padding:1rem 1.25rem 1.5rem;text-align:center}.voice-name{font-size:1.75rem;font-weight:700;margin:0 0 .5rem;transition:text-shadow .4s ease}.voice-badges{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:.75rem;flex-wrap:wrap}.voice-personality-badge{display:inline-block;padding:.25rem .75rem;border-radius:1rem;border:1px solid;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.voice-featured-badge{display:inline-block;padding:.25rem .75rem;border-radius:1rem;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1a1a2e;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.voice-description{font-size:.9rem;color:#ffffffb3;margin:0 0 .75rem;line-height:1.4}.voice-sample-quote{background:#0000004d;border-left:3px solid;padding:.75rem 1rem;margin-bottom:1rem;border-radius:0 .5rem .5rem 0}.voice-sample-quote p{font-size:.85rem;font-style:italic;color:#fffc;margin:0}.voice-preview-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:2rem;border:2px solid;background:transparent;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease}.voice-preview-btn:hover:not(:disabled){transform:translateY(-2px)}.voice-preview-btn:disabled{opacity:.5;cursor:not-allowed}.voice-preview-btn .preview-icon{font-size:1rem}.voice-nav-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:none;background:#ffffff1a;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:50%;color:#fff;font-size:1.5rem;cursor:pointer;z-index:30;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.voice-nav-arrow:hover{background:#fff3;transform:translateY(-50%) scale(1.1)}.voice-nav-arrow.left{left:.5rem}.voice-nav-arrow.right{right:.5rem}.voice-footer{position:relative;z-index:10;padding:.75rem 1rem;text-align:center}.voice-counter{font-size:1rem;font-weight:600;color:#fffc;margin:0 0 .25rem}.voice-hint{font-size:.75rem;color:#ffffff80;margin:0}.voice-api-warning{position:fixed;bottom:.5rem;left:50%;transform:translate(-50%);font-size:.75rem;color:#fbbf24cc;padding:.25rem .75rem;background:#00000080;border-radius:1rem;z-index:100}@media(min-width:768px){.voice-header{padding:2rem 2rem 1rem}.voice-header h1{font-size:2rem}.voice-dm-message{max-width:500px;margin:0 auto}.voice-card-wrapper{max-width:380px;max-height:480px}.voice-card-visual{height:120px}.voice-nav-arrow{width:52px;height:52px}.voice-nav-arrow.left{left:2rem}.voice-nav-arrow.right{right:2rem}}@media(max-width:380px){.voice-nav-arrow{width:36px;height:36px;font-size:1.25rem}}.creation-screen{width:100%;height:100vh;display:flex;flex-direction:column;position:relative;overflow:hidden;padding:1rem;box-sizing:border-box}.creation-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}.creation-background-layer{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .8s ease}.creation-background-layer.active{opacity:.4}.creation-background-layer .animated-bg-image,.creation-background-layer .animated-bg-video{object-fit:cover}.creation-background-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease}.creation-background-image.active{opacity:.4}.creation-particles{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:hidden}.particle{position:absolute;width:4px;height:4px;border-radius:50%;left:var(--x);bottom:-10px;opacity:.6;animation:particleRise var(--duration) ease-out var(--delay) infinite}@keyframes particleRise{0%{transform:translateY(0) scale(1);opacity:.6}50%{opacity:.8}to{transform:translateY(-100vh) scale(.3);opacity:0}}.creation-header{position:relative;z-index:10;text-align:center;padding:.5rem 0}.creation-header h1{font-size:1.5rem;font-weight:700;color:#fff;margin:0;text-shadow:0 2px 10px rgba(0,0,0,.5)}.creation-header p{font-size:.875rem;color:#ffffffb3;margin:.25rem 0 0}.creation-back-btn{position:absolute;left:0;top:50%;transform:translateY(-50%);background:#0006;border:1px solid rgba(255,255,255,.2);color:#fff;width:40px;height:40px;border-radius:50%;font-size:1.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .2s}.creation-back-btn:hover{background:#fff3}.creation-dm-message{position:relative;z-index:10;display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;margin:0 1rem;background:#0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:1rem;border:1px solid rgba(255,255,255,.1)}.creation-dm-portrait{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--creation-primary, #a78bfa);box-shadow:0 0 10px var(--creation-glow, rgba(167, 139, 250, .3));flex-shrink:0}.creation-dm-speech{flex:1;font-size:.85rem;color:#ffffffd9;font-style:italic;margin:0;line-height:1.4;text-align:center}.creation-carousel{flex:1;position:relative;z-index:5;display:flex;flex-direction:column;min-height:0;padding:.5rem 0}.creation-dots{display:flex;justify-content:center;gap:8px;padding:.5rem 0}.creation-dot{width:8px;height:8px;border-radius:50%;border:none;cursor:pointer;transition:all .3s;padding:0}.creation-dot:hover{transform:scale(1.2)}.creation-cards-container{flex:1;position:relative;display:flex;align-items:center;justify-content:center;min-height:0}.creation-card-wrapper{position:absolute;width:85%;max-width:320px;height:100%;max-height:380px;display:flex;align-items:center;justify-content:center;pointer-events:none}.creation-card-wrapper.active{pointer-events:auto}.creation-card{width:100%;height:100%;background:#0009;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:20px;border:2px solid transparent;overflow:hidden;display:flex;flex-direction:column;transition:border-color .3s,box-shadow .3s}.creation-card-visual{position:relative;height:55%;overflow:hidden}.creation-card-image{width:100%;height:100%;object-fit:cover}.creation-card-overlay{position:absolute;bottom:0;left:0;right:0;height:60%;background:linear-gradient(transparent,#000c)}.creation-card-content{flex:1;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.creation-card-name{font-size:1.5rem;font-weight:700;color:#fff;margin:0}.creation-card-description{font-size:.8rem;color:#ffffffb3;margin:0;line-height:1.4;flex:1}.creation-card-traits{display:flex;flex-wrap:wrap;gap:.4rem}.creation-trait-badge{padding:.2rem .5rem;border-radius:6px;font-size:.7rem;font-weight:500;border:1px solid;background:#0000004d}.creation-trait-badge.bonus{border:none}.creation-nav-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:#00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;z-index:10}.creation-nav-arrow:hover{background:#fff3}.creation-nav-arrow.left{left:0}.creation-nav-arrow.right{right:0}.creation-footer{position:relative;z-index:10;text-align:center;padding:.75rem 0}.creation-hint{font-size:.75rem;color:#ffffff80;margin:0 0 .75rem}.creation-select-button{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 2rem;border:none;border-radius:12px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.creation-select-button:hover{transform:translateY(-2px)}.creation-select-button .select-icon{font-size:1.1rem}.creation-simple-screen{width:100%;height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#1a1a2e,#0f0f1a);padding:1rem;box-sizing:border-box}.creation-simple-header{position:relative;text-align:center;padding:.5rem 0 1rem}.creation-simple-header h1{font-size:1.25rem;color:#fff;margin:0}.creation-simple-content{flex:1;overflow-y:auto;padding:.5rem 0}.simple-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;padding:.5rem}.simple-grid.classes{grid-template-columns:repeat(2,1fr)}.simple-grid.alignments{grid-template-columns:repeat(3,1fr)}.simple-grid.gender .simple-card img{aspect-ratio:3/5;object-position:top}.creation-card.gender-card{display:flex;flex-direction:column}.creation-card.gender-card .gender-visual{height:70%}.creation-card.gender-card .creation-card-image{object-position:top center}.creation-card.gender-card .creation-card-content{height:30%;justify-content:center;text-align:center}.creation-card.class-card{display:flex;flex-direction:column}.creation-card.class-card .class-visual{height:55%}.creation-card.class-card .creation-card-image{object-position:top center}.creation-card.background-card{display:flex;flex-direction:column}.creation-card.background-card .background-visual{height:50%}.creation-card.background-card .creation-card-image{object-position:center}.creation-card.background-card .creation-card-content{height:50%;justify-content:flex-start;padding-top:.75rem}.creation-card.background-card .creation-card-description{font-size:.75rem;line-height:1.3}.creation-card.alignment-card{display:flex;flex-direction:column}.creation-card.alignment-card .creation-card-image{object-position:center}.creation-card.alignment-card .creation-card-content{height:45%;justify-content:flex-start;padding-top:.75rem}.creation-card.alignment-card .creation-card-subtitle{font-size:.8rem;opacity:.9;margin-bottom:.5rem}.creation-card.alignment-card .creation-card-description{font-size:.7rem;font-style:italic;line-height:1.4;opacity:.85}.name-screen .name-input-section{flex:1;display:flex;align-items:center;justify-content:center;padding:1rem;position:relative;z-index:10}.name-input-container{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:100%;max-width:400px}.name-portrait-wrapper{position:relative;display:inline-block}.name-character-preview{position:relative;width:180px;height:180px;border-radius:50%;overflow:hidden}.name-character-image{width:100%;height:100%;object-fit:cover;object-position:top center}.name-character-glow{position:absolute;inset:-10px;border-radius:50%;pointer-events:none}.name-character-image.loading{opacity:0}.name-portrait-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#00000080;z-index:5}.name-portrait-loading .loading-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top-width:3px;border-radius:50%;animation:spin 1s linear infinite}.name-portrait-badge{position:absolute;bottom:10px;left:50%;transform:translate(-50%);padding:2px 10px;border-radius:10px;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#000;z-index:10}.name-regenerate-btn{position:absolute;top:5px;right:5px;width:32px;height:32px;border-radius:50%;background:#0009;border:2px solid;font-size:1.1rem;cursor:pointer;z-index:15;display:flex;align-items:center;justify-content:center;transition:all .2s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.name-regenerate-btn:hover:not(:disabled){background:#000c;transform:scale(1.1)}.name-regenerate-btn:disabled{opacity:.5;cursor:not-allowed}.name-regenerate-btn:active:not(:disabled){transform:scale(.95)}.name-field-wrapper{position:relative;width:100%}.name-field{width:100%;padding:1rem 3rem 1rem 1.5rem;font-size:1.5rem;font-family:Georgia,serif;text-align:center;background:#00000080;border:2px solid;border-radius:12px;color:#fff;outline:none;transition:all .3s ease}.name-field::placeholder{color:#fff6;font-style:italic}.name-field:focus{background:#000000b3}.name-shuffle-btn{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);background:none;border:none;font-size:1.5rem;cursor:pointer;opacity:.7;transition:opacity .2s,transform .2s}.name-shuffle-btn:hover{opacity:1;transform:translateY(-50%) rotate(180deg)}.name-summary{display:flex;flex-direction:column;align-items:center;gap:.25rem;text-align:center}.name-summary .summary-title{font-size:2rem;font-family:Georgia,serif;font-weight:700;text-shadow:0 0 20px currentColor}.name-summary .summary-details{font-size:1rem;color:#ffffffe6}.name-summary .summary-alignment{font-size:.85rem;color:#ffffffb3}.name-confirm-btn{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1rem 2.5rem;font-size:1.25rem;font-weight:700;color:#fff;border:none;border-radius:12px;cursor:pointer;transition:transform .2s,box-shadow .2s;text-transform:uppercase;letter-spacing:1px;position:relative;z-index:20}.name-confirm-btn:hover:not(:disabled){transform:scale(1.05)}.name-confirm-btn:disabled{opacity:.5;cursor:not-allowed}.name-confirm-btn .btn-icon{font-size:1.5rem}.simple-card{background:#ffffff14;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:0;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;overflow:hidden;text-align:center}.simple-card:hover{background:#ffffff26;transform:translateY(-2px);box-shadow:0 4px 20px #0000004d}.simple-card img{width:100%;aspect-ratio:4/3;object-fit:cover}.simple-card span{padding:.5rem;color:#fff;font-weight:500}.simple-card .card-title{font-size:.9rem;padding-bottom:0}.simple-card .card-subtitle{font-size:.7rem;color:#fff9;padding-top:.25rem}.simple-card.alignment{padding:1rem;gap:.25rem}.simple-card .alignment-name{font-size:.8rem;font-weight:600}.simple-card .alignment-desc{font-size:.65rem;color:#fff9;line-height:1.3}.ability-selection{display:flex;flex-direction:column;gap:1rem;padding:1rem;background:#0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;border:1px solid rgba(255,255,255,.1)}.ability-methods{display:flex;gap:.5rem;justify-content:center}.method-btn{padding:.5rem 1.25rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;cursor:pointer;transition:all .2s}.method-btn.active{background:#8b5cf64d;border-color:#8b5cf6;color:#c4b5fd}.ability-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.ability-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:.75rem;text-align:center;display:flex;flex-direction:column;gap:.25rem}.ability-name{font-size:.65rem;color:#ffffff80;font-weight:600;letter-spacing:.05em}.ability-value{font-size:1.5rem;font-weight:700;color:#fff}.ability-mod{font-size:.8rem;color:#10b981}.ability-bonus{font-size:.6rem;color:#8b5cf6}.confirm-btn{width:100%;padding:.875rem;background:linear-gradient(135deg,#8b5cf6,#7c3aed);border:none;border-radius:10px;color:#fff;font-weight:600;cursor:pointer;transition:all .2s}.confirm-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 15px #8b5cf666}.confirm-btn:disabled{opacity:.5;cursor:not-allowed}.name-selection{display:flex;flex-direction:column;gap:1.5rem;padding:2rem 1rem;text-align:center}.name-input{width:100%;padding:1rem;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:12px;color:#fff;font-size:1.25rem;text-align:center;outline:none;transition:all .2s}.name-input:focus{border-color:#8b5cf6;background:#8b5cf61a}.name-input::placeholder{color:#fff6}.name-preview{display:flex;flex-direction:column;gap:.25rem}.preview-name{font-size:1.75rem;font-weight:700;color:#fff}.preview-title{font-size:.9rem;color:#8b5cf6}@media(prefers-reduced-motion:reduce){.particle{animation:none;display:none}.creation-background-image,.creation-card,.creation-card-wrapper,.creation-dot,.simple-card,.confirm-btn{transition:none}}@media(min-width:768px){.creation-dm-message{max-width:500px;margin:0 auto}.creation-card-wrapper{max-width:380px}}@media(max-width:640px){.creation-header h1{font-size:1.25rem}.creation-card-wrapper{width:90%;max-height:340px}.creation-card-name{font-size:1.25rem}.creation-nav-arrow{width:36px;height:36px;font-size:1.25rem}.simple-grid.alignments{grid-template-columns:repeat(3,1fr)}.ability-grid{grid-template-columns:repeat(2,1fr)}}.skills-screen{background:linear-gradient(135deg,#1e1b4b,#312e81,#1e1b4b)}.skills-background-gradient{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(167,139,250,.15) 0%,transparent 70%)}.skills-selection-area{flex:1;display:flex;flex-direction:column;padding:0 1.5rem;gap:1rem;overflow-y:auto;max-height:calc(100vh - 320px)}.background-skills-info{display:flex;gap:.5rem;align-items:center;padding:.75rem 1rem;background:#a78bfa26;border-radius:8px;border:1px solid rgba(167,139,250,.3)}.background-skills-info .info-label{color:#ffffffb3;font-size:.875rem}.background-skills-info .info-skills{color:#a78bfa;font-weight:500}.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.skill-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem .75rem;gap:.25rem;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:12px;cursor:pointer;transition:all .2s ease;position:relative}.skill-card:hover:not(:disabled){background:#a78bfa26;border-color:#a78bfa80}.skill-card.selected{background:#a78bfa33;border-color:#a78bfa;box-shadow:0 0 15px #a78bfa4d}.skill-card.from-background{background:#a78bfa1a;border-color:#a78bfa4d;opacity:.7}.skill-card:disabled:not(.from-background){opacity:.4;cursor:not-allowed}.skill-name{font-size:.95rem;font-weight:600;color:#fff}.skill-ability{font-size:.75rem;color:#ffffff80}.skill-badge{position:absolute;top:4px;right:4px;font-size:.6rem;padding:2px 6px;background:#a78bfa80;border-radius:4px;color:#fff}.skill-check{position:absolute;top:50%;right:10px;transform:translateY(-50%);font-size:1.25rem;color:#a78bfa}.skills-counter{text-align:center;padding:.75rem;font-size:.95rem;color:#ffffffb3}.spells-screen{background:linear-gradient(135deg,#1e3a5f,#1e1b4b,#1e3a5f)}.spells-background-gradient{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(96,165,250,.15) 0%,transparent 70%)}.spell-phase-indicator{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1.5rem}.phase-dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);color:#ffffff80;transition:all .3s ease}.phase-dot.active{background:#60a5fa;border-color:#60a5fa;color:#fff;box-shadow:0 0 15px #60a5fa80}.phase-dot.completed{background:#22c55e;border-color:#22c55e;color:#fff}.phase-line{width:40px;height:2px;background:#fff3}.spells-selection-area{flex:1;display:flex;flex-direction:column;padding:0 1rem;gap:1rem;overflow-y:auto;max-height:calc(100vh - 360px)}.spells-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.spell-card{display:flex;flex-direction:column;padding:.875rem;gap:.375rem;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:12px;cursor:pointer;transition:all .2s ease;position:relative;text-align:left;min-height:120px}.spell-card:hover:not(:disabled){background:#60a5fa1a;border-color:var(--spell-color, #60a5fa)}.spell-card.selected{background:#60a5fa26;border-color:var(--spell-color, #60a5fa);box-shadow:0 0 15px #60a5fa4d}.spell-card:disabled:not(.selected){opacity:.4;cursor:not-allowed}.spell-header{display:flex;align-items:center;gap:.5rem}.spell-school-icon{font-size:1.25rem}.spell-name{font-size:.95rem;font-weight:600;color:#fff;flex:1}.spell-school{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--spell-color, #60a5fa);opacity:.8}.spell-description{font-size:.75rem;color:#fff9;line-height:1.3;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.spell-damage{display:flex;gap:.375rem;align-items:center;margin-top:auto}.damage-dice{font-size:.8rem;font-weight:600;color:#ef4444;background:#ef444426;padding:2px 6px;border-radius:4px}.damage-type{font-size:.7rem;color:#ffffff80;text-transform:capitalize}.spell-meta{display:flex;gap:.5rem;margin-top:auto}.spell-range{font-size:.7rem;color:#ffffff80}.spell-check{position:absolute;top:8px;right:8px;font-size:1.25rem;color:var(--spell-color, #60a5fa)}.spells-counter{text-align:center;padding:.75rem;font-size:.95rem;color:#ffffffb3}.spell-particle{animation:spell-float var(--duration, 3s) ease-in-out infinite;animation-delay:var(--delay, 0s)}@keyframes spell-float{0%,to{transform:translateY(0) rotate(0);opacity:.6}50%{transform:translateY(-30px) rotate(180deg);opacity:1}}@media(max-width:480px){.skills-grid,.spells-grid{grid-template-columns:1fr}.spell-card{min-height:100px}}.ability-scores-screen{background:linear-gradient(135deg,#451a03,#78350f,#451a03)}.ability-scores-background-gradient{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(245,158,11,.15) 0%,transparent 70%)}.ability-scores-content{flex:1;display:flex;flex-direction:column;padding:0 1rem;gap:1rem;overflow-y:auto;max-height:calc(100vh - 320px)}.roll-dice-area{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;min-height:200px}.roll-all-button{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:1.5rem 2.5rem;background:linear-gradient(135deg,#f59e0b,#d97706);border:none;border-radius:16px;color:#fff;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 20px #f59e0b66}.roll-all-button:hover{transform:scale(1.05);box-shadow:0 6px 30px #f59e0b99}.roll-all-button .dice-icon{font-size:2.5rem}.dice-animation{display:flex;flex-direction:column;align-items:center;gap:1rem}.rolling-dice{display:flex;gap:.5rem}.animated-die{width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f59e0b,#d97706);border-radius:10px;color:#fff;font-size:1.5rem;font-weight:700;animation:dice-shake .1s ease-in-out infinite}@keyframes dice-shake{0%,to{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}.rolling-text{color:#f59e0b;font-size:1.2rem;font-weight:600;animation:pulse .5s ease-in-out infinite}.rolled-values-pool{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:1rem;background:#0000004d;border-radius:12px;border:1px solid rgba(245,158,11,.3)}.pool-label{font-size:.875rem;color:#ffffffb3;text-transform:uppercase;letter-spacing:.05em}.rolled-values{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.rolled-value{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f59e0b,#d97706);border-radius:10px;color:#fff;font-size:1.25rem;font-weight:700;transition:all .2s ease}.rolled-value.assigned{background:#64646480;opacity:.5}.reroll-button{padding:.5rem 1rem;background:transparent;border:1px solid rgba(245,158,11,.5);border-radius:8px;color:#f59e0b;font-size:.875rem;cursor:pointer;transition:all .2s ease}.reroll-button:hover{background:#f59e0b26;border-color:#f59e0b}.stat-assignment-grid{display:flex;flex-direction:column;gap:.5rem}.stat-assignment-row{display:grid;grid-template-columns:80px 1fr auto auto;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#ffffff0d;border-radius:8px;min-height:50px}.stat-name-col{display:flex;flex-direction:column}.stat-abbrev{font-size:1rem;font-weight:700;color:#f59e0b}.stat-full{font-size:.65rem;color:#ffffff80;text-transform:uppercase}.stat-value-col{display:flex;justify-content:center}.assigned-value{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:linear-gradient(135deg,#f59e0b,#d97706);border:none;border-radius:8px;color:#fff;font-size:1.25rem;font-weight:700;cursor:pointer;transition:all .2s ease}.assigned-value:hover{background:linear-gradient(135deg,#d97706,#b45309)}.assigned-value .clear-icon{font-size:.875rem;opacity:.7}.value-picker{display:flex;gap:.25rem;flex-wrap:wrap;justify-content:center}.pick-value-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#f59e0b33;border:1px solid rgba(245,158,11,.4);border-radius:6px;color:#fff;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .15s ease}.pick-value-btn:hover{background:#f59e0b66;border-color:#f59e0b;transform:scale(1.1)}.racial-bonus-col{text-align:right}.racial-bonus{font-size:.75rem;color:#22c55e;white-space:nowrap}.final-value-col{display:flex;align-items:center;gap:.375rem;min-width:70px;justify-content:flex-end}.final-score{font-size:1.25rem;font-weight:700;color:#fff;background:#22c55e33;padding:.25rem .5rem;border-radius:6px}.final-modifier{font-size:.875rem;color:#ffffffb3}@media(max-width:480px){.stat-assignment-row{grid-template-columns:60px 1fr auto}.racial-bonus-col{display:none}.pick-value-btn{width:32px;height:32px;font-size:.85rem}}.shop-screen{width:100%;height:100vh;display:flex;flex-direction:column;position:relative;overflow:hidden;color:#fff;font-family:Cinzel,serif}.shop-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}.shop-background-layer{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .8s ease;filter:brightness(.4) saturate(1.2)}.shop-background-layer.active{opacity:1}.shop-background-layer .animated-bg-image,.shop-background-layer .animated-bg-video{object-fit:cover}.shop-background-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease;filter:brightness(.4) saturate(1.2)}.shop-background-image.active{opacity:1}.shop-particles{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:hidden}.shop-particle{position:absolute;width:4px;height:4px;border-radius:50%;left:var(--x);bottom:-10px;opacity:.6;animation:floatUp var(--duration) ease-in-out infinite;animation-delay:var(--delay)}@keyframes floatUp{0%{transform:translateY(0) scale(1);opacity:0}10%{opacity:.6}90%{opacity:.6}to{transform:translateY(-100vh) scale(.5);opacity:0}}.shop-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;position:relative;z-index:10;background:linear-gradient(180deg,rgba(0,0,0,.6) 0%,transparent 100%)}.shop-back-btn{width:40px;height:40px;border-radius:50%;background:#0006;border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.shop-back-btn:hover{background:#ffffff1a}.shop-title{text-align:center;flex:1}.shop-title h1{font-size:1.1rem;font-weight:700;margin:0;text-shadow:0 2px 10px rgba(0,0,0,.8)}.shop-gold{display:flex;align-items:center;gap:.4rem;padding:.4rem .75rem;background:#0006;border:2px solid;border-radius:20px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.gold-icon{font-size:1rem}.gold-amount{font-size:1rem;font-weight:700;color:#ffc107}.shop-keeper-section{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;margin:0 1rem;background:#0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:1rem;border:1px solid rgba(255,255,255,.1);position:relative;z-index:10}.shop-keeper-portrait{width:48px;height:48px;border-radius:50%;overflow:hidden;border:2px solid;flex-shrink:0;box-shadow:0 0 10px var(--shop-glow)}.shop-keeper-portrait img{width:100%;height:100%;object-fit:cover}.shop-keeper-speech{flex:1;font-size:.8rem;color:#ffffffd9;font-style:italic;margin:0;line-height:1.4;font-family:Crimson Text,serif}.shop-gift-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .3s ease-out}.shop-gift-popup{background:#000c;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:2px solid;border-radius:20px;padding:2rem;text-align:center;max-width:280px;animation:popIn .3s ease-out}@keyframes popIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.gift-icon{font-size:3rem;margin-bottom:1rem}.gift-text{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem}.gift-title{font-size:1.25rem;font-weight:700}.gift-desc{opacity:.8;font-family:Crimson Text,serif}.gift-accept-btn{padding:.75rem 2rem;border:none;border-radius:12px;color:#000;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s;font-family:Cinzel,serif}.gift-accept-btn:hover{transform:scale(1.05);filter:brightness(1.1)}.shop-categories{display:flex;gap:.4rem;padding:.5rem 1rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;position:relative;z-index:10}.shop-categories::-webkit-scrollbar{display:none}.shop-category-tab{padding:.4rem .75rem;background:#0006;border:1px solid rgba(255,255,255,.2);border-radius:20px;color:#ffffffb3;font-size:.7rem;white-space:nowrap;cursor:pointer;transition:all .2s;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-family:Cinzel,serif}.shop-category-tab:hover{background:#ffffff1a}.shop-category-tab.active{background:#ffffff1a;border-width:2px}.shop-carousel{flex:1;position:relative;z-index:5;display:flex;flex-direction:column;min-height:0;padding:.25rem 0}.shop-dots{display:flex;justify-content:center;gap:6px;padding:.4rem 0;flex-wrap:wrap;max-width:80%;margin:0 auto}.shop-dot{width:8px;height:8px;border-radius:50%;border:none;cursor:pointer;transition:all .3s;padding:0}.shop-dot:hover{transform:scale(1.2)}.shop-dot.active{transform:scale(1.3)}.shop-cards-container{flex:1;position:relative;display:flex;align-items:center;justify-content:center;min-height:0}.shop-card-wrapper{position:absolute;width:75%;max-width:280px;height:100%;max-height:340px;display:flex;align-items:center;justify-content:center;pointer-events:none}.shop-card-wrapper.active{pointer-events:auto}.shop-card{width:100%;height:100%;background:#0009;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:16px;border:2px solid transparent;overflow:hidden;display:flex;flex-direction:column;transition:border-color .3s,box-shadow .3s}.shop-card.in-cart{opacity:.7}.shop-card.unaffordable{opacity:.5}.shop-card-visual{position:relative;height:45%;overflow:hidden;background:#0000004d}.shop-card-image{width:100%;height:100%;object-fit:cover}.shop-card-overlay{position:absolute;bottom:0;left:0;right:0;height:50%;background:linear-gradient(transparent,#000c)}.shop-card-badge{position:absolute;top:.5rem;right:.5rem;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.85rem;color:#000}.shop-card-in-cart{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#22c55ee6;padding:.5rem 1rem;border-radius:8px;font-size:.85rem;font-weight:700;color:#fff}.shop-card-content{flex:1;padding:.75rem;display:flex;flex-direction:column;gap:.4rem}.shop-card-name{font-size:1.1rem;font-weight:700;color:#fff;margin:0}.shop-card-stats{display:flex;flex-direction:column;gap:.25rem;flex:1}.shop-stat{font-size:.75rem;color:#fffc;font-family:Crimson Text,serif}.shop-card-properties{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.25rem}.shop-property{padding:.15rem .4rem;border-radius:4px;font-size:.65rem;border:1px solid;background:#0000004d;color:#fffc}.shop-card-footer{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:auto}.shop-card-cost{font-size:1.1rem;font-weight:700}.shop-add-btn{padding:.5rem 1rem;border:none;border-radius:8px;color:#000;font-size:.8rem;font-weight:700;font-family:Cinzel,serif;transition:all .2s}.shop-add-btn:not(:disabled):hover{transform:scale(1.05);filter:brightness(1.1)}.shop-nav-arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;background:#00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;z-index:20}.shop-nav-arrow:hover{background:#fff3}.shop-nav-arrow.left{left:.5rem}.shop-nav-arrow.right{right:.5rem}.shop-hint{font-size:.7rem;color:#ffffff80;text-align:center;margin:0;padding:.25rem 0}.shop-cart{background:#0009;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:2px solid;padding:.5rem 1rem;position:relative;z-index:10;max-height:100px;overflow-y:auto}.cart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.4rem}.cart-title,.cart-total{font-weight:700;font-size:.85rem}.cart-items{display:flex;flex-wrap:wrap;gap:.4rem}.cart-item{display:flex;align-items:center;gap:.4rem;background:#ffffff1a;border:1px solid;padding:.2rem .4rem;border-radius:8px}.cart-item-image{width:24px;height:24px;border-radius:4px;object-fit:cover}.cart-item-name{font-size:.7rem}.cart-remove-btn{background:none;border:none;color:#fff9;font-size:1rem;cursor:pointer;padding:0;line-height:1;transition:color .2s}.cart-remove-btn:hover{color:#ef4444}.shop-footer{padding:.75rem 1rem;position:relative;z-index:10;background:linear-gradient(0deg,rgba(0,0,0,.6) 0%,transparent 100%)}.shop-complete-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem;border:none;border-radius:12px;color:#000;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s;font-family:Cinzel,serif;text-transform:uppercase;letter-spacing:1px}.shop-complete-btn:hover{transform:scale(1.02);filter:brightness(1.1)}.shop-complete-btn .btn-icon{font-size:1.1rem}@media(min-width:768px){.shop-card-wrapper{max-width:320px;max-height:400px}.shop-keeper-section{margin:0 2rem}.shop-keeper-portrait{width:56px;height:56px}.shop-card-name{font-size:1.25rem}}@media(min-width:1024px){.shop-card-wrapper{max-width:360px;max-height:450px}}@media(prefers-reduced-motion:reduce){.shop-particle,.shop-card-wrapper,.shop-complete-btn,.gift-accept-btn,.shop-category-tab,.shop-add-btn{animation:none;transition:none}.shop-gift-popup{animation:none}}.equipment-screen{width:100%;height:100vh;display:flex;flex-direction:column;position:relative;overflow:hidden;color:#fff}.equipment-background{position:absolute;inset:0;z-index:0;pointer-events:none}.equipment-background-layer{position:absolute;inset:0;width:100%;height:100%;filter:brightness(.4) saturate(1.2)}.equipment-background-layer.active{opacity:1}.equipment-background-layer .animated-bg-image,.equipment-background-layer .animated-bg-video{object-fit:cover}.equipment-background-image{width:100%;height:100%;object-fit:cover;filter:brightness(.4) saturate(1.2)}.equipment-particles{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}.equipment-particle{position:absolute;width:4px;height:4px;border-radius:50%;opacity:.6;left:var(--x);animation:float-up var(--duration) ease-in-out infinite;animation-delay:var(--delay)}@keyframes float-up{0%{transform:translateY(100vh) scale(0);opacity:0}10%{opacity:.6}90%{opacity:.6}to{transform:translateY(-20vh) scale(1);opacity:0}}.equipment-header{position:relative;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:#0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.1)}.equipment-back-btn{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:#0000004d;color:#fff;font-size:1.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.equipment-back-btn:hover{background:#ffffff1a;border-color:var(--equip-primary)}.equipment-title h1{margin:0;font-size:1.5rem;font-weight:600;text-shadow:0 2px 10px rgba(0,0,0,.5)}.equipment-ac{display:flex;flex-direction:column;align-items:center;padding:.5rem .75rem;border-radius:8px;border:2px solid;background:#0000004d;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.ac-label{font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;opacity:.7}.ac-value{font-size:1.5rem;font-weight:700}.equipment-dm-section{position:relative;z-index:10;display:flex;gap:1rem;padding:1rem 1.5rem;cursor:pointer;background:#0003;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.equipment-dm-portrait{width:60px;height:60px;border-radius:50%;overflow:hidden;border:2px solid;flex-shrink:0;box-shadow:0 0 20px #00000080}.equipment-dm-portrait img{width:100%;height:100%;object-fit:cover}.equipment-dm-speech{flex:1;display:flex;flex-direction:column;gap:.25rem}.dm-step-title{font-weight:700;font-size:.9rem;text-transform:uppercase;letter-spacing:.05em}.equipment-dm-speech p{margin:0;font-size:.95rem;line-height:1.4;color:#ffffffe6;font-style:italic}.dm-tap-hint{font-size:.75rem;opacity:.5;margin-top:.25rem}.equipment-content{position:relative;z-index:10;flex:1;display:flex;gap:1rem;padding:1rem 1.5rem;overflow:hidden}.equipment-panel{flex:1;display:flex;flex-direction:column;background:#0006;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:1rem;overflow:hidden;transition:all .3s}.equipment-panel.highlighted{box-shadow:0 0 30px var(--equip-glow, rgba(129, 140, 248, .3))}.equipment-panel h2{margin:0 0 .75rem;font-size:1.1rem;font-weight:600;color:#fff;display:flex;align-items:center;gap:.5rem}.inventory-grid{flex:1;display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;overflow-y:auto;padding-right:.5rem}.inventory-card{display:flex;flex-direction:column;background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:12px;overflow:hidden;cursor:pointer;transition:all .2s}.inventory-card:hover{transform:translateY(-2px);border-color:var(--equip-primary);box-shadow:0 4px 20px var(--card-glow, rgba(0, 0, 0, .3))}.inventory-card-image{width:100%;aspect-ratio:1;overflow:hidden;background:#0000004d}.inventory-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.inventory-card:hover .inventory-card-image img{transform:scale(1.05)}.inventory-card-info{padding:.5rem;display:flex;flex-direction:column;gap:.125rem}.inventory-card-name{font-size:.85rem;font-weight:500;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inventory-card-stats{font-size:.7rem;color:#fff9}.inventory-card-slot{position:absolute;top:.5rem;right:.5rem;font-size:1rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}.inventory-card{position:relative}.empty-message{grid-column:1 / -1;text-align:center;padding:2rem;color:#fff6;font-style:italic}.other-items-section{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.1)}.other-items-section h3{margin:0 0 .5rem;font-size:.85rem;color:#fff9;font-weight:500}.other-items-row{display:flex;flex-wrap:wrap;gap:.5rem}.other-item-badge{display:flex;align-items:center;gap:.5rem;padding:.25rem .5rem;background:#ffffff14;border:1px solid rgba(255,255,255,.1);border-radius:20px;font-size:.75rem;color:#fffc}.other-item-badge img{width:24px;height:24px;border-radius:4px;object-fit:cover}.item-quantity{color:#22c55e;font-weight:600}.slots-grid{flex:1;display:flex;flex-direction:column;gap:.75rem;overflow-y:auto;padding-right:.5rem}.slot-card{display:flex;flex-direction:column;background:#ffffff0d;border:2px dashed rgba(255,255,255,.2);border-radius:12px;padding:.75rem;transition:all .2s}.slot-card.filled{border-style:solid;cursor:pointer}.slot-card.filled:hover{background:#ef44441a;border-color:#ef444480}.slot-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.slot-icon{font-size:1.25rem}.slot-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:#fff9}.slot-content{display:flex;align-items:center;gap:.75rem}.slot-image{width:48px;height:48px;border-radius:8px;object-fit:cover}.slot-item-name{flex:1;font-size:.9rem;color:#fff}.slot-remove-hint{font-size:.65rem;color:#ef4444b3;opacity:0;transition:opacity .2s}.slot-card:hover .slot-remove-hint{opacity:1}.slot-empty-content{padding:.5rem 0}.slot-empty-text{font-size:.85rem;color:#fff6;font-style:italic}.equipment-footer{position:relative;z-index:10;padding:1rem 1.5rem;background:#0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid rgba(255,255,255,.1)}.equipment-continue-btn{width:100%;padding:1rem 1.5rem;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.75rem;transition:all .2s;background:#fff3}.equipment-continue-btn:disabled{opacity:.5;cursor:not-allowed}.equipment-continue-btn:not(:disabled):hover{transform:translateY(-2px)}.equipment-continue-btn:not(:disabled):active{transform:translateY(0)}.btn-icon{font-size:1.25rem}.inventory-grid::-webkit-scrollbar,.slots-grid::-webkit-scrollbar{width:4px}.inventory-grid::-webkit-scrollbar-track,.slots-grid::-webkit-scrollbar-track{background:#ffffff0d;border-radius:2px}.inventory-grid::-webkit-scrollbar-thumb,.slots-grid::-webkit-scrollbar-thumb{background:#fff3;border-radius:2px}.inventory-grid::-webkit-scrollbar-thumb:hover,.slots-grid::-webkit-scrollbar-thumb:hover{background:#ffffff4d}@media(max-width:768px){.equipment-header{padding:.75rem 1rem}.equipment-title h1{font-size:1.25rem}.equipment-content{flex-direction:column;padding:1rem;overflow-y:auto}.equipment-panel{flex:none;min-height:250px;max-height:350px}.inventory-grid{grid-template-columns:repeat(3,1fr);gap:.5rem}.inventory-card-name{font-size:.75rem}.equipment-dm-section{padding:.75rem 1rem}.equipment-dm-portrait{width:48px;height:48px}.equipment-dm-speech p{font-size:.85rem}}@media(max-width:480px){.inventory-grid{grid-template-columns:repeat(2,1fr)}.equipment-back-btn{width:36px;height:36px}.slot-card{padding:.5rem}.slot-image{width:40px;height:40px}}@media(prefers-reduced-motion:reduce){.equipment-particle,.slot-card,.inventory-card,.equipment-continue-btn,.inventory-card-image img{animation:none;transition:none}}.portrait-reveal-screen{width:100%;height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#1a1a2e,#0f0f1a);overflow:hidden}.portrait-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#0000004d}.portrait-header h1{font-size:1.25rem;color:#fff;margin:0}.portrait-area{flex:1;display:flex;align-items:center;justify-content:center;padding:1rem}.generation-container{text-align:center;width:100%;max-width:300px}.generation-frame{width:200px;height:260px;margin:0 auto 1.5rem;background:#ffffff0d;border:2px solid rgba(129,140,248,.3);border-radius:12px;position:relative;overflow:hidden}.generation-mist{position:absolute;inset:0;background:linear-gradient(45deg,#818cf81a,#818cf84d,#818cf81a);animation:mistSwirl 3s ease-in-out infinite}@keyframes mistSwirl{0%,to{transform:translate(-20%) rotate(0);opacity:.5}50%{transform:translate(20%) rotate(10deg);opacity:1}}.generation-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:3rem;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.7}50%{transform:translate(-50%,-50%) scale(1.2);opacity:1}}.generation-progress{width:100%;height:4px;background:#ffffff1a;border-radius:2px;overflow:hidden;margin-bottom:1rem}.generation-progress-fill{height:100%;background:linear-gradient(90deg,#818cf8,#a5b4fc);border-radius:2px;transition:width .3s ease}.generation-text{color:#ffffffb3;font-size:.9rem;margin:0}.error-container{text-align:center;padding:2rem}.error-icon{font-size:3rem;margin-bottom:1rem}.error-text{color:#ef4444;margin:0 0 1.5rem}.retry-button{padding:.75rem 2rem;background:#818cf833;border:1px solid #818cf8;border-radius:12px;color:#a5b4fc;font-size:1rem;cursor:pointer;transition:all .2s}.retry-button:hover{background:#818cf84d}.portrait-container{text-align:center;opacity:0;transform:scale(.8);transition:all .8s cubic-bezier(.34,1.56,.64,1)}.portrait-container.revealed{opacity:1;transform:scale(1)}.portrait-frame{position:relative;width:240px;height:320px;margin:0 auto 1.5rem;border-radius:12px;overflow:hidden;box-shadow:0 20px 60px #00000080}.portrait-image{width:100%;height:100%;object-fit:cover}.portrait-glow{position:absolute;inset:-2px;border:3px solid transparent;border-radius:14px;background:linear-gradient(135deg,#818cf8,#22c55e,#fbbf24) border-box;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:glowRotate 3s linear infinite}@keyframes glowRotate{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}.portrait-nameplate{animation:fadeInUp .6s ease-out .3s both}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.portrait-name{font-size:1.75rem;font-weight:700;color:#fff;margin:0 0 .25rem;text-shadow:0 2px 10px rgba(0,0,0,.5)}.portrait-title{font-size:1rem;color:#a5b4fc;margin:0}.portrait-actions{display:flex;gap:1rem;padding:1rem;animation:fadeIn .5s ease-out}.regenerate-button{flex:1;padding:1rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:12px;color:#fff;font-size:1rem;cursor:pointer;transition:all .2s}.regenerate-button:hover{background:#fff3}.accept-button{flex:2;padding:1rem;background:linear-gradient(135deg,#22c55e,#16a34a);border:none;border-radius:12px;color:#fff;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s}.accept-button:hover{transform:translateY(-2px);box-shadow:0 4px 15px #22c55e66}@media(max-width:640px){.portrait-frame{width:200px;height:270px}.portrait-name{font-size:1.5rem}.dm-portrait{width:40px;height:40px}.dm-speech-bubble p{font-size:.85rem}}@media(prefers-reduced-motion:reduce){.generation-mist,.generation-icon,.portrait-glow{animation:none}.portrait-container{transition:opacity .3s;transform:none}.portrait-container.revealed{transform:none}}.swipeable-card{width:100%;height:100%;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:pan-y;transition:transform .3s ease-out;will-change:transform}.swipeable-card.dragging{cursor:grabbing}.swipe-indicators{position:absolute;inset:0;pointer-events:none;z-index:10}.swipe-indicator{position:absolute;padding:.5rem 1rem;border-radius:8px;font-weight:700;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em;animation:pulse .5s ease-in-out infinite alternate}.swipe-indicator.left{left:1rem;top:50%;transform:translateY(-50%);background:#ffffffe6;color:#333}.swipe-indicator.right{right:1rem;top:50%;transform:translateY(-50%);background:#ffffffe6;color:#333}.swipe-indicator.up{top:2rem;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#10b981,#059669);color:#fff}@keyframes pulse{0%{opacity:.7;transform:translateY(-50%) scale(1)}to{opacity:1;transform:translateY(-50%) scale(1.05)}}.swipe-indicator.up{animation:pulse-up .5s ease-in-out infinite alternate}@keyframes pulse-up{0%{opacity:.7;transform:translate(-50%) scale(1)}to{opacity:1;transform:translate(-50%) scale(1.05)}}.card-stack{display:flex;flex-direction:column;width:100%;height:100%;padding:1rem;gap:1rem}.card-stack-dots{display:flex;justify-content:center;gap:.5rem;padding:.5rem}.card-stack-dots .dot{width:10px;height:10px;border-radius:50%;border:2px solid rgba(255,255,255,.5);background:transparent;cursor:pointer;transition:all .2s ease;padding:0}.card-stack-dots .dot.active{background:#fff;border-color:#fff;transform:scale(1.2)}.card-stack-dots .dot:hover:not(.active){border-color:#fffc}.card-stack-container{flex:1;position:relative;overflow:hidden}.card-stack-item{position:absolute;inset:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.card-stack-item .card-preview{width:100%;height:100%;opacity:.7;filter:brightness(.8)}.card-stack-hints{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;padding:.5rem;font-size:.75rem;color:#fff9}.card-stack-hints .hint{padding:.25rem .5rem;background:#0000004d;border-radius:4px}.card-stack-hints .hint.center{color:#ffffffe6;background:#10b9814d}.selection-card{width:100%;height:100%;border-radius:16px;overflow:hidden;background:linear-gradient(180deg,#0000004d,#000c);position:relative;display:flex;flex-direction:column}.selection-card-image{position:absolute;inset:0;z-index:0}.selection-card-image img{width:100%;height:100%;object-fit:cover}.selection-card-content{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;justify-content:flex-end;padding:1.5rem;background:linear-gradient(0deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.5) 50%,transparent 100%)}.selection-card-title{font-size:1.75rem;font-weight:700;color:#fff;margin:0 0 .5rem;text-shadow:0 2px 4px rgba(0,0,0,.5)}.selection-card-description{font-size:1rem;color:#ffffffe6;margin:0 0 1rem;line-height:1.5}.selection-card-traits{display:flex;flex-wrap:wrap;gap:.5rem}.selection-card-trait{padding:.25rem .75rem;background:#ffffff26;border-radius:999px;font-size:.875rem;color:#ffffffe6}.selection-card-trait.bonus{background:#10b9814d;border:1px solid rgba(16,185,129,.5)}@media(max-width:640px){.card-stack{padding:.5rem}.selection-card-title{font-size:1.5rem}.selection-card-description{font-size:.9rem}.card-stack-hints{font-size:.65rem}}@media(hover:none)and (pointer:coarse){.swipeable-card{touch-action:none}}@media(prefers-color-scheme:dark){.selection-card{background:linear-gradient(180deg,#0006,#000000f2)}}@media(prefers-reduced-motion:reduce){.swipeable-card,.card-stack-item,.swipe-indicator,.card-stack-dots .dot{transition:none;animation:none}}.backstory-selection-screen{width:100%;height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#1a1a2e,#0f0f1a);overflow:hidden}.backstory-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#0000004d}.backstory-header h1{font-size:1.25rem;color:#fff;margin:0}.spacer{width:60px}.dm-narration{display:flex;align-items:flex-start;gap:1rem;padding:1rem}.dm-portrait{width:48px;height:48px;border-radius:50%;overflow:hidden;border:2px solid rgba(129,140,248,.5);flex-shrink:0}.dm-portrait img{width:100%;height:100%;object-fit:cover}.dm-speech-bubble{flex:1;background:#818cf826;border-left:3px solid #818cf8;padding:.75rem 1rem;border-radius:0 12px 12px 0}.dm-speech-bubble p{margin:0;color:#ffffffe6;font-size:.9rem;line-height:1.5;font-style:italic}.backstory-content{flex:1;overflow:hidden;display:flex;flex-direction:column}.generating-container{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}.generating-quill{font-size:4rem;animation:write 1.5s ease-in-out infinite}@keyframes write{0%,to{transform:rotate(-10deg)}50%{transform:rotate(10deg)}}.generating-text{color:#fffc;font-size:1rem;margin:1rem 0;font-style:italic}.generating-dots{display:flex;gap:.5rem}.generating-dots span{width:8px;height:8px;background:#818cf8;border-radius:50%;animation:bounce 1.4s ease-in-out infinite both}.generating-dots span:nth-child(1){animation-delay:-.32s}.generating-dots span:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(.6);opacity:.5}40%{transform:scale(1);opacity:1}}.backstory-card{width:100%;height:100%;border-radius:16px;overflow:hidden;display:flex;flex-direction:column;background:linear-gradient(180deg,#2d2d4a,#1a1a2e);box-shadow:0 10px 40px #00000080}.backstory-card.heroic{border:2px solid rgba(251,191,36,.4)}.backstory-card.tragic{border:2px solid rgba(239,68,68,.4)}.backstory-card.mysterious{border:2px solid rgba(139,92,246,.4)}.backstory-card.comedic{border:2px solid rgba(34,197,94,.4)}.backstory-card-header{display:flex;align-items:center;gap:.5rem;padding:1rem;background:#0000004d}.backstory-tone-icon{font-size:1.5rem}.backstory-tone-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:#fff9}.backstory-card.heroic .backstory-tone-label{color:#fbbf24}.backstory-card.tragic .backstory-tone-label{color:#ef4444}.backstory-card.mysterious .backstory-tone-label{color:#8b5cf6}.backstory-card.comedic .backstory-tone-label{color:#22c55e}.backstory-card-content{flex:1;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.backstory-title{font-size:1.5rem;font-weight:700;color:#fff;margin:0}.backstory-summary{color:#fffc;font-size:1rem;line-height:1.6;margin:0}.backstory-details{margin-top:auto;display:flex;flex-direction:column;gap:.75rem}.backstory-detail{display:flex;flex-direction:column;gap:.25rem}.detail-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:#ffffff80}.detail-value{font-size:.9rem;color:#ffffffe6}.backstory-card-footer{padding:1rem;text-align:center;background:#0003}.swipe-hint{font-size:.75rem;color:#ffffff80}.full-backstory{flex:1;padding:1rem;overflow-y:auto;-webkit-overflow-scrolling:touch}.full-backstory-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.full-backstory-icon{font-size:2rem}.full-backstory-title{font-size:1.5rem;font-weight:700;color:#fff;margin:0}.full-backstory-text{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}.full-backstory-text p{color:#ffffffe6;font-size:.95rem;line-height:1.7;margin:0 0 1rem}.full-backstory-text p:last-child{margin-bottom:0}.full-backstory-meta{display:flex;flex-direction:column;gap:1rem}.meta-item{background:#818cf81a;border-left:3px solid #818cf8;padding:.75rem 1rem;border-radius:0 8px 8px 0}.meta-label{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:#ffffff80;margin-bottom:.25rem}.meta-value{display:block;font-size:.9rem;color:#ffffffe6}.backstory-footer{display:flex;gap:1rem;padding:1rem;background:#0000004d}.change-button{flex:1;padding:1rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:12px;color:#fff;font-size:1rem;cursor:pointer;transition:all .2s}.change-button:hover{background:#fff3}.confirm-button{flex:2;padding:1rem;background:linear-gradient(135deg,#22c55e,#16a34a);border:none;border-radius:12px;color:#fff;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s}.confirm-button:hover{transform:translateY(-2px);box-shadow:0 4px 15px #22c55e66}@media(max-width:640px){.dm-portrait{width:40px;height:40px}.dm-speech-bubble p{font-size:.85rem}.backstory-title{font-size:1.25rem}.backstory-summary{font-size:.9rem}.full-backstory-title{font-size:1.25rem}.full-backstory-text{padding:1rem}.full-backstory-text p{font-size:.9rem}}@media(prefers-reduced-motion:reduce){.generating-quill,.generating-dots span{animation:none}.change-button,.confirm-button{transition:none}}.character-sheet-overlay{position:fixed;inset:0;z-index:1000;background:#000000e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:flex-start;justify-content:center;padding:1rem;overflow-y:auto;animation:sheetOverlayFadeIn .3s ease-out}@keyframes sheetOverlayFadeIn{0%{opacity:0}to{opacity:1}}.character-sheet{position:relative;width:100%;max-width:480px;background:linear-gradient(180deg,#1a1a2e,#16162a);border:2px solid var(--sheet-primary, #a78bfa);border-radius:16px;padding:1.5rem;margin:1rem 0;box-shadow:0 0 40px var(--sheet-glow, rgba(167, 139, 250, .3)),inset 0 1px #ffffff1a;animation:sheetSlideUp .4s ease-out}@keyframes sheetSlideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.sheet-close-btn{position:absolute;top:1rem;right:1rem;width:36px;height:36px;border-radius:50%;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:10}.sheet-close-btn:hover{background:#fff3;transform:scale(1.1)}.sheet-header{display:flex;gap:1rem;margin-bottom:1rem;padding-right:2.5rem}.sheet-portrait{width:80px;height:80px;border-radius:50%;overflow:hidden;border:3px solid var(--sheet-primary, #a78bfa);box-shadow:0 0 20px var(--sheet-glow, rgba(167, 139, 250, .4));flex-shrink:0}.sheet-portrait img{width:100%;height:100%;object-fit:cover}.sheet-identity{display:flex;flex-direction:column;justify-content:center;gap:.25rem}.sheet-name{font-size:1.5rem;font-weight:700;color:#fff;margin:0;line-height:1.2}.sheet-subtitle{font-size:.95rem;color:var(--sheet-primary, #a78bfa);margin:0;font-weight:500}.sheet-background{font-size:.8rem;color:#fff9;margin:0}.sheet-xp-section{margin-bottom:1rem}.sheet-xp-bar{height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden;margin-bottom:.25rem}.sheet-xp-fill{height:100%;background:linear-gradient(90deg,var(--sheet-primary, #a78bfa),#c4b5fd);border-radius:4px;transition:width .5s ease}.sheet-xp-text{font-size:.75rem;color:#ffffff80;text-align:right;display:block}.sheet-core-stats{display:flex;justify-content:space-around;background:#0000004d;border-radius:12px;padding:1rem;margin-bottom:1.5rem;border:1px solid rgba(255,255,255,.1)}.core-stat{display:flex;flex-direction:column;align-items:center;gap:.25rem}.core-stat-value{font-size:1.5rem;font-weight:700;color:#fff}.core-stat-label{font-size:.7rem;color:#ffffff80;text-transform:uppercase;letter-spacing:.5px}.core-stat.hp .hp-display{display:flex;align-items:baseline;gap:.1rem}.core-stat.hp .hp-separator{font-size:1rem;color:#fff6}.core-stat.hp .hp-max{font-size:1rem;color:#fff9}.hp-bar-mini{width:60px;height:4px;background:#ffffff1a;border-radius:2px;overflow:hidden;margin-top:.25rem}.hp-bar-fill{height:100%;border-radius:2px;transition:width .3s ease}.sheet-section{margin-bottom:1.5rem}.section-title{font-size:.85rem;font-weight:600;color:var(--sheet-primary, #a78bfa);text-transform:uppercase;letter-spacing:1px;margin:0 0 .75rem;padding-bottom:.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.ability-scores{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.ability-score{display:flex;flex-direction:column;align-items:center;background:#0000004d;border-radius:8px;padding:.75rem .5rem;border:1px solid rgba(255,255,255,.1)}.ability-abbrev{font-size:.7rem;font-weight:600;color:#ffffff80;text-transform:uppercase;letter-spacing:.5px}.ability-modifier{font-size:1.25rem;font-weight:700;color:#fff}.ability-value{font-size:.8rem;color:#ffffff80;background:#0000004d;padding:.1rem .4rem;border-radius:4px;margin-top:.25rem}.saving-throws{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.save-row{display:flex;align-items:center;gap:.5rem;padding:.4rem .6rem;background:#0003;border-radius:6px}.save-row.proficient{background:rgba(var(--sheet-primary, 167, 139, 250),.1)}.save-name{font-size:.8rem;color:#ffffffb3;flex:1}.save-modifier{font-size:.9rem;font-weight:600;color:#fff}.skills-list{display:grid;grid-template-columns:repeat(2,1fr);gap:.4rem}.skill-row{display:flex;align-items:center;gap:.4rem;padding:.35rem .5rem;background:#0003;border-radius:4px;font-size:.75rem}.skill-row.proficient{background:#a78bfa1a}.proficiency-dot{width:8px;height:8px;border-radius:50%;border:1px solid rgba(255,255,255,.3);flex-shrink:0}.proficiency-dot.filled{background:var(--sheet-primary, #a78bfa);border-color:var(--sheet-primary, #a78bfa)}.skill-name{flex:1;color:#fffc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.skill-ability{color:#fff6;font-size:.65rem;text-transform:uppercase}.skill-modifier{font-weight:600;color:#fff;min-width:24px;text-align:right}.equipment-grid{display:flex;flex-direction:column;gap:.5rem}.equipment-slot{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;background:#0000004d;border-radius:6px;border:1px solid rgba(255,255,255,.1)}.slot-name{font-size:.7rem;color:#fff6;text-transform:capitalize;min-width:70px}.item-name{flex:1;font-size:.85rem;color:#fff;font-weight:500}.item-damage,.item-ac{font-size:.75rem;color:var(--sheet-primary, #a78bfa);background:#a78bfa26;padding:.15rem .4rem;border-radius:4px}.gold-section{text-align:center}.gold-display{display:inline-flex;align-items:center;gap:.5rem;background:linear-gradient(135deg,#fbbf2433,#f59e0b1a);border:1px solid rgba(251,191,36,.3);border-radius:20px;padding:.5rem 1.25rem}.gold-icon{font-size:1.25rem}.gold-amount{font-size:1.25rem;font-weight:700;color:#fbbf24}.gold-label{font-size:.75rem;color:#fbbf24b3;text-transform:uppercase}.backstory-text{font-size:.85rem;color:#ffffffb3;line-height:1.6;margin:0;font-style:italic}@media(max-width:480px){.character-sheet-overlay{padding:.5rem}.character-sheet{padding:1rem;border-radius:12px}.sheet-portrait{width:64px;height:64px}.sheet-name{font-size:1.25rem}.ability-scores{grid-template-columns:repeat(3,1fr);gap:.5rem}.ability-score{padding:.5rem .25rem}.ability-modifier{font-size:1.1rem}.skills-list{grid-template-columns:1fr}.saving-throws{grid-template-columns:repeat(3,1fr)}.save-row{flex-direction:column;text-align:center;gap:.2rem;padding:.4rem}}.spells-section{background:#60a5fa0d;border:1px solid rgba(96,165,250,.2);border-radius:12px;padding:1rem}.spell-slots-display{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid rgba(255,255,255,.1)}.slots-label{font-size:.8rem;color:#fff9;white-space:nowrap}.slot-pips{display:flex;gap:1rem;flex-wrap:wrap}.slot-level{display:flex;align-items:center;gap:.5rem}.slot-level-label{font-size:.7rem;color:#ffffff80}.slot-pips-row{display:flex;gap:.25rem}.slot-pip{width:12px;height:12px;border-radius:50%;border:2px solid rgba(96,165,250,.5);background:transparent;transition:all .2s ease}.slot-pip.available{background:#60a5fa;border-color:#60a5fa;box-shadow:0 0 6px #60a5fa80}.cantrips-list,.spells-list{margin-bottom:.75rem}.cantrips-list:last-child,.spells-list:last-child{margin-bottom:0}.spell-category{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:#ffffff80;margin-bottom:.5rem}.spell-names{display:flex;flex-wrap:wrap;gap:.5rem}.spell-name-tag{font-size:.85rem;padding:.25rem .75rem;border-radius:20px;background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#fff}.spell-name-tag.cantrip{background:#a78bfa26;border-color:#a78bfa4d;color:#c4b5fd}.spell-name-tag.level1{background:#60a5fa26;border-color:#60a5fa4d;color:#93c5fd}.sheet-tabs{display:flex;gap:.5rem;margin-bottom:1rem;padding:.5rem;background:#0000004d;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.sheet-tab{flex:1;padding:.6rem .75rem;background:transparent;border:1px solid transparent;border-radius:8px;color:#fff9;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:.4rem}.sheet-tab:hover{background:#ffffff1a;color:#ffffffe6}.sheet-tab.active{background:var(--sheet-primary, #a78bfa);border-color:var(--sheet-primary, #a78bfa);color:#fff;box-shadow:0 0 12px var(--sheet-glow, rgba(167, 139, 250, .4))}.inventory-tab{padding-top:.5rem}.inventory-gold{display:flex;align-items:center;justify-content:center;gap:.5rem;background:linear-gradient(135deg,#fbbf2433,#f59e0b1a);border:1px solid rgba(251,191,36,.3);border-radius:12px;padding:.75rem;margin-bottom:1rem}.inventory-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;margin-bottom:1rem}.inventory-item{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:.75rem;background:#0000004d;border:2px solid rgba(255,255,255,.2);border-radius:10px;cursor:pointer;transition:all .2s ease;position:relative}.inventory-item:hover{background:#00000080;transform:translateY(-2px)}.inventory-item.selected{background:#a78bfa26;box-shadow:0 0 12px var(--sheet-glow, rgba(167, 139, 250, .3))}.inventory-item .item-icon{font-size:1.75rem}.inventory-item .item-name{font-size:.8rem;color:#fff;text-align:center;line-height:1.2}.inventory-item .item-quantity{position:absolute;top:.4rem;right:.4rem;font-size:.7rem;font-weight:600;background:#0009;color:#fff;padding:.15rem .4rem;border-radius:10px}.inventory-item .item-rarity{font-size:.65rem;text-transform:capitalize}.inventory-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;color:#fff6;text-align:center}.inventory-empty .empty-icon{font-size:3rem;margin-bottom:.75rem;opacity:.5}.inventory-empty p{margin:0;font-size:.9rem}.item-details{background:#0006;border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:1rem;margin-top:.5rem;animation:itemDetailsSlideIn .2s ease-out}@keyframes itemDetailsSlideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.item-details-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem;padding-bottom:.75rem;border-bottom:1px solid rgba(255,255,255,.1)}.item-icon-large{font-size:2.5rem}.item-info{flex:1}.item-title{margin:0;font-size:1.1rem;color:#fff;font-weight:600}.item-type{margin:0;font-size:.8rem;color:#ffffff80;text-transform:capitalize}.item-stats,.item-damage-stat,.item-ac-stat{font-size:.85rem;color:#fffc;margin:.4rem 0}.item-actions{display:flex;gap:.75rem;margin-top:1rem}.item-action-btn{flex:1;padding:.6rem 1rem;border-radius:8px;border:none;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:.4rem}.item-action-btn.use{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}.item-action-btn.use:hover{transform:translateY(-2px);box-shadow:0 4px 12px #22c55e66}.item-action-btn.equip{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.item-action-btn.equip:hover{transform:translateY(-2px);box-shadow:0 4px 12px #3b82f666}.journal-tab-placeholder{display:flex;flex-direction:column;align-items:center;text-align:center;padding:2rem 1rem;color:#ffffffb3}.journal-tab-placeholder .journal-icon{font-size:3rem;margin-bottom:.75rem}.journal-tab-placeholder h3{margin:0 0 .5rem;font-size:1.25rem;color:#fff}.journal-tab-placeholder p{margin:0 0 1rem;font-size:.9rem;color:#fff9}.journal-preview-list{list-style:none;padding:0;margin:0 0 1.5rem;text-align:left}.journal-preview-list li{padding:.5rem 0;font-size:.9rem;color:#fffc;border-bottom:1px solid rgba(255,255,255,.1)}.journal-preview-list li:last-child{border-bottom:none}.journal-coming-soon{font-size:.8rem;color:var(--sheet-primary, #a78bfa);font-style:italic}@media(prefers-reduced-motion:reduce){.character-sheet-overlay,.character-sheet,.item-details{animation:none}}@media(max-width:480px){.sheet-tabs{padding:.4rem;gap:.3rem}.sheet-tab{padding:.5rem;font-size:.75rem}.inventory-grid{grid-template-columns:repeat(2,1fr);gap:.5rem}.inventory-item{padding:.6rem}.inventory-item .item-icon{font-size:1.5rem}.inventory-item .item-name{font-size:.75rem}}.journal-overlay{position:fixed;inset:0;z-index:1100;background:#000000f2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;align-items:flex-start;justify-content:center;padding:1rem;overflow-y:auto;animation:journalFadeIn .3s ease-out}@keyframes journalFadeIn{0%{opacity:0}to{opacity:1}}.journal{position:relative;width:100%;max-width:600px;background:linear-gradient(180deg,#1a1a2e,#0f0f1a);border:2px solid var(--journal-primary, #a78bfa);border-radius:16px;margin:1rem 0;box-shadow:0 0 60px var(--journal-glow, rgba(167, 139, 250, .3)),inset 0 1px #ffffff1a;animation:journalSlideUp .4s ease-out;min-height:80vh;display:flex;flex-direction:column}@keyframes journalSlideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.journal-header{display:flex;align-items:center;padding:1rem 1.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.journal-back-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;padding:.5rem 1rem;font-size:.9rem;cursor:pointer;transition:all .2s ease}.journal-back-btn:hover{background:#fff3}.journal-title{flex:1;text-align:center;font-size:1.5rem;font-weight:700;color:#fff;margin:0}.journal-header-spacer{width:80px}.journal-tabs{display:flex;gap:.25rem;padding:.75rem 1rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;background:#0000004d;border-bottom:1px solid rgba(255,255,255,.1)}.journal-tabs::-webkit-scrollbar{display:none}.journal-tab{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.6rem .75rem;background:transparent;border:1px solid transparent;border-radius:10px;color:#ffffff80;font-size:.7rem;cursor:pointer;transition:all .2s ease;min-width:60px;position:relative}.journal-tab:hover{background:#ffffff1a;color:#fffc}.journal-tab.active{background:var(--journal-primary, #a78bfa);border-color:var(--journal-primary, #a78bfa);color:#fff}.tab-icon{font-size:1.25rem}.tab-label{font-weight:500;white-space:nowrap}.tab-count{position:absolute;top:.25rem;right:.25rem;font-size:.6rem;background:#fff3;padding:.1rem .35rem;border-radius:10px}.journal-tab.active .tab-count{background:#ffffff4d}.journal-content{flex:1;padding:1rem;overflow-y:auto}.tab-toolbar{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem}.search-input{width:100%;padding:.75rem 1rem;background:#0006;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:.9rem}.search-input::placeholder{color:#fff6}.search-input:focus{outline:none;border-color:var(--journal-primary, #a78bfa)}.filter-buttons{display:flex;gap:.5rem}.filter-btn{flex:1;padding:.5rem;background:#0000004d;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#fff9;font-size:.8rem;cursor:pointer;transition:all .2s ease}.filter-btn:hover{background:#ffffff1a}.filter-btn.active{background:var(--journal-primary, #a78bfa);border-color:var(--journal-primary, #a78bfa);color:#fff}.filter-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.filter-select{padding:.5rem .75rem;background:#0000004d;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#fffc;font-size:.8rem;cursor:pointer;min-width:100px}.filter-select:focus{outline:none;border-color:var(--journal-primary, #a78bfa)}.filter-select option{background:#1a1a2e;color:#fff}.monster-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.monster-card{display:flex;flex-direction:column;align-items:center;padding:.75rem;background:#0000004d;border:1px solid rgba(255,255,255,.15);border-radius:10px;cursor:pointer;transition:all .2s ease;position:relative}.monster-card:hover{background:#00000080;transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.monster-portrait{width:60px;height:60px;border-radius:50%;overflow:hidden;background:#ffffff1a;display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.monster-portrait img{width:100%;height:100%;object-fit:cover}.monster-emoji{font-size:2rem}.monster-info{text-align:center}.monster-name{font-size:.85rem;font-weight:600;color:#fff;margin:0 0 .25rem}.monster-type{font-size:.7rem;color:#ffffff80;margin:0;text-transform:capitalize}.monster-cr{display:inline-block;font-size:.65rem;background:#ffffff1a;padding:.15rem .4rem;border-radius:10px;color:#ffffffb3;margin-top:.25rem}.discovered-badge{position:absolute;top:.5rem;right:.5rem;font-size:.9rem}.quests-section{margin-bottom:1.5rem}.section-header{display:flex;align-items:center;gap:.5rem;font-size:1rem;font-weight:600;color:#fff;margin:0 0 .75rem;padding-bottom:.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.section-header.toggle{background:none;border:none;width:100%;cursor:pointer;text-align:left;padding:.5rem 0}.section-icon{font-size:1.1rem}.toggle-arrow{margin-left:auto;font-size:.8rem;transition:transform .2s ease}.toggle-arrow.open{transform:rotate(180deg)}.quest-list{display:flex;flex-direction:column;gap:.75rem}.quest-card{background:#0000004d;border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:1rem}.quest-card.completed{opacity:.7}.quest-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.quest-title{flex:1;font-size:1rem;font-weight:600;color:#fff;margin:0}.quest-category{font-size:.65rem;padding:.2rem .5rem;border-radius:10px;text-transform:uppercase}.quest-category.main{background:#ef444433;color:#fca5a5}.quest-category.side{background:#3b82f633;color:#93c5fd}.quest-category.tutorial{background:#22c55e33;color:#86efac}.quest-description{font-size:.85rem;color:#ffffffb3;margin:0 0 .75rem;line-height:1.4}.quest-objectives{display:flex;flex-direction:column;gap:.4rem}.objective{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:#fffc}.objective.completed{color:#fff6;text-decoration:line-through}.objective-check{font-size:.9rem;color:var(--journal-primary, #a78bfa)}.objective.completed .objective-check{color:#22c55e}.objective-progress{margin-left:auto;font-size:.75rem;color:#ffffff80}.empty-quests{text-align:center;padding:1.5rem;color:#ffffff80}.completed-section{opacity:.8}.spell-slots-section,.spells-section{margin-bottom:1.5rem}.spell-slots-grid{display:flex;flex-direction:column;gap:.5rem}.spell-slot-row{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;background:#0000004d;border-radius:8px}.slot-level{font-size:.8rem;color:#fff9;min-width:60px}.slot-pips{display:flex;gap:.35rem;flex:1}.slot-pip{width:14px;height:14px;border-radius:50%;border:2px solid rgba(96,165,250,.5);transition:all .2s ease}.slot-pip.available{background:#60a5fa;border-color:#60a5fa;box-shadow:0 0 8px #60a5fa80}.slot-pip.used{background:#6464644d;border-color:#64646480}.slot-count{font-size:.8rem;color:#ffffff80}.spell-list{display:flex;flex-wrap:wrap;gap:.5rem}.spell-card{padding:.5rem 1rem;background:#0000004d;border:1px solid rgba(255,255,255,.15);border-radius:20px;cursor:pointer;transition:all .2s ease}.spell-card:hover{background:#00000080;transform:translateY(-1px)}.spell-card.cantrip{background:#a78bfa26;border-color:#a78bfa4d}.spell-card.cantrip .spell-name{color:#c4b5fd}.spell-card.level1{background:#60a5fa26;border-color:#60a5fa4d}.spell-card.level1 .spell-name{color:#93c5fd}.spell-name{font-size:.9rem;color:#fff}.spellbook-note{font-size:.8rem;color:#fff6;text-align:center;font-style:italic;margin-top:1rem}.spell-card.has-details{display:flex;flex-direction:column;gap:.15rem}.spell-card.has-details .spell-school{font-size:.7rem;color:#ffffff80;text-transform:capitalize}.spell-details-overlay{position:fixed;inset:0;z-index:1200;background:#000c;display:flex;align-items:center;justify-content:center;padding:1rem;animation:fadeIn .2s ease-out}.spell-details-panel{background:linear-gradient(180deg,#1e1e3f,#0f0f23);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:1.5rem;max-width:400px;max-height:80vh;overflow-y:auto;position:relative;animation:slideUp .3s ease-out}.spell-details-panel .close-btn{position:absolute;top:.75rem;right:.75rem;width:28px;height:28px;border-radius:50%;border:none;background:#ffffff1a;color:#ffffffb3;font-size:1.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.spell-details-panel .close-btn:hover{background:#fff3;color:#fff}.spell-details-header{margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid rgba(255,255,255,.1)}.spell-details-header h3{font-size:1.25rem;font-weight:600;color:#fff;margin:0 0 .25rem}.spell-level-school{font-size:.85rem;color:#a78bfae6;font-style:italic}.spell-meta{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem;padding:.75rem;background:#0000004d;border-radius:8px}.spell-meta-row{display:flex;gap:.5rem;font-size:.85rem}.spell-meta-row .label{color:#ffffff80;font-weight:500;min-width:100px}.spell-meta-row .value{color:#ffffffe6;flex:1}.spell-description{font-size:.9rem;line-height:1.6;color:#fffc;margin-bottom:1rem}.spell-higher-levels{font-size:.85rem;line-height:1.5;color:#ffffffb3;padding:.75rem;background:#60a5fa1a;border-left:3px solid rgba(96,165,250,.5);border-radius:0 8px 8px 0;margin-bottom:.75rem}.spell-higher-levels strong{color:#93c5fd}.spell-ritual-tag{display:inline-block;font-size:.75rem;padding:.3rem .6rem;background:#22c55e26;color:#86efac;border-radius:4px}.placeholder-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:3rem 1rem;color:#ffffffb3;min-height:300px}.placeholder-icon{font-size:4rem;margin-bottom:1rem;opacity:.8}.placeholder-tab h3{font-size:1.25rem;font-weight:600;color:#fff;margin:0 0 .5rem}.placeholder-tab p{font-size:.9rem;margin:0 0 .5rem;max-width:280px}.coming-soon{color:var(--journal-primary, #a78bfa);font-style:italic;margin-top:1rem!important}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;color:#fff6}.empty-icon{font-size:3rem;margin-bottom:.75rem;opacity:.6}.empty-state p{margin:0;font-size:.9rem}@media(max-width:480px){.journal-overlay{padding:0}.journal{border-radius:0;min-height:100vh;margin:0}.journal-header{padding:.75rem 1rem}.journal-title{font-size:1.25rem}.journal-tabs{padding:.5rem}.journal-tab{padding:.5rem .6rem;min-width:50px}.tab-icon{font-size:1.1rem}.tab-label{font-size:.65rem}.monster-grid{grid-template-columns:repeat(2,1fr);gap:.5rem}.monster-card{padding:.6rem}.monster-portrait{width:50px;height:50px}}.items-tab{padding:1rem}.items-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.item-card{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:#0000004d;border:2px solid rgba(255,255,255,.15);border-radius:10px;cursor:pointer;transition:all .2s ease}.item-card:hover{background:#00000080;transform:translateY(-2px)}.item-icon{font-size:1.5rem}.item-info{flex:1;display:flex;flex-direction:column;gap:.1rem;min-width:0}.item-name{font-size:.9rem;font-weight:500;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.item-type{font-size:.75rem;color:#ffffff80;text-transform:capitalize}.item-rarity-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.item-details-overlay{position:fixed;inset:0;z-index:1200;background:#000c;display:flex;align-items:center;justify-content:center;padding:1rem;animation:fadeIn .2s ease-out}.item-details-panel{background:linear-gradient(180deg,#1e1e3f,#0f0f23);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:1.5rem;max-width:400px;max-height:80vh;overflow-y:auto;position:relative}.item-details-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.item-details-icon{font-size:2.5rem}.item-details-header h3{font-size:1.25rem;font-weight:600;color:#fff;margin:0 0 .25rem}.item-rarity-badge{display:inline-block;padding:.2rem .5rem;font-size:.7rem;text-transform:uppercase;border-radius:4px;color:#fff}.item-description{font-size:.9rem;line-height:1.5;color:#fffc;margin-bottom:1rem}.item-properties{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}.item-property{font-size:.75rem;padding:.25rem .5rem;background:#a78bfa26;color:#c4b5fd;border-radius:4px}.item-meta{display:flex;flex-wrap:wrap;gap:.75rem;font-size:.85rem;color:#fff9}.meta-item{display:flex;align-items:center;gap:.3rem}.npcs-tab{padding:1rem}.npcs-grid{display:flex;flex-direction:column;gap:.75rem}.npc-card{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:#0000004d;border:1px solid rgba(255,255,255,.15);border-radius:10px;cursor:pointer;transition:all .2s ease}.npc-card:hover{background:#00000080}.npc-card.deceased{opacity:.6}.npc-portrait{width:50px;height:50px;border-radius:50%;background:#0006;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;flex-shrink:0}.npc-portrait img{width:100%;height:100%;object-fit:cover}.npc-emoji{font-size:1.5rem}.deceased-badge{position:absolute;bottom:-2px;right:-2px;font-size:.9rem}.npc-info{flex:1;display:flex;flex-direction:column;gap:.1rem;min-width:0}.npc-name{font-size:1rem;font-weight:500;color:#fff}.npc-title{font-size:.8rem;color:#a78bfae6}.npc-location{font-size:.75rem;color:#ffffff80}.npc-relationship{font-size:1.25rem}.npc-details-overlay{position:fixed;inset:0;z-index:1200;background:#000c;display:flex;align-items:center;justify-content:center;padding:1rem;animation:fadeIn .2s ease-out}.npc-details-panel{background:linear-gradient(180deg,#1e1e3f,#0f0f23);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:1.5rem;max-width:400px;max-height:80vh;overflow-y:auto;position:relative}.npc-details-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.npc-details-portrait{width:70px;height:70px;border-radius:50%;background:#0006;display:flex;align-items:center;justify-content:center;overflow:hidden}.npc-details-portrait img{width:100%;height:100%;object-fit:cover}.npc-emoji-large{font-size:2.5rem}.npc-details-header h3{font-size:1.25rem;font-weight:600;color:#fff;margin:0}.npc-title-large{display:block;font-size:.9rem;color:#a78bfae6;margin-top:.2rem}.npc-race{display:block;font-size:.8rem;color:#ffffff80}.npc-relationship-bar{padding:.5rem 1rem;border-radius:8px;font-size:.9rem;font-weight:500;color:#fff;text-align:center;margin-bottom:1rem}.npc-description{font-size:.9rem;line-height:1.5;color:#fffc;margin-bottom:1rem}.npc-meta{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}.meta-row{display:flex;gap:.5rem;font-size:.85rem}.meta-row .label{color:#ffffff80;min-width:100px}.meta-row .value{color:#ffffffe6}.npc-interactions{border-top:1px solid rgba(255,255,255,.1);padding-top:1rem}.npc-interactions h4{font-size:.9rem;font-weight:600;color:#fff;margin:0 0 .75rem}.interaction-entry{padding:.5rem;background:#0003;border-radius:6px;margin-bottom:.5rem}.interaction-location{font-size:.75rem;color:#ffffff80}.interaction-summary{font-size:.85rem;color:#fffc;margin:.25rem 0 0;line-height:1.4}.lore-tab{padding:1rem}.locations-grid{display:flex;flex-direction:column;gap:.75rem}.location-card{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:#0000004d;border:1px solid rgba(255,255,255,.15);border-radius:10px;cursor:pointer;transition:all .2s ease}.location-card:hover{background:#00000080}.location-icon{font-size:1.5rem}.location-info{flex:1;display:flex;flex-direction:column;gap:.1rem}.location-name{font-size:1rem;font-weight:500;color:#fff}.location-type{font-size:.8rem;color:#a78bfae6;text-transform:capitalize}.location-visits{font-size:.75rem;color:#ffffff80}.danger-badge{font-size:1rem}.danger-badge.moderate{color:#eab308}.danger-badge.dangerous{color:#f97316}.danger-badge.deadly{color:#ef4444}.lore-list{display:flex;flex-direction:column;gap:.75rem}.lore-card{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem;background:#0000004d;border:1px solid rgba(255,255,255,.15);border-radius:10px;cursor:pointer;transition:all .2s ease}.lore-card:hover{background:#00000080}.lore-card.secret{border-color:#a855f74d;background:#a855f70d}.lore-icon{font-size:1.5rem;flex-shrink:0}.lore-info{flex:1;min-width:0}.lore-title{display:block;font-size:1rem;font-weight:500;color:#fff}.lore-type{display:block;font-size:.8rem;color:#a78bfae6;text-transform:capitalize}.lore-summary{font-size:.8rem;color:#fff9;margin:.25rem 0 0;line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.secret-badge{font-size:1rem}.lore-details-overlay{position:fixed;inset:0;z-index:1200;background:#000c;display:flex;align-items:center;justify-content:center;padding:1rem;animation:fadeIn .2s ease-out}.lore-details-panel{background:linear-gradient(180deg,#1e1e3f,#0f0f23);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:1.5rem;max-width:450px;max-height:80vh;overflow-y:auto;position:relative}.lore-details-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.lore-details-icon{font-size:2rem}.lore-details-header h3{font-size:1.25rem;font-weight:600;color:#fff;margin:0}.lore-type-badge{display:inline-block;font-size:.75rem;padding:.2rem .5rem;background:#a78bfa26;color:#c4b5fd;border-radius:4px;text-transform:capitalize;margin-top:.25rem}.secret-tag{display:inline-block;font-size:.7rem;padding:.15rem .4rem;background:#a855f733;color:#d8b4fe;border-radius:4px;margin-left:.5rem}.lore-description,.lore-content{font-size:.9rem;line-height:1.6;color:#fffc;margin-bottom:1rem}.location-features{margin-bottom:1rem}.location-features h4{font-size:.9rem;font-weight:600;color:#fff;margin:0 0 .5rem}.location-features ul{margin:0;padding-left:1.25rem}.location-features li{font-size:.85rem;color:#ffffffb3;margin-bottom:.25rem}.lore-meta{display:flex;flex-direction:column;gap:.4rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.1)}.danger-safe{color:#22c55e}.danger-moderate{color:#eab308}.danger-dangerous{color:#f97316}.danger-deadly{color:#ef4444}@media(prefers-reduced-motion:reduce){.journal-overlay,.journal{animation:none}}.dice-roller-overlay{position:fixed;inset:0;z-index:1000;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;animation:diceOverlayFadeIn .3s ease-out}@keyframes diceOverlayFadeIn{0%{opacity:0}to{opacity:1}}.dice-roller-container{display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:2rem;max-width:90%;width:360px;animation:diceContainerSlideUp .4s ease-out}@keyframes diceContainerSlideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.dice-roller-header{text-align:center}.dice-roller-title{font-size:1.5rem;font-weight:700;color:#fff;margin:0;text-shadow:0 2px 10px rgba(0,0,0,.5)}.dice-roller-description{font-size:.95rem;color:#ffffffb3;margin:.5rem 0 0;font-style:italic}.dice-display{position:relative;cursor:pointer;transition:transform .2s ease}.dice-display:hover:not(.rolling){transform:scale(1.05)}.dice-display:active:not(.rolling){transform:scale(.95)}.dice-shape{width:120px;height:120px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2a2a3a,#1a1a2a);border:3px solid var(--dice-primary, #a78bfa);box-shadow:0 0 30px var(--dice-glow, rgba(167, 139, 250, .4)),inset 0 0 20px #00000080;position:relative}.dice-shape[data-dice=d4]{clip-path:polygon(50% 0%,0% 100%,100% 100%);width:130px;height:115px}.dice-shape[data-dice=d6]{border-radius:12px}.dice-shape[data-dice=d8]{clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);width:130px;height:130px}.dice-shape[data-dice=d10],.dice-shape[data-dice=d100]{clip-path:polygon(50% 0%,95% 35%,80% 100%,20% 100%,5% 35%);width:125px;height:130px}.dice-shape[data-dice=d12]{clip-path:polygon(50% 0%,85% 15%,100% 50%,85% 85%,50% 100%,15% 85%,0% 50%,15% 15%)}.dice-shape[data-dice=d20]{clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);width:130px;height:140px}.dice-value{font-size:2.5rem;font-weight:800;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.5);-webkit-user-select:none;user-select:none}.dice-display.rolling .dice-shape{animation:diceRoll .1s linear infinite}@keyframes diceRoll{0%{transform:rotate(0) scale(1)}25%{transform:rotate(5deg) scale(1.02)}50%{transform:rotate(0) scale(1)}75%{transform:rotate(-5deg) scale(1.02)}to{transform:rotate(0) scale(1)}}.dice-display.critical-success .dice-shape{border-color:#22c55e;box-shadow:0 0 40px #22c55e99,0 0 80px #22c55e66,inset 0 0 20px #22c55e33;animation:criticalSuccessPulse .5s ease-out}.dice-display.critical-failure .dice-shape{border-color:#ef4444;box-shadow:0 0 40px #ef444499,0 0 80px #ef444466,inset 0 0 20px #ef444433;animation:criticalFailureShake .5s ease-out}.dice-display.success .dice-shape{border-color:#22c55e;box-shadow:0 0 30px #22c55e80}.dice-display.failure .dice-shape{border-color:#ef4444;box-shadow:0 0 30px #ef444480}@keyframes criticalSuccessPulse{0%{transform:scale(1)}50%{transform:scale(1.15)}to{transform:scale(1)}}@keyframes criticalFailureShake{0%,to{transform:translate(0)}20%{transform:translate(-10px)}40%{transform:translate(10px)}60%{transform:translate(-10px)}80%{transform:translate(10px)}}.dice-modifier-badge{position:absolute;top:-10px;right:-10px;padding:.25rem .5rem;border-radius:4px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.dice-modifier-badge.advantage{background:#22c55e;color:#fff}.dice-modifier-badge.disadvantage{background:#ef4444;color:#fff}.dice-info{display:flex;flex-direction:column;align-items:center;gap:.25rem}.dice-formula{font-size:1.1rem;font-weight:600;color:var(--dice-primary, #a78bfa);text-transform:uppercase;letter-spacing:1px}.dice-skill{font-size:.85rem;color:#fff9;text-transform:capitalize}.dice-result{display:flex;flex-direction:column;align-items:center;gap:.75rem;animation:resultFadeIn .5s ease-out}@keyframes resultFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.dice-result-breakdown{display:flex;align-items:center;gap:.5rem;font-size:1.25rem;color:#fff}.dice-natural{font-weight:700;padding:.25rem .5rem;background:#ffffff1a;border-radius:4px}.dice-modifier{color:var(--dice-primary, #a78bfa);font-weight:600}.dice-equals{color:#ffffff80}.dice-total{font-size:1.5rem;font-weight:800;padding:.25rem .75rem;background:var(--dice-primary, #a78bfa);border-radius:6px;color:#fff}.dice-result.success .dice-total{background:#22c55e}.dice-result.failure .dice-total{background:#ef4444}.dice-result.critical-success .dice-total{background:linear-gradient(135deg,#22c55e,#16a34a);box-shadow:0 0 20px #22c55e80}.dice-result.critical-failure .dice-total{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 0 20px #ef444480}.dice-crit-banner{font-size:1.25rem;font-weight:800;text-transform:uppercase;letter-spacing:2px;padding:.5rem 1rem;border-radius:8px;animation:critBannerPulse 1s ease-in-out infinite}.dice-crit-banner.success{color:#22c55e;background:#22c55e26;border:2px solid #22c55e;text-shadow:0 0 10px rgba(34,197,94,.5)}.dice-crit-banner.failure{color:#ef4444;background:#ef444426;border:2px solid #ef4444;text-shadow:0 0 10px rgba(239,68,68,.5)}@keyframes critBannerPulse{0%,to{opacity:1}50%{opacity:.7}}.dice-roll-button{padding:1rem 2.5rem;font-size:1.1rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#fff;background:var(--dice-primary, #a78bfa);border:none;border-radius:30px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 20px var(--dice-glow, rgba(167, 139, 250, .4))}.dice-roll-button:hover:not(:disabled){transform:scale(1.05);box-shadow:0 6px 30px var(--dice-glow, rgba(167, 139, 250, .6))}.dice-roll-button:active:not(:disabled){transform:scale(.98)}.dice-roll-button:disabled{opacity:.6;cursor:not-allowed}.dice-roll-button.rolling{animation:buttonPulse .5s ease-in-out infinite}.dice-shake-hint{font-size:.85rem;color:#ffffff80;margin:0;font-style:italic}.dice-cancel-button{padding:.5rem 1.5rem;font-size:.9rem;color:#fff9;background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:20px;cursor:pointer;transition:all .2s ease}.dice-cancel-button:hover{color:#fff;border-color:#fff6}@media(max-width:480px){.dice-roller-container{padding:1.5rem;gap:1.25rem}.dice-roller-title{font-size:1.25rem}.dice-shape{width:100px;height:100px}.dice-shape[data-dice=d4]{width:110px;height:95px}.dice-shape[data-dice=d8]{width:110px;height:110px}.dice-shape[data-dice=d10],.dice-shape[data-dice=d100]{width:105px;height:110px}.dice-shape[data-dice=d20]{width:110px;height:120px}.dice-value{font-size:2rem}.dice-roll-button{padding:.875rem 2rem;font-size:1rem}}@media(prefers-reduced-motion:reduce){.dice-display.rolling .dice-shape,.dice-roll-button.rolling,.dice-crit-banner,.dice-display.critical-success .dice-shape,.dice-display.critical-failure .dice-shape{animation:none}}.ability-roller-overlay{position:fixed;inset:0;z-index:1000;background:#000000e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;animation:abilityOverlayFadeIn .3s ease-out}@keyframes abilityOverlayFadeIn{0%{opacity:0}to{opacity:1}}.ability-roller-container{display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:2rem;max-width:95%;width:480px;animation:abilityContainerSlideUp .4s ease-out}@keyframes abilityContainerSlideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.ability-roller-header{text-align:center;width:100%}.ability-roller-title{font-size:1.5rem;font-weight:700;color:#fff;margin:0 0 1rem;text-shadow:0 2px 10px rgba(0,0,0,.5)}.ability-roller-progress{display:flex;justify-content:center;gap:.5rem}.progress-pip{padding:.35rem .5rem;font-size:.7rem;font-weight:700;color:#fff6;background:#ffffff1a;border-radius:4px;transition:all .3s ease}.progress-pip.complete{color:#fff;background:var(--dice-primary, #a78bfa)}.progress-pip.current{color:#fff;background:transparent;border:2px solid var(--dice-primary, #a78bfa);box-shadow:0 0 10px var(--dice-glow, rgba(167, 139, 250, .5));animation:currentPipPulse 1.5s ease-in-out infinite}@keyframes currentPipPulse{0%,to{opacity:1}50%{opacity:.7}}.ability-dice-row{display:flex;gap:1rem;justify-content:center}.ability-die{width:70px;height:70px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2a2a3a,#1a1a2a);border:3px solid var(--dice-primary, #a78bfa);border-radius:12px;box-shadow:0 0 20px var(--dice-glow, rgba(167, 139, 250, .3)),inset 0 0 15px #00000080;position:relative;transition:all .3s ease}.ability-die.rolling{animation:dieRoll .1s linear infinite}@keyframes dieRoll{0%{transform:rotate(0) scale(1)}25%{transform:rotate(8deg) scale(1.05)}50%{transform:rotate(0) scale(1)}75%{transform:rotate(-8deg) scale(1.05)}to{transform:rotate(0) scale(1)}}.ability-die.dropped{opacity:.4;border-color:#ef4444;box-shadow:0 0 15px #ef44444d;transform:scale(.9)}.die-face{font-size:2rem;font-weight:800;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.5)}.dropped-label{position:absolute;bottom:-8px;left:50%;transform:translate(-50%);font-size:.6rem;font-weight:700;color:#ef4444;background:#000c;padding:2px 6px;border-radius:4px;text-transform:uppercase}.ability-roll-info{display:flex;align-items:center;gap:.75rem;font-size:1.1rem}.roll-formula{color:#fff9;font-style:italic}.roll-total{font-size:1.5rem;font-weight:800;color:var(--dice-primary, #a78bfa);animation:totalAppear .3s ease-out}@keyframes totalAppear{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.ability-roll-button{padding:1rem 2.5rem;font-size:1.1rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#fff;background:var(--dice-primary, #a78bfa);border:none;border-radius:30px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 20px var(--dice-glow, rgba(167, 139, 250, .4))}.ability-roll-button:hover:not(:disabled){transform:scale(1.05);box-shadow:0 6px 30px var(--dice-glow, rgba(167, 139, 250, .6))}.ability-roll-button:active:not(:disabled){transform:scale(.98)}.ability-roll-button:disabled{opacity:.6;cursor:not-allowed}.ability-roll-button.rolling{animation:buttonPulse .5s ease-in-out infinite}.ability-roll-button.next{background:linear-gradient(135deg,#22c55e,#16a34a);box-shadow:0 4px 20px #22c55e66}.ability-roll-button.next:hover{box-shadow:0 6px 30px #22c55e99}@keyframes buttonPulse{0%,to{opacity:1}50%{opacity:.7}}.completed-rolls-mini{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;padding:.75rem;background:#ffffff0d;border-radius:12px}.mini-roll{display:flex;flex-direction:column;align-items:center;padding:.5rem;background:#ffffff1a;border-radius:8px;min-width:50px}.mini-stat{font-size:.65rem;font-weight:600;color:#ffffff80;text-transform:uppercase}.mini-value{font-size:1.1rem;font-weight:800;color:#fff}.ability-results-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;width:100%}.ability-result-card{display:flex;flex-direction:column;align-items:center;padding:1rem;background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border:1px solid rgba(255,255,255,.1);border-radius:12px;animation:resultCardAppear .4s ease-out backwards}.ability-result-card:nth-child(1){animation-delay:.1s}.ability-result-card:nth-child(2){animation-delay:.15s}.ability-result-card:nth-child(3){animation-delay:.2s}.ability-result-card:nth-child(4){animation-delay:.25s}.ability-result-card:nth-child(5){animation-delay:.3s}.ability-result-card:nth-child(6){animation-delay:.35s}@keyframes resultCardAppear{0%{opacity:0;transform:translateY(10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.result-stat-name{font-size:.75rem;font-weight:600;color:#fff9;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.25rem}.result-stat-value{font-size:2rem;font-weight:800;color:#fff;line-height:1}.result-dice-breakdown{display:flex;gap:4px;margin-top:.5rem}.result-die{font-size:.7rem;font-weight:600;padding:2px 5px;background:#ffffff26;border-radius:4px;color:#fffc}.result-die.dropped{background:#ef44444d;color:#ef4444cc;text-decoration:line-through}.ability-stats-summary{display:flex;align-items:center;gap:1.5rem;padding:1rem 1.5rem;background:#ffffff0d;border-radius:12px;font-size:.95rem;color:#ffffffb3}.summary-total strong,.summary-avg strong{color:#fff;font-weight:700}.summary-quality{padding:.35rem .75rem;border-radius:20px;font-weight:700;font-size:.85rem}.summary-quality.legendary{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;box-shadow:0 0 15px #f59e0b80}.summary-quality.excellent{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}.summary-quality.good{background:#22c55e33;color:#22c55e}.summary-quality.average{background:#ffffff1a;color:#ffffffb3}.summary-quality.tough{background:#ef444433;color:#ef4444}.ability-action-buttons{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:300px}.ability-keep-button{padding:1rem 2rem;font-size:1.1rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#fff;background:linear-gradient(135deg,#22c55e,#16a34a);border:none;border-radius:30px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 20px #22c55e66}.ability-keep-button:hover{transform:scale(1.03);box-shadow:0 6px 30px #22c55e99}.ability-reroll-button{padding:.75rem 1.5rem;font-size:.95rem;font-weight:600;color:var(--dice-primary, #a78bfa);background:transparent;border:2px solid var(--dice-primary, #a78bfa);border-radius:30px;cursor:pointer;transition:all .2s ease}.ability-reroll-button:hover{background:#a78bfa1a;transform:scale(1.02)}.no-rerolls-message{text-align:center;font-size:.85rem;color:#fff6;font-style:italic}.reroll-counter{font-size:.8rem;color:#fff6;margin-top:.5rem}.ability-cancel-button{padding:.5rem 1.5rem;font-size:.85rem;color:#ffffff80;background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:20px;cursor:pointer;transition:all .2s ease;margin-top:.5rem}.ability-cancel-button:hover{color:#fff;border-color:#fff6}.roll-total.high{color:#22c55e;text-shadow:0 0 10px rgba(34,197,94,.5);animation:highRollPulse .5s ease-out}.roll-total.low{color:#ef4444;text-shadow:0 0 10px rgba(239,68,68,.5)}@keyframes highRollPulse{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1)}}.mini-roll.high{background:#22c55e33;border:1px solid rgba(34,197,94,.4)}.mini-roll.high .mini-value{color:#22c55e}.mini-roll.low{background:#ef444433;border:1px solid rgba(239,68,68,.4)}.mini-roll.low .mini-value{color:#ef4444}.ability-result-card.high{border-color:#22c55e80;box-shadow:0 0 15px #22c55e33}.ability-result-card.high .result-stat-value{color:#22c55e}.ability-result-card.low{border-color:#ef444480;box-shadow:0 0 15px #ef444433}.ability-result-card.low .result-stat-value{color:#ef4444}.ability-results-grid.legendary{animation:legendaryGlow 2s ease-in-out infinite}@keyframes legendaryGlow{0%,to{filter:drop-shadow(0 0 10px rgba(255,215,0,.3))}50%{filter:drop-shadow(0 0 25px rgba(255,215,0,.6))}}.shake-hint{font-size:.85rem;color:#ffffff80;margin:.5rem 0 0;font-style:italic;animation:shakeHintBounce 2s ease-in-out infinite}@keyframes shakeHintBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.confetti-container{position:fixed;inset:0;pointer-events:none;z-index:1001;overflow:hidden}.confetti-piece{position:absolute;top:-20px;border-radius:2px;animation:confettiFall 3s ease-out forwards}@keyframes confettiFall{0%{transform:translateY(0) rotate(0) scale(1);opacity:1}25%{transform:translateY(25vh) rotate(180deg) scale(1);opacity:1}50%{transform:translateY(50vh) rotate(360deg) scale(.9);opacity:.9}75%{transform:translateY(75vh) rotate(540deg) scale(.8);opacity:.6}to{transform:translateY(100vh) rotate(720deg) scale(.5);opacity:0}}.confetti-piece:nth-child(odd){animation-name:confettiFallLeft}.confetti-piece:nth-child(2n){animation-name:confettiFallRight}@keyframes confettiFallLeft{0%{transform:translateY(0) translate(0) rotate(0);opacity:1}to{transform:translateY(100vh) translate(-50px) rotate(720deg);opacity:0}}@keyframes confettiFallRight{0%{transform:translateY(0) translate(0) rotate(0);opacity:1}to{transform:translateY(100vh) translate(50px) rotate(-720deg);opacity:0}}@media(max-width:480px){.ability-roller-container{padding:1.5rem 1rem;gap:1.25rem}.ability-roller-title{font-size:1.25rem}.progress-pip{padding:.25rem .4rem;font-size:.6rem}.ability-dice-row{gap:.5rem}.ability-die{width:55px;height:55px}.die-face{font-size:1.5rem}.ability-results-grid{grid-template-columns:repeat(2,1fr)}.ability-result-card{padding:.75rem}.result-stat-value{font-size:1.75rem}.ability-stats-summary{flex-direction:column;gap:.5rem}.ability-action-buttons{max-width:100%}}@media(prefers-reduced-motion:reduce){.ability-die.rolling,.ability-roll-button.rolling,.progress-pip.current,.ability-result-card{animation:none}}.scene-background{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;z-index:0}.scene-gradient{position:absolute;inset:0;width:100%;height:100%;z-index:1}.scene-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;opacity:0;transition:opacity .5s ease-in-out}.scene-image.loaded{opacity:1}.scene-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:3;opacity:0;transition:opacity 1s ease-in-out;pointer-events:none}.scene-video.ready{opacity:1}.scene-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:4;background:linear-gradient(to bottom,#0003,#0000001a 30% 70%,#0000004d);pointer-events:none}.scene-video-indicator{position:absolute;bottom:12px;right:12px;z-index:5;pointer-events:none}.scene-video-indicator-dot{width:8px;height:8px;background:#fff9;border-radius:50%;animation:scene-video-pulse 2s ease-in-out infinite}@keyframes scene-video-pulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.8;transform:scale(1.2)}}.personality-indicator{position:relative;width:100%;max-width:200px;font-family:inherit;-webkit-user-select:none;user-select:none}.personality-compact{cursor:pointer;padding:8px;background:#0006;border-radius:8px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .2s ease}.personality-compact:hover{background:#00000080}.personality-bar{margin-bottom:6px}.personality-bar-track{position:relative;height:6px;border-radius:3px;overflow:hidden}.personality-bar.neutral .personality-bar-track{background:linear-gradient(to right,#8b0000,#4a0033,#2d1b4e,#1a3a1a,gold)}.personality-bar.lawful .personality-bar-track{background:linear-gradient(to right,#4a0000,#1a1a4a,#2a2a6a,#1a4a4a,#4a90d9)}.personality-bar.chaotic .personality-bar-track{background:linear-gradient(to right,#2d0000,#4a1a00,#6a3a00,#4a4a00,#f60)}.personality-bar-marker{position:absolute;top:50%;transform:translate(-50%,-50%);width:12px;height:12px;background:#fff;border:2px solid rgba(0,0,0,.5);border-radius:50%;box-shadow:0 0 8px #ffffff80;transition:left .5s ease-out}.personality-bar-labels{display:flex;justify-content:space-between;font-size:9px;color:#ffffff80;margin-top:2px;text-transform:uppercase;letter-spacing:.5px}.label-evil{color:#c86464b3}.label-good{color:#c8b464b3}.personality-title{display:flex;justify-content:space-between;align-items:center}.title-text{font-size:12px;font-weight:500;color:#ffffffe6;font-style:italic}.title-expand-hint{font-size:8px;color:#fff6;transition:transform .2s ease}.personality-compact:hover .title-expand-hint{color:#ffffffb3}.personality-expanded{margin-top:8px;padding:12px;background:#0009;border-radius:8px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);animation:expandIn .2s ease-out}@keyframes expandIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.personality-section{margin-bottom:12px}.personality-section:last-child{margin-bottom:0}.section-header{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#ffffff80;margin-bottom:6px;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:4px}.section-content{font-size:12px;color:#ffffffd9}.alignment-label{font-weight:600;color:#fffffff2}.alignment-drift{font-size:10px;color:#f59e0b;margin-top:4px;font-style:italic}.mbti-type{font-size:16px;font-weight:700;letter-spacing:2px;color:var(--adventure-primary, #a78bfa)}.mbti-name{font-size:13px;font-weight:500;color:#ffffffe6;margin-top:2px}.mbti-description{font-size:11px;color:#fff9;margin-top:4px;line-height:1.4}.no-data{font-size:11px;color:#fff6;font-style:italic}.personality-confidence{margin-top:12px;padding-top:8px;border-top:1px solid rgba(255,255,255,.1)}.confidence-bar{height:3px;background:#ffffff1a;border-radius:2px;overflow:hidden;margin-bottom:4px}.confidence-fill{height:100%;background:linear-gradient(to right,rgba(167,139,250,.5),var(--adventure-primary, #a78bfa));border-radius:2px;transition:width .5s ease-out}.confidence-label{font-size:9px;color:#fff6;text-transform:uppercase;letter-spacing:.5px}.enemy-panel{position:absolute;right:1rem;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:.5rem;z-index:15;max-height:80%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent}.enemy-panel::-webkit-scrollbar{width:4px}.enemy-panel::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:2px}.enemy-panel-header{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem .75rem;background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:8px;border:1px solid rgba(239,68,68,.3)}.round-badge{font-size:.7rem;font-weight:600;color:#ef4444;text-transform:uppercase;letter-spacing:1px}.turn-indicator{font-size:.65rem;color:#22c55e;font-weight:500}.enemy-list{display:flex;flex-direction:column;gap:.5rem}.enemy-entry{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:8px;border:2px solid rgba(239,68,68,.4);min-width:140px;transition:all .2s ease}.enemy-entry.current-turn{border-color:#fbbf24;box-shadow:0 0 15px #fbbf2466}.enemy-entry.targetable{cursor:pointer}.enemy-entry.targetable:hover{border-color:#ef4444;box-shadow:0 0 12px #ef444480;transform:scale(1.02)}.enemy-entry.targeted{border-color:#ef4444;box-shadow:0 0 15px #ef444499;background:#ef444426}.enemy-entry.defeated{opacity:.5;border-color:#64646466}.enemy-portrait{position:relative;width:36px;height:36px;border-radius:50%;overflow:hidden;background:#ef444433;display:flex;align-items:center;justify-content:center;flex-shrink:0}.enemy-portrait img{width:100%;height:100%;object-fit:cover}.enemy-icon{font-size:1.25rem}.turn-marker{position:absolute;top:-4px;right:-4px;font-size:.7rem;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.enemy-info{flex:1;display:flex;flex-direction:column;gap:.2rem;min-width:0}.enemy-name{font-size:.75rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.enemy-hp-bar{width:100%;height:6px;background:#ffffff1a;border-radius:3px;overflow:hidden}.enemy-hp-fill{height:100%;border-radius:3px;transition:width .3s ease,background-color .3s ease}.enemy-hp-text{font-size:.6rem;color:#ffffffb3}.defeated-label{font-size:.6rem;color:#ffffff80;font-style:italic}.target-crosshair{font-size:1rem;animation:targetPulse .5s ease-in-out infinite}@keyframes targetPulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}}.defeated-section{padding-top:.5rem;border-top:1px solid rgba(255,255,255,.1);margin-top:.25rem}@media(max-width:480px){.enemy-panel{right:.5rem;max-width:120px}.enemy-entry{padding:.4rem .5rem;min-width:100px}.enemy-portrait{width:28px;height:28px}.enemy-icon{font-size:1rem}.enemy-name{font-size:.65rem}.enemy-hp-bar{height:4px}}.death-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:#000000f2;animation:deathFadeIn 1s ease-out}@keyframes deathFadeIn{0%{opacity:0}to{opacity:1}}.death-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:2rem;max-width:400px;width:90%;animation:deathSlideUp .8s ease-out .3s both}@keyframes deathSlideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.death-header{text-align:center}.death-title{font-size:1.5rem;font-weight:700;color:#ef4444;text-shadow:0 0 20px rgba(239,68,68,.5);margin:0;letter-spacing:1px;animation:titlePulse 2s ease-in-out infinite}@keyframes titlePulse{0%,to{text-shadow:0 0 20px rgba(239,68,68,.5)}50%{text-shadow:0 0 30px rgba(239,68,68,.8)}}.death-portrait{position:relative;width:150px;height:150px;border-radius:50%;overflow:hidden;border:3px solid #ef4444;box-shadow:0 0 30px #ef444466}.death-portrait img{width:100%;height:100%;object-fit:cover;filter:grayscale(.5) brightness(.6)}.portrait-overlay{position:absolute;inset:0;background:radial-gradient(circle at center,transparent 30%,rgba(239,68,68,.3) 100%)}.death-vignette{position:absolute;inset:0;box-shadow:inset 0 0 40px #000c;border-radius:50%}.death-narration{text-align:center;padding:1rem;background:#ef44441a;border-radius:12px;border:1px solid rgba(239,68,68,.3)}.death-narration p{margin:0;font-size:1.1rem;font-style:italic;color:#ffffffe6;line-height:1.5}.fate-tokens-display{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem 1.5rem;background:#00000080;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.tokens-label{font-size:.7rem;color:#ffffff80;text-transform:uppercase;letter-spacing:2px}.tokens-icons{display:flex;gap:.5rem;font-size:1.5rem}.fate-token-icon{transition:all .3s ease}.fate-token-icon.active{color:#fbbf24;text-shadow:0 0 10px rgba(251,191,36,.8);animation:tokenGlow 1.5s ease-in-out infinite}.fate-token-icon.empty{color:#fff3}.fate-token-extra{font-size:.9rem;color:#fbbf24;font-weight:600}@keyframes tokenGlow{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.tokens-count{font-size:.85rem;color:#ffffffb3}.death-message{padding:.75rem 1rem;background:#22c55e33;border:1px solid rgba(34,197,94,.5);border-radius:8px;animation:messageFade .5s ease}.death-message p{margin:0;color:#22c55e;font-weight:500;text-align:center}@keyframes messageFade{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.death-actions{display:flex;flex-direction:column;gap:.75rem;width:100%}.death-btn{display:flex;align-items:center;gap:1rem;width:100%;padding:1rem 1.25rem;background:#0009;border:2px solid rgba(255,255,255,.2);border-radius:12px;color:#fff;cursor:pointer;transition:all .3s ease;text-align:left}.death-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 15px #0006}.death-btn:disabled{opacity:.4;cursor:not-allowed}.death-btn.cheat-death{border-color:#fbbf2480;background:linear-gradient(135deg,#fbbf2426,#0009)}.death-btn.cheat-death:hover:not(:disabled){border-color:#fbbf24;box-shadow:0 0 20px #fbbf244d}.death-btn.accept-fate{border-color:#ef444480;background:linear-gradient(135deg,#ef444426,#0009)}.death-btn.accept-fate:hover:not(:disabled){border-color:#ef4444;box-shadow:0 0 20px #ef44444d}.death-btn.purchase{border-color:#3b82f680;background:linear-gradient(135deg,#3b82f626,#0009)}.death-btn.purchase:hover:not(:disabled){border-color:#3b82f6;box-shadow:0 0 20px #3b82f64d}.death-btn.cancel{background:#ffffff1a}.btn-icon{font-size:2rem}.btn-text{display:flex;flex-direction:column;gap:.2rem}.btn-title{font-size:1.1rem;font-weight:600}.btn-subtitle{font-size:.75rem;color:#fff9}.purchase-panel{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.5rem;background:#3b82f61a;border:1px solid rgba(59,130,246,.3);border-radius:12px;width:100%}.purchase-panel h3{margin:0;font-size:1.1rem;color:#3b82f6}.purchase-info{margin:0;font-size:1rem;color:#fff}.credit-balance{margin:0;font-size:.9rem;color:#ffffffb3}.credit-balance strong{color:#fbbf24}.purchase-actions{display:flex;gap:.75rem;width:100%}.purchase-actions .death-btn{flex:1;justify-content:center}.no-tokens-hint{text-align:center;padding:1rem;background:#ffffff0d;border-radius:8px}.no-tokens-hint p{margin:0 0 .5rem;font-size:.9rem;color:#fff9}.purchase-link{background:none;border:none;color:#3b82f6;font-size:.9rem;cursor:pointer;text-decoration:underline;padding:0;transition:color .2s ease}.purchase-link:hover{color:#60a5fa}.purchase-disabled{color:#fff6;font-style:italic}.death-info{text-align:center;padding-top:1rem;border-top:1px solid rgba(255,255,255,.1)}.death-info p{margin:0;font-size:.8rem;color:#ffffff80}@media(max-width:480px){.death-content{padding:1.5rem;gap:1rem}.death-title{font-size:1.25rem}.death-portrait{width:120px;height:120px}.death-narration{padding:.75rem}.death-narration p{font-size:1rem}.death-btn{padding:.875rem 1rem;gap:.75rem}.btn-icon{font-size:1.5rem}.btn-title{font-size:1rem}.btn-subtitle{font-size:.7rem}}@media(prefers-reduced-motion:reduce){.death-overlay,.death-content,.fate-token-icon.active,.death-title{animation:none}}.adventure-screen{width:100%;height:100vh;height:100dvh;position:relative;overflow:hidden;color:#fff}.scene-background{position:absolute;inset:0;z-index:0}.scene-background .scene-image{width:100%;height:100%;object-fit:cover;filter:brightness(.7) saturate(1.1)}.scene-background .scene-placeholder{width:100%;height:100%}.scene-background .scene-overlay{position:absolute;inset:0;background:linear-gradient(180deg,#0000004d,#0000001a 30% 50%,#0006 70%,#000c);pointer-events:none}.adventure-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}.adventure-particles .particle{position:absolute;width:3px;height:3px;border-radius:50%;opacity:.4;left:var(--x);bottom:-10px;animation:float-up var(--duration) var(--delay) infinite ease-out}@keyframes float-up{0%{transform:translateY(0) scale(1);opacity:0}10%{opacity:.5}90%{opacity:.3}to{transform:translateY(-100vh) scale(.5);opacity:0}}.adventure-content{position:relative;z-index:2;display:flex;flex-direction:column;height:100%}.location-badge{position:absolute;top:.75rem;left:.75rem;display:flex;align-items:center;gap:.4rem;background:#0009;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:.4rem .75rem;border-radius:20px;border:1px solid rgba(255,255,255,.15);z-index:10}.location-icon{font-size:.85rem}.location-name{font-size:.75rem;color:#fff;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.location-details{display:flex;align-items:center;gap:.25rem;margin-left:.25rem;padding-left:.5rem;border-left:1px solid rgba(255,255,255,.2)}.location-detail{font-size:.8rem;cursor:help;transition:transform .2s ease}.location-detail:hover{transform:scale(1.2)}.location-detail.mood-combat{filter:drop-shadow(0 0 3px rgba(255,50,50,.6))}.location-detail.mood-tense{filter:drop-shadow(0 0 3px rgba(255,200,50,.6))}.location-detail.mood-mysterious{filter:drop-shadow(0 0 3px rgba(150,100,255,.6))}.location-detail.mood-triumphant{filter:drop-shadow(0 0 3px rgba(255,215,0,.6))}.location-detail.mood-ominous{filter:drop-shadow(0 0 3px rgba(100,0,100,.6))}.location-detail.mood-peaceful{filter:drop-shadow(0 0 3px rgba(100,200,100,.6))}.character-panel{position:absolute;top:3rem;left:0;z-index:20;display:flex;flex-direction:column;gap:.5rem;pointer-events:auto}.character-bar{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:transparent;flex-shrink:0}.character-portrait{width:48px;height:48px;border-radius:50%;overflow:hidden;border:2px solid var(--adventure-primary, #a78bfa);box-shadow:0 0 12px var(--adventure-glow, rgba(167, 139, 250, .4));flex-shrink:0}.character-portrait img{width:100%;height:100%;object-fit:cover}button.character-portrait{background:none;padding:0;cursor:pointer;transition:all .2s ease}button.character-portrait:hover{transform:scale(1.1);box-shadow:0 0 20px var(--adventure-glow, rgba(167, 139, 250, .6))}button.character-portrait:active{transform:scale(1.05)}button.character-portrait:focus{outline:2px solid var(--adventure-primary, #a78bfa);outline-offset:2px}.companion-bar{position:absolute;top:140px;left:1rem;display:flex;flex-direction:column;gap:.5rem;z-index:20;pointer-events:auto}.companion-card{display:flex;align-items:center;gap:.5rem;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:.5rem;padding:.4rem .6rem;border:1px solid var(--adventure-primary, #a78bfa);box-shadow:0 2px 8px #0000004d;min-width:140px}.companion-card .companion-portrait{width:32px;height:32px;border-radius:50%;overflow:hidden;border:2px solid var(--adventure-primary, #a78bfa);flex-shrink:0}.companion-card .companion-portrait img{width:100%;height:100%;object-fit:cover}.companion-info{flex:1;min-width:0}.companion-name{font-size:.75rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.companion-class{font-size:.6rem;color:#fff9;text-transform:uppercase}.companion-hp .hp-bar{width:60px;height:4px}.companion-hp .hp-text{font-size:.6rem;color:#ffffffb3}.monster-bar{position:absolute;top:60px;right:1rem;display:flex;flex-direction:column;gap:.5rem;z-index:20;pointer-events:auto}.monster-card{display:flex;align-items:center;gap:.5rem;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:.5rem;padding:.4rem .6rem;border:1px solid #dc2626;box-shadow:0 2px 8px #dc26264d;min-width:120px}.monster-card .monster-portrait{width:32px;height:32px;border-radius:50%;overflow:hidden;border:2px solid #dc2626;flex-shrink:0}.monster-card .monster-portrait img{width:100%;height:100%;object-fit:cover}.monster-info{flex:1;min-width:0}.monster-name{font-size:.75rem;font-weight:600;color:#fca5a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.monster-hp .hp-bar{width:50px;height:4px}.monster-hp .hp-bar.enemy{background:#dc26264d}.character-info{flex:1;min-width:0}.character-name{font-size:.95rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 2px 4px rgba(0,0,0,.5)}.character-class{font-size:.7rem;color:#ffffffb3;text-transform:uppercase;letter-spacing:.5px;text-shadow:0 1px 2px rgba(0,0,0,.5)}.character-hp{display:flex;align-items:center;gap:.5rem;margin-top:.25rem}.hp-bar{width:60px;height:6px;background:#00000080;border-radius:3px;overflow:hidden;border:1px solid rgba(255,255,255,.2)}.hp-fill{height:100%;border-radius:3px;transition:width .3s ease}.hp-text{font-size:.6rem;color:#ffffffb3;font-weight:500;text-shadow:0 1px 2px rgba(0,0,0,.5)}.chat-area{flex:1;overflow-y:auto;padding:1rem 0;display:flex;flex-direction:column;align-items:stretch;gap:1rem;scroll-behavior:smooth}.chat-spacer{flex:1 1 auto;min-height:0}.chat-message{display:flex;gap:.75rem;animation:messageSlideIn .3s ease;margin-left:16%;margin-right:0%}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.chat-message.player{flex-direction:row}.message-avatar{width:36px;height:36px;border-radius:50%;overflow:hidden;flex-shrink:0;border:2px solid var(--adventure-primary, #a78bfa);box-shadow:0 2px 8px #0000004d}.message-avatar.player{border-color:#fff6}.message-avatar img{width:100%;height:100%;object-fit:cover}.message-content{flex:1;min-width:0;display:flex;flex-direction:column;gap:.25rem}.message-sender{font-size:.7rem;color:var(--adventure-primary, #a78bfa);font-weight:600;text-transform:uppercase;letter-spacing:.5px;text-shadow:0 1px 2px rgba(0,0,0,.5)}.message-text{background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:16px;padding:.875rem 1.125rem;font-size:.95rem;line-height:1.6;color:#fffffff2;margin:0;border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 12px #0000004d;width:100%}.chat-message.dm .message-text{border-top-left-radius:4px}.chat-message.player .message-text{background:var(--adventure-primary, #a78bfa);color:#fff;border-top-left-radius:4px;border-color:transparent}.chat-message.player .message-sender{color:var(--adventure-primary, #a78bfa)}.chat-message.npc{flex-direction:row}.message-avatar.npc{border-color:#f59e0b}.npc-avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;font-weight:700;font-size:1rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.chat-message.npc .message-text{background:#f59e0b26;border-color:#f59e0b4d;border-top-left-radius:4px}.chat-message.npc .message-sender,.message-sender.npc-name{color:#f59e0b}.chat-message.typing .message-content{gap:.5rem}.typing-indicator{display:flex;gap:.3rem;padding:.75rem 1rem;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:4px 16px 16px;width:fit-content;border:1px solid rgba(255,255,255,.1)}.typing-indicator span{width:8px;height:8px;border-radius:50%;animation:typingBounce 1.4s infinite ease-in-out both}.typing-indicator span:nth-child(1){animation-delay:-.32s}.typing-indicator span:nth-child(2){animation-delay:-.16s}@keyframes typingBounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}.typing-text{font-size:.75rem;color:#fff9;font-style:italic;margin:0;text-shadow:0 1px 2px rgba(0,0,0,.5)}.input-area{flex-shrink:0;padding:.75rem 1rem 1rem;background:linear-gradient(0deg,rgba(0,0,0,.7) 0%,rgba(0,0,0,.5) 70%,transparent 100%);display:flex;flex-direction:column;gap:.75rem}.input-area.transparent{background:transparent}.chat-area.transparent .message-text{background:#0003;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.chat-area.transparent .chat-message.player .message-text{background:#a78bfa4d}.chat-area.transparent .chat-message.npc .message-text{background:#f59e0b26}.action-carousel{position:relative;width:100%;height:200px;display:flex;flex-direction:column;align-items:center;touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none;animation:carouselSlideIn .4s ease}@keyframes carouselSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.action-nav-arrow{position:absolute;top:50%;transform:translateY(-70%);width:36px;height:36px;border-radius:50%;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.5rem;cursor:pointer;z-index:10;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.action-nav-arrow:hover{background:#000c;transform:translateY(-70%) scale(1.1)}.action-nav-arrow.left{left:.5rem}.action-nav-arrow.right{right:.5rem}.action-cards-container{position:relative;width:100%;height:170px;display:flex;align-items:center;justify-content:center}.action-card-wrapper{position:absolute;width:260px;will-change:transform,opacity}.action-dots{display:none}.quick-action-card{width:100%;position:relative;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:2px solid rgba(255,255,255,.2);border-radius:12px;overflow:hidden;cursor:pointer;transition:all .25s ease}.quick-action-card:hover:not(:disabled){transform:translateY(-4px) scale(1.02);box-shadow:0 8px 24px #00000080}.quick-action-card:active:not(:disabled){transform:translateY(-2px) scale(1.01)}.quick-action-card:disabled{opacity:.5;cursor:not-allowed}.quick-action-card.safe{border-color:#22c55e80}.quick-action-card.safe:hover:not(:disabled){border-color:#22c55ee6;box-shadow:0 8px 24px #00000080,0 0 20px #22c55e4d}.quick-action-card.risky{border-color:#eab30880}.quick-action-card.risky:hover:not(:disabled){border-color:#eab308e6;box-shadow:0 8px 24px #00000080,0 0 20px #eab3084d}.quick-action-card.dangerous{border-color:#ef444480}.quick-action-card.dangerous:hover:not(:disabled){border-color:#ef4444e6;box-shadow:0 8px 24px #00000080,0 0 20px #ef44444d}.action-image-container{position:absolute;inset:0;background:linear-gradient(135deg,#1e1e28,#14141e);overflow:hidden}.action-image{width:100%;height:100%;object-fit:contain;transition:transform .3s ease}.quick-action-card:hover .action-image{transform:scale(1.1)}.action-image-overlay{position:absolute;inset:0;background:linear-gradient(180deg,#0003,#0006,#000000d9);pointer-events:none}.action-image-placeholder{position:absolute;inset:0;filter:blur(2px) brightness(.7);opacity:.8}.action-image-ready{animation:choiceImageFadeIn .5s ease-out forwards}@keyframes choiceImageFadeIn{0%{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}.action-image-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0000004d;z-index:2}.action-loading-spinner{width:24px;height:24px;border:2px solid rgba(255,255,255,.2);border-top-color:#fffc;border-radius:50%;animation:actionSpinner .8s linear infinite}@keyframes actionSpinner{to{transform:rotate(360deg)}}.action-card-content{position:relative;z-index:1;padding:.6rem .75rem;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:120px}.action-text{font-size:.85rem;font-weight:600;color:#fff;line-height:1.3;text-shadow:0 2px 4px rgba(0,0,0,.8)}.action-card-footer{display:flex;align-items:center;justify-content:space-between}.action-type-icon{font-size:1.1rem;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.danger-indicator{font-size:.6rem;letter-spacing:2px}.danger-indicator.safe{color:#22c55e}.danger-indicator.risky{color:#eab308}.danger-indicator.dangerous{color:#ef4444}.text-input-container{display:flex;gap:.5rem}.text-input{flex:1;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);border-radius:24px;padding:.75rem 1.25rem;color:#fff;font-size:.9rem;outline:none;transition:all .2s ease}.text-input::placeholder{color:#ffffff80}.text-input:focus{border-color:var(--adventure-primary, #a78bfa);box-shadow:0 0 0 2px var(--adventure-glow, rgba(167, 139, 250, .3))}.text-input:disabled{opacity:.5;cursor:not-allowed}.send-button{width:48px;height:48px;border-radius:50%;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.1rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0}.send-button:hover:not(:disabled){transform:scale(1.05)}.send-button:active:not(:disabled){transform:scale(.95)}.send-button:disabled{opacity:.4;cursor:not-allowed}.name-entry-container{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.5rem 2rem;background:#00000040;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:16px;border:1px solid rgba(255,255,255,.15);animation:nameEntryAppear .4s ease-out}@keyframes nameEntryAppear{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.name-entry-header{text-align:center}.name-entry-label{font-size:.85rem;font-weight:600;color:#ffffffb3;text-transform:uppercase;letter-spacing:1px}.name-entry-input-row{display:flex;gap:.5rem;width:100%;max-width:320px}.name-entry-input{flex:1;background:#0003;border:2px solid rgba(255,255,255,.4);border-radius:12px;padding:.875rem 1rem;color:#fff;font-size:1.1rem;font-weight:500;text-align:center;outline:none;transition:all .2s ease;text-shadow:0 1px 3px rgba(0,0,0,.5)}.name-entry-input::placeholder{color:#ffffff80;font-weight:400}.name-entry-input:focus{background:#00000059;box-shadow:0 0 0 3px #ffffff26}.name-regenerate-button{width:48px;height:48px;border-radius:12px;background:#0003;border:2px solid rgba(255,255,255,.4);color:#fff;font-size:1.25rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0}.name-regenerate-button:hover:not(:disabled){background:#ffffff1a;transform:scale(1.05)}.name-regenerate-button:active:not(:disabled){transform:scale(.95)}.name-regenerate-button:disabled{opacity:.4;cursor:not-allowed}.regenerate-icon{display:inline-block;transition:transform .3s ease}.name-regenerate-button:hover:not(:disabled) .regenerate-icon{animation:diceRoll .5s ease}@keyframes diceRoll{0%{transform:rotate(0)}25%{transform:rotate(-15deg)}50%{transform:rotate(15deg)}75%{transform:rotate(-10deg)}to{transform:rotate(0)}}.name-confirm-button{padding:.875rem 2rem;font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#fff;background:#0000004d;border:2px solid rgba(255,255,255,.3);border-radius:30px;cursor:pointer;transition:all .2s ease;min-width:180px;text-shadow:0 1px 3px rgba(0,0,0,.5)}.name-confirm-button:hover:not(:disabled){transform:scale(1.03)}.name-confirm-button:active:not(:disabled){transform:scale(.98)}.name-confirm-button:disabled{opacity:.5;cursor:not-allowed}@media(max-width:480px){.character-panel{top:2.5rem}.character-bar{padding:.5rem .75rem;gap:.5rem}.character-portrait{width:40px;height:40px}.character-name{font-size:.85rem}.hp-bar{width:60px}.chat-area{padding:.75rem}.message-avatar{width:32px;height:32px}.message-text{font-size:.9rem;padding:.7rem 1rem}.action-carousel{height:170px}.action-cards-container{height:140px}.action-card-wrapper{width:220px}.action-nav-arrow{width:30px;height:30px;font-size:1.2rem}.action-card-content{min-height:100px}.action-text{font-size:.75rem}.text-input{padding:.6rem 1rem;font-size:.85rem}.send-button{width:42px;height:42px}}@media(min-width:768px){.character-panel{top:3.5rem}.character-bar{padding:1rem 1.5rem}.character-portrait{width:56px;height:56px}.chat-area{padding:1.5rem 2rem}.message-content{max-width:70%}.message-text{font-size:1rem}.input-area{padding:1rem 2rem 1.5rem}.action-carousel{height:240px}.action-cards-container{height:200px}.action-card-wrapper{width:320px}.action-nav-arrow{width:44px;height:44px;font-size:1.8rem}.action-nav-arrow.left{left:1.5rem}.action-nav-arrow.right{right:1.5rem}.action-card-content{min-height:150px}.action-text{font-size:.9rem}.action-dots{gap:.75rem}.action-dot{width:10px;height:10px}.action-dot.active{width:12px;height:12px}}@media(prefers-reduced-motion:reduce){.chat-message,.action-carousel,.typing-indicator span,.adventure-particles .particle{animation:none}.quick-action-card,.action-card-wrapper,.action-image,.action-nav-arrow,.action-dot,.send-button,.text-input{transition:none}}.chat-area::-webkit-scrollbar{width:6px}.chat-area::-webkit-scrollbar-track{background:transparent}.chat-area::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.chat-area::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.detail-frame-persistent{position:absolute;inset:8%;z-index:1;display:flex;align-items:center;justify-content:center;pointer-events:none;touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none}.detail-carousel-container{position:relative;width:100%;height:100%;overflow:hidden;border-radius:16px}.detail-controls-layer{position:absolute;inset:8% 0;z-index:5;pointer-events:none}.detail-center-click{position:absolute;inset:10% 15% 20%;pointer-events:auto;cursor:pointer;z-index:1}.view-toggle-btn{position:absolute;top:8px;right:8px;width:40px;height:40px;border-radius:50%;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.2rem;cursor:pointer;pointer-events:auto;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:10}.view-toggle-btn:hover{background:#000c;transform:scale(1.1);border-color:var(--adventure-primary, #a78bfa);box-shadow:0 0 12px var(--adventure-glow, rgba(167, 139, 250, .4))}.view-toggle-btn:active{transform:scale(.95)}.detail-nav-arrow{position:absolute;top:50%;transform:translateY(-70%);width:36px;height:36px;border-radius:50%;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.5rem;cursor:pointer;z-index:10;display:flex;align-items:center;justify-content:center;transition:all .2s ease;pointer-events:auto}.detail-nav-arrow:hover{background:#000c;transform:translateY(-70%) scale(1.1);border-color:var(--adventure-primary, #a78bfa)}.detail-nav-arrow.left{left:1.5rem}.detail-nav-arrow.right{right:1.5rem}.detail-dots{position:absolute;bottom:1rem;left:50%;transform:translate(-50%);display:flex;gap:.5rem;z-index:10;pointer-events:auto}.detail-dot{width:8px;height:8px;border-radius:50%;border:none;cursor:pointer;transition:all .2s ease;padding:0}.detail-dot:hover{transform:scale(1.2)}.detail-dot.active{width:10px;height:10px}.detail-frame-inner{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:16px;overflow:hidden;background:#0000004d;border:4px solid rgba(255,255,255,.12);box-shadow:0 0 60px #0009,inset 0 0 40px #0006;pointer-events:auto;cursor:pointer;will-change:transform,opacity}.detail-frame-inner.active{border-color:#ffffff26}.detail-frame-inner.active:hover{border-color:#ffffff40}.detail-frame-inner.generating{display:flex;align-items:center;justify-content:center}.detail-frame-inner .detail-image{width:100%;height:100%;object-fit:cover;transition:opacity .5s ease}.detail-frame-inner .detail-image.creation-portrait{object-position:center top}.detail-frame-inner .detail-image.final-portrait{animation:portraitReveal 1s ease-out;cursor:pointer}.detail-frame-inner:has(.final-portrait){cursor:pointer}@keyframes portraitReveal{0%{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}.portrait-click-hint{position:absolute;bottom:10%;left:50%;transform:translate(-50%);background:#000000b3;padding:.75rem 1.5rem;border-radius:8px;border:1px solid var(--adventure-primary, #a78bfa);box-shadow:0 0 20px #a78bfa4d;animation:pulseHint 2s ease-in-out infinite;cursor:pointer;z-index:10}.portrait-click-hint span{color:#fff;font-size:1.1rem;font-weight:500;text-shadow:0 1px 2px rgba(0,0,0,.5)}@keyframes pulseHint{0%,to{opacity:1;transform:translate(-50%) scale(1)}50%{opacity:.8;transform:translate(-50%) scale(1.02)}}.detail-frame-inner .detail-image.fallback{filter:brightness(.8) saturate(.9)}.detail-generating{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:1rem;background:#00000080}.detail-spinner{width:48px;height:48px;border:4px solid rgba(255,255,255,.2);border-top-color:var(--adventure-primary, #a78bfa);border-radius:50%;animation:detailSpin 1s linear infinite}@keyframes detailSpin{to{transform:rotate(360deg)}}.detail-generating-text{color:#ffffffb3;font-size:1rem;font-style:italic;margin:0;animation:detailTextPulse 2s ease-in-out infinite}@keyframes detailTextPulse{0%,to{opacity:.7}50%{opacity:1}}.detail-placeholder{width:100%;height:100%}.detail-placeholder.transparent{background:transparent!important}.detail-frame-inner:has(.detail-placeholder.transparent){background:transparent;border-color:#ffffff14;box-shadow:none}@media(max-width:480px){.detail-frame-persistent,.detail-controls-layer{inset:5%}.detail-frame-inner{border-width:3px;border-radius:12px}.detail-carousel-container{border-radius:12px}.detail-nav-arrow{width:32px;height:32px;font-size:1.2rem}.detail-nav-arrow.left{left:.5rem}.detail-nav-arrow.right{right:.5rem}.detail-dots{bottom:.5rem;gap:.4rem}.detail-dot{width:6px;height:6px}.detail-dot.active{width:8px;height:8px}.view-toggle-btn{width:34px;height:34px;font-size:1rem;top:4px;right:4px}}@media(min-width:768px){.detail-frame-persistent,.detail-controls-layer{inset:10%}.detail-frame-inner,.detail-carousel-container{border-radius:20px}.detail-nav-arrow{width:50px;height:50px;font-size:1.8rem}.detail-nav-arrow.left{left:1.5rem}.detail-nav-arrow.right{right:1.5rem}.detail-dots{bottom:1.5rem;gap:.6rem}.detail-dot{width:10px;height:10px}.detail-dot.active{width:12px;height:12px}.view-toggle-btn{width:46px;height:46px;font-size:1.4rem;top:12px;right:12px}}.detail-count-badge{position:absolute;bottom:8px;right:8px;background:#000000b3;color:#ffffffe6;font-size:.7rem;padding:4px 8px;border-radius:12px;pointer-events:none}.fullscreen-gallery-overlay{position:fixed;inset:0;z-index:9999;background:#000000f7;display:flex;align-items:center;justify-content:center;animation:fullscreenFadeIn .3s ease-out}@keyframes fullscreenFadeIn{0%{opacity:0}to{opacity:1}}.fullscreen-close-btn{position:absolute;top:1rem;right:1rem;width:44px;height:44px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:50%;color:#fff;font-size:1.5rem;cursor:pointer;z-index:10;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.fullscreen-close-btn:hover{background:#fff3;transform:scale(1.1)}.fullscreen-image-container{max-width:90%;max-height:85%;display:flex;align-items:center;justify-content:center}.fullscreen-image-container img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;box-shadow:0 0 60px #000c;animation:fullscreenImageZoom .3s ease-out}@keyframes fullscreenImageZoom{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.fullscreen-nav-arrow{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:80px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;font-size:2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:10}.fullscreen-nav-arrow.left{left:1rem;border-radius:8px}.fullscreen-nav-arrow.right{right:1rem;border-radius:8px}.fullscreen-nav-arrow:hover{background:#fff3}.fullscreen-dots{position:absolute;bottom:4rem;left:50%;transform:translate(-50%);display:flex;gap:8px;z-index:10}.fullscreen-dot{width:10px;height:10px;border-radius:50%;border:none;cursor:pointer;transition:all .2s ease}.fullscreen-dot:hover{transform:scale(1.3)}.fullscreen-dot.active{transform:scale(1.2)}.fullscreen-counter{position:absolute;bottom:1.5rem;left:50%;transform:translate(-50%);color:#fff9;font-size:.9rem;z-index:10}.adventure-content.chat-hidden .chat-area,.adventure-content.chat-hidden .input-area{opacity:0;pointer-events:none;transition:opacity .3s ease}.adventure-content.chat-hidden{pointer-events:none}.adventure-content.chat-hidden .location-badge,.adventure-content.chat-hidden .character-bar{pointer-events:auto}.adventure-content .chat-area,.adventure-content .input-area{transition:opacity .3s ease}.audio-enable-overlay{position:absolute;inset:0;z-index:1000;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;cursor:pointer;animation:overlayFadeIn .5s ease-out}@keyframes overlayFadeIn{0%{opacity:0}to{opacity:1}}.audio-enable-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:2rem;text-align:center;animation:contentSlideUp .6s ease-out .2s both}@keyframes contentSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.dm-portrait-large{width:120px;height:120px;border-radius:50%;overflow:hidden;border:3px solid var(--adventure-primary, #a78bfa);box-shadow:0 0 30px var(--adventure-glow, rgba(167, 139, 250, .5));animation:portraitPulse 2s ease-in-out infinite}@keyframes portraitPulse{0%,to{box-shadow:0 0 30px var(--adventure-glow, rgba(167, 139, 250, .5))}50%{box-shadow:0 0 50px var(--adventure-glow, rgba(167, 139, 250, .7))}}.dm-portrait-large img{width:100%;height:100%;object-fit:cover}.dm-greeting{font-size:1.5rem;font-weight:600;color:#fff;margin:0;text-shadow:0 2px 10px rgba(0,0,0,.5)}.audio-enable-hint{font-size:1rem;color:#ffffffb3;margin:0;animation:hintPulse 2s ease-in-out infinite}@keyframes hintPulse{0%,to{opacity:.7}50%{opacity:1}}.audio-enable-icon{font-size:2rem;margin-top:.5rem;animation:iconBounce 1.5s ease-in-out infinite}@keyframes iconBounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.creation-step-indicator{position:absolute;top:-2rem;left:50%;transform:translate(-50%);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;padding:.25rem .75rem;background:#0009;border-radius:1rem;white-space:nowrap}.action-mechanical-info{font-size:.7rem;color:#ffffffb3;text-align:center;line-height:1.2;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.character-portrait.mystery{width:48px;height:48px;border-radius:50%;overflow:hidden;flex-shrink:0}.mystery-portrait{width:100%;height:100%;background:linear-gradient(135deg,#1a1a2e,#2d2d44);border:2px solid rgba(255,255,255,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#ffffff80;font-weight:700}.mystery-avatar{width:100%;height:100%;background:linear-gradient(135deg,#1a1a2e,#2d2d44);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;color:#ffffff80;font-weight:700}.creation-progress{display:flex;align-items:center;gap:.5rem}.creation-step-label{font-size:.75rem;color:#fff9;font-style:italic}.party-panel-container{position:fixed;top:1rem;left:1rem;z-index:50;pointer-events:auto}@media(max-width:768px){.party-panel-container{top:.5rem;left:.5rem}}.character-personality{margin-left:1rem;max-width:180px}@media(max-width:640px){.character-personality{display:none}}@media(min-width:641px)and (max-width:768px){.character-personality{max-width:150px}}@media(min-width:1024px){.character-personality{max-width:200px}}.combat-screen{width:100%;height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#2a1a1a,#1a0a0a);position:relative;overflow:hidden}.battle-arena{flex:1;display:flex;flex-direction:column;justify-content:space-between;padding:1rem}.enemy-side,.player-side{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.enemy-side{padding-top:2rem}.player-side{padding-bottom:1rem}.combatant-card{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:12px;transition:all .3s;min-width:80px}.combatant-card.active{border-color:#fbbf24;box-shadow:0 0 20px #fbbf244d}.combatant-card.defeated{opacity:.4;filter:grayscale(1)}.combatant-card.targetable{cursor:pointer;border-color:#ef4444;animation:targetPulse 1s ease-in-out infinite}.combatant-card.targetable:hover{transform:scale(1.05);box-shadow:0 0 20px #ef444480}@keyframes targetPulse{0%,to{border-color:#ef4444}50%{border-color:#fbbf24}}.combatant-card.enemy{border-color:#ef44444d}.combatant-card.player{border-color:#22c55e4d}.combatant-card.ally{border-color:#818cf84d}.combatant-portrait{width:60px;height:60px;border-radius:50%;overflow:hidden;background:#0000004d}.combatant-portrait img{width:100%;height:100%;object-fit:cover}.portrait-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:2rem}.combatant-info{display:flex;flex-direction:column;align-items:center;gap:.25rem;width:100%}.combatant-name{font-size:.75rem;color:#fff;font-weight:600;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}.combatant-hp-bar{width:100%;height:8px;background:#00000080;border-radius:4px;overflow:hidden;position:relative}.hp-fill{height:100%;border-radius:4px;transition:width .3s ease}.hp-fill.enemy-hp{background:linear-gradient(90deg,#ef4444,#dc2626)}.hp-fill.ally-hp{background:linear-gradient(90deg,#22c55e,#16a34a)}.hp-numbers{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.55rem;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.8)}.round-indicator{position:absolute;top:1rem;right:1rem;background:#0009;padding:.5rem 1rem;border-radius:20px;font-size:.8rem;color:#fffc;border:1px solid rgba(255,255,255,.2)}.dice-roll-display{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:100;display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1.5rem 2rem;background:#000000e6;border:2px solid #fbbf24;border-radius:16px;animation:diceRoll .5s ease-out}@keyframes diceRoll{0%{transform:translate(-50%,-50%) scale(.5) rotate(-180deg);opacity:0}to{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}}.dice{font-size:3rem;animation:diceSpin .5s ease-out}@keyframes diceSpin{0%{transform:rotate(-360deg)}to{transform:rotate(0)}}.roll-result{display:flex;align-items:baseline;gap:.5rem}.roll-number{font-size:2rem;font-weight:700;color:#fff}.roll-modifier{font-size:1rem;color:#22c55e}.roll-total{font-size:1.5rem;font-weight:700;color:#fbbf24}.combat-narrator{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:#0009;border-top:1px solid rgba(255,255,255,.1)}.dm-avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid rgba(129,140,248,.5);flex-shrink:0}.dm-avatar img{width:100%;height:100%;object-fit:cover}.narrator-text{flex:1;color:#ffffffe6;font-size:.9rem;font-style:italic}.action-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;padding:.75rem 1rem;background:#0006}.action-button{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.75rem;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:12px;color:#fff;font-size:.75rem;cursor:pointer;transition:all .2s}.action-button:hover{transform:translateY(-2px);background:#ffffff26}.action-button.attack{border-color:#ef444480}.action-button.attack:hover{border-color:#ef4444;box-shadow:0 4px 15px #ef44444d}.action-button.defend{border-color:#818cf880}.action-button.defend:hover{border-color:#818cf8;box-shadow:0 4px 15px #818cf84d}.action-button.item{border-color:#22c55e80}.action-button.item:hover{border-color:#22c55e;box-shadow:0 4px 15px #22c55e4d}.action-button.flee{border-color:#fbbf2480}.action-button.flee:hover{border-color:#fbbf24;box-shadow:0 4px 15px #fbbf244d}.action-icon{font-size:1.5rem}.combat-log{display:flex;flex-direction:column;gap:.25rem;padding:.5rem 1rem;background:#0009;max-height:120px;overflow-y:auto}.log-entry{font-size:.75rem;padding:.25rem .5rem;border-radius:4px;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.log-entry.attack{color:#ffffffe6}.log-entry.damage{color:#ef4444;background:#ef44441a}.log-entry.miss{color:#ffffff80}.log-entry.heal{color:#22c55e;background:#22c55e1a}.log-entry.info{color:#818cf8}.log-entry.critical{color:#fbbf24;background:#fbbf241a;font-weight:700}@media(max-width:640px){.combatant-card{min-width:70px;padding:.5rem}.combatant-portrait{width:50px;height:50px}.combatant-name{font-size:.65rem;max-width:60px}.action-button{padding:.5rem;font-size:.7rem}.action-icon{font-size:1.25rem}.narrator-text{font-size:.8rem}}@media(prefers-reduced-motion:reduce){.combatant-card,.action-button,.dice,.dice-roll-display{transition:none;animation:none}@keyframes targetPulse{0%,to{border-color:#ef4444}}}.audio-control-panel{position:fixed;top:1rem;right:1rem;z-index:10000;display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}.audio-main-button{width:48px;height:48px;border-radius:50%;background:#0009;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.25rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 15px #0000004d}.audio-main-button:hover{background:#000c;transform:scale(1.05);border-color:#fff6}.audio-main-button:active{transform:scale(.95)}.audio-control-panel.expanded .audio-main-button{background:#ffffff26}.audio-panel-content{background:#000000d9;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:.75rem;display:flex;flex-direction:column;gap:.5rem;min-width:180px;box-shadow:0 8px 32px #0006;animation:panelSlideIn .2s ease-out}@keyframes panelSlideIn{0%{opacity:0;transform:translateY(-10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.audio-panel-header{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#ffffff80;padding:.25rem .5rem;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:.25rem}.audio-toggle{display:flex;align-items:center;gap:.75rem;padding:.625rem .75rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:10px;color:#ffffffb3;cursor:pointer;transition:all .2s ease;width:100%;text-align:left}.audio-toggle:hover{background:#ffffff1a;border-color:#fff3}.audio-toggle.active{background:#22c55e26;border-color:#22c55e4d;color:#fff}.audio-toggle.active:hover{background:#22c55e40}.toggle-icon{font-size:1.1rem;width:24px;text-align:center}.toggle-label{flex:1;font-size:.875rem;font-weight:500}.toggle-status{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:.2rem .4rem;border-radius:4px;background:#ffffff1a}.toggle-status.on{background:#22c55e4d;color:#4ade80}.toggle-status.off{background:#ef444433;color:#f87171}.volume-slider-container{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#ffffff08;border-radius:8px;margin-top:-.25rem}.volume-label{font-size:.75rem;color:#ffffff80;min-width:45px}.volume-slider{flex:1;height:4px;-webkit-appearance:none;appearance:none;background:#fff3;border-radius:2px;cursor:pointer}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#4ade80;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;box-shadow:0 2px 6px #0000004d}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 2px 8px #4ade8066}.volume-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#4ade80;cursor:pointer;border:none;transition:transform .15s ease}.volume-slider::-moz-range-thumb:hover{transform:scale(1.2)}.volume-value{font-size:.7rem;font-weight:600;color:#fff9;min-width:32px;text-align:right}@media(min-width:768px){.audio-control-panel{top:1.5rem;right:1.5rem}.audio-main-button{width:52px;height:52px}.audio-panel-content{min-width:200px}}@media(prefers-reduced-motion:reduce){.audio-panel-content{animation:none}.audio-main-button,.audio-toggle{transition:none}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#0f0f1a;color:#fff;min-height:100vh;overflow-x:hidden}#root{width:100%;min-height:100vh}.app{width:100%;min-height:100vh;position:relative}.screen{width:100%;min-height:100vh;display:flex;flex-direction:column}.screen.placeholder{justify-content:center;align-items:center;text-align:center;padding:2rem;background:linear-gradient(180deg,#1a1a2e,#0f0f1a)}.screen.placeholder h1{font-size:1.75rem;margin-bottom:1rem;color:#fff}.screen.placeholder p{color:#fff9;margin-bottom:2rem}.screen.placeholder button{padding:1rem 2rem;background:linear-gradient(135deg,#818cf8,#6366f1);border:none;border-radius:12px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.screen.placeholder button:hover{transform:translateY(-2px);box-shadow:0 4px 15px #818cf866}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}p{line-height:1.6}a{color:#818cf8;text-decoration:none;transition:color .2s}a:hover{color:#a5b4fc}button{font-family:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}img{max-width:100%;height:auto;display:block}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#ffffff0d}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}::selection{background:#818cf84d;color:#fff}:focus-visible{outline:2px solid #818cf8;outline-offset:2px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.text-center{text-align:center}.flex-center{display:flex;align-items:center;justify-content:center}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fadeIn{animation:fadeIn .3s ease-out}.animate-slideUp{animation:slideUp .3s ease-out}.animate-slideDown{animation:slideDown .3s ease-out}.animate-pulse{animation:pulse 2s ease-in-out infinite}@media(min-width:640px){html{font-size:17px}}@media(min-width:768px){html{font-size:18px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.auth-gate{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);z-index:9999}.auth-container{background:#0009;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;border:1px solid rgba(255,255,255,.1);padding:2.5rem;max-width:400px;width:90%;text-align:center;box-shadow:0 20px 60px #00000080}.auth-logo h1{font-size:2.5rem;color:#fff;margin:0;font-family:Georgia,serif;text-shadow:0 2px 10px rgba(255,215,0,.3)}.auth-tagline{color:#fff9;font-size:1rem;margin-top:.5rem}.auth-content{margin-top:2rem}.auth-content h2{color:#fff;font-size:1.5rem;margin-bottom:.5rem}.auth-content p{color:#ffffffb3;font-size:.95rem;margin-bottom:1.5rem}.google-signin-btn{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:14px 24px;background:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:500;color:#333;cursor:pointer;transition:all .2s ease}.google-signin-btn:hover{background:#f5f5f5;transform:translateY(-2px);box-shadow:0 4px 12px #0003}.google-signin-btn svg{flex-shrink:0}.auth-footer{margin-top:2rem;color:#fff6;font-size:.85rem}.auth-loading{display:flex;flex-direction:column;align-items:center;gap:1rem;color:#ffffffb3}.loading-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top-color:gold;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.user-info{background:#ffffff1a;padding:.75rem 1rem;border-radius:8px;margin-bottom:1.5rem}.user-info p{margin:0;color:#fffc}.invite-form{display:flex;flex-direction:column;gap:1rem}.invite-input{padding:14px 16px;font-size:1.2rem;text-align:center;letter-spacing:2px;font-family:monospace;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;outline:none;transition:border-color .2s}.invite-input:focus{border-color:gold}.invite-input::placeholder{color:#ffffff4d}.invite-error{color:#ff6b6b;font-size:.9rem;margin:0}.submit-btn{padding:14px 24px;background:linear-gradient(135deg,gold,#fa0);border:none;border-radius:8px;font-size:1rem;font-weight:600;color:#1a1a2e;cursor:pointer;transition:all .2s ease}.submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #ffd70066}.submit-btn:disabled{opacity:.5;cursor:not-allowed}.signout-link{margin-top:1.5rem;background:none;border:none;color:#ffffff80;font-size:.85rem;cursor:pointer;text-decoration:underline}.signout-link:hover{color:#fffc}.auth-divider{display:flex;align-items:center;margin:1.5rem 0;gap:1rem}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:#fff3}.auth-divider span{color:#ffffff80;font-size:.85rem;text-transform:uppercase;letter-spacing:1px}.waitlist-toggle-btn{width:100%;padding:14px 24px;background:transparent;border:2px solid rgba(255,255,255,.3);border-radius:8px;font-size:1rem;font-weight:500;color:#fffc;cursor:pointer;transition:all .2s ease}.waitlist-toggle-btn:hover{border-color:#ffffff80;background:#ffffff0d;color:#fff}.text-link{background:none;border:none;color:#ffffff80;font-size:.9rem;cursor:pointer;text-decoration:underline;margin-top:1rem}.text-link:hover{color:#fffc}.waitlist-form{display:flex;flex-direction:column;gap:1rem}.waitlist-input{padding:14px 16px;font-size:1rem;text-align:center;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;outline:none;transition:border-color .2s}.waitlist-input:focus{border-color:gold}.waitlist-input::placeholder{color:#ffffff4d}.waitlist-error{color:#ff6b6b;font-size:.9rem;margin:0}.waitlist-status{text-align:center}.waitlist-success-icon{width:60px;height:60px;margin:0 auto 1rem;background:linear-gradient(135deg,#4ade80,#22c55e);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;color:#fff}.waitlist-code-box{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:1rem;margin:1.5rem 0}.code-label{display:block;color:#ffffff80;font-size:.8rem;text-transform:uppercase;letter-spacing:1px;margin-bottom:.5rem}.code-value{display:block;font-size:1.5rem;font-family:monospace;font-weight:700;color:#fff;letter-spacing:2px}.code-status{display:inline-block;margin-top:.75rem;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:500}.code-status.inactive{background:#ffffff1a;color:#fff9}.code-status.active{background:linear-gradient(135deg,#4ade80,#22c55e);color:#fff;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.waitlist-active-notice{margin-top:1.5rem}.waitlist-active-notice p{color:#4ade80;font-weight:500;margin-bottom:1rem}.waitlist-pending-notice{color:#fff9;font-style:italic}