@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#080b12;--panel:#101622;--panel2:#151e2c;--text:#f4f7fb;--muted:#9ca9ba;--cyan:#55f2dc;--purple:#9b7bff;--line:#283244}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse at 75% 0%,#17203b 0,transparent 40%),var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;min-height:100vh}.app-shell{max-width:1500px;margin:auto;padding:0 5.2%}.topbar{height:86px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #202939;gap:24px}.brand{display:flex;align-items:center;gap:12px;font:700 17px 'Space Grotesk',sans-serif;letter-spacing:2px}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;color:#071211;background:linear-gradient(135deg,var(--cyan),#89a9ff);font-size:20px}.accent{color:var(--cyan)}nav{display:flex;gap:10px}.nav-btn,.secondary-btn,.time-btn,.mood-btn{background:transparent;color:#b7c2d1;border:1px solid transparent;border-radius:12px;padding:11px 16px;font:600 14px 'DM Sans',sans-serif;cursor:pointer}.nav-btn.selected{background:#172230;color:var(--text);border-color:#304052}.nav-btn span{font-size:11px;background:#263747;padding:3px 7px;border-radius:20px;margin-left:5px}.status{font-size:10px;letter-spacing:1.7px;color:#aab6c6;display:flex;align-items:center;gap:8px}.live-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}main{padding-bottom:26px}.hero{min-height:380px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:36px;padding:46px 0 38px}.eyebrow{font-size:10px;letter-spacing:2.4px;font-weight:700;color:var(--cyan);margin:0 0 13px}.hero h1{font:600 clamp(38px,4.5vw,65px)/1.03 'Space Grotesk',sans-serif;letter-spacing:-2px;margin:0}.gradient-text{background:linear-gradient(90deg,var(--cyan),#a2a7ff 70%);color:transparent;background-clip:text}.hero-desc{max-width:500px;color:var(--muted);font-size:15px;line-height:1.7;margin:20px 0 24px}.hero-actions{display:flex;gap:12px}.primary-btn{background:var(--cyan);color:#061211;border:0;border-radius:12px;padding:14px 19px;font-weight:700;cursor:pointer}.secondary-btn{border-color:#354255;color:#e5ebf4}.trust-row{display:flex;gap:22px;flex-wrap:wrap;color:#8997a9;font-size:11px;margin-top:28px}.hero-art{height:300px;position:relative;display:grid;place-items:center;overflow:hidden;border-radius:28px;background:radial-gradient(circle at 50% 45%,#4a3c83 0,#22264b 28%,#101826 62%,#0b1019 100%);border:1px solid #34405a}.hero-art:before,.hero-art:after{content:"";position:absolute;width:250px;height:250px;border-radius:50%;border:1px solid #7c8bff55;transform:rotate(-30deg) scaleX(1.6)}.hero-art:after{transform:rotate(55deg) scaleX(1.4);width:200px;height:200px;border-color:#55f2dc55}.orbit{position:absolute;border:1px solid #b4a4ff4d;border-radius:50%;width:340px;height:110px;transform:rotate(-35deg)}.orbit-two{transform:rotate(45deg);width:300px;border-color:#55f2dc44}.glass-card{position:relative;z-index:2;width:205px;height:218px;border:1px solid #ffffff44;border-radius:20px;background:linear-gradient(145deg,#ffffff24,#ffffff08);backdrop-filter:blur(10px);box-shadow:0 25px 80px #0008;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;text-align:center}.glass-card span{font-size:8px;letter-spacing:1.8px;color:#c5c9e6}.glass-card strong{font:600 19px/1.25 'Space Grotesk';letter-spacing:1px}.play-symbol{width:53px;height:53px;display:grid;place-items:center;padding-left:4px;border-radius:50%;background:linear-gradient(135deg,var(--cyan),#9e91ff);color:#101526;font-size:20px;box-shadow:0 0 30px #55f2dc55}.floating-chip{position:absolute;z-index:3;font-size:9px;letter-spacing:1px;padding:10px 13px;background:#131b2bdd;border:1px solid #ffffff20;border-radius:10px;color:#dbe6f3}.chip-top{top:37px;right:25px}.chip-bottom{bottom:32px;left:20px}.controls-panel,.recommendations{border-top:1px solid #222d3c;padding:28px 0}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:20px}.section-heading h2,.info-panel h2{font:600 24px 'Space Grotesk';margin:0;letter-spacing:-.6px}.small-note{font-size:11px;color:#77869a}.mood-row{display:flex;gap:10px;flex-wrap:wrap}.mood-btn{background:#111824;border-color:#263143;padding:13px 18px;min-width:130px;text-align:left;font-size:17px;color:var(--cyan)}.mood-btn span{color:#dbe2ec;font-size:13px;margin-left:8px}.mood-btn.active,.time-btn.active{border-color:var(--cyan);background:#12302f;color:var(--cyan)}.time-row{display:flex;align-items:center;gap:9px;margin-top:20px;flex-wrap:wrap}.time-label{font-size:10px;letter-spacing:1.7px;color:#7f8da0;margin-right:7px}.time-btn{border-color:#2b3547;padding:9px 14px}.results-count{margin-left:auto;color:#8c9bae;font-size:12px}.content-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.content-card{position:relative;min-height:180px;border:1px solid #263244;border-radius:18px;overflow:hidden;padding:19px;background:linear-gradient(135deg,var(--card-color,#19253a),#101620 72%);transition:transform .18s,border-color .18s;cursor:pointer;outline:none}.content-card:before{content:"";position:absolute;right:-22px;top:-34px;width:150px;height:150px;border-radius:50%;background:var(--glow,#55f2dc);opacity:.13;filter:blur(5px)}.content-card:after{content:attr(data-symbol);position:absolute;right:17px;top:18px;font-size:55px;color:#ffffff22;font-family:'Space Grotesk'}.card-top{display:flex;gap:8px;align-items:center;position:relative;z-index:1}.category-tag{font-size:9px;letter-spacing:1.2px;text-transform:uppercase;color:var(--cyan);background:#0b111ba8;padding:6px 8px;border-radius:6px}.duration{font-size:10px;color:#b6c2d2}.content-card h3{position:relative;z-index:1;font:600 20px 'Space Grotesk';margin:18px 0 7px}.content-card p{position:relative;z-index:1;font-size:12px;color:#aab7c8;line-height:1.5;margin:0;max-width:86%}.card-bottom{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;margin-top:17px;font-size:10px;color:#8292a7}.save-btn{border:1px solid #435066;background:#101824;color:#e4ebf5;border-radius:9px;padding:7px 10px;cursor:pointer}.save-btn.saved{color:var(--cyan);border-color:#397a72}.focusable:focus-visible,.nav-btn:focus-visible,.mood-btn:focus-visible,.time-btn:focus-visible,.content-card:focus-visible,.save-btn:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}.content-card:focus-within,.content-card:focus{border-color:var(--cyan);transform:translateY(-3px)}.empty-state{text-align:center;padding:40px 20px;color:var(--muted)}.empty-icon{font-size:38px;color:var(--cyan)}.empty-state h3{color:var(--text)}.hidden{display:none!important}.info-panel{position:relative;border:1px solid #2d3a50;background:#101824;border-radius:20px;padding:30px;margin:10px 0 30px;max-width:800px}.info-panel p:not(.eyebrow){color:#a9b7c9;line-height:1.8}.close-btn{position:absolute;right:18px;top:18px;background:#202b3c;color:white;border:0;border-radius:8px;padding:8px;cursor:pointer}.info-pills{display:flex;gap:9px;flex-wrap:wrap}.info-pills span{border:1px solid #304053;border-radius:20px;padding:8px 12px;color:#b9c7d8;font-size:11px}footer{border-top:1px solid #202a39;padding:21px 0;display:flex;justify-content:space-between;gap:15px;color:#758398;font-size:9px;letter-spacing:1.2px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:#e9fff9;color:#0c201e;padding:12px 18px;border-radius:12px;font-size:13px;font-weight:700;opacity:0;pointer-events:none;transition:.2s;box-shadow:0 10px 35px #0008;z-index:10}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:800px){.app-shell{padding:0 22px}.topbar{height:auto;min-height:75px;flex-wrap:wrap;padding:15px 0}.status{display:none}.hero{grid-template-columns:1fr;padding:35px 0}.hero-art{height:240px}.content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-heading{align-items:start;flex-direction:column}.results-count{margin-left:0}}@media(max-width:520px){nav{width:100%;order:3}.content-grid{grid-template-columns:1fr}.mood-btn{flex:1;min-width:120px}.hero h1{font-size:42px}footer{flex-direction:column}.trust-row{gap:12px}}

/* Minimal team credits at the bottom */
.team-section {
  padding: 12px 16px 18px;
  text-align: center;
  color: #858593;
  background: transparent;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  margin-top: 48px;
}

.team-section h2 {
  font-family: Georgia, serif;
  font-size: 13px;
  font-weight: 400;
  font-style: italic;
  letter-spacing: 1.5px;
  color: #c7c7d2;
  margin: 0 0 8px;
}

.team-section > p {
  font-size: 10px;
  margin: 0 0 8px;
  color: #777786;
}

.team-members {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 18px;
}

.team-member {
  width: auto;
  padding: 0;
  border: none;
  background: transparent;
}

.team-member h3 {
  font-family: Georgia, serif;
  font-size: 11px;
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0.4px;
  margin: 0 0 3px;
  color: #dedee8;
}

.team-member p {
  font-size: 9px;
  margin: 0;
  color: #777786;
}