:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f5f3ff;background:#0c1020;font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:#9fe4ff}button,input,select,textarea{font:inherit}button{cursor:pointer}header{border-bottom:1px solid #30364b;background:#11162b}nav{max-width:1140px;margin:auto;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}nav .brand{font-weight:800;color:#fff;font-size:1.25rem;text-decoration:none}nav .links{display:flex;gap:22px}nav .links a{color:#cad1e9;text-decoration:none}.shell{max-width:1140px;margin:auto;padding:50px 24px 80px}.eyebrow{color:#a5b4fc;text-transform:uppercase;letter-spacing:.16em;font-size:.74rem;font-weight:700}h1{font-size:clamp(2.25rem,6vw,4.4rem);line-height:1.05;margin:12px 0 18px;letter-spacing:-.045em}h2{font-size:1.4rem;line-height:1.3;margin-top:0}p{color:#c2c9de;line-height:1.65}.intro{max-width:760px;font-size:1.1rem}.chips{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 30px}.chip{border:1px solid #3a465b;padding:6px 11px;border-radius:40px;font-size:.78rem;color:#c5f0ff}.panel{background:#171e34;border:1px solid #303b56;border-radius:18px;padding:24px;margin:22px 0}.grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.field{display:flex;flex-direction:column;gap:7px;color:#e8e9f1;font-size:.87rem;margin-bottom:14px}input,select,textarea{border-radius:10px;border:1px solid #46516d;background:#0f172d;color:#fff;padding:12px 14px;width:100%;outline-offset:2px}textarea{min-height:270px;resize:vertical;line-height:1.8}button{border:1px solid #64748b;border-radius:10px;padding:11px 16px;background:#233149;color:white;font-weight:650}button.primary{background:#7c6ef6;border-color:#a69bff;color:#fff}button:disabled{opacity:.5;cursor:not-allowed}button:hover:not(:disabled){filter:brightness(1.15)}.status{min-height:24px;color:#9ce4c5;font-size:.9rem}.muted{color:#a9b6cb;font-size:.88rem}.results{display:grid;grid-template-columns:1fr 1fr;gap:20px}.result-list{display:flex;gap:8px;flex-wrap:wrap;min-height:44px}.result-list button{padding:8px 11px;background:#263249;font-size:.87rem}.section{max-width:880px;padding-top:18px;margin-top:28px;border-top:1px solid #303b56}.section h2{margin:0 0 9px}.section p{margin:0 0 13px}.bars{background:#0f172d;color:#eef4ff;white-space:pre-wrap;font-family:inherit}.footer{border-top:1px solid #303b56;padding:30px 24px;text-align:center;color:#9aa7bd;font-size:.85rem}.sr-only{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}@media(max-width:760px){.shell{padding-top:32px}.controls,.grid,.results{grid-template-columns:1fr}.panel{padding:17px}.links{gap:12px!important}nav{padding:16px}.row button{flex-grow:1}}
/* Group pronunciation suggestions without hiding other syllable lengths. */
.syllable-group{padding:14px 0;border-top:1px solid #34415d}
.syllable-group:first-child{border-top:0;padding-top:2px}
.syllable-group h3{margin:0 0 10px;color:#d5dcf5;font-size:.95rem;font-weight:700}
.syllable-group .result-list{min-height:0;margin-bottom:2px}

#analytics-choice{position:fixed;bottom:16px;left:16px;right:16px;max-width:650px;margin:auto;z-index:100;background:#1c2640;color:#fff;border:1px solid #69799a;box-shadow:0 10px 36px #0008;border-radius:14px;padding:16px}#analytics-choice p{margin:0 0 12px;color:#e5ebfc}#analytics-choice .row button{flex:1}#analytics-choice a{color:#a8e8ff}

/* RAPLYRICS / STUDIO visual system — keeps static SEO content and existing controls intact */
:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:#090d10;color:#f6f8f4;--acid:#d5fa48;--line:#293237;--muted:#a8b5bd}
body{background:radial-gradient(ellipse 70% 360px at 74% 4%,#1a2530 0%,transparent 82%),#090d10;color:#f6f8f4}
header{background:#0a0e11eF;border-bottom:1px solid #242b31;position:relative;z-index:2}
nav{max-width:1380px}nav .brand{font-weight:900;letter-spacing:-.06em;font-size:1.43rem}nav .brand span{color:var(--acid)!important}nav .links a{font-size:.91rem;font-weight:650;color:#c5cbd0}nav .links a:hover{color:var(--acid)}
a{color:#d8fc61}a:hover{text-decoration-color:var(--acid)}
.shell{max-width:1380px;padding:38px 26px 90px}
.studio-hero{position:relative;padding:36px 12px 25px;border-radius:24px;background:radial-gradient(ellipse 45% 110% at 81% 55%,#17202c8a,transparent),linear-gradient(115deg,#0d1419,#101719);border:1px solid #222c30;margin-bottom:20px;overflow:hidden}
.studio-hero:after{content:"◉";position:absolute;right:8%;top:0;opacity:.07;font-size:260px;line-height:1;pointer-events:none}
.studio-hero .eyebrow{padding:0 24px;color:#a99aff;font-weight:800;letter-spacing:.17em}
.studio-hero .eyebrow strong{color:var(--acid)}
.hero-display{font-weight:950;letter-spacing:-.07em;font-size:clamp(3rem,8vw,7rem);line-height:.92;margin:18px 24px 8px;color:#fff;max-width:910px}
.hero-display span{color:var(--acid)}
.studio-hero h1{font-size:clamp(1.05rem,2vw,1.55rem);letter-spacing:0;font-weight:700;color:#d5dde0;margin:21px 24px 6px}
.studio-hero .intro{font-size:1.03rem;margin:5px 24px 8px;color:#aebbc5}
.studio-hero .chips{margin:20px 24px 4px}
.chip{background:#172024;border:1px solid #34413b;color:#d7e3ca;text-transform:uppercase;letter-spacing:.07em}
.panel{background:#11191e;border:1px solid #2c363c;box-shadow:0 10px 30px #0002;border-radius:16px}
.studio-controls{margin-top:16px}
.studio-panel-kicker{font-size:.69rem;color:var(--acid);font-weight:900;letter-spacing:.18em;margin-bottom:14px}
h2{font-weight:850;letter-spacing:-.035em;color:#f5f9fb}
.field{color:#aebcc8;font-size:.81rem;font-weight:650;letter-spacing:.01em}
input,select,textarea{background:#0d151a;color:#f7fcfd;border:1px solid #334149;border-radius:9px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--acid);outline-offset:2px;border-color:#a6c637}
button{border:1px solid #394850;background:#1c292f;color:#f1f9fd;border-radius:9px;transition:background .15s ease,transform .15s ease}
button.primary{background:var(--acid);border-color:var(--acid);color:#0b1414;font-weight:900;letter-spacing:.04em;padding:14px 25px}
button:hover:not(:disabled){filter:none;background:#344148}
button.primary:hover:not(:disabled){background:#e6ff81}
button:active:not(:disabled){transform:translateY(1px)}
.studio-workspace{grid-template-columns:minmax(0,1.65fr) minmax(315px,1fr);align-items:stretch;gap:14px}
.studio-workspace .panel{margin-top:4px}
.verse-panel h2{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.verse-tag{font-size:.63rem;color:#a6a0f8;border:1px solid #43405b;letter-spacing:.13em;border-radius:30px;padding:6px 10px}
.verse-panel textarea{min-height:375px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.92rem;line-height:2;background:repeating-linear-gradient(to bottom,#0d151a 0,#0d151a 31px,#1f2b30 32px);border-color:#2f3c42;padding:16px 18px;tab-size:2}
.verse-panel .row{margin-top:17px}
.rhyme-panel h3{font-size:1rem;color:#e3eaeb}
.rhyme-quick{border:1px solid #293840;background:#0c1419;border-radius:12px;padding:14px;margin:15px 0 20px}
.rhyme-quick input{margin-bottom:10px}
.rhyme-quick button{width:100%;border-color:#d5fa48;color:#d5fa48}
.studio-quick-links{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:none;margin:12px 0 44px;padding:0}
.studio-quick-links a{border:1px solid #29363b;border-radius:14px;padding:22px;background:#11181d;color:#fff;text-decoration:none;display:flex;flex-direction:column;gap:8px;min-width:0}
.studio-quick-links a:hover{border-color:#c8eb4a;background:#162124}
.studio-quick-links span{color:var(--acid);font-size:1.5rem}.studio-quick-links strong{font-size:.96rem;letter-spacing:.03em}.studio-quick-links small{color:#aebac4}
.section{border-color:#2b363c}
.muted{color:#b2bec7}
.result-list button{background:#1f2b30}
.syllable-group{border-color:#2c383d}
#analytics-choice{background:#161f23;border-color:#53635f}
@media(max-width:900px){.studio-workspace{grid-template-columns:1fr}.studio-quick-links{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.shell{padding:20px 14px 60px}.studio-hero{padding:22px 0}.hero-display{font-size:clamp(2.7rem,11vw,4.8rem);margin:14px 18px}.studio-hero .eyebrow,.studio-hero h1,.studio-hero .intro,.studio-hero .chips{margin-left:18px;margin-right:18px}.studio-hero .eyebrow{padding:0}.studio-quick-links{grid-template-columns:1fr}.studio-quick-links a{padding:16px}.controls{grid-template-columns:repeat(2,minmax(0,1fr))}.verse-panel textarea{min-height:330px}.panel{padding:16px}nav .brand{font-size:1.05rem}}
@media(prefers-reduced-motion:reduce){button{transition:none}}

/* Review pass: prioritize the writing task on smaller screens. */
.verse-count{font-size:.68rem;font-weight:750;color:#d5fa48;letter-spacing:.08em;margin-left:auto}
.studio-home .studio-controls{margin-bottom:10px}
.studio-workspace textarea{width:100%;max-width:100%}
.studio-hero .hero-display{overflow-wrap:normal}
@media(max-width:650px){
  .studio-hero{margin-bottom:10px}
  .studio-hero .hero-display{font-size:clamp(2.15rem,10vw,4rem);line-height:1}
  .studio-hero .chips{gap:6px}
  .studio-hero .chip{font-size:.66rem}
  .studio-controls .field{min-width:0}
  .studio-controls button.primary{width:100%;min-height:48px}
  .studio-workspace .row button{min-height:44px}
  .rhyme-quick button{min-height:44px}
  nav .links a{font-size:.8rem}
  .verse-count{margin-left:0}
}

/* Hero art is served only above 850px; no image download on small screens. */
.studio-hero{isolation:isolate;min-height:370px}
.studio-hero-art{display:block;position:absolute;z-index:-1;inset:0 0 0 auto;width:min(49%,640px);height:100%;overflow:hidden;pointer-events:none;mask-image:linear-gradient(to right,transparent 0%,#000 30%)}
.studio-hero-art img{display:block;width:100%;height:100%;object-fit:cover}
.studio-hero .hero-display{position:relative;z-index:1;max-width:850px}
@media(max-width:849px){.studio-hero{min-height:0}.studio-hero-art{display:none}}

/* Fidelity pass: identity, typography and controls — no decorative fake features. */
:root{--acid:#d9ff39;--panel:#0c1419;--edge:#28343c}
body{background:#070d10}
header{background:#080e12;border-color:#1d2930}
header nav{min-height:70px;padding:12px 26px;max-width:1480px}
nav .brand{display:inline-flex;align-items:center;gap:11px;font-size:1.38rem;white-space:nowrap}
.brand-crown{flex:none;color:var(--acid);filter:drop-shadow(0 0 4px #b4ee3830)}
.brand-name{font-family:Impact,"Arial Black",system-ui,sans-serif;font-weight:900;font-stretch:condensed;letter-spacing:-.055em;font-size:1.5rem;font-style:italic;transform:skew(-4deg);display:inline-block}
.brand-name strong{color:#fff}.brand-name em{color:var(--acid);font-style:inherit}
nav .links a{position:relative;padding:12px 0;font-weight:650;font-size:.91rem}
nav .links a[href="/"]{color:var(--acid)}
nav .links a[href="/"]::after{content:"";position:absolute;left:0;right:0;bottom:1px;height:2px;background:var(--acid);border-radius:2px}
.studio-home{max-width:1480px;padding:0 22px 85px}
.studio-hero{min-height:365px;padding:32px 22px 26px;border:0;border-bottom:1px solid #24313a;border-radius:0;background:linear-gradient(90deg,#080e12 0%,#080e12 35%,#0a1419 100%)}
.studio-hero:after{display:none}
.studio-hero .eyebrow{padding:0;margin-left:0;letter-spacing:.2em;color:#b0b9d3;font-size:.85rem}
.studio-hero .eyebrow strong{color:inherit}
.studio-hero .hero-display{font-family:Impact,"Arial Black",Haettenschweiler,system-ui,sans-serif;letter-spacing:-.027em;line-height:.98;text-transform:uppercase;max-width:980px;font-size:clamp(3.6rem,6.15vw,6.8rem);font-weight:900;margin:18px 0 8px;text-shadow:0 2px 0 #11181c}
.studio-hero .hero-display span{color:var(--acid);letter-spacing:-.02em}
.studio-hero h1{font-size:1.08rem;color:#b6c5d8;margin:12px 0 0}
.studio-hero .intro{margin:8px 0 12px;max-width:520px;font-size:1rem}
.studio-hero .chips{margin:17px 0 0}
.chip{border:0;background:none;padding:3px 8px 3px 0;color:#c9d5dc;font-size:.73rem;font-weight:700;border-radius:0}
.chip:before{content:"✦";color:var(--acid);margin-right:8px}
.panel{background:linear-gradient(135deg,#101920,#0b1217);border:1px solid #27343b;border-radius:13px;box-shadow:none}
.studio-controls{padding:18px 21px;margin:15px 0}
.studio-controls .studio-panel-kicker{margin-bottom:12px}
.studio-controls .controls{grid-template-columns:repeat(4,minmax(0,1fr))}
.studio-controls .field{margin-bottom:10px}
input,select,textarea{border-color:#2b3e49;background:linear-gradient(#111b23,#0d151c);border-radius:8px;min-height:44px;color:#f4f8fc}
button{font-weight:700;min-height:43px;background:linear-gradient(#1b2a33,#111d25);border:1px solid #314450;box-shadow:inset 0 1px #ffffff0b;border-radius:8px}
button.primary{min-height:50px;background:linear-gradient(140deg,#edff72,#cafa36);box-shadow:0 4px 20px #d9ff3914,inset 0 1px #fff8;display:inline-flex;gap:11px;align-items:center;justify-content:center;padding:13px 25px;text-transform:none;letter-spacing:-.02em;font-weight:900;color:#111606}
button.primary:hover:not(:disabled){background:linear-gradient(140deg,#f0ff99,#d9ff50);box-shadow:0 6px 25px #d9ff3930}
.studio-workspace{grid-template-columns:minmax(0,1.8fr) minmax(290px,.92fr);gap:13px}
.studio-workspace .panel{margin:4px 0 0}
.studio-panel-kicker{color:#a8b5c0;letter-spacing:.15em}
.verse-panel h2,.rhyme-panel h2{font-family:Impact,"Arial Black",sans-serif;letter-spacing:.02em;font-size:1.5rem}
.verse-panel textarea{background:#091219;min-height:380px;font-size:.91rem;line-height:2.06;border-color:#26343c}
.verse-panel .row button,.rhyme-quick button{background:linear-gradient(#1b2832,#111d26);border:1px solid #34424c;color:#f2f8ff}
.rhyme-quick button:hover{color:var(--acid)}
.studio-quick-links a{background:#0e171e;border-color:#2a3841}
.studio-hero-art{width:min(48%,680px);mask-image:linear-gradient(to right,transparent 0%,#000 38%)}
@media(max-width:950px){.studio-workspace{grid-template-columns:1fr}.studio-hero .hero-display{font-size:clamp(3rem,7vw,5.3rem)}}
@media(max-width:849px){.studio-hero{min-height:0;padding:30px 14px}.studio-hero .hero-display{font-size:clamp(2.4rem,8vw,4.8rem)}.studio-hero .eyebrow,.studio-hero h1,.studio-hero .intro,.studio-hero .chips{margin-left:0;margin-right:0}}
@media(max-width:650px){header nav{padding:12px 15px;gap:8px}.brand-crown{width:30px;height:28px}.brand-name{font-size:1.1rem}nav .links{gap:11px}.studio-home{padding:0 12px 60px}.studio-hero .hero-display{font-size:clamp(2.25rem,9.9vw,3.6rem)}.studio-controls .controls{grid-template-columns:repeat(2,minmax(0,1fr))}.studio-hero .chips{gap:9px}.studio-hero .chip{font-size:.65rem}}

/* Interactive rhyme palette: real Datamuse results, not decorative mock chips. */
.quick-search-row{display:flex;gap:8px;align-items:stretch}
.quick-search-row input{min-width:0;flex:1;width:100%}
.quick-search-row button{flex:none;min-width:110px;white-space:nowrap}
.rhyme-quick{padding:11px 12px 8px}
.rhyme-quick .field{margin-bottom:9px}
.rhyme-quick .muted{margin:9px 1px 0;font-size:.76rem;min-height:2.2em}
.quick-results{display:grid;gap:16px}
.quick-results section{padding:0}
.quick-results h3{font-size:.9rem;margin:0 0 10px;color:#f3f8fc}
.quick-result-list{display:flex;gap:7px;flex-wrap:wrap;align-items:flex-start;min-height:36px}
.quick-result-list button{min-height:32px;padding:6px 12px;border-radius:20px;color:#dbdaff;font-size:.8rem;font-weight:600;background:linear-gradient(145deg,#272141,#161928);border:1px solid #352c51}
#quick-near button{background:linear-gradient(145deg,#173143,#10212c);border-color:#29495a;color:#cde9f9}
.quick-result-list button:hover:not(:disabled){background:#35305d;border-color:var(--acid);color:#fff}
.quick-results .muted{font-size:.8rem}
.verse-panel{min-width:0}
.rhyme-panel{min-width:0}
@media(max-width:560px){.quick-search-row{flex-direction:column}.quick-search-row button{width:100%}.quick-result-list button{min-height:36px}}

/* Render the photographic asset only on wider viewports. No scenic SVG. */
@media(min-width:850px){
 .studio-hero{background-image:linear-gradient(90deg,#080e12 0%,#080e12f7 27%,#080e12ba 52%,#080e1270 72%,#080e1240 100%),url("/hero-studio.webp");background-size:cover, min(61%,780px) auto;background-position:center, right center;background-repeat:no-repeat}
}

/* Active navigation follows the actual route, never highlights Generator on tool pages. */
nav .links a[href="/"]{color:#c5cbd0}
nav .links a[href="/"]::after{display:none}
.page-home nav .links a[href="/"],.page-tool nav .links a[href="/rap-rhyme-generator/"]{color:var(--acid)}
.page-home nav .links a[href="/"]::after,.page-tool nav .links a[href="/rap-rhyme-generator/"]::after{display:block;content:"";position:absolute;left:0;right:0;bottom:1px;height:2px;background:var(--acid)}

/* Hero visibility and sidebar density corrections (review: 2026-10-24). */
@media (min-width: 850px) {
  .page-home .studio-hero {
    background-image:
      linear-gradient(90deg, #080e12 0%, #080e12fa 24%, #080e12d8 43%, #080e1266 61%, #080e1210 83%),
      url("/hero-studio.webp");
    background-repeat:no-repeat;
    background-position:center, right center;
    background-size:cover, 56% 100%;
  }
  .page-home .studio-hero .hero-display { max-width:780px; }
}
.page-home .studio-workspace { align-items:start; }
.page-home .studio-workspace .rhyme-panel { align-self:start; }
.page-home .quick-search-row button { width:auto; min-width:118px; }
.page-home .rhyme-quick { margin-bottom:16px; }
.page-home .rhyme-next { margin-top:20px; padding:16px 0 3px; border-top:1px solid #28363e; }
.page-home .rhyme-next-title { color:#d5fa48; font-weight:850; font-size:.73rem; letter-spacing:.13em; display:flex; justify-content:space-between; margin-bottom:12px; }
.page-home .rhyme-next-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.page-home .rhyme-next-links a { display:block; text-decoration:none; text-align:center; padding:11px 5px; border-radius:8px; border:1px solid #2d424c; background:#111f27; color:#dfeaf0; font-size:.73rem; letter-spacing:.04em; font-weight:750; }
.page-home .rhyme-next-links a:hover,.page-home .rhyme-next-links a:focus-visible { border-color:#d5fa48; color:#d5fa48; }
.page-home .rhyme-more { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:14px 2px 5px; font-size:.74rem; font-weight:850; letter-spacing:.075em; text-decoration:none; }
@media(max-width:560px) {
  .page-home .quick-search-row button { width:100%; }
  .page-home .rhyme-next-links { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* Mobile hero: keep real compressed raster visible, with copy legible. */
@media(max-width:849px){
 .page-home .studio-hero{
  position:relative;
  min-height:325px;
  padding-top:27px;
  padding-bottom:115px;
  background-image:
   linear-gradient(180deg,#080e12 0%,#080e12e8 34%,#080e12a6 61%,#080e122a 100%),
   url("/hero-studio.webp");
  background-repeat:no-repeat;
  background-size:cover,auto 72%;
  background-position:center, right bottom;
 }
 .page-home .studio-hero .hero-display{position:relative;z-index:1;text-shadow:0 2px 12px #000a}
 .page-home .studio-hero h1,.page-home .studio-hero .intro,.page-home .studio-hero .chips,.page-home .studio-hero .eyebrow{position:relative;z-index:1}
}
@media(max-width:460px){
 .page-home .studio-hero{padding-bottom:110px;background-size:cover,auto 55%;background-position:center,right bottom}
 .page-home .studio-hero .hero-display{font-size:clamp(2.1rem,9.1vw,3rem)}
}