/* Independent component styles: the rating page must not own the home chart. */
.rating-home .rating-home-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.rating-home .rating-home-card{position:relative;display:grid;grid-template-columns:30px 72px minmax(0,1fr);align-items:center;gap:14px;min-width:0;width:auto;box-sizing:border-box;padding:20px;border:1px solid #e3dbea;border-radius:22px;background:#fff;color:#241d32;text-decoration:none;box-shadow:0 10px 28px #30234808}.rating-home .rating-home-rank{align-self:center;font:500 27px/1 Arial,sans-serif;color:#927da9;letter-spacing:-1px}.rating-home .rating-home-cover{position:relative;width:72px;height:72px;aspect-ratio:1;border-radius:16px;overflow:hidden;min-width:0}.rating-home .rating-home-cover span{position:absolute;top:6px;left:5px;max-width:calc(100% - 10px);box-sizing:border-box;padding:4px 5px;border-radius:6px;background:#ffffffdf;color:#35274b;font:500 8px/1.2 Arial,sans-serif;letter-spacing:0;overflow-wrap:anywhere}.rating-home .rating-home-info{min-width:0}.rating-home .rating-home-info h3{margin:0 14px 6px 0;font-size:17px;line-height:1.3;overflow-wrap:anywhere}.rating-home .rating-home-info p{margin:0 0 12px;font-size:12px;color:#72677f;line-height:1.45}.rating-home .rating-home-views{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-size:12px;color:#72677f}.rating-home .rating-home-views strong{font-size:16px;font-weight:500;color:#302348}.rating-home .card-arrow{right:10px;top:10px;width:25px;height:25px;font-size:15px}.site-audience{display:block!important;visibility:visible!important;opacity:1!important;padding:25px max(24px,calc((100vw - 1240px)/2));background:#f0eaf7;border-top:1px solid #ddd2e9;color:#302348}.site-audience-head{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:baseline;margin-bottom:16px}.site-audience-head a{font:500 16px/1.5 Arial,sans-serif;color:#302348;text-decoration:none}.site-audience-head small{font-size:12px;color:#756780}.site-audience-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:580px}.site-audience-grid span{display:grid;gap:5px;padding:12px 16px;background:#fff;border:1px solid #e2d7eb;border-radius:12px;font-size:12px;color:#756780;min-width:0}.site-audience-grid b{font:500 23px/1.2 Arial,sans-serif;color:#302348;overflow-wrap:anywhere}@media(max-width:1100px){.rating-home .rating-home-grid{grid-template-columns:1fr}.rating-home .rating-home-card{grid-template-columns:30px 72px minmax(0,1fr)}}@media(max-width:640px){.rating-home .rating-home-card{grid-template-columns:26px 64px minmax(0,1fr);gap:12px;padding:20px}.rating-home .rating-home-cover{width:64px;height:64px;border-radius:13px}.rating-home .rating-home-rank{font-size:24px}.rating-home .rating-home-info h3{font-size:16px;margin-right:0}.site-audience{padding:22px 20px}.site-audience-grid{gap:8px}.site-audience-grid span{padding:12px 8px;font-size:11px}.site-audience-grid b{font-size:20px}}

.rating-home .rating-home-info>strong{margin-right:6px}.rating-home .rating-home-info>small{font-size:12px}

@media(min-width:901px){
.rating-home .rating-home-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.rating-home .rating-home-card{display:flex;flex-direction:column;align-items:stretch;gap:20px;padding:clamp(20px,2vw,32px)}
.rating-home .rating-home-cover{width:100%;height:clamp(148px,14vw,248px);aspect-ratio:auto;border-radius:15px;background-color:#e8dff2}
.rating-home .rating-home-cover span{left:14px;top:14px;font-size:11px;padding:6px 9px;max-width:70%}
.rating-home .rating-home-rank{position:absolute;z-index:1;right:clamp(32px,3vw,52px);top:clamp(32px,3vw,52px);font-size:28px;color:#292038;background:#fff;border-radius:10px;padding:5px 9px}
.rating-home .rating-home-info h3{font-size:clamp(22px,2vw,32px);margin:0 0 8px}
.rating-home .rating-home-info p{font-size:16px;margin-bottom:14px}
.rating-home .rating-home-views{font-size:14px}
.rating-home .card-arrow{top:auto;bottom:20px;right:20px}
}

.site-audience{background:linear-gradient(115deg,#241c30,#40304f 72%,#4e395f);color:#fff;padding:32px max(5vw,calc((100vw - 1240px)/2)) 42px;border-top:1px solid #ffffff25}
.site-audience-head{justify-content:space-between;align-items:center}
.site-audience-head a{color:#fff;font:inherit;font-size:clamp(22px,2.3vw,32px);font-weight:600;letter-spacing:-.04em}
.site-audience-head small,.site-audience-grid span{color:#e1d8ed}
.site-audience-grid{max-width:none;gap:0;border-block:1px solid #ffffff35}
.site-audience-grid span{background:transparent;border:0;border-radius:0;padding:18px 8%;font:inherit;font-size:14px}
.site-audience-grid span+span{border-left:1px solid #ffffff35}
.site-audience-grid b{font:inherit;font-size:clamp(24px,3vw,42px);color:white;line-height:1.1;font-variant-numeric:tabular-nums}
@media(max-width:600px){.site-audience-head{align-items:flex-start;flex-direction:column;gap:4px}.site-audience-grid span{font-size:12px}}

.ps-orbit .ps-rotor{position:absolute;inset:0;animation:psTurn 18s linear infinite!important;pointer-events:none}.ps-orbit .orbit-dot{animation:psTurn 18s linear infinite reverse!important}
@keyframes psTurn{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.ps-orbit .ps-orbit-control{cursor:pointer;border:0;z-index:2;color:#21172e;font-family:inherit}.ps-orbit-control:focus-visible{outline:3px solid #7042c2;outline-offset:4px}
.ps-orbit[data-running=false] :is(.ps-rotor,.orbit-dot){animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.ps-orbit:not([data-running=true]) :is(.ps-rotor,.orbit-dot){animation-play-state:paused!important}}

/* Homepage palette and type match Musical Styles exactly. */
body:has(#styles) :is(.step-grid .step,.square-art:not([style]),.hero-cover,.story-image){
 color:#191525;background:var(--card-fill,linear-gradient(145deg,#ffbfd8,#d8b7ff,#b7f2dc));border:1px solid #ffffffb3;border-radius:30px;box-shadow:0 18px 44px #30234816;
}
body:has(#styles) :is(.style-card,.step):nth-child(5n+2){--card-fill:linear-gradient(145deg,#b9e8ff,#bfc6ff,#e5d1ff)}
body:has(#styles) :is(.style-card,.step):nth-child(5n+3){--card-fill:linear-gradient(145deg,#ffc4cc,#f1c5ed,#ffdcb6)}
body:has(#styles) :is(.style-card,.step):nth-child(5n+4){--card-fill:linear-gradient(145deg,#c9b8ff,#e1b9ed,#b5d6ff)}
body:has(#styles) :is(.style-card,.step):nth-child(5n){--card-fill:linear-gradient(145deg,#ffd2a6,#ffb7c7,#f0d2ff)}
body:has(#styles) .style-card .square-art:not([style]){background:var(--card-fill,linear-gradient(145deg,#ffbfd8,#d8b7ff,#b7f2dc))}
body:has(#styles) .step-grid .step{background:var(--card-fill,linear-gradient(145deg,#ffbfd8,#d8b7ff,#b7f2dc));opacity:1}
body:has(#styles) .step-grid .step:after{display:none}
body:has(#styles) .step-grid .step :is(h3,p){color:#191525;opacity:1;font-family:Inter,Arial,sans-serif}
body:has(#styles) .step-grid .step h3{font-weight:500;letter-spacing:-.04em}
body:has(#styles) .step-grid .step>span{color:#33264a;background:#ffffffb3}
body:has(#styles) :is(.square-art>span,.story-image>b){font-family:Inter,Arial,sans-serif;font-weight:400;color:#191525;text-shadow:none;letter-spacing:-.055em}
body:has(#styles) .square-art[style]>span{background:#ffffffdf;padding:.12em .2em;border-radius:8px}

/* The rich article uses real paragraphs, not preformatted line breaks. */
.journal-content.service-story-content{white-space:normal}
.journal-content.service-story-content p{margin:0}
.journal-content.service-story-content p+p{margin-top:1.925em}
.journal-content.service-story-content h2{margin-top:1.6em;margin-bottom:.75em}
.journal-content.service-story-content nav{margin-bottom:1.925em}