@import"https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700;900&family=Crimson+Pro:ital,wght@0,300;0,400;0,600;1,400&display=swap";body{margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--bg-deep: #0d0a08;--bg-warm: #1a1411;--bg-card: #241d18;--curtain-red: #8b2635;--curtain-dark: #5c1a24;--gold: #d4a857;--gold-bright: #f0c970;--gold-dim: #9a7832;--cream: #f5e6d3;--cream-dim: #c9b8a1;--spotlight: #fff8e7;--shadow: rgba(0, 0, 0, .6);--serious: #2d4a5e;--silly: #e8a838;--grounded: #3d6b4f;--absurd: #9b4dca;font-family:Crimson Pro,Georgia,serif}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg-deep);color:var(--cream);overflow-x:hidden}.app:before{content:"";position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:1000}.app{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 0%,rgba(139,38,53,.15) 0%,transparent 50%),radial-gradient(ellipse at 20% 80%,rgba(212,168,87,.08) 0%,transparent 40%),radial-gradient(ellipse at 80% 80%,rgba(212,168,87,.08) 0%,transparent 40%),linear-gradient(180deg,var(--bg-deep) 0%,var(--bg-warm) 100%)}.intro-overlay{position:fixed;inset:0;background:var(--bg-deep);display:flex;align-items:center;justify-content:center;z-index:100}.intro-content{text-align:center}.intro-content h1{font-family:Playfair Display,serif;font-size:4rem;font-weight:900;color:var(--gold);text-shadow:0 0 60px rgba(212,168,87,.5),0 4px 0 var(--gold-dim);letter-spacing:.05em}.intro-content p{font-style:italic;font-size:1.3rem;color:var(--cream-dim);margin-top:.5rem}.header{text-align:center;padding:2rem 1rem 1rem;position:relative}.header:after{content:"";display:block;width:200px;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:1rem auto 0}.header h1{font-family:Playfair Display,serif;font-size:2.5rem;font-weight:900;color:var(--gold);text-shadow:0 2px 0 var(--gold-dim);letter-spacing:.03em}.tagline{font-style:italic;color:var(--cream-dim);font-size:1.1rem;margin-top:.25rem}.main{flex:1;display:grid;grid-template-columns:1fr 1.2fr;gap:2rem;padding:1.5rem 2rem;max-width:1400px;margin:0 auto;width:100%}@media(max-width:900px){.main{grid-template-columns:1fr;padding:1rem}}.controls-section{display:flex;flex-direction:column;gap:1.5rem}.vibe-control h2{font-family:Playfair Display,serif;font-size:1.1rem;color:var(--gold);text-transform:uppercase;letter-spacing:.15em;margin-bottom:1rem;text-align:center}.vibe-wheel-container{position:relative;width:280px;height:280px;margin:0 auto}.vibe-wheel-labels{position:absolute;inset:0;pointer-events:none}.vibe-wheel-labels span{position:absolute;font-family:Playfair Display,serif;font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}.label-top{top:-8px;left:50%;transform:translate(-50%);color:var(--absurd)}.label-bottom{bottom:-8px;left:50%;transform:translate(-50%);color:var(--grounded)}.label-left{left:-12px;top:50%;transform:translateY(-50%) rotate(-90deg);color:var(--serious)}.label-right{right:-12px;top:50%;transform:translateY(-50%) rotate(90deg);color:var(--silly)}.vibe-wheel{position:absolute;inset:20px;border-radius:50%;cursor:crosshair;overflow:hidden;box-shadow:inset 0 0 30px #00000080,0 0 0 3px var(--gold-dim),0 0 0 6px var(--bg-card),0 0 20px #00000080}.vibe-wheel.dragging{cursor:grabbing}.wheel-gradient{position:absolute;inset:0;background:conic-gradient(from 180deg,var(--grounded) 0deg,var(--serious) 90deg,var(--absurd) 180deg,var(--silly) 270deg,var(--grounded) 360deg);opacity:.6}.wheel-grid{position:absolute;inset:0}.grid-line{position:absolute;background:#f5e6d326}.grid-line.horizontal{left:0;right:0;top:50%;height:1px}.grid-line.vertical{top:0;bottom:0;left:50%;width:1px}.wheel-indicator{position:absolute;width:28px;height:28px;background:radial-gradient(circle at 30% 30%,var(--gold-bright),var(--gold));border:3px solid var(--cream);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 15px #d4a85799,0 4px 8px #0006;z-index:10}.wheel-center-dot{position:absolute;top:50%;left:50%;width:8px;height:8px;background:var(--cream-dim);border-radius:50%;transform:translate(-50%,-50%);opacity:.5}.dial-controls{display:flex;justify-content:center;gap:2rem}.dial-container{text-align:center}.dial-label{font-family:Playfair Display,serif;font-size:.8rem;color:var(--gold);text-transform:uppercase;letter-spacing:.15em;margin-bottom:.75rem}.dial{width:80px;height:80px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#3a302a,#1a1411);box-shadow:inset 0 2px 4px #ffffff1a,inset 0 -2px 4px #0000004d,0 0 0 3px var(--gold-dim),0 4px 12px #00000080;cursor:ns-resize;position:relative;margin:0 auto}.dial.dragging{cursor:grabbing}.dial-track{position:absolute;inset:0}.dial-tick{position:absolute;top:6px;left:50%;width:2px;height:6px;background:var(--cream-dim);transform-origin:center 34px;opacity:.4}.dial-knob{position:absolute;inset:10px;border-radius:50%;background:radial-gradient(circle at 40% 40%,#4a3d35,#2a211a);box-shadow:inset 0 1px 2px #ffffff1a,0 2px 4px #0000004d}.dial-indicator{position:absolute;top:4px;left:50%;width:4px;height:12px;background:var(--gold);border-radius:2px;transform:translate(-50%);box-shadow:0 0 6px #d4a85780}.dial-value{margin-top:.5rem;font-size:.9rem;color:var(--cream-dim);font-variant-numeric:tabular-nums}.scene-starter{background:var(--bg-card);border:1px solid rgba(212,168,87,.2);border-radius:12px;padding:1.25rem;text-align:center;position:relative;overflow:hidden}.scene-starter:before{content:'"';position:absolute;top:-20px;left:10px;font-family:Playfair Display,serif;font-size:6rem;color:var(--curtain-red);opacity:.15;line-height:1}.starter-label{font-family:Playfair Display,serif;font-size:.7rem;color:var(--gold);text-transform:uppercase;letter-spacing:.2em;margin-bottom:.75rem}.starter-content{font-size:1.1rem;font-style:italic;line-height:1.5;color:var(--cream);position:relative;z-index:1}.starter-refresh{margin-top:1rem;padding:.5rem 1.25rem;background:transparent;border:1px solid var(--gold-dim);border-radius:20px;color:var(--gold);font-family:Crimson Pro,serif;font-size:.9rem;cursor:pointer;transition:all .2s ease}.starter-refresh:hover{background:#d4a8571a;border-color:var(--gold)}.suggestions-section{display:flex;flex-direction:column;gap:1rem}.category-tabs{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.category-btn{display:flex;align-items:center;gap:.4rem;padding:.5rem 1rem;background:var(--bg-card);border:1px solid rgba(212,168,87,.15);border-radius:25px;color:var(--cream-dim);font-family:Crimson Pro,serif;font-size:.9rem;cursor:pointer;transition:all .2s ease;text-transform:capitalize}.category-btn:hover{border-color:var(--gold-dim);color:var(--cream)}.category-btn.active{background:linear-gradient(135deg,var(--curtain-dark),var(--curtain-red));border-color:var(--gold);color:var(--cream);box-shadow:0 0 15px #8b263566}.category-icon{font-size:1.1rem}.category-name{font-weight:600}.suggestions-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}@media(max-width:600px){.suggestions-grid{grid-template-columns:1fr}}.suggestion-wrapper{cursor:pointer}.suggestion-card{background:var(--bg-card);border:1px solid rgba(212,168,87,.15);border-radius:12px;padding:1.25rem;position:relative;transition:all .2s ease;perspective:1000px}.suggestion-card:hover{border-color:var(--gold-dim);transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.card-category{font-family:Playfair Display,serif;font-size:.65rem;color:var(--gold);text-transform:uppercase;letter-spacing:.2em;margin-bottom:.5rem}.card-content{font-size:1.2rem;font-weight:600;color:var(--cream);line-height:1.3;min-height:2.6em;display:flex;align-items:center}.refresh-btn{position:absolute;top:.75rem;right:.75rem;width:28px;height:28px;border-radius:50%;background:#d4a8571a;border:1px solid rgba(212,168,87,.2);color:var(--gold);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.refresh-btn:hover{background:#d4a85733;border-color:var(--gold)}.generate-all-btn{margin-top:.5rem;padding:.9rem 2rem;background:linear-gradient(135deg,var(--curtain-dark),var(--curtain-red));border:2px solid var(--gold);border-radius:30px;color:var(--cream);font-family:Playfair Display,serif;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px #8b263566,inset 0 1px #ffffff1a}.generate-all-btn:hover{box-shadow:0 6px 20px #8b263580,inset 0 1px #ffffff1a,0 0 20px #d4a8574d}.favorites-bar{background:var(--bg-card);border-top:1px solid rgba(212,168,87,.2);padding:1rem 2rem}.favorites-label{font-family:Playfair Display,serif;font-size:.7rem;color:var(--gold);text-transform:uppercase;letter-spacing:.2em;margin-bottom:.75rem;text-align:center}.favorites-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;max-width:900px;margin:0 auto}@media(max-width:600px){.favorites-slots{grid-template-columns:repeat(2,1fr)}}.favorite-slot{border-radius:8px;padding:.75rem;min-height:60px;position:relative}.favorite-slot.empty{border:1px dashed rgba(212,168,87,.2);display:flex;align-items:center;justify-content:center}.favorite-hint{font-size:.75rem;color:var(--cream-dim);opacity:.5}.favorite-slot.filled{background:#8b263533;border:1px solid rgba(212,168,87,.3)}.favorite-category{font-size:.6rem;color:var(--gold);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.25rem}.favorite-content{font-size:.85rem;color:var(--cream);font-weight:600;line-height:1.2}.favorite-clear{position:absolute;top:4px;right:4px;width:18px;height:18px;border-radius:50%;background:#0000004d;border:none;color:var(--cream-dim);font-size:.9rem;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}.favorite-slot.filled:hover .favorite-clear{opacity:1}.favorite-clear:hover{background:#00000080;color:var(--cream)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-deep)}::-webkit-scrollbar-thumb{background:var(--gold-dim);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--gold)}::selection{background:var(--curtain-red);color:var(--cream)}
