/* Koło emocji w stylu portalu STYKI: czcionki, kolory, ciemny pas na górze, nagłówek i stopka portalu. */
.kolo-page{--serif:var(--f-display);--sans:var(--f-body);--paper:#ffffff;--ink:#24292e;background:#fff!important;font-family:var(--f-body);color:#24292e}
.kolo-page .app{font-family:var(--f-body);color:#24292e;max-width:1240px;padding:0 var(--gutter,20px);margin:0 auto}
.kolo-page .app h1,.kolo-page .app h2,.kolo-page .app h3{font-family:var(--f-display);font-weight:500;letter-spacing:-.01em;color:inherit}
.kolo-page .topbar{position:sticky;top:0;z-index:50}
/* ciemny pas jak na stronie LAB */
.kolo-page .hero{position:relative;margin:28px 0 26px;padding:44px 48px 40px;border-radius:30px;overflow:hidden;color:#f4eef0;isolation:isolate;
background:radial-gradient(720px 420px at 0% 0%,rgba(132,38,62,.58),transparent 70%),radial-gradient(560px 420px at 100% 110%,rgba(225,180,92,.11),transparent 70%),radial-gradient(500px 300px at 85% 0%,rgba(196,120,150,.12),transparent 70%),linear-gradient(160deg,#3a2a31,#2f2a2f 52%,#272a2f);
box-shadow:0 30px 70px rgba(39,42,47,.16)}
.kolo-page .hero .eyebrow{color:#e1b45c;font-family:var(--f-mono);font-weight:500;letter-spacing:.18em;font-size:12px}
.kolo-page .hero h1{font-family:var(--f-display)!important;font-weight:500;letter-spacing:-.02em;color:#fff;font-size:clamp(40px,5vw,64px);line-height:1.04;margin:10px 0 12px}
.kolo-page .hero .hero-stop{color:#e1b45c}
.kolo-page .hero>p:not(.eyebrow){color:#e6dde1;font-size:18px;max-width:760px}
.kolo-back{display:inline-block;margin:0 0 18px;color:#f4eef0;opacity:.8;text-decoration:none;font-size:14px;border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:6px 14px}
.kolo-back:hover{opacity:1;border-color:rgba(255,255,255,.5)}
/* zakładki na ciemnym pasie */
.kolo-page .hero .tabs button{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.16)!important;color:#f4eef0!important;box-shadow:none!important}
.kolo-page .hero .tabs button *{color:inherit!important}
.kolo-page .hero .tabs button small,.kolo-page .hero .tabs button span:not([class*="ico"]){opacity:.85}
.kolo-page .hero .tabs button:hover{background:rgba(255,255,255,.12)!important}
.kolo-page .hero .tabs button[aria-selected="true"]{background:#f4eef0!important;color:#84263e!important;border-color:#f4eef0!important}
/* karty: biel i chłodna szarość portalu zamiast beżu */
.kolo-page .wheel-panel,.kolo-page .detail,.kolo-page .alt,.kolo-page .selection,.kolo-page .scientific{background:#fff;border:1px solid #e2e5e9;border-radius:24px;box-shadow:0 18px 50px rgba(36,41,46,.07)}
.kolo-page .detail [class*="card"],.kolo-page .detail .fact,.kolo-page .detail li{background-color:transparent}
.kolo-page .search input{background:#f1f3f5;border-color:#e2e5e9}
.kolo-page .eyebrow{color:#84263e}
.kolo-page button{font-family:var(--f-body)}
.kolo-page .sfoot{margin-top:56px}
@media (max-width:860px){.kolo-page .hero{padding:30px 22px;border-radius:24px}.kolo-page .hero h1{font-size:38px}}
@media print{.kolo-page .topbar,.kolo-page .sfoot{display:none}.kolo-page .hero{background:none;color:#000;box-shadow:none}}
.kolo-page .hero{display:block}
.kolo-page .hero>*{max-width:none}
.kolo-page .hero .eyebrow::before{background:#e1b45c}
/* chłodne, jasne tła zamiast beżowych */
.kolo-page .emotion-overview-grid>div,.kolo-page .overview-sources,.kolo-page .proc-sources,.kolo-page .proc-branch,.kolo-page .proc-stage-nav button,.kolo-page .story-bubble.context,.kolo-page .story-illustration,.kolo-page .comic-person-panel,.kolo-page .sa-affect-word,.kolo-page .sa-design-section,.kolo-page .basic-hint{background:#f4f5f7!important;border-color:#e2e5e9!important}
.kolo-page .basic-hint{border-radius:16px}
/* Emocje w ciele: ciemna scena, żeby sylwetka 3D była wyraźna */
.kolo-page .e3-stage{background:radial-gradient(520px 420px at 50% 40%,rgba(132,38,62,.35),transparent 70%),linear-gradient(160deg,#3a2a31,#2f2a2f 55%,#272a2f)!important;border:0!important;box-shadow:0 30px 70px rgba(39,42,47,.16)}
.kolo-page .e3-stage-head,.kolo-page .e3-stage-head strong{color:#e1b45c!important}
.kolo-page .e3-stage-head span{color:#d9ced3!important}
.kolo-page .e3-stage #e3Loading{color:#d9ced3}
.kolo-page .e3-views button{background:rgba(255,255,255,.08)!important;color:#f4eef0!important;border:1px solid rgba(255,255,255,.18)!important}
.kolo-page .e3-views button.active{background:#f4eef0!important;color:#84263e!important}
.kolo-page .e3-views .e3-spin{background:#e1b45c!important;color:#2f2a2f!important;border-color:#e1b45c!important;font-weight:700}
.kolo-page .e3-views .e3-spin[aria-pressed="false"]{background:transparent!important;color:#e1b45c!important}