/* The home page's research section (TASK-58, research.js): "Research, not a word cloud.", right under the hero.
   On the hero's night: the heading, then six questions as tabs under their two games, the one picked joined to a
   window where the Atlas opens on the
   answer, in its own look (atlas-look.css, atlas.css): view tabs, what is pinned or filtered, its panels, and the
   reviews behind the number as its review cards (site-look.css). Phone (up to 860px): each window opens under its
   question. A view plays when it opens (.rs-anim gains .is-in): bars grow, lines draw, points appear; with reduced
   motion they rest in their final state. */
.rs{--rs-rule:#cfcbbf;--rs-rule-soft:#e2ded3;--rs-night:#0b0f1a;--rs-bone:#ecedf0;--rs-bone-soft:#b9c0cf;--rs-dim:#8e96a8;--rs-line:rgba(236,237,240,.12);--rs-gutter:max(5.5%,calc((100% - 1720px)/2));background:var(--rs-night);color:var(--rs-bone);scroll-margin-top:var(--header-h,72px)}
.rs .pin-0{--pin:#15161a}.rs .pin-1{--pin:#d4a012}.rs .pin-2{--pin:#c0357a}
.rs .g-praise{--grp:#3f86c6}.rs .g-complaint{--grp:#a34c25}.rs .g-suggestion{--grp:#8b74d6}.rs .g-context{--grp:#8a93a3}
.rs-nw{white-space:nowrap}
.rs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- the Atlas, as it opens: its view tabs, what is pinned or filtered, its panels, its reviews --------------- */
.rs-a{margin:0;min-width:0;background:var(--paper);color:var(--ink);border:1px solid var(--rs-rule);border-radius:8px;overflow:hidden;container-type:inline-size}
.rs-a-tabs{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 18px;border-bottom:1px solid var(--rs-rule)}
.rs-a-views{display:flex;gap:22px;min-width:0;overflow:hidden;white-space:nowrap}
.rs-a-views span{padding:13px 0 10px;border-bottom:2.5px solid transparent;font:500 14.5px var(--font-sans);color:#5b5e66}
.rs-a-views .is-on{border-bottom-color:var(--gold);font-weight:600;color:var(--ink)}
.rs-a-count{flex:none;font:13px var(--font-sans);color:var(--muted);white-space:nowrap}
.rs-a-count b{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.rs-a-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:11px 18px;border-bottom:1px solid var(--rs-rule-soft)}
.rs-a-label{display:inline-flex;align-items:center;gap:6px;margin-right:4px;font:600 13.5px var(--font-sans);color:var(--ink)}
.rs-a-label svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.rs-a-pin{display:inline-flex;align-items:center;gap:8px;min-height:30px;padding:0 12px 0 11px;border:1px solid var(--rs-rule);border-bottom:3px solid var(--pin,#15161a);border-radius:999px;background:#fff;font:500 13.5px var(--font-sans);color:var(--ink);white-space:nowrap}
.rs-a-pin>i:last-child:not([class]){font-style:normal;color:#8a8d94}
.rs-a-pin.g0{--pin:#15161a}.rs-a-pin.g1{--pin:#d4a012}.rs-a-pin.is-theme{--pin:#a34c25}
.rs-a-seg{display:inline-flex;margin-left:auto;border:1px solid var(--rs-rule);border-radius:6px;overflow:hidden;background:#fff}
.rs-a-seg span{padding:6px 12px;font:500 13px var(--font-sans);color:#5b5e66}
.rs-a-seg .is-on{background:var(--ink);color:#fff}
.rs-panes{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:14px;padding:14px}
.rs-panes.is-even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.rs-pane{min-width:0;padding:16px 16px 12px;border:1px solid var(--rs-rule);border-radius:4px;background:var(--panel)}
.rs-pane-h{display:flex;flex-direction:column;gap:2px;margin:0 0 12px}
.rs-pane-h b{font:400 18px/1.2 var(--font-display);letter-spacing:-.01em;color:var(--ink)}
.rs-pane-h span{font:13px/1.4 var(--font-sans);color:var(--muted)}
.rs-dot{display:inline-block;flex:none;width:9px;height:9px;border-radius:50%;background:var(--grp,#a34c25)}
.rs-dot.is-filter{width:10px;height:10px;background:none;border:2px solid var(--gold)}
/* the reviews behind the number, as the Atlas's review cards */
.rs-rv{padding:2px 14px 16px}
.rs-rv-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:4px 2px 10px}
.rs-rv-h b{font:400 18px/1.2 var(--font-display);letter-spacing:-.01em;color:var(--ink)}
.rs-rv-h span{font:13px/1.4 var(--font-sans);color:var(--muted)}
.rs-rv-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}
.rs-review{display:flex;flex-direction:column;min-width:0;height:100%;margin:0;padding:14px 14px 12px;border:1px solid var(--rs-rule);border-radius:6px;background:#fff}
.rs-review .review-header{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.rs-review .rs-review-game{display:flex;align-items:center;gap:8px;margin:0 0 10px;font:600 13px/1.3 var(--font-sans);color:var(--ink)}
.rs-review .rs-review-game img{width:48px;height:22px;object-fit:cover;border-radius:2px;border:1px solid var(--rule)}
.rs-review .review-lang{min-height:26px;font-size:12.5px;font-weight:600;color:#1d3a6b}
.rs-review .verdict{font-size:13px}
.rs-review .verdict-icon{width:26px;height:26px}
.rs-review .review-facts{margin:10px 0}
.rs-review .review-fact{min-height:24px;padding:0 9px 0 8px;font-size:12px}
.rs-review-text>p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden;margin:0;font:14.5px/1.5 var(--font-sans);color:var(--ink)}
.rs-review .review-translation{margin-top:10px;padding:9px 12px 10px}
.rs-review .review-translation p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;font:14px/1.45 var(--font-sans)}
.rs-review .review-foot{margin-top:auto;padding-top:12px}
.rs-review .review-tags{display:flex;flex-wrap:wrap;gap:6px}
.rs-review .review-tags span{display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:0 10px 0 8px;border:1px solid var(--rs-rule);border-radius:999px;background:var(--paper-2);font:600 12px var(--font-sans);color:#15161a}
.rs-review .review-tags span::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--grp,#a34c25)}
.rs-review .review-tags .grp-praise{--grp:#3f86c6}.rs-review .review-tags .grp-complaint{--grp:#a34c25}.rs-review .review-tags .grp-suggestion{--grp:#8b74d6}.rs-review .review-tags .grp-context{--grp:#8a93a3}.rs-review .review-tags .grp-meta{--grp:#d4a012}
/* ---- the band: six questions as tabs, joined to the Atlas that answers the one picked ------------------------ */
.rs-band{background:var(--rs-night);color:var(--rs-bone);padding:88px var(--rs-gutter) 100px}
.rs-band-head{margin:0 0 44px}
.rs-band-head h2{font:300 clamp(44px,4.8vw,76px)/1.02 var(--font-display);letter-spacing:-.035em;margin:0 0 14px;text-wrap:balance}
.rs-band-head p{font:500 clamp(18px,1.5vw,21px)/1.45 var(--font-sans);color:var(--rs-bone-soft);margin:0;max-width:40em;text-wrap:balance}
.rs-show{display:grid;grid-template-columns:minmax(260px,330px) minmax(0,1fr);align-items:stretch;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 40px 90px -30px rgba(0,0,0,.75),0 0 0 1px rgba(236,237,240,.1)}
/* the rail: the six questions, a shade lighter than the band */
.rs-tabs{padding:14px 0 24px 12px;background:#141b2c}
.rs-tablist{display:flex;flex-direction:column;gap:2px}
/* a tab: the question, the largest words in the section after the heading, with an arrow toward the answer */
.rs-tab{all:unset;box-sizing:border-box;position:relative;display:flex;flex-direction:column;width:100%;padding:16px 40px 16px 16px;border-radius:8px 0 0 8px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s}
.rs-tab:hover{background:rgba(236,237,240,.06)}
.rs-tab:focus-visible{outline:2px solid var(--gold-soft,#e0b04a);outline-offset:-2px}
.rs-tab-q{font:500 18px/1.35 var(--font-sans);color:#dfe2e8;text-wrap:balance}
.rs-tab-go{position:absolute;right:16px;top:50%;width:16px;height:16px;margin-top:-8px;fill:none;stroke:#5d677b;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s,stroke .15s}
.rs-tab:hover .rs-tab-go{stroke:#b9c0cf;transform:translateX(2px)}
/* the tab picked stays on the rail's dark, lit, with a gold edge, its question in white, so the question and the
   answer never read as one block of black on white; a notch of the answer's white points back at it */
.rs-tab[aria-selected="true"]{background:#222c46;box-shadow:inset 3px 0 0 var(--gold)}
.rs-tab[aria-selected="true"] .rs-tab-q{font-weight:600;color:#fff}
.rs-tab[aria-selected="true"] .rs-tab-go{stroke:var(--gold);transform:translateX(2px)}
.rs-tab[aria-selected="true"]::after{content:'';position:absolute;right:0;top:50%;margin-top:-11px;border:11px solid transparent;border-left:0;border-right-color:#fff}

/* the game the question was asked of, at the head of its answer */
.rs-game{display:flex;align-items:center;gap:12px;margin:0 0 12px}
.rs-cover{position:relative;display:block;flex:none;width:64px;height:30px}
.rs-cover img{display:block;width:64px;height:30px;object-fit:cover;border-radius:3px;border:1px solid var(--rule)}
/* two games: the sequel's cover laid over the original's, offset, the same footprint as one */
.rs-cover.is-two img{position:absolute;width:54px;height:25px}
.rs-cover.is-two img:first-child{left:0;top:0}
.rs-cover.is-two img+img{left:10px;top:5px;box-shadow:-4px -3px 10px rgba(11,15,26,.3)}
.rs-game-name{font:600 15px/1.3 var(--font-sans);color:var(--ink)}

/* the stage: every window in one cell, so it is as tall as the tallest and the page below never moves */
.rs-stage{display:grid;min-width:0}
.rs-stage>.rs-win{grid-area:1/1;align-self:start;visibility:hidden;opacity:0;transition:opacity .2s,visibility 0s .2s}
.rs-stage>.rs-win.is-on{visibility:visible;opacity:1;transition:opacity .25s,visibility 0s}
/* before a question is picked: the prompt, over a faint outline of the Atlas; the answers stay out of the layout
   until one is picked, then the stage is as tall as the tallest */
.rs-stage>.rs-prompt{grid-area:1/1}
.rs-show:not(.has-open) .rs-stage>.rs-win{display:none}
.rs-show.has-open .rs-prompt{display:none}
.rs-prompt{display:flex;flex-direction:column;gap:26px;min-height:100%;padding:30px 26px 26px}
.rs-prompt-text svg{display:block;width:28px;height:28px;margin:0 0 14px;fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rs-prompt-h{margin:0 0 8px;font:400 clamp(24px,2.1vw,30px)/1.2 var(--font-display);letter-spacing:-.02em;color:var(--ink);text-wrap:balance}
.rs-prompt-a{margin:0;font:16px/1.55 var(--font-sans);color:var(--ink-soft);max-width:48ch;text-wrap:pretty}
.rs-ghost{display:flex;flex:1;flex-direction:column;min-height:300px;overflow:hidden;border:1px solid var(--rs-rule-soft);border-radius:8px;background:var(--paper);opacity:.6}
.rs-ghost .rs-a-views span{color:#a3a6ad}
.rs-ghost-panes{display:grid;flex:1;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:12px;padding:14px}
.rs-ghost-rv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;height:96px;padding:0 14px 14px}
.rs-ghost i{display:block;border:1px solid var(--rs-rule-soft);border-radius:4px;background:var(--panel)}
.rs-win{min-width:0;background:#fff;color:var(--ink);container-type:inline-size}
.rs-finding{display:flex;align-items:flex-start;justify-content:space-between;gap:14px 28px;padding:22px 24px 20px}
.rs-finding-h{margin:0 0 8px;font:500 18px/1.35 var(--font-sans);letter-spacing:-.005em;color:var(--ink);text-wrap:balance}
.rs-finding-a{margin:0;font:15.5px/1.55 var(--font-sans);color:var(--ink-soft);max-width:70ch;text-wrap:pretty}
.rs-open{display:inline-flex;flex:none;align-items:center;gap:6px;min-height:42px;padding:0 16px;border-radius:6px;background:var(--ink);font:600 15px var(--font-sans);color:var(--rs-bone);text-decoration:none;white-space:nowrap;transition:background .2s}
.rs-open:hover{background:#2b2e35}
.rs-open:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.rs-win>.rs-a{margin:0 12px 12px}

/* ---- inside a view: the Atlas's pills, keys, chips and panels -------------------------------------------------- */
.rs-chart{position:relative;width:100%;min-height:40px}
.rs-chart svg{display:block;overflow:visible}
.rs svg text{font-family:var(--font-sans)}
.rs-key{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin:0 0 8px;font:500 12.5px/1.4 var(--font-sans);color:#4a4c52}
.rs-key>span{display:inline-flex;align-items:center;gap:6px}
.rs-pm{display:inline-block;flex:none;width:9px;height:9px;background:var(--pin,#15161a)}
.rs-pm.pin-0{border-radius:50%}
.rs-pm.pin-1{border-radius:1.5px}
.rs-pm.pin-2{width:8px;height:8px;margin:0 2px 0 1px;border-radius:1px;transform:rotate(45deg)}
.rs-pm.is-all{width:15px;height:0;border-top:2px dashed #5b5e66;background:none;border-radius:0}
.rs-sw{display:inline-block;flex:none;width:14px;height:3px;background:#15161a}
.rs-sw.is-bar{height:5px}
.rs-sw.g1{background:#d4a012}
.rs-pills{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.rs-pill{display:inline-flex;align-items:center;gap:7px;min-height:30px;padding:0 10px 0 9px;border:1px solid var(--rs-rule);border-radius:8px;background:#fff;box-shadow:inset 0 3px 0 var(--pin,transparent);font:500 12.5px var(--font-sans);color:var(--ink)}
.rs-pill b{font-weight:700;font-variant-numeric:tabular-nums}
.rs-pill.is-all{border-style:dashed;background:transparent;box-shadow:none}
.rs-chip{display:inline-flex;align-items:center;min-height:26px;padding:0 11px;border:1px solid var(--gold);border-radius:999px;background:#fbf1d4;font:500 12.5px var(--font-sans);color:var(--ink)}
.rs-scope{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:0 0 10px;font:13px var(--font-sans);color:var(--muted)}
.rs-scope b{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.rs-note{margin:12px 0 0;font:13px/1.5 var(--font-sans);color:#4a4c52}
/* the inspector: a theme's chip, name, definition and its measures */
.rs-pane.is-inspector h4{margin:8px 0 5px;font:400 22px/1.12 var(--font-display);letter-spacing:-.02em;color:#15161a}
.rs-pane.is-inspector>p{margin:0;font:14px/1.55 var(--font-sans);color:#3d4047}
.rs-tdchip{display:inline-flex;align-items:center;gap:7px;padding:3px 10px 3px 8px;border:1px solid var(--rs-rule);border-radius:999px;background:var(--paper-2);font:600 12px var(--font-sans);color:#15161a}
.rs-tdchip i{width:8px;height:8px;border-radius:50%;background:var(--grp,#a34c25)}
.rs-metric{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin-top:12px;padding:11px 14px 10px;border:1px solid var(--rs-rule);border-top:3px solid var(--grp,#a34c25);border-radius:8px;background:#fff}
.rs-metric-label{font:600 12.5px var(--font-sans);color:#3d4047}
.rs-metric strong{font:300 32px/1 var(--font-display);letter-spacing:-.025em;color:var(--ink)}
.rs-metric .is-up,.rs-metric strong.is-up{color:#1f6aa6}.rs-metric .is-down,.rs-metric strong.is-down{color:#a34c25}
.rs-metric-note{font:13px/1.35 var(--font-sans);color:#3d4047}
.rs-rate{display:grid;grid-template-columns:auto minmax(40px,1fr) auto;align-items:center;gap:7px 10px;width:100%;margin:6px 0 2px;font:500 12.5px var(--font-sans);color:#3d4047}
.rs-rate b{font:600 13px var(--font-sans);color:#15161a;text-align:right;font-variant-numeric:tabular-nums}
.rs-rate-track{position:relative;height:9px;border-radius:5px;background:#e9eaee;overflow:hidden}
.rs-rate-track i{position:absolute;left:0;top:0;bottom:0;border-radius:5px;transform-origin:left center}
.rs-rate-track i.is-up{background:#1f6aa6}.rs-rate-track i.is-down{background:#a34c25}.rs-rate-track i.is-all{background:#8e9199}
.rs-gap{font:600 13px var(--font-sans)}
.rs-gap.is-up{color:#1f6aa6}.rs-gap.is-down{color:#a34c25}
.rs-inspect-head{margin:14px 0 6px;padding-top:10px;border-top:1px solid var(--rs-rule);font:600 12.5px var(--font-sans);color:#15161a}
/* two numbers side by side, one per game */
.rs-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin:12px 0 4px}
.rs-pair-n{display:flex;flex-direction:column;gap:3px;min-width:0;padding:10px 12px;border:1px solid var(--rs-rule);border-top:3px solid var(--gg);border-radius:6px;background:#fff}
.rs-pair-n.g0{--gg:#15161a}.rs-pair-n.g1{--gg:#d4a012}
.rs-pair-n span{font:600 12.5px/1.3 var(--font-sans);color:#3d4047}
.rs-pair-n strong{font:300 30px/1.05 var(--font-display);letter-spacing:-.02em;color:var(--ink)}
.rs-pair-n small{font:12px/1.35 var(--font-sans);color:var(--muted)}
/* how many recommend, in each pinned language */
.rs-rates{display:grid;gap:14px;margin:4px 0 0}
.rs-rate-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(40px,1fr) auto;align-items:center;gap:10px}
.rs-rate-name{display:flex;align-items:center;gap:8px;min-width:0;font:500 13px/1.25 var(--font-sans);color:var(--ink)}
.rs-rate-name small{display:block;font-size:11.5px;font-weight:400;color:var(--muted)}
.rs-rate-row>b{font:600 13px var(--font-sans);font-variant-numeric:tabular-nums}

/* ---- the Atlas's chart ink ------------------------------------------------------------------------------------ */
.rs-tick{font-size:11px;font-weight:500;fill:#33363d}
.rs-gl{fill:none;stroke:#dfe1e6;stroke-width:1}
.rs-base{fill:none;stroke:#2b2e35;stroke-width:1.4}
.rs-axt{font-size:11.5px;font-weight:600;fill:#15161a}
.rs-cap{font-size:11px;font-weight:600;fill:#5b5e66;paint-order:stroke;stroke:var(--panel);stroke-width:3.5px;stroke-linejoin:round}
.rs-ref{fill:none;stroke:#15161a;stroke-width:1.2;stroke-dasharray:5 4;opacity:.7}
.rs-reflab{font-size:11px;font-weight:600;fill:#15161a;paint-order:stroke;stroke:var(--panel);stroke-width:4px;stroke-linejoin:round}
.rs-zone.is-up{fill:#1f6aa6;fill-opacity:.045}
.rs-zone.is-down{fill:#a34c25;fill-opacity:.04}
.rs-core{fill-opacity:.94;stroke:#fff;stroke-width:1.2}
.rs-core.g-praise{fill:#66c0f4}.rs-core.g-complaint{fill:#a34c25}.rs-core.g-suggestion{fill:#8b74d6}.rs-core.g-context{fill:#8a93a3}
.rs-pt.is-dim .rs-core{fill-opacity:.26;stroke-opacity:.6}
.rs-pt.is-sel .rs-core{stroke:#15161a;stroke-width:1.8}
.rs-pinring{fill:none;stroke:var(--pin);stroke-width:2.6}
.rs-maplab{font-weight:500;fill:#15161a;paint-order:stroke;stroke:var(--panel);stroke-width:3.5px;stroke-linejoin:round}
.rs-maplab.is-dim{fill:#7d8089}
.rs-maplab.is-pinned{font-weight:600}
.rs-maplab.is-sel{font-weight:700}
.rs-pinline{fill:none;stroke:var(--pin);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.rs-pinline.is-all{stroke:#5b5e66;stroke-width:1.6;stroke-dasharray:6 5}
.rs-pinpt{fill:var(--pin);stroke:var(--pin);stroke-width:1.4}
.rs-pinpt.is-partial{fill:var(--panel)}
.rs-partday{fill:var(--paper-2);fill-opacity:.7}
.rs-flowgame{font-size:12.5px;font-weight:500;fill:#15161a}
.rs-flowrule{stroke:var(--rs-rule)}
.rs-conn{fill:none;stroke:var(--rs-rule)}
.rs-flowhit{fill:var(--paper-2)}
.rs-flowlab{fill:#15161a}
.rs-flowlab.is-sel{font-weight:600}
.rs-flowrank,.rs-flowval{font-family:var(--font-mono);font-size:11.5px;fill:#6b6d72}
.rs-flowrank.is-sel{fill:#15161a;font-weight:600}
.rs-flowtick{fill:none;stroke-width:1}
.rs-flowtick.g0{stroke:#15161a}.rs-flowtick.g1{stroke:#d4a012}
.rs-mgrid{stroke:var(--rs-rule-soft);stroke-width:.8}
.rs-mline{fill:none;stroke-width:1.8;stroke-linejoin:round}
.rs-mline.g0{stroke:#15161a}.rs-mline.g1{stroke:#d4a012}
.rs-mlab{font-size:11px;fill:#6b6d72}

/* ---- the Atlas's Themes rows ------------------------------------------------------------------------------------ */
.rs-rows{--lab:150px;--room:66px}
.rs-rows.is-narrow{--lab:118px;--room:60px}
.rs-axis,.rs-row{display:grid;grid-template-columns:var(--lab) minmax(0,1fr);gap:12px}
.rs-axis{align-items:center;margin:0 0 4px;font:11px var(--font-sans);color:var(--muted)}
.rs-axis>div{position:relative;height:14px;margin-right:var(--room)}
.rs-axis>div span{position:absolute;transform:translateX(-50%);white-space:nowrap}
.rs-row{align-items:center;min-height:44px;padding:7px 0;border-top:1px solid var(--rs-rule-soft)}
.rs-label{font:13px/1.3 var(--font-sans);color:var(--ink)}
.rs-label small{display:block;margin-top:2px;font-size:11.5px;color:#5b5e66}
.rs-track{position:relative;display:block;height:10px;margin-right:var(--room)}
.rs-fill{position:absolute;left:0;top:0;bottom:0;border-radius:0 2px 2px 0;transform-origin:left center}
.rs-fill.grp-praise{background:#3f86c6}.rs-fill.grp-complaint{background:#a34c25}.rs-fill.grp-suggestion{background:#8b74d6}.rs-fill.grp-context{background:#8a93a3}
.rs-value{position:absolute;top:50%;transform:translateY(-50%);margin-left:7px;white-space:nowrap;font:600 12.5px var(--font-sans);font-variant-numeric:tabular-nums;color:var(--ink)}
.rs-value small{margin-left:5px;font-weight:500;font-size:11.5px;color:#5b5e66}
.rs-marks{display:flex;flex-direction:column;gap:8px}
.rs-track.is-game{height:5px}
/* the two games, as in the rank flow: the original in ink, the sequel in gold */
.rs-track.g0 .rs-fill{background:#15161a}.rs-track.g1 .rs-fill{background:#d4a012}
.rs-track.is-game .rs-value{font-weight:400;font-size:11.5px;margin-left:5px}

/* ---- motion: a view plays when it opens --------------------------------------------------------------------- */
.rs-anim .rs-grow{transform:scaleX(0);transform-origin:left center;transition:transform 1s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
.rs-anim.is-in .rs-grow{transform:scaleX(1)}
.rs-anim .rs-draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s cubic-bezier(.4,.1,.2,1) var(--d,0s)}
.rs-anim.is-in .rs-draw{stroke-dashoffset:0}
.rs-anim .rs-pop{transform:scale(0);transform-box:fill-box;transform-origin:center;transition:transform .7s cubic-bezier(.2,.8,.3,1.25) var(--d,0s)}
.rs-anim.is-in .rs-pop{transform:none}
.rs-anim .rs-fade{opacity:0;transition:opacity .6s var(--d,0s)}
.rs-anim.is-in .rs-fade{opacity:1}
.rs-anim .rs-pinline.is-all.rs-fade{transition-duration:1.2s}
@media(prefers-reduced-motion:reduce){.rs-anim *,.rs-stage>.rs-win,.rs-tab{transition:none!important}}

/* ---- narrower windows: panels stack, the reviews go two then one to a row ------------------------------------ */
@container (max-width:760px){
 .rs-panes,.rs-panes.is-even{grid-template-columns:minmax(0,1fr)}
 .rs-rv-row{grid-template-columns:repeat(2,minmax(0,1fr))}
 .rs-rv-row>.rs-review:nth-child(3){grid-column:1/-1}
 .rs-a-views span:not(.is-on){display:none}
}
@container (max-width:480px){
 .rs-rv-row{grid-template-columns:minmax(0,1fr)}
 .rs-a-count{display:none}
 .rs-a-tabs,.rs-a-bar{padding-left:12px;padding-right:12px}
 .rs-panes{padding:10px;gap:10px}
 .rs-pane{padding:12px 10px 10px}
 .rs-rv{padding:2px 10px 12px}
 .rs-rows{--lab:104px;--room:58px}
 .rs-axis,.rs-row{gap:10px}
 .rs-axis>div span:nth-child(even){display:none}
}
@container (max-width:620px){.rs-finding{flex-direction:column}}

@media(max-width:1180px){.rs-show{grid-template-columns:minmax(230px,280px) minmax(0,1fr)}.rs-tab-q{font-size:17px}.rs-finding-h{font-size:17px}}
@media(max-width:860px){
 .rs-band{padding:56px 16px 52px}
 .rs-band-head{margin:0 0 30px}
 .rs-band-head h2{font-size:clamp(38px,10.5vw,50px);margin-bottom:12px}
 .rs-band-head p{font-size:17px}
 .rs-show{display:block;border-radius:0;overflow:visible;background:none;box-shadow:none}
 .rs-stage{display:none}
 .rs-tabs{padding:0;background:none}
 .rs-tab-go{transform:rotate(90deg)!important}
 .rs-tab[aria-selected="true"] .rs-tab-go{transform:rotate(-90deg)!important}
 .rs-tablist{gap:8px}
 .rs-tab{border:1px solid var(--rs-line);border-radius:8px;padding:14px 46px 14px 16px;background:rgba(236,237,240,.04)}
 .rs-tab[aria-selected="true"]{border-color:#222c46;border-radius:8px 8px 0 0;box-shadow:inset 0 3px 0 var(--gold)}
 .rs-tab[aria-selected="true"]::after{display:none}
 /* the window opens under its question, one at a time */
 .rs-slot{display:none}
 .rs-tab[aria-selected="true"]+.rs-slot{display:block;margin-top:-8px}
 .rs-slot .rs-win{border-radius:0 0 10px 10px;overflow:hidden}
 .rs-finding{padding:16px}
 .rs-finding-h{font-size:17px}
 .rs-tab-q{font-size:19px}
 .rs-finding-a{font-size:15px}
 .rs-win>.rs-a{margin:0 8px 8px}
}
.rs-review-text>p:lang(ko){word-break:keep-all}
