/* =========================================================================
   Sennik Planisfer
   Odstępy z ciągu Fibonacciego: 5 8 13 21 34 55 89 144.
   Kształty z tematu: okrąg planisfery, kartusz z podwójną ramką, plakietka.
   ========================================================================= */

@font-face { font-family: "Brygada 1918"; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/brygada-1918-latin-wght-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Brygada 1918"; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/brygada-1918-latin-ext-wght-normal.woff2) format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Brygada 1918"; font-style: italic; font-weight: 400 700; font-display: swap; src: url(../fonts/brygada-1918-latin-wght-italic.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Brygada 1918"; font-style: italic; font-weight: 400 700; font-display: swap; src: url(../fonts/brygada-1918-latin-ext-wght-italic.woff2) format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Alegreya Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/alegreya-sans-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Alegreya Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/alegreya-sans-latin-ext-400-normal.woff2) format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Alegreya Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/alegreya-sans-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Alegreya Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/alegreya-sans-latin-ext-500-normal.woff2) format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Alegreya Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/alegreya-sans-latin-700-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Alegreya Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/alegreya-sans-latin-ext-700-normal.woff2) format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

:root {
	--noc: #24123F;
	--noc-2: #2E1852;
	--noc-3: #40246B;
	--noc-4: #1F0F38;
	--sliwa: #4A2A7A;
	--papier: #E6DEF0;
	--papier-2: #F3EEF8;
	--linia: #C7B9DD;
	--lila: #D3C7E6;
	--zloto: #E8C77A;
	--zloto-jasne: #F3DC9B;
	--zloto-ciemne: #B8862F;
	--zloto-ramka: #9C7426;
	--zloto-tekst: #7A5714;
	--mleko: #F6EBD0;
	--mleko-2: #FFF6DC;
	--mgla: #CDBFE3;
	--mgla-2: #E4DAF0;
	--mgla-3: #A897C8;
	--tekst: #24123F;
	--tekst-2: #3A2A58;
	--tekst-3: #5B4A78;
	--rozany: #8E2F52;
	--folia: linear-gradient(100deg, #B8862F 0%, #F3DC9B 36%, #D6AA52 60%, #F7E8BA 82%, #B8862F 100%);
	--folia-tekst: linear-gradient(100deg, #B8862F 0%, #F3DC9B 34%, #C9993F 55%, #F7E8BA 76%, #A87A26 100%);
	--szeryf: "Brygada 1918", Georgia, "Times New Roman", serif;
	--bezszeryf: "Alegreya Sans", system-ui, -apple-system, sans-serif;
	--s1: 5px; --s2: 8px; --s3: 13px; --s4: 21px; --s5: 34px; --s6: 55px; --s7: 89px; --s8: 144px;
	--naglowek: 68px;
	--szer: 1240px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--noc); color: var(--tekst); font-family: var(--szeryf); font-size: 18px; line-height: 1.6; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
img, svg { max-width: 100%; }
a { color: var(--zloto-tekst); text-decoration-thickness: 1px; text-underline-offset: 4px; }
a:hover { color: var(--tekst); }
h1, h2, h3 { font-family: var(--szeryf); font-weight: 500; line-height: 1.1; letter-spacing: -0.015em; margin: 0; }
p { margin: 0; }
button { font: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--sliwa); outline-offset: 4px; }
.noc :focus-visible { outline-color: var(--zloto); }

.ukryte { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pomin { position: absolute; left: var(--s3); top: -100px; z-index: 100; padding: var(--s2) var(--s3); background: var(--mleko); color: var(--noc); }
.pomin:focus { top: var(--s3); }

/* ------------------------------------------------------------------ powierzchnie */

.noc {
	color: var(--mleko);
	background-color: var(--noc);
	background-image: repeating-linear-gradient(0deg, rgba(232,199,122,.035) 0, rgba(232,199,122,.035) 1px, transparent 1px, transparent 5px), radial-gradient(ellipse at 50% 55%, var(--noc-3) 0%, var(--noc-2) 38%, var(--noc) 70%);
}
.noc a { color: var(--zloto); }
.noc a:hover { color: var(--mleko-2); }
.papier { background: var(--papier); color: var(--tekst); padding-bottom: var(--s8); }
.papier + .noc, .noc + .papier, .noc + footer { border-top: 5px double var(--zloto-ciemne); }

.zloto-tekst { background: var(--folia-tekst); -webkit-background-clip: text; background-clip: text; color: transparent; }
.zloto-tekst-ciemne { background: linear-gradient(100deg, #9C7426 0%, #D6AA52 45%, #7A5714 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ------------------------------------------------------------------ nagłówek */

.naglowek { position: relative; z-index: 20; border-bottom: 1px solid rgba(184,134,47,.45); background-image: none; }
.naglowek__wnetrze { max-width: 1320px; margin: 0 auto; min-height: var(--naglowek); padding: var(--s2) var(--s5); display: flex; align-items: center; gap: var(--s3) var(--s5); }
.logo { display: inline-flex; align-items: center; gap: var(--s3); color: var(--mleko) !important; text-decoration: none; font-style: italic; font-size: 27px; font-weight: 500; line-height: 1; margin-right: auto; }
.logo svg { flex: none; }
.naglowek__menu { display: flex; gap: 0 var(--s5); font-family: var(--bezszeryf); font-size: 17px; font-weight: 500; }
.naglowek__menu a { color: var(--mleko); text-decoration: none; line-height: 44px; border-bottom: 1px solid transparent; }
.naglowek__menu a:hover, .naglowek__menu a[aria-current] { color: var(--zloto); border-bottom-color: var(--zloto-ciemne); }
.naglowek__szukaj { position: relative; display: flex; align-items: center; border-bottom: 1px solid rgba(232,199,122,.5); }
.naglowek__szukaj input { width: 190px; padding: var(--s2) 0; border: 0; background: transparent; color: var(--mleko-2); font: italic 17px var(--szeryf); }
.naglowek__szukaj input::placeholder { color: var(--mgla-3); }
.naglowek__szukaj button { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; background: none; color: var(--zloto); cursor: pointer; }
.naglowek__mobilne { display: none; }
.naglowek__mobilne summary { list-style: none; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--zloto); cursor: pointer; }
.naglowek__mobilne summary::-webkit-details-marker { display: none; }
.naglowek__szuflada { position: absolute; left: 0; right: 0; top: 100%; padding: var(--s4) var(--s4) var(--s5); background: var(--noc); border-bottom: 5px double var(--zloto-ciemne); display: flex; flex-direction: column; font-family: var(--bezszeryf); font-size: 19px; }
.naglowek__szuflada a { color: var(--mleko); text-decoration: none; line-height: 2.6; border-bottom: 1px solid rgba(184,134,47,.25); }
.naglowek__szuflada .szukajka { margin-bottom: var(--s3); }
.naglowek__szuflada .szukajka input { width: 100%; }

@media (max-width: 1080px) {
	.naglowek__menu, .naglowek__szukaj { display: none; }
	.naglowek__mobilne { display: block; }
	.naglowek__wnetrze { padding: var(--s1) var(--s2) var(--s1) var(--s4); }
	.logo { font-size: 24px; }
}

/* ------------------------------------------------------------------ wyszukiwarka i podpowiedzi */

.szukajka { position: relative; }
.szukajka input { font: italic 19px var(--szeryf); color: var(--mleko-2); background: transparent; border: 0; border-bottom: 5px double var(--zloto-ciemne); padding: var(--s2) 0; }
.szukajka input::placeholder { color: var(--mgla-3); opacity: 1; }
.szukajka--duza { max-width: 620px; margin-top: var(--s5); }
.szukajka--duza input { width: 100%; font-size: 30px; }
.podpowiedzi { position: absolute; left: 0; right: 0; top: calc(100% + var(--s1)); z-index: 30; margin: 0; padding: var(--s1) 0; list-style: none; background: var(--papier-2); border: 1px solid var(--zloto-ramka); box-shadow: 0 21px 34px -13px rgba(0,0,0,.45); min-width: 240px; }
.podpowiedzi a { display: block; padding: var(--s2) var(--s3); color: var(--tekst) !important; text-decoration: none; font-size: 18px; }
.podpowiedzi a:hover, .podpowiedzi a[aria-selected="true"] { background: var(--lila); }

/* ------------------------------------------------------------------ przyciski */

.plakietka {
	display: inline-flex; align-items: center; justify-content: center; min-height: 55px; padding: 0 var(--s5);
	border: 0; cursor: pointer; text-decoration: none !important; text-align: center;
	font: italic 600 20px/1.1 var(--szeryf);
	clip-path: polygon(13px 0, calc(100% - 13px) 0, 100% 50%, calc(100% - 13px) 100%, 13px 100%, 0 50%);
	transition: filter .3s, background .3s;
}
.plakietka--zlota { background: var(--folia); color: var(--noc) !important; }
.plakietka--nocna { background: var(--noc); color: var(--zloto-jasne) !important; }
.plakietka:hover { filter: brightness(1.08); }
.plakietka:focus-visible { outline: none; background: var(--mleko-2); color: var(--noc) !important; text-decoration: underline !important; text-underline-offset: 5px; }
.plakietka[aria-pressed="true"] { background: var(--folia); color: var(--noc) !important; }
.link-przycisk { min-height: 44px; padding: 0 var(--s1); border: 0; background: none; color: inherit; font-family: var(--bezszeryf); font-size: 16px; text-decoration: underline; text-underline-offset: 5px; cursor: pointer; }
.noc .link-przycisk { color: var(--zloto); }
.link-strzalka { display: inline-block; font-family: var(--bezszeryf); font-size: 17px; font-weight: 500; line-height: 2.6; }
.przyciski { display: flex; flex-wrap: wrap; gap: var(--s3); justify-content: center; margin-top: var(--s5); }

.znacznik {
	display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--s4); background: var(--lila); color: var(--tekst) !important;
	text-decoration: none; font: italic 18px var(--szeryf);
	clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 8px 100%, 0 50%);
}
.znacznik[aria-current] { background: var(--folia); font-weight: 600; }
.znacznik:focus-visible { outline: none; background: var(--noc); color: var(--mleko) !important; }
.znacznik--maly { min-height: 34px; padding: 0 var(--s3); font-size: 16px; }
.znacznik--jasny { background: var(--papier-2); }

/* ------------------------------------------------------------------ kartusz i medalion */

.kartusz { position: relative; padding: var(--s5) var(--s5) var(--s4); background: var(--papier-2); border: 1px solid var(--zloto-ramka); outline: 1px solid rgba(156,116,38,.5); outline-offset: -8px; }
.rog { position: absolute; width: 9px; height: 9px; background: var(--zloto-ramka); transform: rotate(45deg); }
.rog--lg { left: -5px; top: -5px; } .rog--pg { right: -5px; top: -5px; } .rog--ld { left: -5px; bottom: -5px; } .rog--pd { right: -5px; bottom: -5px; }
.kartusz--noc { background: linear-gradient(180deg, var(--noc-2) 0%, #2A1548 100%); color: var(--mleko); border-color: var(--zloto-ciemne); outline-color: rgba(184,134,47,.5); }
.kartusz--noc .rog { background: var(--zloto); }
.kartusz--medalion { margin-top: 38px; padding-top: 62px; text-align: center; }
.kartusz--medalion > .rog--lg, .kartusz--medalion > .rog--pg { display: none; }
.medalion { position: absolute; left: 50%; top: -38px; width: 76px; height: 76px; margin-left: -38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--noc); color: var(--zloto); border: 1px solid var(--zloto-ciemne); box-shadow: 0 0 0 5px var(--papier), 0 0 0 6px var(--zloto-ramka); }
.noc .medalion { background: #2A1548; box-shadow: 0 0 0 5px var(--noc), 0 0 0 6px var(--zloto-ramka); }

.ornament { display: flex; align-items: center; justify-content: center; gap: var(--s4); }
.ornament span { width: 144px; height: 1px; background: var(--zloto-ramka); }
.ornament i { width: 8px; height: 8px; background: var(--zloto-ramka); transform: rotate(45deg); }
.romb { display: block; width: 8px; height: 8px; margin: var(--s4) auto; background: var(--zloto-ciemne); transform: rotate(45deg); }

/* ------------------------------------------------------------------ sekcje */

.sekcja { max-width: var(--szer); margin: 0 auto; padding: var(--s7) var(--s5) 0; }
.sekcja__tytul { font-size: clamp(34px, 4vw, 52px); letter-spacing: -0.02em; }
.sekcja__wstep { margin-top: var(--s3); max-width: 52ch; font-size: 19px; line-height: 1.6; color: var(--tekst-3); }
.srodek { text-align: center; }
.srodek .sekcja__wstep, .sekcja__wstep.srodek { margin-left: auto; margin-right: auto; }
.tytul-duzy { font-size: clamp(55px, 7vw, 89px); line-height: .95; letter-spacing: -0.03em; }
.tytul-duzy em, .tytul-noc em { font-style: italic; }
.przypis { font-family: var(--bezszeryf); font-size: 14px; color: var(--tekst-3); }
.noc .przypis { color: var(--mgla); }
.uwaga { margin-top: var(--s4); color: var(--zloto-jasne); }

/* ------------------------------------------------------------------ planisfer */

.planisfer { position: relative; width: 100%; }
.planisfer__tarcza { position: relative; width: 100%; aspect-ratio: 1 / 1; }
.planisfer__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.planisfer__tlo circle { fill: var(--mleko); opacity: .55; }
.planisfer__siatka circle, .planisfer__siatka line { fill: none; stroke: var(--zloto-ciemne); stroke-width: 1.2; }
.planisfer__siatka .kropki { stroke-width: .6; stroke-dasharray: 1 5; }
.planisfer__siatka .slaba { stroke-width: .5; opacity: .35; stroke-dasharray: 2 8; }
.planisfer__obrzeze circle { fill: none; stroke: var(--zloto-ciemne); }
.planisfer__obrzeze .r1 { stroke-width: 1.2; } .planisfer__obrzeze .r2 { stroke-width: .6; } .planisfer__obrzeze .r3 { stroke-width: .8; }
.planisfer__obrzeze .podzialka { stroke-width: 8; stroke-dasharray: 1.2 27.95; }
.planisfer__obrzeze .podzialka-duza { stroke: var(--zloto); stroke-width: 16; stroke-dasharray: 2 263.46; }
.planisfer__obrzeze .punkty { stroke: var(--zloto); stroke-width: 7; stroke-linecap: round; stroke-dasharray: .1 290.5; }
.planisfer__krainy { font-family: var(--szeryf); font-style: italic; font-size: 24px; fill: var(--zloto); letter-spacing: 1px; }
.planisfer__obrzeze.obraca { transform-box: view-box; transform-origin: 400px 400px; animation: snio-obrot 420s linear infinite; }
@keyframes snio-obrot { to { transform: rotate(360deg); } }
.planisfer__linie line { stroke: var(--zloto-jasne); stroke-width: 1.4; stroke-linecap: round; opacity: .8; }
.planisfer__linie line.nowa { stroke-dasharray: 600; stroke-dashoffset: 600; animation: snio-rysuj 1.1s ease forwards; }
@keyframes snio-rysuj { to { stroke-dashoffset: 0; } }
.gw { cursor: pointer; text-decoration: none; }
.gw__blask path { fill: var(--mleko-2); filter: drop-shadow(0 0 8px rgba(243,220,155,.85)) drop-shadow(0 0 21px rgba(232,199,122,.45)); }
.gw__nazwa { font-family: var(--szeryf); font-style: italic; font-size: 27px; fill: var(--mleko); paint-order: stroke; stroke: var(--noc-4); stroke-width: 6px; stroke-linejoin: round; }
.gw__nr { fill: var(--zloto); font-size: 18px; font-style: normal; }
.gw:hover .gw__nazwa, .gw:focus .gw__nazwa { fill: var(--zloto-jasne); }
.gw:focus { outline: none; }
.gw:focus-visible .gw__blask path { filter: drop-shadow(0 0 3px #fff) drop-shadow(0 0 21px rgba(232,199,122,.9)); }
.gw.nowa > g > * { transform-box: fill-box; transform-origin: center; animation: snio-zapal .8s cubic-bezier(.2,.9,.25,1.2) both; }
@keyframes snio-zapal { from { opacity: 0; transform: scale(.3) rotate(-40deg); } to { opacity: 1; transform: none; } }
.planisfer__pusto { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 50%; text-align: center; font-style: italic; font-size: clamp(17px, 2vw, 23px); line-height: 1.4; color: var(--mgla); }
.planisfer__tytul { position: absolute; left: 50%; top: 75%; transform: translateX(-50%); width: 72%; text-align: center; }
.planisfer__nazwa { font-style: italic; font-size: clamp(18px, 2.4vw, 27px); line-height: 1.1; background: var(--folia-tekst); -webkit-background-clip: text; background-clip: text; color: transparent; }
.planisfer__opis { margin-top: var(--s1); font-family: var(--bezszeryf); font-size: 14px; color: var(--mgla); }

/* ------------------------------------------------------------------ legenda */

.legenda { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--s5); }
.legenda li { display: flex; gap: var(--s3); }
.legenda--lewa { text-align: right; }
.legenda--lewa li { flex-direction: row-reverse; }
.legenda__nr { flex: none; width: 29px; height: 29px; border-radius: 50%; border: 1px solid var(--zloto-ciemne); display: flex; align-items: center; justify-content: center; font-style: italic; font-size: 15px; color: var(--zloto); }
.legenda a { display: block; font-style: italic; font-size: 25px; line-height: 1.1; text-decoration: none; }
.legenda p { margin-top: var(--s1); font-family: var(--bezszeryf); font-size: 16px; line-height: 1.45; color: var(--mgla-2); }
.legenda .legenda__scena { color: var(--zloto-jasne); font-style: italic; font-family: var(--szeryf); font-size: 15px; }
.legenda__pusto { display: block; font-style: italic; font-size: 19px; line-height: 1.45; color: var(--mgla-3); }
.legenda li.nowa { animation: snio-wejdz .6s ease both; }
@keyframes snio-wejdz { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.legenda--statyczna { margin: var(--s5) 0; }

/* ------------------------------------------------------------------ start */

.start { display: flex; flex-direction: column; min-height: min(calc(100svh - var(--naglowek)), 940px); }
.start__wpis { width: 100%; max-width: 1320px; margin: 0 auto; padding: var(--s5) var(--s5) 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: end; gap: var(--s3) var(--s5); }
.start__tytul { font-style: italic; font-weight: 400; font-size: clamp(40px, 4.2vw, 58px); line-height: 1.02; letter-spacing: -0.02em; padding-bottom: var(--s2); }
.start__tytul label { cursor: text; }
.start__pole { border-bottom: 5px double var(--zloto-ciemne); }
.start__pole textarea { display: block; width: 100%; min-height: 50px; max-height: 140px; padding: var(--s1) 0 var(--s2); border: 0; background: transparent; color: var(--mleko-2); font: italic 32px/1.3 var(--szeryf); resize: none; overflow: hidden; }
.start__pole textarea::placeholder { color: #8E7DB0; opacity: 1; }
.start__pole textarea:focus-visible { outline: none; }
.start__pole:focus-within { border-bottom-color: var(--zloto); }
.start__akcje { display: flex; align-items: center; gap: var(--s4); padding-bottom: var(--s1); }
.start__plansza { flex: 1; width: 100%; max-width: 1320px; margin: 0 auto; padding: var(--s4) var(--s5); display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: var(--s4) var(--s5); }
.planisfer--start { width: clamp(320px, calc(100svh - 250px), 640px); }
.start__przypis { padding: 0 var(--s5) var(--s3); text-align: center; font-family: var(--bezszeryf); font-size: 13px; color: var(--mgla-3); }
.legenda--lewa, .legenda--prawa { max-width: 300px; }
.legenda--lewa { justify-self: end; }

@media (max-width: 1100px) {
	.start__wpis { grid-template-columns: minmax(0, 1fr) auto; }
	.start__tytul { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
	.start { min-height: 0; }
	.start__wpis { grid-template-columns: 1fr; padding: var(--s5) var(--s4) 0; }
	.start__pole textarea { font-size: 25px; }
	.start__akcje { justify-content: space-between; flex-wrap: wrap; }
	.start__akcje .plakietka { flex: 1; }
	.start__plansza { grid-template-columns: 1fr; padding: var(--s4); }
	.planisfer--start { width: min(100%, 520px); justify-self: center; order: -1; }
	.legenda--lewa, .legenda--prawa { max-width: none; justify-self: stretch; text-align: left; }
	.legenda--lewa li { flex-direction: row; }
	.legenda--prawa { display: none; }
}

/* ------------------------------------------------------------------ trzy okna, atlas, sen dnia */

.okna__lista { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s6) var(--s5); margin-top: var(--s7); }
.okno { flex: 1 1 300px; max-width: 380px; }
.okno h3 { font-style: italic; font-size: 32px; }
.okno p { margin-top: var(--s3); font-size: 18px; color: var(--tekst-2); }

.atlas-start { display: flex; flex-wrap: wrap; gap: var(--s6) var(--s7); align-items: flex-start; padding-top: var(--s8); }
.atlas-start__opis { flex: 2 1 340px; min-width: 0; }
.atlas-start__opis > p { margin-top: var(--s5); max-width: 34ch; font-size: 19px; color: var(--tekst-2); }
.atlas-start__opis .link-strzalka { margin-top: var(--s3); }
.sen-dnia { display: block; margin-top: var(--s5); max-width: 380px; color: var(--tekst) !important; text-decoration: none; }
.sen-dnia__etykieta { display: block; font-family: var(--bezszeryf); font-size: 15px; color: var(--zloto-tekst); }
.sen-dnia__nazwa { display: block; margin-top: var(--s1); font-style: italic; font-size: 34px; line-height: 1.1; }
.sen-dnia__opis { display: block; margin-top: var(--s2); font-size: 17px; color: var(--tekst-2); }
.sen-dnia:hover .sen-dnia__nazwa { color: var(--sliwa); }

.spis { flex: 3 1 480px; min-width: 0; border-top: 5px double var(--zloto-ramka); }
.spis__pozycja { display: flex; align-items: baseline; gap: var(--s3); padding: var(--s4) 0 var(--s3); border-bottom: 1px solid var(--linia); color: var(--tekst) !important; text-decoration: none; }
.spis__nr { flex: 0 0 89px; font-family: var(--bezszeryf); font-size: 15px; color: var(--zloto-tekst); }
.spis__nazwa { flex: 0 1 auto; min-width: 0; }
.spis__nazwa span { display: block; font-size: 29px; line-height: 1.1; transition: color .3s; }
.spis__nazwa em { display: block; margin-top: var(--s1); font-size: 16px; color: var(--tekst-3); }
.spis__kropki { flex: 1 1 21px; min-width: 21px; align-self: center; border-bottom: 2px dotted var(--zloto-ramka); transform: translateY(-8px); }
.spis__liczba { flex: none; font-style: italic; font-size: 18px; color: var(--zloto-tekst); }
.spis__pozycja:hover .spis__nazwa span { color: var(--sliwa); }
.spis--siatka { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr)); column-gap: var(--s7); margin-top: var(--s5); }
@media (max-width: 600px) {
	.spis__pozycja { flex-wrap: wrap; row-gap: 0; }
	.spis__nr { flex-basis: 100%; font-size: 13px; }
	.spis__nazwa span { font-size: 24px; }
}

/* ------------------------------------------------------------------ dziennik na stronie głównej */

.dziennik-start__wnetrze { max-width: var(--szer); margin: 0 auto; padding: var(--s7) var(--s5); display: flex; flex-wrap: wrap; gap: var(--s6) var(--s7); align-items: center; }
.dziennik-start__wnetrze > div:first-child { flex: 5 1 400px; min-width: 0; }
.tytul-noc { font-weight: 400; font-size: clamp(42px, 5vw, 62px); line-height: 1.02; letter-spacing: -0.02em; }
.dziennik-start__wnetrze p { margin: var(--s5) 0; max-width: 42ch; font-size: 19px; color: var(--mgla-2); }
.kartka-wrap { position: relative; flex: 4 1 360px; min-width: 0; padding-top: var(--s4); }
.zakladka { position: absolute; right: 55px; top: 0; z-index: 2; width: 34px; height: 144px; background: linear-gradient(90deg, #A87A26 0%, #F3DC9B 50%, #A87A26 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 86%, 0 100%); }
.kartka { position: relative; background: var(--papier-2); color: var(--tekst); padding: var(--s5) var(--s5) var(--s5) var(--s7); border: 1px solid var(--zloto-ramka); }
.kartka-wrap .kartka { transform: rotate(-2deg); box-shadow: 0 34px 55px -21px rgba(0,0,0,.6); }
.kartka::before { content: ""; position: absolute; left: 55px; top: var(--s4); bottom: var(--s4); width: 1px; background: var(--linia); }
.kartka__data { position: absolute; left: var(--s4); top: var(--s5); writing-mode: vertical-rl; transform: rotate(180deg); font-family: var(--bezszeryf); font-size: 15px; color: var(--zloto-tekst); }
.kartka h3 { font-style: italic; font-size: 29px; line-height: 1.15; }
.kartka p { margin-top: var(--s3); font-size: 17px; color: var(--tekst-2); }
.kartka__etykieta { font-family: var(--bezszeryf); font-size: 15px !important; color: var(--tekst-3) !important; }
.kartka__gwiazdy { font-style: italic; font-size: 20px !important; color: var(--zloto-tekst) !important; margin-top: var(--s1) !important; display: flex; flex-wrap: wrap; gap: var(--s2); }
.kartka__motyw { margin-top: var(--s4) !important; padding: var(--s3) var(--s4); background: var(--noc); color: var(--mleko) !important; font-size: 16px !important; }
.kartka__motyw em { color: var(--zloto); }
.kartka__podpis { margin-top: var(--s4) !important; text-align: center; font-family: var(--bezszeryf); font-size: 14px !important; color: var(--mgla-3) !important; }

.almanach-start { padding-top: var(--s8); }
.fazy { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s4); margin-top: var(--s6); }
.ksiezyc__tlo { fill: #3B2163; stroke: var(--zloto-ramka); stroke-width: .8; }
.ksiezyc__swiatlo { fill: var(--zloto); }
.almanach-start .link-strzalka { margin-top: var(--s5); }

/* ------------------------------------------------------------------ strony z niebem */

.strona-niebo__wnetrze { max-width: var(--szer); margin: 0 auto; padding: var(--s6) var(--s5) var(--s7); }
.strona-niebo__wnetrze--waskie { max-width: 860px; }
.strona-niebo__nad { margin-top: var(--s4); font-family: var(--bezszeryf); font-size: 16px; color: var(--mgla); }
.strona-niebo__tytul { margin-top: var(--s3); font-size: clamp(48px, 7vw, 96px); line-height: .98; letter-spacing: -0.03em; }
.strona-niebo__wstep { margin-top: var(--s4); max-width: 56ch; font-size: 19px; color: var(--mgla-2); }
.strona-niebo__wnetrze--waskie .odczyt-form { margin-top: var(--s7); }

.sciezka ol { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: var(--s1) var(--s2); font-family: var(--bezszeryf); font-size: 15px; }
.sciezka li + li::before { content: "/"; margin-right: var(--s2); opacity: .6; }
.sciezka--noc { color: var(--mgla); }
.sciezka--noc a { color: var(--mgla) !important; }

/* ------------------------------------------------------------------ hasło */

.podglad { padding: var(--s2) var(--s4); background: var(--zloto); color: var(--noc); text-align: center; font-family: var(--bezszeryf); }
.haslo-niebo__wnetrze { max-width: var(--szer); margin: 0 auto; padding: var(--s5) var(--s5) var(--s6); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 460px); gap: var(--s5) var(--s7); align-items: center; }
.haslo-niebo__nad { margin-top: var(--s5); font-style: italic; font-size: 22px; }
.haslo-niebo__tytul { margin-top: var(--s4); font-size: clamp(72px, 10vw, 136px); line-height: .9; letter-spacing: -0.035em; overflow-wrap: anywhere; }
.haslo-niebo__tytul--wariant { font-size: clamp(44px, 6vw, 80px); line-height: 1; }
.haslo-niebo__pod { margin-top: var(--s4); font-style: italic; font-size: 22px; color: var(--mgla); }
.planisfer--haslo .gw__nazwa { font-size: 30px; }
@media (max-width: 860px) {
	.haslo-niebo__wnetrze { grid-template-columns: 1fr; padding: var(--s4) var(--s4) var(--s5); }
	.planisfer--haslo { max-width: 420px; justify-self: center; }
	.haslo-niebo__tytul { font-size: clamp(64px, 20vw, 96px); }
}

.haslo { max-width: var(--szer); margin: 0 auto; padding: var(--s6) var(--s5) 0; display: grid; grid-template-columns: minmax(0, 720px) minmax(0, 340px); justify-content: space-between; gap: var(--s6) var(--s7); }
.haslo__tresc > * + * { margin-top: var(--s5); }
.inicjalowy { font-size: 21px; line-height: 1.6; }
.inicjal { float: left; margin: 6px 10px 0 0; font-weight: 500; font-size: 89px; line-height: .72; }
.haslo__ogolnie { font-size: 17px; color: var(--tekst-2); }
.haslo__faza { clear: both; padding: var(--s4); }
.wydzwiek__gora { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s3); }
.wydzwiek__gora span, .wydzwiek__dol { font-family: var(--bezszeryf); font-size: 15px; color: var(--tekst-3); }
.wydzwiek__gora strong { font-style: italic; font-weight: 500; font-size: 22px; }
.wydzwiek__skala { display: flex; justify-content: space-between; align-items: center; margin-top: var(--s3); max-width: 420px; }
.wydzwiek__faza { display: flex; padding: 3px; border: 1.5px solid transparent; border-radius: 50%; opacity: .55; }
.wydzwiek__faza.biezaca { opacity: 1; border-color: var(--zloto-ramka); box-shadow: 0 0 0 4px var(--papier-2), 0 0 0 5px rgba(156,116,38,.45); }
.wydzwiek__dol { display: flex; justify-content: space-between; margin-top: var(--s2); max-width: 420px; font-size: 14px; }
.glos { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s4); }
.glos__opis { flex: 1 1 200px; font-family: var(--bezszeryf); font-size: 15px; line-height: 1.4; color: var(--tekst-3); }

.sceny { padding-top: var(--s4); }
.sceny__wstep { margin: var(--s3) 0 var(--s4); color: var(--tekst-3); }
.sceny__lista { display: flex; flex-wrap: wrap; gap: var(--s2); }
.scena { margin-top: var(--s4); animation: snio-wejdz .5s ease both; }
.scena h3 { font-style: italic; font-size: 29px; }
.scena p { margin-top: var(--s3); font-size: 18px; line-height: 1.65; }
.scena__tradycja { display: flex; gap: var(--s3); margin-top: var(--s4) !important; padding-top: var(--s3); border-top: 1px solid var(--linia); font-size: 16px !important; color: var(--tekst-2); }
.scena__tradycja svg { flex: none; margin-top: 3px; color: var(--zloto-ramka); }
.scena__tradycja em { color: var(--zloto-tekst); }
.scena__link { display: inline-block; margin-top: var(--s2); font-family: var(--bezszeryf); font-size: 16px; font-weight: 500; line-height: 2.75; }

.haslo__bok { position: relative; }
.bok-sasiedzi { position: sticky; top: var(--s4); }
.bok-sasiedzi h2 { font-size: 29px; }
.bok-sasiedzi > p { margin-top: var(--s2); font-family: var(--bezszeryf); font-size: 15px; color: var(--tekst-3); }
.bok-sasiedzi ul { margin: var(--s4) 0 0; padding: 0; list-style: none; }
.bok-sasiedzi li { padding: var(--s3) 0; border-top: 1px solid var(--linia); }
.bok-sasiedzi a { display: flex; align-items: center; gap: var(--s2); font-style: italic; font-size: 21px; text-decoration: none; color: var(--tekst) !important; }
.bok-sasiedzi a svg { color: var(--zloto-ramka); }
.bok-sasiedzi small { display: block; margin-top: var(--s1); font-family: var(--bezszeryf); font-size: 14px; line-height: 1.4; color: var(--tekst-3); }
@media (max-width: 960px) {
	.haslo { grid-template-columns: 1fr; padding: var(--s5) var(--s4) 0; }
	.bok-sasiedzi { position: static; }
}

.pytania { padding: var(--s6) var(--s4); text-align: center; }
.pytania h2 { font-family: var(--bezszeryf); font-size: 16px; font-weight: 500; letter-spacing: 0; color: var(--mgla); }
.pytania p { max-width: 28ch; margin: var(--s4) auto 0; font-style: italic; font-size: clamp(25px, 3vw, 34px); line-height: 1.25; color: var(--zloto-jasne); }
.pytania .romb + p { margin-top: 0; }

.trzy-okna { max-width: 900px; }
.spojrzenie { display: flex; margin-top: var(--s5); }
.spojrzenie h3 { flex: 0 0 34px; writing-mode: vertical-rl; transform: rotate(180deg); text-align: right; font-style: italic; font-size: 21px; color: var(--zloto-tekst); border-left: 1px solid var(--zloto-ramka); padding-left: var(--s1); }
.spojrzenie--psychologia h3 { color: var(--sliwa); }
.spojrzenie--kultury h3 { color: var(--rozany); }
.spojrzenie--nauka h3 { color: #2F5B6E; }
.spojrzenie__tresc { flex: 1; min-width: 0; padding-left: var(--s4); }
.spojrzenie__tresc p { font-size: 18px; line-height: 1.7; }
.spojrzenie__tresc p + p { margin-top: var(--s3); }
.spojrzenie__tresc .przypis { margin-top: var(--s2); }

.faq { max-width: 900px; }
.faq__pozycja { border-bottom: 1px solid var(--linia); }
.faq__pozycja:first-of-type { margin-top: var(--s4); border-top: 5px double var(--zloto-ramka); }
.faq__pozycja summary { display: flex; justify-content: space-between; gap: var(--s4); padding: var(--s4) 0; font-style: italic; font-size: 22px; cursor: pointer; list-style: none; }
.faq__pozycja summary::-webkit-details-marker { display: none; }
.faq__pozycja summary::after { content: ""; flex: none; width: 9px; height: 9px; margin-top: 10px; background: var(--zloto-ramka); transform: rotate(45deg); transition: transform .3s; }
.faq__pozycja[open] summary::after { transform: rotate(45deg) scale(1.5); background: var(--sliwa); }
.faq__pozycja p { padding: 0 0 var(--s4); font-size: 18px; color: var(--tekst-2); }

.odczyt-pas__wnetrze { max-width: 760px; margin: 0 auto; padding: var(--s7) var(--s4) var(--s7); }
.odczyt-form h2 { font-style: italic; font-weight: 400; font-size: clamp(30px, 4vw, 40px); }
.odczyt-form > p { margin: var(--s3) auto var(--s4); max-width: 46ch; font-size: 17px; color: var(--mgla-2); }
.odczyt-form form { text-align: left; }
.pole__etykieta { display: block; margin-bottom: var(--s2); font-family: var(--bezszeryf); font-size: 15px; color: var(--tekst-3); }
.noc .pole__etykieta, .kartusz--noc .pole__etykieta { color: var(--mgla); }
.odczyt-form textarea { display: block; width: 100%; padding: var(--s3); border: 0; border-bottom: 5px double var(--zloto-ciemne); background: rgba(31,15,56,.6); color: var(--mleko-2); font: italic 20px/1.45 var(--szeryf); resize: vertical; }
.odczyt-form textarea::placeholder { color: #8E7DB0; opacity: 1; }
.odczyt-form .plakietka { width: 100%; margin-top: var(--s4); }

/* ------------------------------------------------------------------ atlas, księga */

.abecadlo__litery { display: flex; flex-wrap: wrap; gap: var(--s1); margin-top: var(--s4); position: sticky; top: 0; z-index: 5; padding: var(--s2) 0; background: var(--papier); }
.abecadlo__litery a, .abecadlo__litery span { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; font-size: 21px; text-decoration: none; }
.abecadlo__litery a { color: var(--tekst) !important; border: 1px solid var(--zloto-ramka); }
.abecadlo__litery a:hover { background: var(--noc); color: var(--zloto) !important; }
.abecadlo__litery span { color: var(--linia); }
.abecadlo__grupa { display: grid; grid-template-columns: 89px minmax(0, 1fr); gap: var(--s4); padding: var(--s5) 0; border-bottom: 1px solid var(--linia); scroll-margin-top: 70px; }
.abecadlo__grupa h3 { font-style: italic; font-size: 55px; line-height: 1; color: var(--zloto-tekst); }
.abecadlo__grupa ul { margin: 0; padding: 0; list-style: none; columns: 3 200px; column-gap: var(--s5); }
.abecadlo__grupa li { break-inside: avoid; }
.abecadlo__grupa a { display: block; padding: var(--s1) 0; font-size: 20px; color: var(--tekst) !important; text-decoration: none; }
.abecadlo__grupa a:hover { color: var(--sliwa) !important; text-decoration: underline; }

.ksiega-lista { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); column-gap: var(--s5); border-top: 5px double var(--zloto-ramka); }
.ksiega-lista a { display: block; padding: var(--s4) 0; border-bottom: 1px solid var(--linia); color: var(--tekst) !important; text-decoration: none; }
.ksiega-lista__nazwa { display: block; font-size: 27px; line-height: 1.15; }
.ksiega-lista__opis { display: block; margin-top: var(--s1); font-family: var(--bezszeryf); font-size: 16px; color: var(--tekst-3); }
.ksiega-lista a:hover .ksiega-lista__nazwa { color: var(--sliwa); }
.ksiegi-nawigacja { display: flex; flex-wrap: wrap; gap: var(--s2); }

/* ------------------------------------------------------------------ odczyt snu */

.odczyt-niebo__wnetrze { max-width: var(--szer); margin: 0 auto; padding: var(--s5) var(--s5) var(--s6); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 560px); gap: var(--s5) var(--s7); align-items: center; }
.odczyt-niebo__sen { margin: var(--s2) 0 0; padding-left: var(--s4); border-left: 1px solid var(--zloto-ciemne); font-style: italic; font-size: 19px; color: var(--mgla-2); }
.odczyt-niebo .strona-niebo__tytul { font-size: clamp(40px, 5vw, 68px); }
.udostepnij { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s4); margin-top: var(--s5); }
.udostepnij__info { flex-basis: 100%; font-family: var(--bezszeryf); font-size: 14px; color: var(--mgla-3); }
@media (max-width: 900px) {
	.odczyt-niebo__wnetrze { grid-template-columns: 1fr; padding: var(--s4); }
}
.odczyt { max-width: 900px; margin: 0 auto; padding: var(--s7) var(--s4) 0; display: grid; gap: var(--s6); }
.odczyt__symbol h2 { font-size: 34px; }
.odczyt__symbol h2 a { color: var(--tekst) !important; text-decoration: none; }
.odczyt__nr { position: absolute; right: var(--s4); top: var(--s4); width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--zloto-ramka); display: flex; align-items: center; justify-content: center; font-style: italic; color: var(--zloto-tekst); }
.odczyt__scena { margin-top: var(--s2); font-style: italic; color: var(--zloto-tekst); }
.odczyt__symbol p { margin-top: var(--s3); font-size: 18px; }
.odczyt__pytanie { color: var(--sliwa); }
.odczyt__zwiazki ul { margin: var(--s4) 0 0; padding: 0; list-style: none; }
.odczyt__zwiazki li { padding: var(--s3) 0; border-bottom: 1px solid var(--linia); }
.odczyt__zwiazki svg { color: var(--zloto-ramka); vertical-align: -2px; }
.odczyt__zapisz { text-align: center; }
.odczyt__zapisz h2 { font-style: italic; font-size: 34px; }
.odczyt__zapisz p { margin: var(--s3) 0 var(--s4); }
.zapisz__status { margin-top: var(--s3) !important; font-family: var(--bezszeryf); font-size: 15px; color: var(--tekst-3); }

/* ------------------------------------------------------------------ dziennik */

.dziennik-wejscie .kartusz { max-width: 640px; margin-left: auto; margin-right: auto; }
.dziennik-wejscie h2 { font-style: italic; font-size: 34px; }
.lista-gwiazd { margin: var(--s4) 0 0; padding: 0; list-style: none; text-align: left; }
.lista-gwiazd li { display: flex; gap: var(--s3); padding: var(--s2) 0; font-size: 17px; }
.lista-gwiazd svg { flex: none; margin-top: 6px; color: var(--zloto-ramka); }

.dziennik { max-width: var(--szer); margin: 0 auto; padding: var(--s6) var(--s5) 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 340px); grid-template-areas: "nowy bok" "wpisy bok"; gap: var(--s6) var(--s7); align-items: start; }
.dziennik__nowy { grid-area: nowy; }
.dziennik__bok { grid-area: bok; display: grid; gap: var(--s5); }
.dziennik__wpisy { grid-area: wpisy; }
.dziennik__nowy h2, .dziennik__bok h2 { font-style: italic; font-size: 29px; margin-bottom: var(--s4); }
.pola { display: flex; flex-wrap: wrap; gap: 0 var(--s4); }
.pole { margin: 0 0 var(--s4); flex: 1 1 200px; }
.pole--szerokie { flex: 3 1 300px; }
.pole input[type="text"], .pole input[type="date"], .pole select, .pole textarea { display: block; width: 100%; padding: var(--s2) var(--s3); border: 1px solid var(--linia); border-bottom: 5px double var(--zloto-ramka); background: #fff; color: var(--tekst); font: 18px var(--szeryf); }
.pole textarea { font-style: italic; line-height: 1.5; resize: vertical; }
.skala { border: 0; padding: 0; }
.skala label { display: inline-flex; }
.skala input { position: absolute; opacity: 0; }
.skala span { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--zloto-ramka); margin-right: var(--s1); cursor: pointer; font-style: italic; }
.skala input:checked + span { background: var(--noc); color: var(--zloto); }
.skala input:focus-visible + span { outline: 2px solid var(--sliwa); outline-offset: 2px; }
.pole--check label { display: flex; gap: var(--s2); align-items: center; min-height: 44px; font-size: 17px; }
.motywy, .fazy-lista { margin: 0; padding: 0; list-style: none; }
.motywy li, .fazy-lista li { display: flex; align-items: center; gap: var(--s3); padding: var(--s2) 0; border-bottom: 1px solid var(--linia); }
.motywy a { flex: 1; font-style: italic; font-size: 21px; color: var(--tekst) !important; text-decoration: none; }
.motywy span, .fazy-lista strong { font-family: var(--bezszeryf); color: var(--zloto-tekst); }
.fazy-lista span { flex: 1; }
.kartka--wpis { margin-top: var(--s5); }
.kartka__glowa { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s3); }
.kartka__tresc { white-space: normal; }
.kartka__meta { display: flex; flex-wrap: wrap; gap: var(--s2) var(--s4); font-family: var(--bezszeryf); font-size: 14px !important; color: var(--tekst-3) !important; }
.kartka__usun { margin-top: var(--s3); color: var(--rozany); }
@media (max-width: 960px) {
	.dziennik { grid-template-columns: 1fr; grid-template-areas: "nowy" "bok" "wpisy"; padding: var(--s5) var(--s4) 0; }
	.kartka { padding: var(--s4) var(--s4) var(--s4) var(--s6); }
	.kartka::before { left: 40px; }
	.kartka__data { left: var(--s2); }
}

/* ------------------------------------------------------------------ almanach */

.almanach-niebo { display: flex; flex-wrap: wrap; gap: var(--s5) var(--s7); align-items: center; justify-content: space-between; }
.almanach-niebo > div:first-child { flex: 1 1 480px; min-width: 0; }
.almanach-niebo__ksiezyc { text-align: center; font-family: var(--bezszeryf); color: var(--mgla); }
.almanach-niebo__ksiezyc p { margin-top: var(--s2); }
.almanach-niebo__ksiezyc strong { color: var(--zloto-jasne); font-family: var(--szeryf); font-style: italic; font-weight: 500; font-size: 19px; }
.ksiezyc--duzy { filter: drop-shadow(0 0 34px rgba(232,199,122,.35)); }
.almanach__lista { margin: var(--s5) 0 0; padding: 0; list-style: none; border-top: 5px double var(--zloto-ramka); }
.almanach__lista li { display: grid; grid-template-columns: 34px minmax(120px, 220px) minmax(0, 1fr); align-items: center; gap: var(--s3); padding: var(--s3) 0; border-bottom: 1px solid var(--linia); }
.almanach__nr { font-style: italic; color: var(--zloto-tekst); }
.almanach__lista a { font-size: 22px; color: var(--tekst) !important; text-decoration: none; }
.almanach__pasek { height: 8px; background: var(--lila); }
.almanach__pasek span { display: block; height: 100%; background: var(--folia); }
.almanach__zbieramy { max-width: 720px; margin-top: var(--s5); }
.postep { height: 8px; margin-top: var(--s4); background: var(--lila); }
.postep span { display: block; height: 100%; background: var(--folia); }
.almanach-jak p { margin-top: var(--s4); max-width: 68ch; font-size: 18px; color: var(--tekst-2); }

/* ------------------------------------------------------------------ czytelnia */

.wpisy { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: var(--s5); margin-top: var(--s4); }
.wpis-karta h2 { margin-top: var(--s2); font-size: 27px; }
.wpis-karta h2 a { color: var(--tekst) !important; text-decoration: none; }
.wpis-karta p { margin-top: var(--s3); font-size: 17px; }
.proza { max-width: 760px; }
.proza > * + * { margin-top: var(--s4); }
.proza h2 { margin-top: var(--s6); font-size: 34px; }
.proza h3 { margin-top: var(--s5); font-size: 25px; }
.proza p, .proza li { font-size: 19px; line-height: 1.7; }
.proza blockquote { margin-left: 0; padding-left: var(--s4); border-left: 1px solid var(--zloto-ramka); font-style: italic; }
.navigation.pagination { margin-top: var(--s6); font-family: var(--bezszeryf); }
.nav-links { display: flex; gap: var(--s3); }

/* ------------------------------------------------------------------ stopka */

.stopka { border-top: 5px double var(--zloto-ciemne); }
.stopka__wnetrze { max-width: var(--szer); margin: 0 auto; padding: var(--s6) var(--s5) var(--s7); display: flex; flex-wrap: wrap; gap: var(--s5) var(--s7); justify-content: space-between; }
.stopka__kolofon { flex: 1 1 340px; }
.stopka__kolofon p { margin-top: var(--s3); max-width: 50ch; font-style: italic; font-size: 16px; line-height: 1.6; color: var(--mgla); }
.stopka__menu { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 0 var(--s5); font-family: var(--bezszeryf); font-size: 17px; }
.stopka__menu a { color: var(--mleko) !important; line-height: 2.6; }

/* ------------------------------------------------------------------ hasło: części */

.haslo-niebo__tagi { margin-top: var(--s3); font-family: var(--bezszeryf); font-size: 15px; letter-spacing: .04em; color: var(--mgla-3); }
.czesc { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--s4); align-items: baseline; scroll-margin-top: var(--s4); }
.czesc__nr { grid-row: span 2; display: inline-flex; align-items: center; justify-content: center; width: 55px; height: 55px; border-radius: 50%; border: 1px solid var(--zloto-ramka); box-shadow: inset 0 0 0 4px var(--papier), inset 0 0 0 5px rgba(156,116,38,.45); font-style: italic; font-size: 22px; color: var(--zloto-tekst); align-self: center; }
.czesc__tytul { font-size: clamp(32px, 3.6vw, 46px); letter-spacing: -0.02em; }
.czesc__pod { grid-column: 2; margin-top: var(--s2); max-width: 60ch; font-family: var(--bezszeryf); font-size: 16px; line-height: 1.45; color: var(--tekst-3); }
.czesc--noc .czesc__nr { color: var(--zloto); border-color: var(--zloto-ciemne); box-shadow: inset 0 0 0 4px var(--noc), inset 0 0 0 5px rgba(184,134,47,.45); }
.czesc--noc .czesc__pod { color: var(--mgla); }
.czesc-sekcja > .czesc { margin-bottom: var(--s5); }
.czesc-sekcja > * + * { margin-top: var(--s6); }
.czesc-sekcja > .czesc + * { margin-top: 0; }
.sekcja__tytul--mniejszy { font-size: clamp(28px, 3vw, 38px); }
.haslo__akapit { font-size: 19px; line-height: 1.65; }
.haslo__tresc > .czesc + * { margin-top: var(--s4); }

.trafnosc { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); padding: var(--s2) 0; border-top: 1px solid var(--linia); border-bottom: 1px solid var(--linia); }
.trafnosc__pyt { font-family: var(--bezszeryf); font-size: 15px; color: var(--tekst-3); margin-right: var(--s1); }
.trafnosc button { border: 0; cursor: pointer; }
.trafnosc--oddana button { opacity: .45; pointer-events: none; }
.trafnosc--oddana button[aria-pressed="true"] { opacity: 1; background: var(--folia); }
.trafnosc__dzieki { font-family: var(--bezszeryf); font-size: 15px; color: var(--zloto-tekst); }

.znak__glowa { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--s2) var(--s4); margin-bottom: var(--s3); }
.znak h3 { font-style: italic; font-size: 27px; }
.znak__werdykt { font-style: italic; font-size: 19px; color: var(--zloto-tekst); }
.znak__werdykt span { font-family: var(--bezszeryf); font-style: normal; font-size: 14px; color: var(--tekst-3); }
.znak--zly .znak__werdykt { color: var(--rozany); }
.znak--dobry .znak__werdykt { color: #3E6B4A; }
.znak p { font-size: 18px; line-height: 1.65; }
.znak p + p { margin-top: var(--s3); }

.haslo__bok-lepki { position: sticky; top: var(--s4); display: grid; gap: var(--s5); }
.haslo__bok-lepki .bok-sasiedzi { position: static; }
.spis-hasla { padding: var(--s4); }
.spis-hasla h2 { font-family: var(--bezszeryf); font-size: 15px; font-weight: 500; letter-spacing: .04em; color: var(--tekst-3); }
.spis-hasla ol { margin: var(--s3) 0 0; padding: 0; list-style: none; }
.spis-hasla li a { display: flex; align-items: baseline; gap: var(--s3); padding: var(--s2) 0; font-style: italic; font-size: 20px; color: var(--tekst) !important; text-decoration: none; border-top: 1px solid var(--linia); }
.spis-hasla li a span { flex: 0 0 29px; font-size: 15px; color: var(--zloto-tekst); }
.spis-hasla li a:hover { color: var(--sliwa) !important; }
.spis-hasla__granica { margin-top: var(--s2); border-top: 5px double var(--zloto-ramka); }
.spis-hasla__granica a { border-top: 0 !important; }

/* twój sen */
.warstwa__tytul { font-style: italic; font-size: clamp(25px, 2.6vw, 31px); }
.warstwa__wstep { margin-top: var(--s2); font-family: var(--bezszeryf); font-size: 16px; color: var(--tekst-3); }
.warstwa > p, .warstwa > .warstwa__tytul + p { margin-top: var(--s3); font-size: 18px; line-height: 1.7; }
.warstwa > p + p { margin-top: var(--s3); }
.emocje__lista { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s4); }
.emocje__lista button { border: 0; cursor: pointer; }
.emocje__lista button[aria-pressed="true"] { background: var(--folia); font-weight: 600; }
.emocje__panel { margin-top: var(--s4); max-width: 720px; animation: snio-wejdz .4s ease both; }
.emocje__panel h4 { font-family: var(--szeryf); font-style: italic; font-weight: 500; font-size: 23px; margin: 0; }
.emocje__panel p { margin-top: var(--s2); font-size: 18px; }
.rozklad { margin-top: var(--s5); max-width: 560px; }
.rozklad__tytul { font-family: var(--bezszeryf); font-size: 15px; color: var(--tekst-3); }
.rozklad__lista { margin: var(--s3) 0 0; padding: 0; list-style: none; }
.rozklad__lista li { display: grid; grid-template-columns: 130px minmax(0, 1fr) 44px; align-items: center; gap: var(--s3); padding: var(--s1) 0; font-style: italic; }
.rozklad__lista strong { font-family: var(--bezszeryf); font-style: normal; font-weight: 500; font-size: 15px; color: var(--zloto-tekst); text-align: right; }
.rozklad__pasek { height: 8px; background: var(--lila); }
.rozklad__pasek span { display: block; height: 100%; background: var(--folia); }
.sytuacje { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: var(--s4) var(--s5); margin-top: var(--s4); }
.sytuacja { padding-top: var(--s3); border-top: 5px double var(--zloto-ramka); }
.sytuacja h4 { margin: 0; font-family: var(--szeryf); font-style: italic; font-weight: 500; font-size: 23px; }
.sytuacja p { margin-top: var(--s2); font-size: 17px; line-height: 1.6; color: var(--tekst-2); }
.dwie-kolumny { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: var(--s6) var(--s7); }
.spojrzenie--cialo h3 { color: #6B4A2F; }
.czesc-sekcja .spojrzenie { max-width: 900px; }

/* granica */
.granica { padding: var(--s6) var(--s4) var(--s5); text-align: center; border-top: 5px double var(--zloto-ciemne); }
.granica__linia { display: flex; align-items: center; justify-content: center; gap: var(--s4); }
.granica__linia span { flex: 0 1 233px; height: 1px; background: linear-gradient(90deg, transparent, var(--zloto-ciemne)); }
.granica__linia span:last-child { background: linear-gradient(90deg, var(--zloto-ciemne), transparent); }
.granica__tekst { margin-top: var(--s4); font-style: italic; font-size: clamp(26px, 3.2vw, 38px); line-height: 1.2; color: var(--zloto-jasne); }
.granica__pod { max-width: 58ch; margin: var(--s3) auto 0; font-family: var(--bezszeryf); font-size: 16px; line-height: 1.5; color: var(--mgla); }
.wierzenia { padding-bottom: var(--s8); border-top: 0 !important; }
.wierzenia .sekcja { padding-top: var(--s5); }
.wierzenia__siatka { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: var(--s5); }
.wierzenie h3 { font-style: italic; font-size: 25px; color: var(--zloto-jasne); }
.wierzenie p { margin-top: var(--s3); font-size: 17px; line-height: 1.65; color: var(--mgla-2); }
.wierzenie .przypis { color: var(--mgla-3); }
.wierzenie--szerokie { grid-column: 1 / -1; }
.wierzenie--szerokie > p { max-width: 70ch; }
.dawne__cytat { margin: var(--s4) 0 0; }
.dawne__cytat blockquote { margin: 0; padding-left: var(--s4); border-left: 1px solid var(--zloto-ciemne); }
.dawne__cytat blockquote p { margin-top: 0; font-style: italic; font-size: 19px; color: var(--mleko); }
.dawne__cytat .dawne__oryginal { margin-top: var(--s2); font-size: 15px; color: var(--mgla-3); }
.dawne__cytat figcaption { margin-top: var(--s2); padding-left: var(--s4); font-family: var(--bezszeryf); font-size: 14px; color: var(--zloto); }
.liczby__kule { display: flex; flex-wrap: wrap; gap: var(--s2); margin: var(--s4) 0 0; padding: 0; list-style: none; }
.liczby__kule li { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #FFF6DC 0%, #E8C77A 45%, #9C7426 100%); color: var(--noc); font-weight: 600; font-size: 18px; box-shadow: 0 0 0 1px var(--zloto-ciemne), 0 5px 13px -5px rgba(0,0,0,.6); }
.liczby__num strong { font-style: italic; font-size: 25px; color: var(--zloto-jasne); }

/* wokół */
.zwroty { margin: var(--s3) 0 0; }
.zwroty dt { margin-top: var(--s3); font-style: italic; font-size: 20px; }
.zwroty dd { margin: var(--s1) 0 0; font-family: var(--bezszeryf); font-size: 16px; color: var(--tekst-3); }
.pary__lista { display: flex; flex-wrap: wrap; gap: var(--s2); margin: var(--s3) 0 0; padding: 0; list-style: none; }
.pary__lista a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--s4); background: var(--papier-2); border: 1px solid var(--zloto-ramka); font-style: italic; font-size: 18px; color: var(--tekst) !important; text-decoration: none; }
.pary__lista a:hover { background: var(--noc); color: var(--zloto) !important; }
.scena-warstwy > * + * { margin-top: var(--s4); }

/* para i sytuacja */
.para-dwa { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: var(--s5); }
.para-dwa__symbol h2 { font-style: italic; font-size: 34px; }
.para-dwa__symbol h2 a { color: var(--tekst) !important; text-decoration: none; }
.para-dwa__symbol p { margin-top: var(--s3); font-size: 18px; }
.sytuacja-lista { margin: 0; padding: 0; list-style: none; max-width: 860px; border-top: 5px double var(--zloto-ramka); }
.sytuacja-lista li { padding: var(--s4) 0; border-bottom: 1px solid var(--linia); }
.sytuacja-lista h2 { font-style: italic; font-size: 29px; }
.sytuacja-lista h2 a { color: var(--tekst) !important; text-decoration: none; }
.sytuacja-lista p { margin-top: var(--s2); font-size: 18px; color: var(--tekst-2); }

/* udostępnij sen */
.dziel-sen__wnetrze { max-width: 760px; margin: 0 auto; padding: var(--s7) var(--s4) 0; }
.dziel-sen h2 { font-style: italic; font-weight: 400; font-size: clamp(28px, 3.6vw, 38px); }
.dziel-sen .kartusz > p { margin: var(--s3) auto var(--s4); max-width: 52ch; color: var(--mgla-2); }
.dziel-sen form { text-align: left; }
.dziel-sen textarea { display: block; width: 100%; padding: var(--s3); border: 0; border-bottom: 5px double var(--zloto-ciemne); background: rgba(31,15,56,.6); color: var(--mleko-2); font: italic 18px/1.5 var(--szeryf); resize: vertical; margin-bottom: var(--s4); }
.dziel-sen select { display: block; width: 100%; min-height: 44px; padding: 0 var(--s2); border: 1px solid var(--zloto-ciemne); background: var(--noc-4); color: var(--mleko); font: 17px var(--szeryf); }
.zgoda { display: flex; gap: var(--s2); align-items: flex-start; font-family: var(--bezszeryf); font-size: 15px; color: var(--mgla); }
.zgoda input { margin-top: 4px; width: 18px; height: 18px; accent-color: var(--zloto); }
.dziel-sen .plakietka { width: 100%; margin-top: var(--s4); }
.noc .zapisz__status { color: var(--mgla); }

.sny-czytelnikow { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); gap: var(--s5); margin-top: var(--s4); }
.sen-czytelnika p { font-size: 17px; }

/* ------------------------------------------------------------------ panel „Mój sen” */

.moj-sen { position: fixed; right: var(--s4); bottom: var(--s4); z-index: 60; font-family: var(--szeryf); }
.moj-sen__przycisk { display: flex; align-items: center; gap: var(--s2); min-height: 55px; padding: 0 var(--s4) 0 var(--s3); border: 1px solid var(--zloto-ciemne); border-radius: 34px; background: var(--noc); color: var(--mleko); font: italic 19px var(--szeryf); cursor: pointer; box-shadow: 0 0 0 4px rgba(36,18,63,.9), 0 0 0 5px rgba(184,134,47,.5), 0 13px 34px -8px rgba(0,0,0,.6); }
.moj-sen__przycisk:hover { color: var(--zloto-jasne); }
.moj-sen__licznik { font-family: var(--bezszeryf); font-style: normal; font-size: 14px; color: var(--zloto); }
.moj-sen__okno { position: absolute; right: 0; bottom: calc(100% + var(--s3)); width: min(360px, calc(100vw - 2 * var(--s4))); max-height: min(70vh, 560px); overflow: auto; padding: var(--s4); background: var(--papier-2); color: var(--tekst); border: 1px solid var(--zloto-ramka); outline: 1px solid rgba(156,116,38,.5); outline-offset: -8px; box-shadow: 0 21px 55px -13px rgba(0,0,0,.6); animation: snio-wejdz .3s ease both; }
.moj-sen__glowa { display: flex; justify-content: space-between; align-items: center; }
.moj-sen__glowa h2 { font-style: italic; font-size: 25px; }
.moj-sen__zamknij { width: 44px; height: 44px; margin-right: -8px; border: 0; background: none; color: var(--zloto-tekst); font-size: 29px; line-height: 1; cursor: pointer; }
.moj-sen__tytul { margin-top: var(--s1); font-style: italic; color: var(--zloto-tekst); }
.moj-sen__gwiazdy { margin: var(--s3) 0 0; padding: 0; list-style: none; counter-reset: gw; }
.moj-sen__gwiazdy li { counter-increment: gw; display: grid; grid-template-columns: 29px minmax(0, 1fr); padding: var(--s2) 0; border-top: 1px solid var(--linia); }
.moj-sen__gwiazdy li::before { content: counter(gw); grid-row: span 2; width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--zloto-ramka); display: flex; align-items: center; justify-content: center; font-style: italic; font-size: 13px; color: var(--zloto-tekst); }
.moj-sen__gwiazdy li.przeczytane::before { content: "✓"; background: var(--noc); color: var(--zloto); font-style: normal; }
.moj-sen__gwiazdy li.tutaj a { color: var(--sliwa) !important; font-weight: 600; }
.moj-sen__gwiazdy a { font-style: italic; font-size: 19px; color: var(--tekst) !important; text-decoration: none; }
.moj-sen__gwiazdy small { grid-column: 2; font-family: var(--bezszeryf); font-size: 14px; color: var(--tekst-3); }
.moj-sen__odczyt .plakietka { width: 100%; margin-top: var(--s4); min-height: 48px; font-size: 18px; }
.moj-sen__inne { margin-top: var(--s3); }
.moj-sen__inne h3 { font-family: var(--bezszeryf); font-size: 14px; font-weight: 500; color: var(--tekst-3); }
.moj-sen__inne .link-przycisk { display: block; min-height: 34px; padding: 0; text-align: left; font-family: var(--szeryf); font-style: italic; font-size: 17px; }
.moj-sen__info { margin-top: var(--s3); padding-top: var(--s2); border-top: 1px solid var(--linia); font-family: var(--bezszeryf); font-size: 13px; color: var(--tekst-3); }
.moj-sen__info .link-przycisk { min-height: 0; font-size: 13px; color: var(--rozany); }
@media (max-width: 600px) {
	.moj-sen { right: var(--s3); bottom: var(--s3); }
	.moj-sen__przycisk { min-height: 48px; font-size: 17px; }
	.czesc__nr { width: 44px; height: 44px; font-size: 18px; }
	.rozklad__lista li { grid-template-columns: 100px minmax(0, 1fr) 40px; }
}
@media print { .moj-sen { display: none; } }

/* ------------------------------------------------------------------ telefony */

@media (max-width: 600px) {
	body { font-size: 17px; }
	.sekcja { padding: var(--s6) var(--s4) 0; }
	.strona-niebo__wnetrze { padding: var(--s5) var(--s4) var(--s6); }
	.kartusz { padding: var(--s4) var(--s4) var(--s3); }
	.kartusz--medalion { padding-top: var(--s6); }
	.dziennik-start__wnetrze { padding: var(--s6) var(--s4); }
	.ornament span { width: 89px; }
	.abecadlo__grupa { grid-template-columns: 1fr; gap: var(--s2); }
	.abecadlo__litery a, .abecadlo__litery span { width: 38px; height: 38px; font-size: 18px; }
	.almanach__lista li { grid-template-columns: 34px 1fr; }
	.almanach__pasek { grid-column: 2; }
	.stopka__wnetrze { padding: var(--s5) var(--s4) var(--s6); }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.planisfer__linie line.nowa { stroke-dashoffset: 0; }
}

/* ------------------------------------------------------------------ 0.3: sceny jako lista, senniki */

.scena-lista { margin-top: var(--s4); border-top: 5px double var(--zloto-ramka); }
.scena-poz { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: var(--s1) var(--s5); padding: var(--s4) 0; border-bottom: 1px solid var(--linia); scroll-margin-top: var(--s5); }
.scena-poz__nazwa { font-style: italic; font-size: 22px; line-height: 1.25; }
.scena-poz__tresc p { font-size: 18px; line-height: 1.6; }
.scena-poz__tresc p + p { margin-top: var(--s2); }
.scena-poz__sennik { display: flex; gap: var(--s2); align-items: baseline; margin-top: var(--s2) !important; font-size: 16px !important; color: var(--tekst-2); }
.scena-poz__sennik svg { flex: none; color: var(--zloto-ramka); }
.scena-poz__sennik em { color: var(--zloto-tekst); }
.scena-poz .scena__link { line-height: 2.2; }
.scena-poz:target { background: linear-gradient(90deg, rgba(232,199,122,.18), transparent 70%); }
@media (max-width: 700px) { .scena-poz { grid-template-columns: 1fr; } }
.senniki__lista { margin: var(--s3) 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 0 var(--s5); }
.senniki__lista div { padding: var(--s3) 0; border-top: 1px solid rgba(184,134,47,.35); }
.senniki__lista dt { font-style: italic; font-size: 19px; color: var(--zloto-jasne); }
.senniki__lista dd { margin: var(--s1) 0 0; font-size: 17px; line-height: 1.55; color: var(--mgla-2); }
.dawne__cytat blockquote p + p { margin-top: var(--s2); }
.dawne__oryginal { margin-top: var(--s2); padding-left: var(--s4); font-family: var(--bezszeryf); font-size: 14px; color: var(--mgla-3); }
.dawne__oryginal summary { cursor: pointer; color: var(--zloto); }
.dawne__oryginal p { margin-top: var(--s2); font-family: var(--szeryf); font-style: italic; font-size: 15px; color: var(--mgla-3); }
.liczby__senniki { margin: var(--s3) 0 0; padding: 0; list-style: none; }
.liczby__senniki li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); padding: var(--s2) 0; border-top: 1px solid rgba(184,134,47,.3); font-size: 15px; color: var(--mgla); }
.liczby__kule--male { display: inline-flex; gap: 5px; margin: 0; }
.liczby__kule--male b { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #FFF6DC 0%, #E8C77A 45%, #9C7426 100%); color: var(--noc); font-size: 15px; box-shadow: 0 0 0 1px var(--zloto-ciemne); }

/* ------------------------------------------------------------------ 0.4: sceny jako opowieści, podsumowanie, połączenia */

.sceny__wstep { margin-top: var(--s2); font-style: italic; color: var(--tekst-2); }
.scena-poz { grid-template-columns: 1fr; max-width: 820px; padding: var(--s5) 0; }
.scena-poz__nazwa { font-size: 25px; }
.scena-poz__tresc p { font-size: 19px; line-height: 1.65; }
.podsumowanie { margin-top: var(--s6); max-width: 900px; }
.podsumowanie__tytul { font-style: italic; font-size: 24px; }
.podsumowanie__tabela { width: 100%; margin-top: var(--s3); border-collapse: collapse; font-size: 17px; }
.podsumowanie__tabela th, .podsumowanie__tabela td { padding: var(--s2) var(--s3); text-align: left; vertical-align: top; border-bottom: 1px solid var(--linia); }
.podsumowanie__tabela thead th { font-family: var(--bezszeryf); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--zloto-tekst); border-bottom: 2px solid var(--zloto-ramka); }
.podsumowanie__tabela tbody th { width: 42%; font-weight: 400; font-style: italic; }
.podsumowanie__tabela tbody th a { color: var(--tekst); }
.podsumowanie__tabela tbody tr:nth-child(odd) { background: rgba(232,199,122,.08); }
@media (max-width: 560px) { .podsumowanie__tabela th, .podsumowanie__tabela td { padding: var(--s2); font-size: 16px; } }
.polaczenia { max-width: 900px; margin-top: var(--s6); }
.polaczenie { padding: var(--s3) 0; border-top: 1px solid var(--linia); }
.polaczenie__nazwa { font-style: italic; font-size: 20px; font-weight: 400; }
.polaczenie p { margin-top: var(--s1); font-size: 18px; line-height: 1.6; }

/* Odczyt AI */
.odczyt-ai { max-width: 860px; margin: 0 auto var(--s6); padding: var(--s5) var(--s5) var(--s4); }
.odczyt-ai__nad { display: flex; gap: var(--s2); align-items: center; font-family: var(--bezszeryf); font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--zloto-tekst); }
.odczyt-ai__tresc { margin-top: var(--s3); }
.odczyt-ai__otwarcie { font-style: italic; font-size: 24px; line-height: 1.4; }
.odczyt-ai__akapit { margin-top: var(--s3); font-size: 19px; line-height: 1.65; }
.odczyt-ai__senniki { margin-top: var(--s4); padding-top: var(--s3); border-top: 1px solid var(--linia); }
.odczyt-ai__senniki h3 { font-style: italic; font-size: 20px; font-weight: 400; }
.odczyt-ai__senniki ul { margin: var(--s2) 0 0; padding: 0; list-style: none; }
.odczyt-ai__senniki li { margin-top: var(--s2); font-size: 17px; line-height: 1.55; }
.odczyt-ai__senniki cite { color: var(--tekst-3); font-size: 15px; }
.odczyt-ai__pytanie { margin-top: var(--s4); font-style: italic; font-size: 20px; color: var(--zloto-tekst); }
.odczyt-ai__info { margin-top: var(--s4); font-family: var(--bezszeryf); font-size: 13px; color: var(--tekst-3); }
.odczyt-ai__czekaj, .odczyt-ai__blad { font-style: italic; color: var(--tekst-2); }
.odczyt-ai__kropki { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--zloto-ramka); animation: snio-puls 1.2s ease-in-out infinite; vertical-align: middle; margin-right: var(--s2); }
@keyframes snio-puls { 0%, 100% { opacity: .25; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.1); } }
@media (prefers-reduced-motion: reduce) { .odczyt-ai__kropki { animation: none; } }
.odczyt__naglowek { margin-bottom: var(--s4); }
@media (max-width: 560px) { .odczyt-ai { padding: var(--s4) var(--s3); } .odczyt-ai__otwarcie { font-size: 21px; } .odczyt-ai__akapit { font-size: 18px; } }
.polaczenia .polaczenie__nazwa { margin: 0; }
.polaczenia .polaczenie p { margin: var(--s1) 0 0; }

.odczyt-ai__hasla { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; margin-top: var(--s4); padding-top: var(--s3); border-top: 1px solid var(--linia); font-family: var(--bezszeryf); font-size: 14px; color: var(--tekst-3); }
.odczyt-ai__senniki strong a { color: inherit; }
.odczyt-ai__cytat { quotes: none; font-style: italic; }
.odczyt-ai__senniki cite { display: block; }

/* ------------------------------------------------------------------ 0.5: inicjał, sceny jako karty */

.inicjalowy::first-letter { float: left; margin: 6px 10px 0 0; font-weight: 500; font-size: 89px; line-height: .72; color: var(--zloto-tekst); }
.sceny__szukaj { margin-top: var(--s3); max-width: 520px; }
.sceny__szukaj input { width: 100%; min-height: 48px; padding: 0 var(--s3); font: inherit; font-size: 18px; color: var(--tekst); background: var(--papier-2); border: 1px solid var(--zloto-ramka); border-radius: 0; }
.sceny__szukaj input:focus { outline: 2px solid var(--zloto-ramka); outline-offset: 2px; }
.sceny__brak { margin-top: var(--s2); font-style: italic; color: var(--tekst-2); }
.sceny__karty { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: var(--s3); margin-top: var(--s4); align-items: start; }
.scena-karta { background: var(--papier-2); border: 1px solid rgba(184,134,47,.45); scroll-margin-top: var(--s5); transition: border-color .2s; }
.scena-karta[open] { grid-column: 1 / -1; border-color: var(--zloto-ramka); box-shadow: 0 6px 24px rgba(42,25,74,.08); }
.scena-karta summary { list-style: none; cursor: pointer; padding: var(--s3) var(--s6) var(--s3) var(--s3); position: relative; min-height: 44px; }
.scena-karta summary::-webkit-details-marker { display: none; }
.scena-karta summary::after { content: '+'; position: absolute; right: var(--s3); top: var(--s3); font-size: 24px; line-height: 1; color: var(--zloto-tekst); }
.scena-karta[open] summary::after { content: '−'; }
.scena-karta summary:hover .scena-karta__nazwa { color: var(--zloto-tekst); }
.scena-karta summary:focus-visible { outline: 2px solid var(--zloto-ramka); outline-offset: -2px; }
.scena-karta__nazwa { margin: 0; font-style: italic; font-weight: 400; font-size: 21px; line-height: 1.3; }
.scena-karta__sedno { margin: var(--s1) 0 0; font-family: var(--bezszeryf); font-size: 15px; line-height: 1.45; color: var(--tekst-3); }
.scena-karta__tresc { padding: 0 var(--s3) var(--s4); max-width: 820px; }
.scena-karta__tresc p { font-size: 19px; line-height: 1.65; }
.scena-karta__tresc p + p { margin-top: var(--s2); }
.scena-karta:target, .scena-karta.podswietl { border-color: var(--zloto-ramka); background: linear-gradient(90deg, rgba(232,199,122,.22), var(--papier-2) 70%); }
.dawne__zapisy > summary { cursor: pointer; margin-top: var(--s2); font-family: var(--bezszeryf); font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--zloto-jasne); }
.dawne__zapisy[open] > summary { margin-bottom: var(--s3); }

/* ------------------------------------------------------------------ 0.6: przewodnik, maszyna snu, zakładki, tajemnica */

.haslo-niebo__odp { margin-top: var(--s4); max-width: 34em; font-size: 21px; line-height: 1.5; color: var(--mleko-2); }

/* pigułki nawigacji, przyklejone u góry */
.pigulki { position: sticky; top: 0; z-index: 15; background: rgba(31,15,56,.95); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); border-bottom: 1px solid rgba(184,134,47,.45); }
.papier + .pigulki, .pigulki + .papier { border-top: 0; }
.pigulki__rzad { display: flex; gap: var(--s2); max-width: var(--szer); margin: 0 auto; padding: 10px var(--s5); overflow-x: auto; scrollbar-width: none; }
.pigulki__rzad::-webkit-scrollbar { display: none; }
.pigulka { flex: none; display: inline-flex; align-items: center; min-height: 38px; padding: 0 16px; border: 1px solid rgba(232,199,122,.45); border-radius: 999px; font-family: var(--bezszeryf); font-size: 15px; color: var(--zloto-jasne); text-decoration: none; white-space: nowrap; transition: background .2s, color .2s; }
.pigulka:hover { background: rgba(232,199,122,.12); color: var(--mleko-2); }
.pigulka.aktywna, .noc .pigulka.aktywna { background: var(--folia); color: var(--noc) !important; border-color: transparent; }
.czesc, .sekcja__tytul, .kotwica, .faq { scroll-margin-top: 76px; }
.haslo__bok-lepki { top: 72px; }
.kotwica { display: block; height: 0; }

/* jasny papier dla sekcji przeplatanych */
.papier--jasny { background: var(--papier-2); }

/* W skrócie */
.w-skrocie h2 { font-style: italic; font-size: 24px; }
.w-skrocie p { margin-top: var(--s3); font-size: 17px; line-height: 1.55; }
.w-skrocie strong { color: var(--zloto-tekst); font-weight: 600; }

/* chipy (przyciski wyboru) */
.chip { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1px solid var(--linia); border-radius: 999px; background: var(--papier-2); color: var(--tekst); font-family: var(--bezszeryf); font-size: 16px; cursor: pointer; transition: border-color .2s, background .2s, color .2s; }
.chip:hover { border-color: var(--zloto-ramka); }
.chip[aria-pressed="true"] { background: var(--noc); color: var(--zloto-jasne); border-color: var(--noc); }
.chip--maly { min-height: 38px; padding: 0 14px; font-size: 15px; }

/* maszyna snu */
.maszyna__uklad { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 460px); gap: var(--s6); align-items: start; margin-top: var(--s5); }
.maszyna__krok { margin: 0 0 var(--s5); padding: 0; border: 0; min-width: 0; }
.maszyna__krok legend { padding: 0; margin-bottom: var(--s3); font-family: var(--bezszeryf); font-weight: 700; font-size: 17px; color: var(--tekst); }
.maszyna__chipy { display: flex; flex-wrap: wrap; gap: var(--s2); }
.maszyna__krok .rozklad { margin-top: var(--s4); }
.maszyna__odczyt { position: sticky; top: 76px; min-height: 340px; }
.maszyna__nad { font-family: var(--bezszeryf); font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--zloto); }
.maszyna__nad span { color: var(--mgla-3); letter-spacing: .04em; text-transform: none; }
.maszyna__zacheta { margin-top: var(--s3); font-style: italic; font-size: 22px; line-height: 1.45; color: var(--mleko-2); }
.maszyna__info { margin-top: var(--s4); font-family: var(--bezszeryf); font-size: 14px; color: var(--mgla-3); }
.maszyna__sedno { margin-top: var(--s3); font-size: 27px; line-height: 1.25; color: var(--zloto-jasne); }
.maszyna__odczyt [data-m-tresc] p { margin-top: var(--s3); font-size: 18px; line-height: 1.6; color: var(--mgla-2); }
.maszyna__odczyt [data-m-tresc] strong { color: var(--mleko-2); font-weight: 600; }
.maszyna__odczyt .jesli { border-top-color: rgba(232,199,122,.3); }
.maszyna__odczyt .jesli__nad { color: var(--zloto); }
.maszyna__odczyt .wyjscie { color: var(--zloto-jasne); }
.maszyna__dalej { margin-top: var(--s4); display: inline-flex; }
@media (max-width: 900px) {
	.maszyna__uklad { grid-template-columns: 1fr; gap: var(--s4); }
	.maszyna__odczyt { position: relative; top: 0; min-height: 0; margin-inline: 7px; }
}

/* rozwidlenia „jeśli” i wyjście */
.jesli { margin-top: var(--s3); padding-top: var(--s3); border-top: 1px solid var(--linia); }
.jesli__nad { font-family: var(--bezszeryf); font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--zloto-tekst); }
.jesli p { margin-top: var(--s2); font-size: 17px; line-height: 1.55; }
.wyjscie { margin-top: var(--s3); font-style: italic; font-size: 19px; line-height: 1.5; color: var(--zloto-tekst); }
.scena-karta__akcje { display: flex; flex-wrap: wrap; gap: var(--s3); align-items: center; margin-top: var(--s4) !important; }

/* narzędzia scen */
.sceny__narzedzia { display: flex; flex-wrap: wrap; gap: var(--s3) var(--s5); align-items: center; justify-content: space-between; margin-top: var(--s4); }
.sceny__filtry { display: flex; flex-wrap: wrap; gap: var(--s2); }
.sceny__narzedzia .sceny__szukaj { margin-top: 0; flex: 0 1 360px; }
.sceny__narzedzia .sceny__szukaj input { border-radius: 999px; padding: 0 var(--s4); }

/* zakładki „Co wiemy” */
.taby { display: flex; flex-wrap: wrap; gap: 0 var(--s2); margin-top: var(--s5); border-bottom: 1px solid var(--linia); }
.tab { min-height: 46px; padding: 0 var(--s4); border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; background: none; font-family: var(--bezszeryf); font-size: 17px; color: var(--tekst-3); cursor: pointer; }
.tab:hover { color: var(--tekst); }
.tab[aria-selected="true"] { color: var(--tekst); border-bottom-color: var(--zloto-ramka); }
.tab-panel { max-width: 760px; margin-top: var(--s5); }
.tab-panel p { margin-top: var(--s3); font-size: 19px; line-height: 1.65; }
.tab-panel__tytul { font-style: italic; font-size: 24px; }
[data-taby].js-taby .tab-panel__tytul { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.spojrzenia { margin: var(--s3) 0 0; }
.spojrzenia div { padding: var(--s3) 0; border-top: 1px solid var(--linia); }
.spojrzenia dt { font-style: italic; font-size: 20px; }
.spojrzenia dd { margin: var(--s1) 0 0; font-size: 17px; line-height: 1.6; color: var(--tekst-2); }
.zrodla { margin-top: var(--s4); font-family: var(--bezszeryf); font-size: 15px; color: var(--tekst-3); }
.zrodla summary { cursor: pointer; }
.zrodla ul { margin: var(--s2) 0 0; padding-left: var(--s4); }

/* tajemnica: złote kartusze, na telefonie karuzela */
.tajemnice { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: var(--s5); margin-top: var(--s5); }
.tajemnica__nad { font-family: var(--bezszeryf); font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--zloto); }
.tajemnica h3 { margin-top: var(--s2); font-style: italic; font-size: 24px; color: var(--zloto-jasne); }
.tajemnica p { margin-top: var(--s3); font-size: 17px; line-height: 1.65; color: var(--mgla-2); }
.tajemnica__lista { margin: var(--s3) 0 0; padding: 0; list-style: none; }
.tajemnica__lista li { margin-top: var(--s2); font-size: 17px; line-height: 1.55; color: var(--mgla-2); }
.tajemnica__lista em { color: var(--zloto-jasne); }
@media (max-width: 700px) {
	.tajemnice { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: var(--s4); padding: 8px 8px var(--s3); }
	.tajemnice > .tajemnica { flex: 0 0 86%; scroll-snap-align: center; }
}
.archiwum { margin-top: var(--s6); padding-top: var(--s4); border-top: 1px solid rgba(232,199,122,.3); }
.archiwum > summary { cursor: pointer; font-family: var(--bezszeryf); font-size: 15px; color: var(--mgla-3); }
.archiwum > summary:hover { color: var(--zloto-jasne); }
.archiwum__tresc { display: grid; gap: var(--s4); max-width: 820px; margin-top: var(--s4); }
.archiwum__cytat { margin: 0; }
.archiwum__cytat blockquote { margin: 0; font-style: italic; font-size: 16px; line-height: 1.55; color: var(--mgla-2); }
.archiwum__cytat figcaption { margin-top: var(--s1); font-family: var(--bezszeryf); font-size: 13px; color: var(--mgla-3); }
.archiwum__liczby p { font-size: 15px; color: var(--mgla-2); }

/* połączenia w siatce */
.polaczenia__siatka { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 0 var(--s5); }
@media (max-width: 560px) { .pigulki__rzad { padding: 8px var(--s3); } }
.scena-karta.ukryta-tonem { display: none; }
.archiwum__wstep { font-family: var(--bezszeryf); font-size: 15px; color: var(--mgla-3); }
.maszyna__czekaj { margin-top: var(--s3); font-style: italic; color: var(--mgla-3); }
.maszyna__czekaj::before { content: ''; display: inline-block; width: 9px; height: 9px; margin-right: 10px; border-radius: 50%; background: var(--zloto); vertical-align: middle; animation: snio-puls 1.2s ease-in-out infinite; }

/* 0.7: „nie pamiętam” i kilka możliwych odczytów w maszynie */
.chip--brak { border-style: dashed; color: #5b5270; background: transparent; }
.chip--brak[aria-pressed="true"] { background: transparent; color: var(--noc); border-style: solid; border-color: var(--noc); }
.maszyna__odczyt [data-m-tresc] p.maszyna__wstep { font-style: italic; }
.maszyna__warianty { display: grid; gap: var(--s3); margin-top: var(--s3); }
.maszyna__wariant { border-left: 2px solid rgba(232,199,122,.55); padding: 2px 0 2px var(--s3); }
.maszyna__odczyt [data-m-tresc] .maszyna__wariant p { margin-top: 4px; font-size: 17px; }
.maszyna__odczyt [data-m-tresc] .maszyna__wariant p.maszyna__gdy { margin-top: 0; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--zloto-jasne); font-weight: 600; }

/* 0.8: pięć aktów. Twój sen = sceny + dopasowanie w otwartej karcie. */
.twoj-sen .sceny__narzedzia { margin-top: var(--s4); }
.scena-karta--inna { border-style: dashed; background: transparent; }
.scena-karta--inna .scena-karta__nazwa { font-style: italic; }
.scena-karta__miejsce:empty { display: none; }
.dopasuj { margin-top: var(--s5); padding: var(--s4); border: 1px solid rgba(184,134,47,.35); background: var(--papier-2); }
.dopasuj--w-karcie { margin-top: var(--s4); padding: var(--s4) 0 0; border: 0; border-top: 1px solid rgba(184,134,47,.35); background: transparent; }
.dopasuj__tytul { font-family: var(--bezszeryf); font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--zloto-tekst); margin-bottom: var(--s3); }
.dopasuj .maszyna__krok { margin-bottom: var(--s4); }
.dopasuj .maszyna__krok legend { font-size: 16px; }
.dopasuj__sytuacja { margin-top: var(--s3); font-size: 16px; line-height: 1.55; color: var(--tekst-2, #3a3150); }
.dopasuj__sytuacja .link-strzalka { display: inline-block; margin-top: 4px; }
.dopasuj__wynik { margin-top: var(--s4); }
.dopasuj__wynik [data-m-tresc] p { margin-top: var(--s3); font-size: 18px; line-height: 1.6; color: var(--mgla-2); }
.dopasuj__wynik [data-m-tresc] strong { color: var(--mleko-2); font-weight: 600; }
.dopasuj__wynik .wyjscie { color: var(--zloto-jasne); }
.dopasuj__wynik [data-m-tresc] p.maszyna__wstep { font-style: italic; }
.dopasuj__wynik [data-m-tresc] .maszyna__wariant p { margin-top: 4px; font-size: 17px; }
.dopasuj__wynik [data-m-tresc] .maszyna__wariant p.maszyna__gdy { margin-top: 0; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--zloto-jasne); font-weight: 600; }
.dopasuj .maszyna__info { font-size: 13px; }
.twoj-sen__po { margin-top: var(--s6); }
.w-skrocie .wydzwiek { margin-top: var(--s4); padding-top: var(--s3); border-top: 1px solid rgba(184,134,47,.3); }
.w-skrocie .wydzwiek__gora strong { font-size: 18px; }
.w-skrocie .wydzwiek__faza svg { width: 30px; height: 30px; }
.tajemnica--senniki { grid-column: 1 / -1; }
.archiwum--w-karcie { margin-top: var(--s4); padding-top: var(--s3); }
.warstwa__nad { font-family: var(--bezszeryf); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--zloto-tekst); }
@media (max-width: 720px) {
	.dopasuj { padding: var(--s3); }
	.dopasuj--w-karcie { padding: var(--s3) 0 0; }
	.dopasuj__wynik { margin-inline: 0; }
	.tajemnica--senniki { grid-column: auto; }
}
.dopasuj__wskazowka { margin-top: var(--s4); font-family: var(--bezszeryf); font-size: 15px; color: var(--tekst-3, #6b6480); }
.dopasuj__wskazowka::before { content: '✦ '; color: var(--zloto-tekst); }
