html{
    scroll-behavior:auto;
}

html,
body,
.wrapper,
#content,
.biosfera-story{
    overflow-anchor:none;
}

.biosfera-story{
    max-width:1100px;
    margin:auto;
    padding:40px 20px 60px;
}


.biosfera-audio-toggle{
    margin:0 0 28px;
    display:flex;
    justify-content:flex-end;
}

.biosfera-audio-toggle__label{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:12px 16px;
    border-radius:999px;
    background:#f1f6eb;
    box-shadow:0 6px 16px rgba(0,0,0,.05);
    cursor:pointer;
    font-weight:700;
    line-height:1.2;
}

.biosfera-audio-toggle__checkbox{
    width:18px;
    height:18px;
    margin:0;
    cursor:pointer;
}

.biosfera-audio-toggle__text{
    display:inline-block;
}

.biosfera-story.is-audio-text-hidden .biosfera-text{
    display:none;
}

.biosfera-scene{
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    gap:40px;
    margin-bottom:80px;
    align-items:start;
    scroll-margin-top:24px;
    opacity:0;
    transform:translateY(28px);
    transition:opacity .6s ease, transform .6s ease;
    will-change:opacity, transform;
}

.biosfera-scene:first-child{
    opacity:1;
    transform:translateY(0);
}

.biosfera-scene.is-visible{
    opacity:1;
    transform:translateY(0);
}

.biosfera-scene--quiz,
.biosfera-scene--cta{
    background:#f7fbf1;
    border-radius:24px;
    padding:28px;
}

.biosfera-media{
    width:100%;
    display:grid;
    gap:18px;
}

.biosfera-image{
    margin:0;
    width:100%;
}

.biosfera-image img{
    display:block;
    width:100%;
    max-width:100%;
    height:auto;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.biosfera-image__caption{
    margin-top:8px;
    font-size:14px;
    line-height:1.5;
    opacity:.82;
}

.biosfera-content{
    min-width:0;
}

.biosfera-speaker{
    font-size:28px;
    margin:0 0 15px;
    line-height:1.2;
}

.biosfera-text{
    font-size:18px;
    line-height:1.7;
}

.biosfera-text > *:first-child{
    margin-top:0;
}

.biosfera-text > *:last-child{
    margin-bottom:0;
}

.biosfera-audios{
    margin-top:24px;
    display:grid;
    gap:18px;
}

.biosfera-radio{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:16px 18px;
    border-radius:18px;
    background:linear-gradient(135deg, #203419 0%, #355c24 100%);
    color:#fff;
    box-shadow:0 10px 24px rgba(32,52,25,.22);
}

.biosfera-radio__meta{
    min-width:0;
    flex:1 1 auto;
}

.biosfera-radio__eyebrow{
    margin-bottom:6px;
    font-size:12px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
    opacity:.82;
}

.biosfera-radio__title{
    font-size:16px;
    line-height:1.45;
    font-weight:700;
    word-break:break-word;
}

.biosfera-radio__controls{
    display:flex;
    align-items:center;
    gap:10px;
    flex-shrink:0;
}

.biosfera-radio__btn,
.biosfera-audio__select{
    appearance:none;
    border:0;
    cursor:pointer;
    width:46px;
    height:46px;
    border-radius:999px;
    background:rgba(255,255,255,.14);
    color:#fff;
    font-size:20px;
    line-height:1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:transform .2s ease, background .2s ease, opacity .2s ease;
}

.biosfera-radio__btn:hover,
.biosfera-audio__select:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.22);
}

.biosfera-radio__btn:focus,
.biosfera-audio__select:focus{
    outline:2px solid #fff;
    outline-offset:3px;
}

.biosfera-radio__btn--next{
    font-size:18px;
}

.biosfera-radio__icon--pause{
    display:none;
}

.biosfera-radio__btn.is-playing .biosfera-radio__icon--play{
    display:none;
}

.biosfera-radio__btn.is-playing .biosfera-radio__icon--pause{
    display:inline;
}

.biosfera-audio{
    padding:16px 18px;
    border-radius:18px;
    background:#f8faf6;
    box-shadow:0 6px 16px rgba(0,0,0,.05);
    transition:box-shadow .2s ease, transform .2s ease, background .2s ease;
}

.biosfera-audio.is-active{
    background:#eef7e6;
    box-shadow:0 10px 24px rgba(107,142,35,.16);
    transform:translateY(-1px);
}

.biosfera-audio__head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;
}

.biosfera-audio__title{
    font-weight:700;
    line-height:1.4;
}

.biosfera-audio__select{
    width:38px;
    height:38px;
    background:#6b8e23;
    flex-shrink:0;
}

.biosfera-audio audio{
    width:100%;
}

.biosfera-audio__desc{
    margin-top:10px;
    font-size:14px;
    line-height:1.5;
    opacity:.82;
}

.biosfera-embeds{
    margin-top:24px;
    display:grid;
    gap:20px;
}

.biosfera-embed{
    padding:18px;
    border-radius:18px;
    background:#f8faf6;
    box-shadow:0 6px 16px rgba(0,0,0,.05);
}

.biosfera-embed__title{
    margin-bottom:12px;
    font-weight:700;
    line-height:1.4;
}

.biosfera-embed iframe{
    width:100%;
    max-width:100%;
    min-height:500px;
    border:0;
    border-radius:16px;
}

.biosfera-next-wrap{
    margin-top:34px;
    display:flex;
    justify-content:center;
}

.biosfera-next{
    appearance:none;
    border:0;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:12px;
    padding:14px 22px;
    border-radius:999px;
    font-weight:700;
    font-size:16px;
    line-height:1;
    background:#6b8e23;
    color:#fff;
    box-shadow:0 10px 24px rgba(107,142,35,.22);
    transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.biosfera-next:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 28px rgba(107,142,35,.28);
}

.biosfera-next:focus{
    outline:2px solid #000;
    outline-offset:3px;
}

.biosfera-next__text{
    display:inline-block;
}

.biosfera-next__arrow{
    display:inline-block;
    font-size:22px;
    line-height:1;
    animation:biosferaArrowBounce 1.5s ease-in-out infinite;
}

@keyframes biosferaArrowBounce{
    0%, 100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(6px);
    }
}

@media(max-width:800px){
    .biosfera-story{
        padding:28px 16px 40px;
    }

    .biosfera-audio-toggle{
        justify-content:flex-start;
        margin-bottom:20px;
    }

    .biosfera-audio-toggle__label{
        width:100%;
        justify-content:flex-start;
        border-radius:18px;
    }

    .biosfera-scene{
        grid-template-columns:1fr;
        gap:24px;
        margin-bottom:56px;
    }

    .biosfera-speaker{
        font-size:24px;
    }

    .biosfera-text{
        font-size:16px;
    }

    .biosfera-scene--quiz,
    .biosfera-scene--cta{
        padding:20px;
    }

    .biosfera-radio{
        align-items:flex-start;
        flex-direction:column;
    }

    .biosfera-radio__controls{
        width:100%;
        justify-content:flex-end;
    }

    .biosfera-embed iframe{
        min-height:380px;
    }
}


.biosfera-radio__icon--pause{
    display:none;
}

.biosfera-radio__btn.is-playing .biosfera-radio__icon--play{
    display:none;
}

.biosfera-radio__btn.is-playing .biosfera-radio__icon--pause{
    display:inline;
}

.biosfera-audio__head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;
}

.biosfera-audio__select{
    appearance:none;
    border:0;
    cursor:pointer;
    width:38px;
    height:38px;
    border-radius:999px;
    background:#6b8e23;
    color:#fff;
    font-size:18px;
    line-height:1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    transition:transform .2s ease, background .2s ease, opacity .2s ease;
}

.biosfera-audio__select:hover{
    transform:translateY(-1px);
    background:#5c7b1f;
}

.biosfera-audio__select:focus{
    outline:2px solid #6b8e23;
    outline-offset:3px;
}

.biosfera-audio__title{
    margin-bottom:0;
}

.biosfera-content-main{
    min-width:0;
}

/* =========================
   KRZYŻÓWKA
   ========================= */

.biosfera-scene--crossword{
    background:#f7fbf1;
    border-radius:24px;
    padding:28px;
    grid-template-columns:1fr;
}

.biosfera-scene--crossword .biosfera-content{
    width:100%;
}

.biosfera-scene--crossword .biosfera-content-main{
    display:grid;
    grid-template-columns:minmax(260px, 360px) minmax(0, 1fr);
    gap:32px;
    align-items:start;
    margin-bottom:24px;
}

.biosfera-scene--crossword .biosfera-media{
    align-self:start;
}

.biosfera-scene--crossword .biosfera-story-copy{
    min-width:0;
}

.biosfera-crossword{
    margin-top:10px;
    padding:28px;
    border-radius:24px;
    background:#eef6e7;
    box-shadow:inset 0 0 0 1px rgba(47,84,36,.08);
}

.biosfera-crossword__header{
    margin-bottom:22px;
}

.biosfera-crossword__title{
    margin:0 0 10px;
    font-size:34px;
    line-height:1.1;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.biosfera-crossword__intro{
    font-size:18px;
    line-height:1.65;
    max-width:760px;
}

.biosfera-crossword__board{
    display:grid;
    grid-template-columns:repeat(var(--cw-cols), 46px);
    gap:2px;
    justify-content:start;
    margin:0 0 24px;
}

.biosfera-crossword__cell{
    position:relative;
    width:46px;
    height:46px;
    background:#fff;
    border:2px solid #95ab90;
    border-radius:8px;
    overflow:hidden;
    display:block;
}

.biosfera-crossword__cell--empty{
    background:transparent;
    border-color:transparent;
}

.biosfera-crossword__number{
    position:absolute;
    top:3px;
    left:5px;
    font-size:10px;
    font-weight:700;
    color:#6a6a6a;
    z-index:2;
}

.biosfera-crossword__input{
    width:100%;
    height:100%;
    border:0;
    background:transparent;
    text-align:center;
    font-size:24px;
    font-weight:700;
    text-transform:uppercase;
    color:#203419;
    padding:10px 0 0;
}

.biosfera-crossword__input:focus{
    outline:2px solid #6b8e23;
    outline-offset:-2px;
    background:#f6fbf2;
}

.biosfera-crossword__input.is-correct{
    background:#dff3d3;
}

.biosfera-crossword__input.is-wrong{
    background:#ffe0e0;
}

.biosfera-crossword__actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-bottom:14px;
}

.biosfera-crossword__btn{
    appearance:none;
    border:0;
    cursor:pointer;
    padding:12px 18px;
    border-radius:999px;
    background:#6b8e23;
    color:#fff;
    font-weight:700;
    font-size:15px;
    line-height:1;
    box-shadow:0 8px 20px rgba(107,142,35,.18);
    transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.biosfera-crossword__btn:hover{
    transform:translateY(-1px);
}

.biosfera-crossword__btn--ghost{
    background:#fff;
    color:#315321;
    box-shadow:inset 0 0 0 1px rgba(49,83,33,.2);
}

.biosfera-crossword__status{
    min-height:24px;
    margin-bottom:20px;
    font-weight:700;
}

.biosfera-crossword__status.is-success{
    color:#235b18;
}

.biosfera-crossword__status.is-warning{
    color:#8a5b00;
}

.biosfera-crossword__clues{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:24px;
}

.biosfera-crossword__clue-group{
    padding:20px;
    border-radius:20px;
    background:#fff;
    box-shadow:0 6px 16px rgba(0,0,0,.05);
}

.biosfera-crossword__clue-group h4{
    margin:0 0 12px;
    font-size:28px;
    line-height:1.2;
}

.biosfera-crossword__clue-group ol{
    margin:0;
    padding-left:0;
    list-style:none;
    display:grid;
    gap:10px;
}

.biosfera-crossword__clue-group li{
    line-height:1.6;
    font-size:18px;
}

.biosfera-scene--crossword .biosfera-next-wrap{
    margin-top:30px;
}

.biosfera-crossword__clue-group li strong{
    display:inline-block;
    min-width:32px;
    margin-right:6px;
    font-size:22px;
    line-height:1;
    color:#203419;
}

.biosfera-crossword__cell.is-active-word{
    background:#f4faee;
    border-color:#6b8e23;
}

@media(max-width:980px){
    .biosfera-scene--crossword .biosfera-content-main{
        grid-template-columns:1fr;
        gap:24px;
    }
}

@media(max-width:800px){
    .biosfera-scene--crossword{
        padding:20px;
    }

    .biosfera-crossword{
        padding:18px;
    }

    .biosfera-crossword__title{
        font-size:28px;
    }

    .biosfera-crossword__intro,
    .biosfera-crossword__clue-group li{
        font-size:16px;
    }

    .biosfera-crossword__board{
        grid-template-columns:repeat(var(--cw-cols), 36px);
    }

    .biosfera-crossword__cell{
        width:36px;
        height:36px;
    }

    .biosfera-crossword__input{
        font-size:20px;
        padding-top:8px;
    }

    .biosfera-crossword__clues{
        grid-template-columns:1fr;
    }

    .biosfera-crossword__clue-group h4{
        font-size:24px;
    }
}

.biosfera-score{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin:0 0 28px;
    padding:16px 20px;
    border-radius:18px;
    background:#eef6e7;
    box-shadow:0 6px 16px rgba(0,0,0,.05);
}

.biosfera-score__label{
    font-weight:700;
    font-size:16px;
    line-height:1.2;
    color:#315321;
}

.biosfera-score__value{
    font-weight:800;
    font-size:26px;
    line-height:1;
    color:#203419;
}

@media(max-width:800px){
    .biosfera-score{
        flex-direction:column;
        align-items:flex-start;
    }

    .biosfera-score__value{
        font-size:22px;
    }
}


/* =========================
   QUIZ
   ========================= */

.biosfera-scene--quiz{
    background:#f7fbf1;
    border-radius:24px;
    padding:28px;
    grid-template-columns:1fr;
}

.biosfera-scene--quiz .biosfera-content{
    width:100%;
}

.biosfera-scene--quiz .biosfera-content-main{
    display:grid;
    grid-template-columns:minmax(260px, 360px) minmax(0, 1fr);
    gap:32px;
    align-items:start;
    margin-bottom:24px;
}

.biosfera-scene--quiz .biosfera-media{
    align-self:start;
}

.biosfera-scene--quiz .biosfera-story-copy{
    min-width:0;
}

.biosfera-quiz{
    margin-top:10px;
    padding:28px;
    border-radius:24px;
    background:#eef6e7;
    box-shadow:inset 0 0 0 1px rgba(47,84,36,.08);
}

.biosfera-quiz__header{
    margin-bottom:22px;
}

.biosfera-quiz__title{
    margin:0 0 10px;
    font-size:34px;
    line-height:1.1;
}

.biosfera-quiz__intro{
    font-size:18px;
    line-height:1.65;
    max-width:760px;
}

.biosfera-quiz__question{
    margin-bottom:24px;
    padding:20px;
    border-radius:20px;
    background:#fff;
    box-shadow:0 6px 16px rgba(0,0,0,.05);
}

.biosfera-quiz__question:last-child{
    margin-bottom:0;
}

.biosfera-quiz__question-title{
    margin-bottom:14px;
    font-size:20px;
    font-weight:700;
    line-height:1.5;
}

.biosfera-quiz__question-image{
    margin-bottom:16px;
}

.biosfera-quiz__question-image img{
    display:block;
    max-width:160px;
    width:100%;
    height:auto;
    border-radius:14px;
}

.biosfera-quiz__answers{
    display:grid;
    gap:14px;
}

.biosfera-quiz__answers--single_image{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

.biosfera-quiz__answer{
    position:relative;
    display:block;
    cursor:pointer;
}

.biosfera-quiz__input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.biosfera-quiz__answer-card{
    display:flex;
    align-items:center;
    gap:14px;
    min-height:64px;
    padding:14px 16px;
    border-radius:16px;
    background:#f8faf6;
    box-shadow:inset 0 0 0 1px rgba(49,83,33,.15);
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.biosfera-quiz__answer:hover .biosfera-quiz__answer-card{
    transform:translateY(-1px);
}

.biosfera-quiz__input:checked + .biosfera-quiz__answer-card{
    background:#e6f2db;
    box-shadow:inset 0 0 0 2px #6b8e23;
}

.biosfera-quiz__input:focus + .biosfera-quiz__answer-card{
    outline:2px solid #6b8e23;
    outline-offset:2px;
}

.biosfera-quiz__answer-image img{
    display:block;
    width:70px;
    height:70px;
    object-fit:cover;
    border-radius:12px;
}

.biosfera-quiz__answer-text{
    font-weight:600;
    line-height:1.45;
}

.biosfera-quiz__complete-image{
    margin-bottom:18px;
}

.biosfera-quiz__complete-image img{
    display:block;
    max-width:320px;
    width:100%;
    height:auto;
    border-radius:18px;
}

.biosfera-quiz__complete-title{
    margin:0 0 12px;
}

.biosfera-quiz__complete-text{
    margin-bottom:16px;
}

.biosfera-quiz__points{
    font-size:20px;
    font-weight:800;
    color:#203419;
}

.biosfera-scene--quiz .biosfera-next-wrap{
    margin-top:30px;
}

@media(max-width:980px){
    .biosfera-scene--quiz .biosfera-content-main{
        grid-template-columns:1fr;
        gap:24px;
    }
}

@media(max-width:800px){
    .biosfera-scene--quiz{
        padding:20px;
    }

    .biosfera-quiz{
        padding:18px;
    }

    .biosfera-quiz__title{
        font-size:28px;
    }

    .biosfera-quiz__intro{
        font-size:16px;
    }

    .biosfera-quiz__answers--single_image{
        grid-template-columns:1fr;
    }
}

.biosfera-quiz__actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin:24px 0 14px;
}

.biosfera-quiz__btn{
    appearance:none;
    border:0;
    cursor:pointer;
    padding:12px 18px;
    border-radius:999px;
    background:#6b8e23;
    color:#fff;
    font-weight:700;
    font-size:15px;
    line-height:1;
    box-shadow:0 8px 20px rgba(107,142,35,.18);
    transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.biosfera-quiz__btn:hover{
    transform:translateY(-1px);
}

.biosfera-quiz__btn--ghost{
    background:#fff;
    color:#315321;
    box-shadow:inset 0 0 0 1px rgba(49,83,33,.2);
}

.biosfera-quiz__status{
    min-height:24px;
    margin-bottom:20px;
    font-weight:700;
}

.biosfera-quiz__status.is-success{
    color:#235b18;
}

.biosfera-quiz__status.is-warning{
    color:#8a5b00;
}

.biosfera-quiz__status.is-error{
    color:#8a1f1f;
}

.biosfera-quiz__answer.is-correct .biosfera-quiz__answer-card{
    background:#dff3d3;
    box-shadow:inset 0 0 0 2px #6b8e23;
}

.biosfera-quiz__answer.is-wrong .biosfera-quiz__answer-card{
    background:#ffe0e0;
    box-shadow:inset 0 0 0 2px #c94747;
}

.biosfera-quiz.is-locked .biosfera-quiz__answer{
    cursor:default;
}

.biosfera-quiz.is-locked .biosfera-quiz__answer-card{
    opacity:.92;
}

.biosfera-quiz__question.is-unanswered .biosfera-quiz__question-title::after{
    content:" — brak odpowiedzi";
    color:#8a5b00;
    font-weight:700;
}

.biosfera-quiz__question{
    position:relative;
}

.biosfera-quiz__question.is-locked .biosfera-quiz__answer{
    cursor:default;
}

.biosfera-quiz__question.is-locked .biosfera-quiz__answer-card{
    opacity:.92;
}

.biosfera-quiz__point-popup{
    position:absolute;
    top:16px;
    right:18px;
    z-index:5;
    padding:8px 12px;
    border-radius:999px;
    background:#6b8e23;
    color:#fff;
    font-size:14px;
    font-weight:800;
    line-height:1;
    box-shadow:0 8px 20px rgba(107,142,35,.22);
    animation:biosferaQuizPointPop 1.2s ease forwards;
}

.biosfera-quiz__question.is-wrong .biosfera-quiz__point-popup{
    background:#c94747;
    box-shadow:0 8px 20px rgba(201,71,71,.2);
}

@keyframes biosferaQuizPointPop{
    0%{
        opacity:0;
        transform:translateY(8px) scale(.92);
    }
    18%{
        opacity:1;
        transform:translateY(0) scale(1);
    }
    75%{
        opacity:1;
        transform:translateY(-6px) scale(1);
    }
    100%{
        opacity:0;
        transform:translateY(-14px) scale(.96);
    }
}

.biosfera-scene{
    position:relative;
}

.biosfera-scene-admin-number{
    position:absolute;
    top:-14px;
    left:24px;
    z-index:10;
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:7px 12px;
    border-radius:999px;
    background:#203419;
    color:#fff;
    font-size:13px;
    font-weight:800;
    line-height:1;
    box-shadow:0 8px 18px rgba(32,52,25,.22);
}

.biosfera-scene-admin-number span{
    opacity:.72;
    font-weight:700;
}

.biosfera-story{
    position:relative;
    max-width:1100px;
    margin:auto;
    padding:40px 20px 60px;
    isolation:isolate;
}

.biosfera-story::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:-2;
    pointer-events:none;
    background:
        radial-gradient(circle at 12% 18%, rgba(155,196,91,.22), transparent 28%),
        radial-gradient(circle at 82% 12%, rgba(107,142,35,.18), transparent 24%),
        radial-gradient(circle at 72% 82%, rgba(184,216,137,.22), transparent 26%),
        linear-gradient(180deg, #f8fbf2 0%, #eef7e6 45%, #f7fbf1 100%);
}

.biosfera-story::after{
    content:"";
    position:fixed;
    inset:0;
    z-index:-1;
    pointer-events:none;
    opacity:.22;
    background-image:
        linear-gradient(120deg, transparent 0 48%, rgba(107,142,35,.18) 49%, transparent 52%),
        radial-gradient(circle at 20% 30%, rgba(32,52,25,.16) 0 2px, transparent 3px),
        radial-gradient(circle at 75% 60%, rgba(32,52,25,.12) 0 2px, transparent 3px);
    background-size:260px 260px, 90px 90px, 130px 130px;
    transform:translateY(calc(var(--biosfera-parallax, 0) * 1px));
}

.biosfera-scene{
    background:rgba(255,255,255,.78);
    backdrop-filter:blur(6px);
    border-radius:28px;
    padding:28px;
    box-shadow:0 18px 45px rgba(32,52,25,.08);
}

.biosfera-scene--crossword,
.biosfera-scene--quiz,
.biosfera-scene--cta{
    background:rgba(247,251,241,.92);
}


.biosfera-path-title{
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:14px;
    margin:0 0 36px;
    padding:14px 22px 16px;
    border-radius:24px;
    background:linear-gradient(135deg, #203419 0%, #4f7f23 100%);
    color:#fff;
    font-size:34px;
    line-height:1.15;
    font-weight:900;
    letter-spacing:-.03em;
    box-shadow:0 18px 38px rgba(32,52,25,.18);
}

.biosfera-path-title::before{
    content:"🌿";
    width:46px;
    height:46px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.15);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);
}

.biosfera-path-title::after{
    content:"";
    position:absolute;
    left:28px;
    right:28px;
    bottom:-10px;
    height:10px;
    border-radius:999px;
    background:rgba(107,142,35,.28);
    filter:blur(6px);
}

@media(max-width:800px){
    .biosfera-path-title{
        font-size:26px;
        padding:12px 16px;
        border-radius:20px;
    }

    .biosfera-path-title::before{
        width:38px;
        height:38px;
    }
}

.biosfera-path-page{
    position:relative;
    min-height:100vh;
    padding:80px 0 70px;
    background:
        linear-gradient(180deg, rgba(247,251,241,.82), rgba(247,251,241,.92)),
        var(--biosfera-path-bg);
    background-size:cover;
    background-position:center top;
    background-attachment:fixed;
}

.biosfera-path-header{
    margin-bottom:34px;
}

.biosfera-path-title{
    position:relative;
    display:inline-flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
    margin:0 0 28px;
    padding:22px 34px 24px;
    max-width:760px;
    border-radius:30px;
    background:
        linear-gradient(135deg, rgba(255,248,220,.94), rgba(247,236,196,.9));
    color:#24451d;
    box-shadow:0 18px 42px rgba(32,52,25,.16);
    overflow:hidden;
}

.biosfera-path-title::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 12% 25%, rgba(107,142,35,.15), transparent 22%),
        radial-gradient(circle at 88% 70%, rgba(107,142,35,.12), transparent 24%);
    pointer-events:none;
}

.biosfera-path-title::after{
    content:"🌿";
    position:absolute;
    right:24px;
    top:18px;
    font-size:34px;
    opacity:.8;
}

.biosfera-path-title__small,
.biosfera-path-title__main{
    position:relative;
    z-index:1;
}

.biosfera-path-title__small{
    font-size:24px;
    line-height:1.1;
    font-weight:800;
}

.biosfera-path-title__main{
    font-size:52px;
    line-height:1.02;
    font-weight:900;
    letter-spacing:-.04em;
}

@media(max-width:800px){
    .biosfera-path-page{
        padding:40px 0;
        background-attachment:scroll;
    }

    .biosfera-path-title{
        padding:18px 22px 20px;
        border-radius:22px;
    }

    .biosfera-path-title__small{
        font-size:18px;
    }

    .biosfera-path-title__main{
        font-size:34px;
    }
}

.biosfera-path-page{
    position:relative;
    min-height:100vh;
    padding:80px 0 70px;
    background-image:
        linear-gradient(180deg, rgba(247,251,241,.72), rgba(247,251,241,.84)),
        var(--biosfera-path-bg);
    background-size:cover;
    background-position:center top;
    background-repeat:no-repeat;
    background-attachment:fixed;
}

.biosfera-path-page .biosfera-story::before,
.biosfera-path-page .biosfera-story::after{
    display:none;
}

.biosfera-path-page{
    position:relative;
    min-height:100vh;
    padding:80px 0 70px;
    background:#f7fbf1;
    overflow:hidden;
}

.biosfera-path-page::before{
    content:"";
    position:fixed;
    inset:-80px 0;
    z-index:0;
    pointer-events:none;
    background-image:
        linear-gradient(180deg, rgba(247,251,241,.50), rgba(247,251,241,.70)),
        var(--biosfera-path-bg);
    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;
    transform:translateY(var(--biosfera-path-parallax, 0px));
    will-change:transform;
}

.biosfera-path-page::after{
    content:"";
    position:fixed;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:rgba(247,251,241,.18);
}

.biosfera-path-page > *{
    position:relative;
    z-index:2;
}

.biosfera-path-start{
    appearance:none;
    border:0;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin:0 0 34px;
    padding:15px 24px;
    border-radius:999px;
    background:linear-gradient(135deg, #6b8e23 0%, #315321 100%);
    color:#fff;
    font-size:17px;
    font-weight:900;
    line-height:1;
    box-shadow:0 14px 30px rgba(49,83,33,.22);
    transition:transform .2s ease, box-shadow .2s ease;
}

.biosfera-path-start:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 38px rgba(49,83,33,.28);
}

.biosfera-path-start:focus{
    outline:2px solid #203419;
    outline-offset:4px;
}

.biosfera-quiz__answer-image{
    display:block;
}

.biosfera-quiz__answer-image img{
    display:block;
    width:96px;
    height:96px;
    object-fit:contain;
    border-radius:12px;
}

.biosfera-quiz__answer-card:has(.biosfera-quiz__answer-image):not(:has(.biosfera-quiz__answer-text)){
    justify-content:center;
    min-height:120px;
}

/* =========================================
   QUIZ — ikony poprawnej / błędnej odpowiedzi
   Rysowane CSS-em, bez znaków specjalnych z fontu
   ========================================= */

.biosfera-quiz__answer.is-correct .biosfera-quiz__answer-card,
.biosfera-quiz__answer.is-wrong .biosfera-quiz__answer-card,
.biosfera-quiz__answer.is-revealed .biosfera-quiz__answer-card{
    position:relative;
    padding-right:64px;
}

.biosfera-quiz__answer.is-correct .biosfera-quiz__answer-card,
.biosfera-quiz__answer.is-revealed .biosfera-quiz__answer-card{
    background:#dff3d3;
    box-shadow:inset 0 0 0 2px #6b8e23;
}

.biosfera-quiz__answer.is-wrong .biosfera-quiz__answer-card{
    background:#ffe0e0;
    box-shadow:inset 0 0 0 2px #c94747;
}

/* kółko */
.biosfera-quiz__answer.is-correct .biosfera-quiz__answer-card::after,
.biosfera-quiz__answer.is-revealed .biosfera-quiz__answer-card::after,
.biosfera-quiz__answer.is-wrong .biosfera-quiz__answer-card::after{
    content:"";
    position:absolute;
    top:50%;
    right:18px;
    width:30px;
    height:30px;
    margin-top:-15px;
    border-radius:999px;
    z-index:1;
}

.biosfera-quiz__answer.is-correct .biosfera-quiz__answer-card::after,
.biosfera-quiz__answer.is-revealed .biosfera-quiz__answer-card::after{
    background:#6b8e23;
}

.biosfera-quiz__answer.is-wrong .biosfera-quiz__answer-card::after{
    background:#c94747;
}

/* tick */
.biosfera-quiz__answer.is-correct .biosfera-quiz__answer-card::before,
.biosfera-quiz__answer.is-revealed .biosfera-quiz__answer-card::before{
    content:"";
    position:absolute;
    top:50%;
    right:28px;
    width:12px;
    height:7px;
    border-left:3px solid #fff;
    border-bottom:3px solid #fff;
    transform:translateY(-65%) rotate(-45deg);
    z-index:2;
}

/* krzyżyk — pierwsza kreska */
.biosfera-quiz__answer.is-wrong .biosfera-quiz__answer-card::before{
    content:"";
    position:absolute;
    top:50%;
    right:25px;
    width:16px;
    height:3px;
    background:#fff;
    border-radius:999px;
    transform:translateY(-50%) rotate(45deg);
    z-index:2;
}

/* krzyżyk — druga kreska */
.biosfera-quiz__answer.is-wrong .biosfera-quiz__answer-card > span:last-child::after{
    content:"";
    position:absolute;
    top:50%;
    right:25px;
    width:16px;
    height:3px;
    background:#fff;
    border-radius:999px;
    transform:translateY(-50%) rotate(-45deg);
    z-index:2;
}

/* poprawka dla odpowiedzi obrazkowych bez tekstu */
.biosfera-quiz__answer-card:has(.biosfera-quiz__answer-image):not(:has(.biosfera-quiz__answer-text)){
    justify-content:center;
    min-height:120px;
    padding-right:64px;
}


/* =========================
   KOMPAS
   ========================= */

.biosfera-scene--compass{
    background:rgba(247,251,241,.92);
    border-radius:24px;
    padding:28px;
    grid-template-columns:1fr;
}

.biosfera-scene--compass .biosfera-content{
    width:100%;
}

.biosfera-scene--compass .biosfera-content-main{
    display:grid;
    grid-template-columns:minmax(260px, 360px) minmax(0, 1fr);
    gap:32px;
    align-items:start;
    margin-bottom:24px;
}

.biosfera-compass{
    position:relative;
    margin-top:10px;
    padding:28px;
    border-radius:24px;
    background:#eef6e7;
    box-shadow:inset 0 0 0 1px rgba(47,84,36,.08);
}

.biosfera-compass__header{
    margin-bottom:22px;
}

.biosfera-compass__title{
    margin:0 0 10px;
    font-size:34px;
    line-height:1.1;
}

.biosfera-compass__intro{
    font-size:18px;
    line-height:1.65;
    max-width:820px;
}

.biosfera-compass__layout{
    display:grid;
    grid-template-columns:minmax(260px, 420px) minmax(0, 1fr);
    gap:28px;
    align-items:center;
}

.biosfera-compass__rose{
    position:relative;
    width:min(100%, 390px);
    aspect-ratio:1;
    margin:auto;
    border-radius:999px;
    background:
        radial-gradient(circle at 50% 50%, #fffdf3 0 17%, transparent 18%),
        radial-gradient(circle at 50% 50%, rgba(107,142,35,.14) 0 56%, transparent 57%),
        linear-gradient(135deg, #f8e9b8, #fbf6df 48%, #d9c58c);
    box-shadow:0 18px 38px rgba(32,52,25,.16), inset 0 0 0 10px rgba(49,83,33,.12), inset 0 0 0 2px rgba(49,83,33,.22);
}

.biosfera-compass__ring{
    position:absolute;
    inset:34px;
    border:2px dashed rgba(49,83,33,.28);
    border-radius:999px;
}

.biosfera-compass__needle{
    position:absolute;
    inset:50% auto auto 50%;
    width:28%;
    height:28%;
    transform:translate(-50%, -88%) rotate(0deg);
    transform-origin:50% 88%;
    clip-path:polygon(50% 0, 70% 100%, 50% 82%, 30% 100%);
    background:linear-gradient(180deg, #b85828 0%, #7a2f18 100%);
    filter:drop-shadow(0 6px 8px rgba(32,52,25,.16));
}

.biosfera-compass__center{
    position:absolute;
    inset:50% auto auto 50%;
    width:72px;
    height:72px;
    transform:translate(-50%, -50%);
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fffdf3;
    font-size:34px;
    box-shadow:0 8px 18px rgba(32,52,25,.12), inset 0 0 0 2px rgba(49,83,33,.16);
}

.biosfera-compass__direction{
    appearance:none;
    border:0;
    cursor:pointer;
    position:absolute;
    width:58px;
    height:58px;
    margin:-29px 0 0 -29px;
    border-radius:999px;
    background:#fffdf3;
    color:#24451d;
    font-size:18px;
    font-weight:900;
    line-height:1;
    box-shadow:0 8px 18px rgba(32,52,25,.14), inset 0 0 0 2px rgba(49,83,33,.18);
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.biosfera-compass__direction:hover{
    transform:translateY(-2px) scale(1.04);
}

.biosfera-compass__direction:focus{
    outline:2px solid #203419;
    outline-offset:3px;
}

.biosfera-compass__direction--n{top:10%;left:50%;}
.biosfera-compass__direction--ne{top:21%;left:79%;}
.biosfera-compass__direction--e{top:50%;left:90%;}
.biosfera-compass__direction--se{top:79%;left:79%;}
.biosfera-compass__direction--s{top:90%;left:50%;}
.biosfera-compass__direction--sw{top:79%;left:21%;}
.biosfera-compass__direction--w{top:50%;left:10%;}
.biosfera-compass__direction--nw{top:21%;left:21%;}

.biosfera-compass__direction.is-correct{
    background:#6b8e23;
    color:#fff;
    box-shadow:0 10px 22px rgba(107,142,35,.28);
}

.biosfera-compass__direction.is-wrong{
    background:#c94747;
    color:#fff;
    box-shadow:0 10px 22px rgba(201,71,71,.22);
}

.biosfera-compass__hint{
    padding:22px;
    border-radius:22px;
    background:#fff;
    box-shadow:0 6px 16px rgba(0,0,0,.05);
    font-size:17px;
    line-height:1.6;
}

.biosfera-compass__hint strong{
    display:block;
    margin-bottom:10px;
    font-size:20px;
    color:#203419;
}

.biosfera-compass__hint ol{
    margin:0;
    padding-left:22px;
}

.biosfera-compass__status{
    min-height:24px;
    margin-top:22px;
    font-weight:800;
}

.biosfera-compass__status.is-success{color:#235b18;}
.biosfera-compass__status.is-warning{color:#8a5b00;}
.biosfera-compass__status.is-error{color:#8a1f1f;}

.biosfera-compass__complete-image{
    margin-bottom:18px;
}

.biosfera-compass__complete-image img{
    display:block;
    max-width:320px;
    width:100%;
    height:auto;
    border-radius:18px;
}

.biosfera-compass__complete-title{
    margin:0 0 12px;
}

.biosfera-compass__complete-text{
    margin-bottom:16px;
}

.biosfera-compass__points{
    font-size:20px;
    font-weight:800;
    color:#203419;
}

.biosfera-compass__point-popup{
    position:absolute;
    top:16px;
    right:18px;
    z-index:5;
    padding:8px 12px;
    border-radius:999px;
    background:#6b8e23;
    color:#fff;
    font-size:14px;
    font-weight:800;
    line-height:1;
    box-shadow:0 8px 20px rgba(107,142,35,.22);
    animation:biosferaQuizPointPop 1.2s ease forwards;
}

.biosfera-compass__point-popup.is-wrong{
    background:#c94747;
    box-shadow:0 8px 20px rgba(201,71,71,.2);
}

@media(max-width:980px){
    .biosfera-scene--compass .biosfera-content-main,
    .biosfera-compass__layout{
        grid-template-columns:1fr;
        gap:24px;
    }
}

@media(max-width:800px){
    .biosfera-scene--compass{
        padding:20px;
    }

    .biosfera-compass{
        padding:18px;
    }

    .biosfera-compass__title{
        font-size:28px;
    }

    .biosfera-compass__intro{
        font-size:16px;
    }

    .biosfera-compass__direction{
        width:48px;
        height:48px;
        margin:-24px 0 0 -24px;
        font-size:15px;
    }

    .biosfera-compass__center{
        width:60px;
        height:60px;
        font-size:28px;
    }
}
