@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Fredoka:wght@400;500;600;700&display=swap');
:root{--dark:#173e2d;--forest:#235b3b;--fern:#437c42;--lime:#d9efb5;--pale:#f8f9ed;--cream:#fffaf0;--gold:#ffe483;--wood:#a96238;--wood-dark:#70391f;--ink:#233a2d;--muted:#637867;--line:#dce7d3;--rounded:'Fredoka',system-ui,sans-serif;--body:'DM Sans',Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased}a{color:inherit}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,[role=button]:focus-visible{outline:3px solid #eead27;outline-offset:4px}::selection{background:#ffdf73;color:#203e27}
.container{width:min(1160px,calc(100% - 44px));margin-inline:auto}.skip{position:absolute;left:16px;top:-80px;z-index:100;background:white;padding:12px 20px;border-radius:12px}.skip:focus{top:12px}.topbar{position:sticky;top:0;z-index:80;background:#fffcf2f0;backdrop-filter:blur(14px);border-bottom:1px solid #dfe5d5}.topbar .container{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--rounded);font-size:1.18rem;font-weight:600;line-height:1.1;color:var(--dark)}.brand-icon{background:#e3f1cb;border:2px solid #b5d79a;width:44px;height:44px;display:grid;place-items:center;border-radius:16px;font-size:1.35rem;flex:none}.main-nav{display:flex;gap:5px;flex-wrap:wrap;align-items:center}.main-nav a{font-size:.9rem;font-weight:800;text-decoration:none;padding:10px 14px;border-radius:30px;white-space:nowrap;transition:background .2s}.main-nav a:hover{background:#e8f1d9}.main-nav a:last-child{background:var(--dark);color:white}.main-nav a:last-child:hover{background:#356c49}
.hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 21%,#e5f9ed 0,transparent 55%),linear-gradient(180deg,#cfeaf1 0%,#e8f6d7 49%,#f3e7ab 93%,#f8f9eb 100%);padding:55px 0 76px}.hero:after{content:'';position:absolute;bottom:-55px;left:-10%;width:120%;height:100px;border-radius:50% 50% 0 0;background:#f8f9ed;z-index:1}.sun{position:absolute;top:65px;right:10%;height:128px;width:128px;border-radius:50%;background:#fff2a2;filter:blur(1px);box-shadow:0 0 75px 40px #fdf4ab80}.cloud{position:absolute;background:#ffffffa8;border-radius:100px;height:32px;width:125px;box-shadow:45px -16px 0 2px #ffffff9c,-37px 3px 0 -7px #ffffffa8}.cloud.one{left:5%;top:210px}.cloud.two{right:8%;top:310px;transform:scale(.8)}.hero-head{position:relative;z-index:2;max-width:870px;margin:auto;text-align:center}.overline,.eyebrow{display:inline-flex;align-items:center;gap:7px;color:#8e5a31;font-size:.78rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.overline{padding:10px 17px;border-radius:50px;border:1px solid #f1d694;background:#fff9df}.hero h1{font-family:var(--rounded);font-weight:600;line-height:1.01;letter-spacing:-.04em;color:var(--dark);font-size:clamp(3.25rem,7vw,6.1rem);margin:19px 0}.hero h1 .accent{color:#a45c34}.hero-head>p{font-size:clamp(1rem,1.7vw,1.18rem);line-height:1.65;max-width:680px;margin:0 auto;color:#3e6550}.hero-head strong{color:var(--forest)}.hero-note{background:#fff9e6;border:1px solid #ecd99b;padding:11px 20px;border-radius:30px;margin:24px auto 0;width:fit-content;font-weight:800;font-size:.93rem;box-shadow:0 7px 18px #886b2e12}
.tree-wrap{position:relative;z-index:3;width:min(1080px,100%);margin:-10px auto -10px}.tree-svg{width:100%;height:auto;display:block;overflow:visible;filter:drop-shadow(0 19px 12px #426a3940)}.tree-svg .foliage-detail{opacity:.78}.tree-svg .signboard{filter:drop-shadow(4px 7px 0px #42351e44)}.tree-svg .signboard .wood{fill:url(#woodGradient);stroke:#6a371e;stroke-width:5}.tree-svg .signboard text{fill:#fff4a2;font-family:var(--rounded);font-size:30px;font-weight:700;letter-spacing:.5px;paint-order:stroke;stroke:#8c4821;stroke-width:1.8px}.tree-svg .signboard .plankgrain{stroke:#dc9852;stroke-width:3.5;fill:none;stroke-linecap:round;opacity:.8}.tree-svg .signboard a{cursor:pointer}.tree-svg .signboard a:hover .wood,.tree-svg .signboard a:focus .wood{fill:#bd7743}.tree-svg .signboard a:hover text{fill:#fffcd9}.tree-svg .signboard a:focus{outline:none}.tree-svg .signboard a:focus-visible .wood{stroke:#fff8b7;stroke-width:8}/* Nie animujemy transformacji grup SVG: CSS transform nadpisuje pozycje tabliczek. */.tree-svg .signboard .wood{transition:fill .18s ease,stroke .18s ease}.tree-svg .signboard:hover{filter:brightness(1.07)}/* Liście również zachowują oryginalny SVG transform i stabilny obszar kliknięcia. */.word-leaf{cursor:pointer;outline:none}.word-leaf ellipse{transition:fill .18s ease,stroke .18s ease}.word-leaf:hover ellipse,.word-leaf:focus-visible ellipse{fill:#f2eaaa;stroke:#fff2ab;stroke-width:4}.word-leaf:focus-visible ellipse{stroke:#ffe879;stroke-width:7}.word-leaf .small-label{fill:#255134;font-family:var(--rounded);font-weight:700;font-size:15px;pointer-events:none}.butterfly-svg{animation:flutter 5s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}.bee-svg{animation:beeFly 4s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}.bee-svg.second{animation-delay:-1.7s}.tree-shadow{fill:#567b3266}.tree-discover{width:min(890px,calc(100% - 44px));margin:-2px auto 0;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fffdf3;border:2px solid #dfe8b7;border-radius:27px;padding:19px 24px;box-shadow:0 15px 35px #5262351a;position:relative;z-index:5}.discover-icon{font-size:2.3rem;background:#edf5d6;border-radius:17px;padding:13px}.discover-text{flex:1}.discover-text .mini{display:block;color:#698365;font-size:.76rem;text-transform:uppercase;letter-spacing:.11em;font-weight:800}.discover-text strong{display:block;font-family:var(--rounded);font-size:clamp(1.35rem,3vw,1.75rem);color:var(--dark);line-height:1.25;margin:3px 0}.discover-text p{margin:0;font-size:.92rem;color:#5b6b5d}.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:none;border-radius:40px;padding:14px 22px;gap:8px;font-weight:800;font-size:.94rem;line-height:1.25;transition:transform .2s,box-shadow .2s;white-space:nowrap}.btn:hover{transform:translateY(-3px);box-shadow:0 10px 24px #2d4c2c20}.btn-dark{background:var(--dark);color:white}.btn-sunny{background:var(--gold);color:#53341f}.btn-outline{background:#fff;border:2px solid #d7e4c9;color:var(--dark)}.mobile-tree-nav{display:none}
section.section{padding:95px 0;scroll-margin-top:85px}.section-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.17em;font-weight:800;color:#ad6d39}.section-title{font-family:var(--rounded);font-size:clamp(2.45rem,5vw,4rem);font-weight:600;color:var(--dark);line-height:1.06;letter-spacing:-.03em;margin:12px 0 16px}.section-description{max-width:640px;margin:0;font-size:1.04rem;line-height:1.75;color:#5d735f}.section-top{display:flex;align-items:end;justify-content:space-between;gap:35px;margin-bottom:38px}.section-top>*{min-width:0}.section-mini-art{background:#eff6d5;border:2px solid #dceabd;border-radius:30px;padding:20px 25px;font-size:3rem;transform:rotate(6deg);flex:none}.pale{background:#f8f9ed}.audio-section{background:#fffdf5}.audio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.audio-card{background:#fff;border:1px solid #e4ead8;border-radius:27px;padding:22px;min-width:0;box-shadow:0 8px 28px #3958340e;display:flex;flex-direction:column;gap:12px;transition:transform .2s,box-shadow .2s}.audio-card:hover{transform:translateY(-4px);box-shadow:0 13px 30px #39583419}.audio-top{display:flex;align-items:center;gap:11px}.audio-symbol{height:49px;width:49px;border-radius:17px;background:#e3f1d3;display:grid;place-items:center;font-size:1.5rem}.audio-index{font-size:.76rem;color:#819080;font-weight:800;letter-spacing:.1em}.audio-card h3{font-family:var(--rounded);font-weight:600;font-size:1.27rem;color:var(--dark);line-height:1.3;margin:0;min-height:3.6rem}.audio-card audio{width:100%;height:46px;margin-top:auto}.audio-card a{font-size:.84rem;color:#347047;font-weight:800;text-underline-offset:3px}.audio-card .coming{color:#84684e;background:#fff3dc;border:1px dashed #e6c595;border-radius:13px;padding:12px;font-size:.85rem;margin-top:auto;line-height:1.55}.audio-hint{margin-top:19px;font-size:.86rem;color:#758475;line-height:1.6}
.dictionary{background:linear-gradient(180deg,#edf5df 0%,#f6f8e9 100%)}.dict-tools{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:18px}.input-wrap{position:relative;flex:1 1 300px}.input-wrap span{position:absolute;left:17px;top:50%;transform:translateY(-50%);pointer-events:none}.search-input{width:100%;background:white;border:2px solid #d3e3c6;color:var(--dark);padding:16px 18px 16px 47px;border-radius:18px;min-height:58px;outline-offset:3px}.category-filter{background:white;border:2px solid #d3e3c6;color:var(--dark);padding:16px 18px;border-radius:18px;min-height:58px;flex:0 1 260px}.dict-count{font-weight:800;color:#63805e;font-size:.87rem;margin:0 0 22px}.word-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.word-card{background:#fffef8;border:1px solid #dce8d1;border-radius:24px;padding:23px;min-width:0;box-shadow:0 7px 20px #214a2908;transition:transform .18s}.word-card:hover{transform:translateY(-3px)}.word-card-top{display:flex;gap:11px;align-items:center;margin-bottom:14px}.word-emoji{font-size:1.65rem;background:#eff6e3;padding:9px;border-radius:15px;flex:none}.word-card h3{font-family:var(--rounded);font-size:1.17rem;line-height:1.23;color:var(--dark);font-weight:600;margin:0}.word-category{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.065em;font-weight:800;color:#95a08c;margin-top:4px}.chips{display:flex;flex-wrap:wrap;gap:7px}.word-chip{border:none;background:#e8f2d8;color:#2b673e;border-radius:30px;padding:7px 11px;font-weight:800;font-size:.83rem;line-height:1.3;transition:background .18s,transform .18s;text-align:left}.word-chip:hover{background:#d3e8b6;transform:translateY(-2px)}.empty-state{border:2px dashed #bbd4b0;padding:30px;background:white;text-align:center;border-radius:25px;font-family:var(--rounded);font-size:1.2rem;color:var(--forest)}
.workshop{background:#fffaf0}.workshop-banner{position:relative;overflow:hidden;background:#234d36;border-radius:36px;padding:55px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:34px;box-shadow:0 19px 37px #23543c2b}.workshop-banner:before,.workshop-banner:after{position:absolute;pointer-events:none;font-size:200px;color:#ffffff0c;line-height:1}.workshop-banner:before{content:'❀';right:22%;top:-70px}.workshop-banner:after{content:'✽';right:-40px;bottom:-70px}.workshop-banner .section-label{color:#ffe483}.workshop-banner h2{font:600 clamp(2.3rem,4vw,3.65rem)/1.08 var(--rounded);color:#fff;margin:14px 0}.workshop-banner p{max-width:635px;color:#d5eadd;line-height:1.75;margin:0}.workshop-banner .btn{position:relative;z-index:1}.timeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px}.timeline article{padding:22px 24px;background:#fffcf2;border:1px solid #eee6cf;border-radius:24px}.timeline .number{color:#bf7c36;font-family:var(--rounded);font-size:1.6rem}.timeline h3{font:600 1.15rem/1.3 var(--rounded);color:var(--dark);margin:8px 0}.timeline p{color:#637768;font-size:.91rem;line-height:1.65;margin:0}
.about{background:#f7f7e8}.about-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:start}.paper{padding:32px;border-radius:30px;background:white;border:1px solid #e6e7da}.paper p{line-height:1.8;color:#536957}.paper h3{font:600 1.5rem/1.25 var(--rounded);margin:0 0 13px;color:var(--dark)}.poster-box{display:grid;grid-template-columns:110px 1fr;gap:21px;align-items:center;background:#fff6e4;border:1px solid #eddfbd;padding:18px;border-radius:21px;margin-top:20px}.poster-box img{width:110px;height:150px;object-fit:cover;object-position:top;border-radius:11px;box-shadow:0 6px 15px #4a4b2130}.poster-box h4{font:600 1.2rem var(--rounded);margin:0 0 6px}.poster-box p{margin:0 0 12px;font-size:.87rem;line-height:1.55}.poster-box a{font-size:.86rem;color:#3c7544;font-weight:800}.info-piece{margin-bottom:24px}.info-piece:last-child{margin-bottom:0}.info-piece small{color:#ac7748;letter-spacing:.08em;font-size:.74rem;text-transform:uppercase;font-weight:800}
.funding{background:white;border-top:1px solid #e4e5dc;padding:48px 0}.funding-inner{text-align:center}.funding p{line-height:1.75;font-size:.9rem;color:#465f4d;max-width:820px;margin:0 auto 25px}.funding img{display:block;width:min(800px,100%);height:auto;margin:auto}footer{padding:28px 0;background:#173b2b;color:#e1ecdf;text-align:center;font-size:.85rem}footer a{color:#fce486}footer .container{display:flex;align-items:center;justify-content:space-between;gap:14px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);z-index:100;pointer-events:none;background:#244c35;color:#fff;border-radius:20px;padding:12px 20px;font-weight:800;box-shadow:0 13px 28px #173b2b44;opacity:0;transition:opacity .2s,transform .2s;max-width:calc(100% - 40px);text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}
@keyframes flutter{to{transform:translate(15px,-17px) rotate(9deg)}}@keyframes beeFly{to{transform:translate(-14px,-14px) rotate(-8deg)}}
@media(max-width:950px){.topbar .container{flex-direction:column;padding-top:12px;padding-bottom:12px;gap:10px}.topbar{position:relative}.hero{padding-top:35px}.audio-grid,.word-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workshop-banner{grid-template-columns:1fr}.about-layout{grid-template-columns:1fr}.tree-wrap{margin:0 auto}.timeline{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.container{width:min(100% - 32px,520px)}.hero{padding-top:30px;padding-bottom:72px}.hero h1{font-size:clamp(2.9rem,12vw,4rem)}.hero-head>p{font-size:.98rem}.hero-note{padding:10px 13px;font-size:.77rem}.tree-wrap{width:calc(100% + 45px);margin-left:-22.5px;margin-top:10px}.tree-discover{width:calc(100% - 30px);flex-wrap:wrap;padding:17px;gap:12px}.discover-icon{font-size:1.65rem;padding:9px}.discover-text{flex-basis:calc(100% - 75px)}.tree-discover .btn{width:100%}.mobile-tree-nav{display:grid;grid-template-columns:1fr 1fr;gap:9px;width:calc(100% - 34px);margin:18px auto 0;position:relative;z-index:3}.mobile-tree-nav a{text-align:center;border-radius:17px;background:#fff9dfb5;padding:12px 6px;border:1px solid #dac89e;text-decoration:none;font-weight:800;font-size:.85rem;color:var(--dark)}section.section{padding:70px 0}.section-top{align-items:start;gap:10px}.section-mini-art{display:none}.section-description{font-size:.97rem}.audio-grid,.word-grid{grid-template-columns:1fr}.audio-card h3{min-height:0}.category-filter{flex:1 1 100%;width:100%}.workshop-banner{padding:30px 25px;border-radius:27px}.timeline{grid-template-columns:1fr;gap:10px}.timeline article{padding:18px}.paper{padding:24px}.poster-box{grid-template-columns:80px 1fr;gap:15px}.poster-box img{width:80px;height:115px}.funding{padding:35px 0}footer .container{flex-direction:column}.hero-head .overline{font-size:.68rem}.tree-svg .signboard text{font-size:29px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.word-leaf.chosen ellipse{fill:#ffec96;stroke:#df8e32;stroke-width:4}
@media(max-width:640px){.main-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:2px}.main-nav a{font-size:.79rem;padding:9px 4px;text-align:center}.topbar .container{gap:5px}.brand{margin:0 auto}}

/* WERSJA STABILNA: zachowujemy pozycje z atrybutów transform w SVG.
   Animacja CSS transform zastępuje SVG transform (a nie dodaje do niego),
   więc może teleportować elementy do środka widoku. */
.tree-svg g[transform],.tree-svg g[transform] *,
.tree-svg .bee-svg,.tree-svg .butterfly-svg,
.tree-svg .signboard,.tree-svg .word-leaf{
  animation:none !important;
  transition:none !important;
}
.tree-svg .signboard:hover,.tree-svg .signboard:focus-within{filter:none !important}
.tree-svg .signboard a:hover .wood,.tree-svg .signboard a:focus-visible .wood{fill:#bd7743}
.tree-svg .word-leaf:hover ellipse,.tree-svg .word-leaf:focus-visible ellipse{fill:#f2eaaa;stroke:#fff2ab}
/* Elementy interfejsu także nie przemieszczają się po najechaniu. */
.btn:hover,.audio-card:hover,.word-card:hover,.word-chip:hover{transform:none !important}

/* WERSJA BEZ ANIMACJI: statyczne drzewo z czterema linkami SVG.
   Nie ustawiamy CSS transform dla elementów SVG, aby nie nadpisywać ich
   oryginalnego pozycjonowania z atrybutu transform. */
*,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
.tree-svg, .tree-svg *, .tree-svg *:hover, .tree-svg *:focus { animation:none !important; transition:none !important; }
.tree-svg .signboard, .tree-svg .signboard:hover, .tree-svg .signboard:focus-within { filter:none !important; }
.tree-svg .signboard a:hover .wood, .tree-svg .signboard a:focus .wood, .tree-svg .signboard a:focus-visible .wood { fill:url(#woodGradient) !important; stroke:#6a371e !important; stroke-width:5 !important; }
.tree-svg .signboard a:hover text, .tree-svg .signboard a:focus text { fill:#fff4a2 !important; }
.tree-svg .word-leaf, .tree-svg .word-leaf * { pointer-events:none !important; cursor:default !important; }
.tree-svg .word-leaf:hover ellipse, .tree-svg .word-leaf:focus-visible ellipse { fill:inherit; }
.btn:hover,.audio-card:hover,.word-card:hover,.word-chip:hover { transform:none !important; }
.tree-svg .signboard a { cursor:pointer !important; }