:root{
    --paper:#F4EDDA; --paper2:#F0E7CF; --paper3:#EBDFC0; --card:#FBF6E7;
    --ink:#262F1B; --forest:#3B4A2A; --khaki:#5A6540; --sand:#8C8259;
    --rust:#C0491C; --rust-deep:#A63E16; --gold:#B08D2E; --line:#D9CDA8;
    --f-disp:"Fraunces",serif; --f-body:"Inter",sans-serif; --f-mono:"IBM Plex Mono",monospace;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{background:var(--paper);}
  body{background:var(--paper); color:var(--ink); font-family:var(--f-body);
    -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden;}
  ::selection{background:var(--rust); color:var(--paper);}
  a{color:inherit;}
  .mono{font-family:var(--f-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase;}

  .grain{position:fixed; inset:-50%; width:200%; height:200%; z-index:60; pointer-events:none; opacity:.05; mix-blend-mode:multiply;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

  .cur,.cur2{position:fixed; z-index:90; top:0; left:0; pointer-events:none; border-radius:50%; opacity:0;}
  .cur{width:8px; height:8px; background:var(--rust); transform:translate(-50%,-50%);}
  .cur2{width:34px; height:34px; border:1px solid rgba(58,70,62,.5); transform:translate(-50%,-50%); transition:width .25s,height .25s,border-color .25s;}
  .cur2.big{width:58px; height:58px; border-color:var(--rust);}
  @media(pointer:coarse){.cur,.cur2{display:none;}}

  .pre{position:fixed; inset:0; z-index:80; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:18px; background:var(--paper);}
  .pre .mono{color:var(--khaki);}
  .pre .num{font-family:var(--f-disp); font-weight:600; font-size:clamp(64px,12vw,120px); line-height:1; color:var(--ink); font-variant-numeric:tabular-nums;}
  .pre .bar{width:min(300px,60vw); height:1px; background:var(--line); position:relative; overflow:hidden;}
  .pre .bar i{position:absolute; inset:0; background:var(--rust); transform:scaleX(0); transform-origin:left;}
  .pre .stamp-mini{margin-top:8px; opacity:0; font-family:var(--f-mono); font-size:12px; letter-spacing:.18em; text-transform:uppercase;
    color:var(--rust); border:2px solid var(--rust); border-radius:4px; padding:7px 14px; transform:rotate(-9deg);}

  .bar-top{position:absolute; top:0; left:0; right:0; z-index:20; padding:26px clamp(20px,4.5vw,56px); display:flex; justify-content:space-between; align-items:baseline;}
  .bar-top .wordmark{font-family:var(--f-disp); font-weight:600; font-size:17px;}
  .bar-top .coords{color:var(--khaki);}
  @media(max-width:640px){.bar-top .coords{display:none;}}

  /* feather mask — wtapia asset w papier strony */
  .feather{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%),linear-gradient(0deg,transparent 0,#000 8%,#000 92%,transparent 100%);
    -webkit-mask-composite:source-in; mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%),linear-gradient(0deg,transparent 0,#000 8%,#000 92%,transparent 100%); mask-composite:intersect;}

  /* ==== hero ==== */
  .hero{position:relative;}
  .hero-pin{position:relative; min-height:100svh; display:flex; align-items:center; overflow:hidden; padding:110px 0 90px; width:100%;}
  #topo{position:absolute; inset:0; width:100%; height:100%; z-index:1; opacity:.5;}
  .hero .inner{position:relative; z-index:5; width:100%; max-width:1200px; margin:0 auto; padding:0 clamp(20px,4.5vw,56px);
    display:grid; grid-template-columns:1.4fr .72fr; gap:clamp(30px,5vw,72px); align-items:center;}
  @media(max-width:860px){.hero .inner{grid-template-columns:1fr;}}
  .symptoms{margin-bottom:28px;}
  .sym-head{color:var(--sand); margin-bottom:13px;}
  .sym{display:flex; align-items:center; gap:12px; margin:10px 0;}
  .zgl{position:relative; display:inline-block; font-family:var(--f-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--forest); padding:1px 2px;}
  .zgl svg{position:absolute; left:-2px; right:-2px; top:50%; height:14px; transform:translateY(-50%); overflow:visible; pointer-events:none;}
  .zgl svg path{stroke:var(--rust); stroke-width:2.4; fill:none; stroke-linecap:round;}
  .tag-objaw{font-family:var(--f-mono); font-size:9.5px; letter-spacing:.16em; color:var(--rust); border:1.2px solid var(--rust); border-radius:3px; padding:2px 6px; transform:rotate(-4deg); display:inline-block;}
  h1.disp{font-family:var(--f-disp); font-weight:600; font-size:clamp(42px,7.2vw,96px); line-height:.99; letter-spacing:-.022em; margin-bottom:30px;}
  h1.disp .ln{display:block; overflow:hidden; padding:.08em .06em .24em; margin:-.08em -.06em -.24em;}
  h1.disp .ln>span{display:inline-block; will-change:transform;}
  h1.disp em{font-style:italic; font-weight:500; color:var(--rust); position:relative; white-space:nowrap;}
  h1.disp em svg{position:absolute; left:-1%; bottom:-.14em; width:102%; height:.3em; overflow:visible;}
  h1.disp em svg path{fill:none; stroke:var(--rust); stroke-width:5; stroke-linecap:round;}
  .lead{font-size:clamp(15.5px,1.55vw,18px); line-height:1.62; color:#414A2E; max-width:46ch; margin-bottom:26px;}
  .doms{display:flex; flex-wrap:wrap; gap:8px 6px; margin-bottom:32px;}
  .doms span{font-family:var(--f-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--forest);
    border:1px solid var(--line); background:rgba(251,246,231,.55); padding:6px 12px; border-radius:999px;}
  .cta-row{display:flex; align-items:center; gap:18px; flex-wrap:wrap;}
  .cta{display:inline-flex; align-items:center; gap:12px; text-decoration:none; background:var(--forest); color:var(--paper);
    font-weight:600; font-size:15.5px; padding:16px 28px; border-radius:999px; transition:background .3s, transform .25s, box-shadow .3s;}
  .cta:hover{background:var(--rust); transform:translateY(-2px); box-shadow:0 16px 34px rgba(192,73,28,.26);}
  .cta .arr{transition:transform .3s;}
  .cta:hover .arr{transform:translateX(5px);}
  .cta-note{font-family:var(--f-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--sand);}

  .por-wrap{position:relative; justify-self:end; width:min(340px,74vw); will-change:transform;}
  @media(max-width:860px){.por-wrap{justify-self:start; margin-top:6px;}}
  .por-wrap img{display:block; width:100%; height:auto;}
  .por-note{position:absolute; left:50%; top:44%; transform:translate(-50%,-50%) rotate(-2.6deg);
    font-family:var(--f-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:rgba(244,237,218,.85); text-align:center; line-height:2;}

  /* ==== rekwizyty biurka (hero) ==== */
  .props{position:absolute; inset:0; z-index:4; pointer-events:none;}
  .prop{position:absolute; will-change:transform; filter:drop-shadow(0 10px 18px rgba(38,47,27,.10));}
  .p-tasma{left:43%; top:9%; width:clamp(70px,8vw,116px);}
  .p-stempel{right:3%; top:4%; width:clamp(170px,19vw,270px);}
  .p-kompas{left:62%; bottom:8%; width:clamp(90px,10vw,128px);}
  .p-lupa{right:15%; bottom:-6%; width:clamp(170px,19vw,260px);}
  .p-olowek{left:20%; top:3%; width:clamp(120px,13vw,185px);}
  .p-notes{left:-2%; bottom:5%; width:clamp(100px,11vw,150px);}
  @media(max-width:860px){.p-lupa,.p-olowek,.p-notes,.p-tasma{display:none;} .p-stempel{left:auto; right:2%; top:2%; width:150px; opacity:.85;} .p-kompas{right:3%; top:auto; bottom:2%; width:90px;}}
  .cue{position:absolute; left:50%; bottom:24px; transform:translateX(-50%); z-index:6; display:flex; flex-direction:column; align-items:center; gap:9px; color:var(--khaki);}
  .cue .mono{font-size:9.5px;}
  .cue .stick{width:1px; height:40px; background:rgba(58,70,62,.22); overflow:hidden; position:relative;}
  .cue .stick i{position:absolute; left:0; top:-100%; width:100%; height:100%; background:var(--rust); animation:cue 2s cubic-bezier(.6,0,.4,1) infinite;}
  @keyframes cue{55%{top:100%}100%{top:100%}}

  /* ==== descent hook ==== */
  .descend{position:relative; background:linear-gradient(var(--paper) 0%, var(--paper2) 55%, var(--paper3) 100%);}
  .descend .pinbox{min-height:100svh; display:flex; align-items:center; position:relative; overflow:hidden;}
  .surface-line{position:absolute; left:0; right:0; top:18%; z-index:1; border-top:1px dashed rgba(90,101,64,.5);}
  .surface-line .mono{position:absolute; right:clamp(16px,4vw,54px); top:-20px; color:var(--khaki); font-size:9.5px;}
  .depth{position:absolute; left:clamp(14px,3vw,44px); bottom:34px; z-index:2; color:var(--khaki); font-family:var(--f-mono); font-size:10.5px; letter-spacing:.14em; display:flex; align-items:center; gap:10px;}
  .depth b{font-weight:500; color:var(--forest); font-variant-numeric:tabular-nums;}
  .hook-txt{max-width:1000px; margin:0 auto; padding:0 clamp(22px,5vw,56px); position:relative; z-index:3;
    font-family:var(--f-disp); font-weight:500; font-size:clamp(26px,4.6vw,54px); line-height:1.24; letter-spacing:-.012em; color:var(--ink);}
  .hook-txt .w{opacity:.13; display:inline-block; will-change:opacity;}
  .hook-txt .accent{font-style:italic; color:var(--rust);}
  .hook-kicker{position:absolute; top:calc(18% + 16px); left:clamp(22px,5vw,56px); color:var(--khaki);}

  /* ==== vignettes ==== */
  .vign{position:relative; background:var(--paper3);}
  .vign .pin2{min-height:100svh; display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(24px,4vw,60px);
    align-items:center; max-width:1280px; margin:0 auto; padding:70px clamp(20px,4.5vw,56px);}
  @media(max-width:899px){.vign .pin2{display:block; min-height:0; padding:72px clamp(20px,4.5vw,56px) 30px;}}
  .vig-copy{position:relative; z-index:2;}
  .vig-copy .ghost{position:absolute; z-index:0; top:-8%; left:-3%; font-family:var(--f-disp); font-weight:700; font-size:clamp(120px,20vw,280px); line-height:1; color:rgba(58,70,62,.07); pointer-events:none; user-select:none;}
  .vig-copy .khead{color:var(--rust); margin-bottom:16px;}
  .vig-copy h2{font-family:var(--f-disp); font-weight:600; font-size:clamp(30px,4vw,52px); line-height:1.02; letter-spacing:-.02em; margin-bottom:18px;}
  .vig-copy .intro{font-size:clamp(15px,1.5vw,17.5px); line-height:1.62; color:#414A2E; max-width:42ch; margin-bottom:30px;}
  .prog{display:flex; align-items:center; gap:14px;}
  .prog .mono{color:var(--khaki); font-variant-numeric:tabular-nums;}
  .prog .dots{display:flex; gap:7px;}
  .prog .dots i{width:26px; height:2px; background:rgba(58,70,62,.2); position:relative; overflow:hidden;}
  .prog .dots i b{position:absolute; inset:0; background:var(--rust); transform:scaleX(0); transform-origin:left;}
  @media(max-width:899px){.prog{display:none;}}

  .deck{position:relative; height:min(640px,78vh); z-index:2;}
  @media(max-width:899px){.deck{height:auto; margin-top:34px; display:flex; flex-direction:column; gap:40px;}}
  .bcard{position:absolute; inset:0; margin:auto; width:100%; max-width:560px; height:fit-content; will-change:transform;}
  @media(max-width:899px){.bcard{position:relative; inset:auto; max-width:none;}}
  .bcard .face{position:relative;}
  .bcard .face>img{display:block; width:100%; height:auto; max-height:56vh; object-fit:contain;}
  .bcard .stampimg{position:absolute; z-index:4; width:34%; top:var(--stamp-top,4%); right:var(--stamp-right,2%); left:var(--stamp-left,auto); mix-blend-mode:multiply; opacity:0; pointer-events:none; transform:rotate(-4deg);}
  .bcard .strike{position:absolute; z-index:3; left:14%; width:72%; height:34px; top:var(--strike-top,40%); overflow:visible; pointer-events:none;}
  .bcard .strike path{stroke:var(--rust); stroke-width:5; fill:none; stroke-linecap:round; opacity:.92; mix-blend-mode:multiply;}
  .bcard .real{margin:2px auto 0; max-width:86%; background:var(--card); border:1px solid var(--line); border-radius:8px;
    padding:16px 20px 15px; opacity:0; will-change:transform; box-shadow:0 14px 34px rgba(38,47,27,.12);}
  .bcard .real .mono{color:var(--rust); font-size:9.5px; display:block; margin-bottom:7px;}
  .bcard .real p{font-size:clamp(15px,1.6vw,18px); line-height:1.45; font-weight:500; color:var(--ink);}
  .bcard .real p u{text-decoration:none; background-image:linear-gradient(var(--rust), var(--rust)); background-repeat:no-repeat; background-size:0% 2px; background-position:0 96%;}

  /* ==== scena OBIECANE/ZASTANE ==== */
  .compare{position:relative; background:var(--paper3);}
  .compare .pin3{min-height:100svh; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:26px; padding:70px clamp(16px,3.5vw,48px); position:relative; overflow:hidden;}
  .compare .khead{color:var(--khaki); text-align:center;}
  .compare h2{font-family:var(--f-disp); font-weight:600; font-size:clamp(26px,3.6vw,46px); letter-spacing:-.018em; text-align:center; max-width:26ch; line-height:1.08;}
  .compare h2 em{font-style:italic; color:var(--rust);}
  .stagebox{position:relative; width:min(1180px,96vw); aspect-ratio:1920/1071; border-radius:10px; overflow:hidden; box-shadow:0 34px 90px rgba(38,47,27,.22);}
  .stagebox img,.stagebox video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
  .stagebox .after{clip-path:inset(0 0 0 100%);}
  .stagebox .divider{position:absolute; top:0; bottom:0; left:0; width:3px; background:var(--rust); z-index:5; transform:translateX(-2px); box-shadow:0 0 0 1px rgba(244,237,218,.5);}
  .stagebox .lab{position:absolute; z-index:6; top:14px; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase;
    padding:6px 12px; border-radius:4px; background:rgba(38,47,27,.72); color:var(--paper);}
  .stagebox .lab.l{left:14px;} .stagebox .lab.r{right:14px; background:rgba(192,73,28,.85);}
  .compare .capline{color:var(--khaki); display:flex; gap:14px; align-items:center;}
  .compare .capline .rule{width:60px; height:1px; background:rgba(90,101,64,.4);}

  /* ==== closer ==== */
  .closer{background:var(--paper3); padding:clamp(90px,14vw,180px) 0 90px;}
  .closer .inner{max-width:900px; margin:0 auto; padding:0 clamp(22px,5vw,56px);}
  .closer .big{font-family:var(--f-disp); font-weight:500; font-size:clamp(24px,3.8vw,44px); line-height:1.3; letter-spacing:-.01em; color:var(--ink);}
  .closer .big .w{display:inline-block; opacity:.13;}
  .closer .big em{font-style:italic; color:var(--rust);}
  .closer .next{margin-top:70px; display:flex; align-items:center; gap:18px; color:var(--khaki); flex-wrap:wrap;}
  .closer .next .rule{flex:1; min-width:60px; height:1px; background:rgba(90,101,64,.35);}


  /* ==== v4a ==== */
  .p-lupa{aspect-ratio:1/1; filter:none; z-index:6;}
  .lupa-img{position:absolute; inset:0; width:100%; height:100%; z-index:2; mix-blend-mode:multiply;
    -webkit-mask-image:radial-gradient(ellipse 19% 19% at 37.2% 37.2%, transparent 96%, #000 99%),linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%),linear-gradient(0deg,transparent 0,#000 7%,#000 93%,transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:radial-gradient(ellipse 19% 19% at 37.2% 37.2%, transparent 96%, #000 99%),linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%),linear-gradient(0deg,transparent 0,#000 7%,#000 93%,transparent 100%);
    mask-composite:intersect;}
  .lens{position:absolute; left:18.2%; top:18.2%; width:38%; height:38%; border-radius:50%; overflow:hidden; z-index:1;
    background:var(--paper); box-shadow:inset 0 0 22px rgba(38,47,27,.14);}
  .lens-inner{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; transform:scale(1.62); white-space:nowrap;}
  .lens-inner .zgl{font-size:12px;}
  .lens-inner img{width:280%; max-width:none;}
  .p-minipoczta{right:17%; bottom:-2%; width:clamp(120px,13vw,170px); z-index:3;}
  @media(max-width:860px){.p-minipoczta{display:none;}}
  .doms span{border-radius:3px !important; border:1.6px solid rgba(58,70,62,.6) !important; background:transparent !important;
    mix-blend-mode:multiply; font-size:11px !important; letter-spacing:.13em !important; padding:7px 13px !important;}
  .doms span:nth-child(1){transform:rotate(-1.4deg);}
  .doms span:nth-child(2){transform:rotate(.9deg);}
  .doms span:nth-child(3){transform:rotate(-.7deg);}
  .doms span:nth-child(4){transform:rotate(1.3deg);}
  @keyframes ctaArr{0%,55%,100%{transform:translateX(0)}70%{transform:translateX(5px)}82%{transform:translateX(1px)}}
  .cta .arr{animation:ctaArr 3.2s ease-in-out 2s infinite;}
  @keyframes ctaGlow{0%,100%{box-shadow:0 6px 18px rgba(58,70,62,.18)}50%{box-shadow:0 10px 30px rgba(192,73,28,.30)}}
  .cta{animation:ctaGlow 3.2s ease-in-out infinite;}
  .cta:hover{animation-play-state:paused;}
  @keyframes kickPulse{0%,100%{opacity:.55}50%{opacity:1}}
  .hook-kicker{left:50% !important; transform:translateX(-50%); text-align:center;
    font-size:clamp(15px,2vw,21px) !important; letter-spacing:.22em !important; color:var(--forest) !important;
    animation:kickPulse 3.4s ease-in-out infinite; white-space:nowrap;}
  .vign .pin2{position:relative;}
  .vig-copy .khead{position:absolute; top:40px; left:0; right:0; text-align:center;
    font-size:clamp(14px,1.9vw,20px) !important; letter-spacing:.22em !important; color:var(--rust) !important;
    animation:kickPulse 3.4s ease-in-out infinite; white-space:nowrap; z-index:5;}
  .compare .khead{font-size:clamp(14px,1.9vw,20px) !important; letter-spacing:.22em !important;
    animation:kickPulse 3.4s ease-in-out infinite;}
  .sym-head{font-size:13px; letter-spacing:.16em; color:var(--forest);}
  .cue .mono{font-size:11px; letter-spacing:.14em; color:var(--forest);}
  .cta-note{font-size:11px !important; letter-spacing:.1em !important; color:var(--khaki) !important;}
  .bar-top .coords{font-size:11px; color:var(--khaki);}
  .tag-objaw{font-size:10.5px !important;}
  .bcard .stampimg{width:26% !important; z-index:3 !important; filter:contrast(1.06);}
  .bcard .real{position:relative; z-index:6;}

  /* ==== v4a runda 2 ==== */
  .prop{filter:none !important;}
  .lupa-img{-webkit-mask-image:none !important; mask-image:none !important; mix-blend-mode:normal !important;}
  .lens{left:7% !important; top:6.8% !important; width:54.4% !important; height:54.4% !important; box-shadow:inset 0 0 26px rgba(38,47,27,.16);}
  .por-wrap{width:min(350px,72vw) !important;}
  .por-note{font-size:12.5px !important; letter-spacing:.18em !important;}
  .p-kartki{right:21%; top:8%; width:clamp(210px,23vw,320px); z-index:2;}
  .p-stempel{right:23.5% !important; top:11% !important; width:clamp(180px,20vw,280px) !important; z-index:3;}
  .p-olowek{right:5% !important; left:auto !important; top:auto !important; bottom:21% !important; width:clamp(120px,13vw,180px) !important;}
  .p-kompas{right:24% !important; left:auto !important; bottom:13% !important; width:clamp(85px,9vw,120px) !important;}
  .p-notes{right:12% !important; left:auto !important; bottom:2% !important; width:clamp(95px,11vw,140px) !important;}
  .p-lupa{left:36% !important; right:auto !important; bottom:3% !important; width:clamp(180px,20vw,255px) !important;}
  .p-minipoczta{left:39% !important; right:auto !important; bottom:1% !important; width:clamp(130px,14vw,180px) !important;}
  @media(max-width:860px){.p-kartki{display:none;} .p-olowek,.p-notes{display:none !important;}}
  .doms span{background:var(--forest) !important; color:#F2EBD8 !important; border:none !important; mix-blend-mode:normal !important;
    font-size:11.5px !important; letter-spacing:.12em !important; padding:8px 14px !important;}
  .cue .mono{font-size:14px !important; letter-spacing:.18em !important; color:var(--forest) !important; font-weight:500;}
  .cue .stick{height:48px;}
  .bcard{max-width:640px !important;}
  .bcard .face>img{max-height:60vh !important;}
  .bcard .stampimg{width:34% !important; z-index:5 !important;}
  .bcard .strike{top:var(--strike-top,36%) !important; left:7% !important; width:84% !important; transform:rotate(-13deg); z-index:2 !important;}
  .bcard .real{margin:-34px auto 0 !important; max-width:88% !important; transform:rotate(-.5deg); box-shadow:0 16px 40px rgba(38,47,27,.16) !important;}
  .vign .pin2{padding-top:118px !important;}
  .vign .vig-copy{position:static !important;}
  .vig-copy .ghost{bottom:4% !important; right:1% !important; z-index:0 !important;}
  .vig-copy .ghost{top:auto !important; bottom:-8% !important; left:auto !important; right:-22% !important; font-size:clamp(90px,13vw,190px) !important;}
  @media(prefers-reduced-motion:reduce){.cta,.cta .arr,.hook-kicker,.vig-copy .khead,.compare .khead{animation:none !important;}}
  @media(prefers-reduced-motion:reduce){ .cue .stick i{animation:none;} }
  html.no-anim .pre{display:none;}

  /* ==== v4b: chłodna, stonowana paleta (oryzo / maxmilkin) ==== */
  :root{
    --paper:#E8E6DE; --paper2:#DDDBD0; --paper3:#D0CFC2; --card:#F0EFE8;
    --ink:#1F241E; --forest:#2C3830; --khaki:#57625A; --sand:#79816F;
    --rust:#C7480E; --rust-deep:#A23A08; --gold:#8A7833; --line:#C4C3B2;
    --steel:#3E4A50;
  }
  img.prop, .lupa-img, .por-img, .card-img, .lens-inner img{
    filter:saturate(.78) hue-rotate(-10deg) contrast(1.06) brightness(.97);}
  .stampimg{filter:saturate(.85) hue-rotate(-8deg) contrast(1.08) !important;}
  .stagebox .before{filter:saturate(.9) hue-rotate(-6deg) contrast(1.03);}
  .stagebox .after{filter:saturate(.8) hue-rotate(-8deg) contrast(1.05) brightness(.95);}
  .grain{opacity:.065;}
  .doms span:nth-child(2){background:var(--rust) !important; transform:rotate(.9deg);}
  .doms span:nth-child(4){background:var(--steel) !important;}
  .doms span:nth-child(5){background:var(--gold) !important;}
  .cta{background:var(--ink);}
  .cta:hover{background:var(--rust);}
  .stagebox .lab.l{background:rgba(31,36,30,.78);}

  /* ==== v4b runda 2 ==== */
  .p-stos{left:auto; right:11%; bottom:17%; width:clamp(170px,19vw,240px); z-index:6 !important; position:absolute; aspect-ratio:630/481; pointer-events:none;}
  .p-stempel{right:13% !important; top:7% !important; width:clamp(210px,23vw,310px) !important; z-index:6 !important; pointer-events:none; position:absolute;}
  h1.disp{font-size:clamp(30px,4.9vw,66px) !important;}
  h1.disp .ln > span{white-space:nowrap;}
  .doms{flex-wrap:nowrap !important; gap:6px 5px !important;}
  .doms span{background:transparent !important; color:var(--rust) !important; border:1.5px solid var(--rust) !important;
    border-radius:3px !important; mix-blend-mode:multiply !important; white-space:nowrap;
    font-size:10px !important; letter-spacing:.07em !important; padding:6px 9px !important;}
  .doms span:nth-child(1){transform:rotate(-1.4deg) !important;}
  .doms span:nth-child(2){transform:rotate(.9deg) !important; background:transparent !important;}
  .doms span:nth-child(3){transform:rotate(-.7deg) !important;}
  .doms span:nth-child(4){transform:rotate(1.3deg) !important; background:transparent !important;}
  .doms span:nth-child(5){transform:rotate(-1deg) !important; background:transparent !important;}
  .bcard .stampimg{width:clamp(185px,19vw,240px) !important; top:auto !important; bottom:20px !important;
    right:-42px !important; left:auto !important; z-index:7 !important; filter:saturate(1.06) contrast(1.15);}
  .bcard .real p{padding-right:76px;}
  .bcard .face{width:fit-content; margin:0 auto; position:relative;}
  .bcard.big{max-width:760px !important;}
  .bcard.big .face>img{max-height:68vh !important;}
  .lens{background:transparent !important;}
  .lens-world{position:absolute; left:0; top:0; transform-origin:0 0; pointer-events:none;}

  /* v4b runda 3 */
  .p-lupa{z-index:7 !important; pointer-events:none;}
  .card-img{filter:drop-shadow(0 20px 34px rgba(31,36,30,.20));}
  .por-img{filter:drop-shadow(0 16px 30px rgba(31,36,30,.16));}
  @media(max-width:860px){.p-stos{right:2%; bottom:1%; width:130px;}}

  /* v4.3: fizyka sznurka (verlet, jedna lina) + stos z 7 osobnych kartek */
  #ropeBack,#ropeFront{position:absolute; inset:0; width:100%; height:100%; pointer-events:none;}
  #ropeBack{z-index:2;}
  #ropeFront{z-index:6;}
  #stosJolt{position:absolute; inset:0;}
  .p-stos .karta{position:absolute; display:block; opacity:1; will-change:transform,opacity;
    filter:saturate(.55) brightness(1.09) drop-shadow(0 5px 10px rgba(31,36,30,.15));}

  /* ==== FULL v-0.1: sekcje narracji po compare ==== */
  .sekcja{position:relative; padding:clamp(84px,12vh,150px) 6vw; overflow:hidden;}
  .s-inner{max-width:880px; margin:0 auto; position:relative;}
  .s-ghost{position:absolute; top:-30px; right:-8px; font-family:Fraunces,serif; font-weight:700;
    font-size:clamp(110px,16vw,210px); line-height:1; color:rgba(44,56,48,.07); pointer-events:none; user-select:none;}
  .s-kick{font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.24em; text-transform:uppercase;
    color:var(--rust); margin-bottom:18px;}
  .s-h2{font-family:Fraunces,serif; font-weight:600; font-size:clamp(28px,3.8vw,50px); line-height:1.12;
    color:var(--ink); margin:0 0 22px; max-width:20ch;}
  .s-lead{font-size:clamp(17px,1.6vw,21px); line-height:1.55; color:var(--ink); max-width:56ch; margin:0 0 26px; font-weight:500;}
  .prose p{font-size:clamp(15.5px,1.25vw,17.5px); line-height:1.7; color:#454D42; max-width:66ch; margin:0 0 18px;}
  .prose strong{color:var(--ink);}
  .sekcja-tinted{background:linear-gradient(180deg, rgba(44,56,48,.035), rgba(44,56,48,0) 30%);}

  /* diagnozy: karty protokolu */
  .diag-lista{display:flex; flex-direction:column; gap:clamp(22px,3vw,34px); margin-top:36px;}
  .diag-karta{background:#F0EFE8; border:1px solid #C4C3B2; border-radius:8px; padding:clamp(20px,3vw,34px);
    box-shadow:0 14px 34px rgba(31,36,30,.10); position:relative;}
  .diag-karta:nth-child(odd){transform:rotate(-.4deg);}
  .diag-karta:nth-child(even){transform:rotate(.35deg);}
  .diag-karta::before{content:""; position:absolute; top:-12px; left:34px; width:86px; height:24px;
    background:rgba(121,129,111,.28); transform:rotate(-2deg); border-radius:2px;}
  .diag-head{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:14px;}
  .diag-num{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.14em; color:#8F8A74;}
  .diag-zgl{font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:.06em; padding:6px 10px;
    border:1.5px solid var(--rust); color:var(--rust); border-radius:3px; text-decoration:line-through; text-decoration-thickness:1.5px;}
  .diag-real{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.18em; color:var(--forest); text-transform:uppercase;}
  .diag-karta p{margin:0 0 12px;}
  .forgiving{margin-top:38px; background:var(--paper); border:1px dashed #B7B29B; border-radius:8px;
    padding:clamp(20px,2.6vw,30px); transform:rotate(-.3deg); max-width:70ch;}
  .forgiving p{margin:0;}
  .metoda{margin-top:30px;}

  /* --- v-0.4: SPROSTOWANIE (poz. 01) — sekcja-oddech po przykładach --- */
  #sprostowanie .prose p{max-width:66ch;}
  .spr-puenta{margin:34px 0 0; font-family:Fraunces,serif; font-style:italic; font-weight:500;
    font-size:clamp(20px,2.1vw,27px); line-height:1.4; color:var(--ink); max-width:24ch;
    text-wrap:balance;}
  .spr-puenta span{background-image:linear-gradient(rgba(176,141,46,.28), rgba(176,141,46,.28));
    background-repeat:no-repeat; background-size:100% .5em; background-position:0 78%;
    box-decoration-break:clone; -webkit-box-decoration-break:clone; padding:0 .1em;}
  .spr-next{margin-top:56px; display:flex; align-items:center; gap:18px; color:var(--tx-body); flex-wrap:wrap;}
  .spr-next .rule{flex:1; min-width:60px; height:1px; background:rgba(69,77,66,.35);}
  .spr-next .mono{font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;}

  /* showroom: kartoteka */
  #showroom .s-inner{max-width:1160px;}
  .sh-filtry{display:flex; gap:9px; flex-wrap:nowrap; overflow-x:auto; padding:4px 2px 12px; margin:26px 0 6px;
    scrollbar-width:none;}
  .sh-filtry::-webkit-scrollbar{display:none;}
  .sh-chip{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.07em; text-transform:uppercase;
    padding:9px 13px; min-height:40px; border-radius:3px; background:transparent; cursor:pointer; white-space:nowrap;
    border:1.5px solid var(--forest); color:var(--forest); mix-blend-mode:multiply;}
  .sh-chip:nth-child(odd){transform:rotate(-.8deg);}
  .sh-chip:nth-child(even){transform:rotate(.6deg);}
  .sh-chip[data-akcent="rust"]{border-color:var(--rust); color:var(--rust);}
  .sh-chip[data-akcent="steel"]{border-color:var(--steel); color:var(--steel);}
  .sh-chip[data-akcent="gold"]{border-color:var(--gold); color:var(--gold);}
  .sh-chip[aria-pressed="true"]{transform:none; color:var(--paper) !important;}
  .sh-chip[aria-pressed="true"][data-akcent="rust"]{background:var(--rust);}
  .sh-chip[aria-pressed="true"][data-akcent="steel"]{background:var(--steel);}
  .sh-chip[aria-pressed="true"][data-akcent="gold"]{background:var(--gold);}
  .sh-chip[aria-pressed="true"]:not([data-akcent]){background:var(--forest);}
  .sh-licznik{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.2em; color:#8F8A74; margin-bottom:22px;}
  .sh-grid{display:grid; grid-template-columns:1fr; gap:clamp(18px,3vw,30px);}
  @media(min-width:640px){.sh-grid{grid-template-columns:1fr 1fr;}}
  @media(min-width:1000px){.sh-grid{grid-template-columns:1fr 1fr 1fr;}}
  .sh-karta{background:#F0EFE8; border:1px solid #C4C3B2; border-radius:8px; padding:16px 16px 18px;
    box-shadow:0 14px 34px rgba(31,36,30,.10); position:relative; display:flex; flex-direction:column; gap:10px;}
  .sh-karta:nth-child(odd){transform:rotate(-.5deg);}
  .sh-karta:nth-child(even){transform:rotate(.4deg);}
  @media(hover:hover){.sh-karta{transition:transform .35s ease, box-shadow .35s ease;}
    .sh-karta:hover{transform:rotate(0) translateY(-4px); box-shadow:0 22px 44px rgba(31,36,30,.14);}}
  .sh-karta::before{content:""; position:absolute; top:-10px; left:26px; width:70px; height:20px;
    background:rgba(121,129,111,.28); transform:rotate(-2deg); border-radius:2px;}
  .sh-top{display:flex; justify-content:space-between; align-items:center; gap:8px;}
  .sh-poz{font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.16em; color:#8F8A74; font-variant-numeric:tabular-nums;}
  .sh-kat{font-family:'IBM Plex Mono',monospace; font-size:9.5px; letter-spacing:.08em; text-transform:uppercase;
    padding:4px 7px; border:1.2px solid; border-radius:3px; transform:rotate(-2deg);}
  .sh-kat.rust{color:var(--rust); border-color:var(--rust);}
  .sh-kat.steel{color:var(--steel); border-color:var(--steel);}
  .sh-kat.gold{color:var(--gold); border-color:var(--gold);}
  .sh-media{margin:0; border:1px solid #C4C3B2; border-radius:5px; overflow:hidden; background:#E9E7DC; position:relative;}
  .sh-atrapa{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
    background:repeating-linear-gradient(-45deg, rgba(44,56,48,.04) 0 14px, rgba(44,56,48,0) 14px 28px);}
  .sh-atrapa .st{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.2em; color:var(--forest);
    border:1.6px solid var(--forest); padding:7px 11px; border-radius:3px; transform:rotate(-3deg); opacity:.85; text-transform:uppercase;}
  .sh-atrapa .md{font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.14em; color:#8F8A74; text-transform:uppercase;}
  .sh-tytul{font-family:Fraunces,serif; font-weight:600; font-size:18.5px; line-height:1.25; color:var(--ink); margin:2px 0 0;}
  .sh-podpis{font-size:13.5px; line-height:1.55; color:#454D42; margin:0;}
  .sh-meta{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:auto; padding-top:6px;}
  .sh-metatxt{font-family:'IBM Plex Mono',monospace; font-size:9.5px; letter-spacing:.12em; color:#8F8A74; text-transform:uppercase;}
  .sh-anon{font-family:'IBM Plex Mono',monospace; font-size:9.5px; letter-spacing:.1em; color:var(--steel);
    border:1.2px solid var(--steel); padding:3px 7px; border-radius:3px; transform:rotate(-2deg); text-transform:uppercase;}
  .sh-cap{display:flex; align-items:center; gap:16px; margin-top:40px;}
  .sh-cap .rule{flex:1; height:1px; background:#C4C3B2;}
  .sh-cap span{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.18em; color:#8F8A74; text-transform:uppercase; white-space:nowrap;}

  /* social wstawka + kontakt + stopka */
  .social-note{margin-top:44px; max-width:60ch; background:#F0EFE8; border:1px solid #C4C3B2; border-radius:8px;
    padding:clamp(18px,2.4vw,28px); transform:rotate(.35deg); position:relative;}
  .social-note h3{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.22em; text-transform:uppercase;
    color:var(--steel); margin:0 0 12px;}
  .social-note p{margin:0 0 10px;}
  .kontakt-dane{display:flex; gap:clamp(18px,4vw,48px); flex-wrap:wrap; margin:30px 0 34px;}
  .kd{border:1px solid #C4C3B2; background:#F0EFE8; border-radius:8px; padding:18px 24px; min-width:220px;}
  .kd .lbl{font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.2em; color:#8F8A74; text-transform:uppercase; display:block; margin-bottom:6px;}
  .kd .val{font-family:Fraunces,serif; font-size:22px; color:var(--ink); font-weight:600;}
  .stopka{padding:34px 6vw 40px; display:flex; justify-content:space-between; align-items:center; gap:14px;
    border-top:1px solid #C4C3B2; flex-wrap:wrap;}
  .stopka .wm{font-family:Fraunces,serif; font-weight:600; font-size:17px; color:var(--ink);}
  .stopka .mono{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.14em; color:#8F8A74;}
  @media(max-width:860px){ .s-ghost{font-size:96px; top:-16px;} .sekcja{padding:64px 6vw;} }

  /* ==== FULL v-0.2: MOBILE REBUILD (<=860px) — fundament ==== */
  @media(max-width:860px){
    html, body{ overflow-x:hidden; }
    .hero-pin{ padding:84px 0 64px; }
    .inner{ display:block !important; width:min(92vw,560px) !important; }
    .hero-copy{ width:100% !important; max-width:100% !important; }
    .symptoms, .hero .lead{ max-width:100% !important; }
    h1.disp{ font-size:clamp(29px,9.4vw,44px) !important; }
    h1.disp .ln > span{ white-space:normal !important; }
    .doms{ flex-wrap:wrap !important; }
    .p-stempel{ width:clamp(116px,30vw,150px) !important; right:3% !important; top:9% !important; }
    .symptoms{ max-width:calc(100% - 32vw - 14px) !important; }
    .hook-kicker{ white-space:normal !important; max-width:92vw; font-size:11px !important; letter-spacing:.14em !important; }
    .cue{ display:none !important; }
    .por-wrap{ position:relative !important; margin:26px auto 0 !important; }
    .p-lupa{ width:clamp(120px,34vw,168px) !important; left:auto !important; right:8% !important; bottom:24% !important; }
    .p-stos{ right:6% !important; bottom:5% !important; width:clamp(112px,36vw,150px) !important; }
    .sekcja{ padding:56px 6vw; }
    .s-ghost{ display:none; }
    .diag-head{ gap:8px; }
    .kontakt-dane{ flex-direction:column; }
  }

  /* ==== FULL v-0.2: ARCHITEKTURA KOLORÓW ==== */
/* ============================================================
   ARCHITEKTURA KOLORÓW v-0.2 — „protokół schodzi głębiej"
   Zgodność wsteczna: --paper/--paper2/--paper3 aliasowane —
   zatwierdzone sekcje hero→compare nie zmieniają ani piksela.
   MAPA (v-0.4, PODPIĘTA — stan faktyczny = plan):
   hero .atmo-surface | descend: gradient | vign/compare/closer (własne p2) |
   sprostowanie .atmo-desk | .prog-p2-p3 | geneza .atmo-deep |
   dlakogo .atmo-deep | .prog-p3-dk | diagnozy .atmo-dark |
   showroom .atmo-dark (+ .dk-grain + .dk-lamp) | .prog-dk-p1 |
   bio .atmo-return | zasady .atmo-surface | rozmowa .atmo-desk |
   .prog-p2-ink | kontakt+stopka .atmo-ink (+ .ink-lamp „lampka na biurku")
   ============================================================ */
:root{
  /* --- oś papieru (zejście) --- */
  --p0:#E8E6DE;   /* powierzchnia: preloader, hero, zasady        */
  --p1:#DDDBD0;   /* półpiętro: bio (powrót z ciemni)             */
  --p2:#D0CFC2;   /* biurko: vignettes, compare, closer, rozmowa  */
  --p3:#C2C0B0;   /* archiwum: geneza, dla-kogo, diagnozy (NOWY)  */

  /* --- dokument: stała jasność na każdym papierze --- */
  --card:#F0EFE8;
  --card-edge:#B9B7A6;              /* zamiast bladego #C4C3B2 */
  --card-tape:rgba(87,98,90,.32);   /* washi-tape, multiply    */

  /* --- atramenty / tekst na jasnym --- */
  --ink:#1F241E; --forest:#2C3830;
  --tx-body:#454D42;  /* prose: 4.8:1 nawet na p3                 */
  --tx-mute:#57625A;  /* meta TYLKO p0/p1 (5.1:1 na p0);
                         na p2/p3 meta = var(--tx-body)           */
  /* KASACJA jako kolory tekstu: #8F8A74 (2.8:1) i #79816F        */

  /* --- akcenty: role, nie dekoracja --- */
  --rust:#C7480E;       /* werdykt/działanie: kreski, pieczątki, hover */
  --rust-deep:#A23A08;  /* rust dla małego tekstu na p0/p1 (5.4:1)     */
  --rust-lift:#F5803C;  /* rust w ciemni (5.4:1 na --dk)               */
  --steel:#3E4A50;      /* aparat protokołu: metadane, anonimizacja    */
  --steel-lift:#9FB4BC; /* steel w ciemni (6.6:1)                      */
  --gold:#8A7833;       /* dorobek/podpis — najrzadszy                 */
  --gold-lift:#C9B45C;  /* gold w ciemni (6.9:1)                       */

  /* --- ciemnia (ta sama rodzina hue co forest/ink) --- */
  --dk:#232B26;         /* ciemnia dowodów (showroom)   */
  --dk-ink:#1B211C;     /* finał: kontakt + stopka      */
  --dk-card:#2C352E;    /* stół podświetleniowy / karty */
  --dk-line:rgba(232,230,222,.14);
  --dk-tx:#E8E6DE;      /* 11.3:1 na --dk, 13:1 na --dk-ink */
  --dk-tx2:#A9B2A7;     /* 6.5:1 na --dk                    */
  --dk-ghost:rgba(232,230,222,.055);

  /* --- cienie: trzy poziomy zamiast jednego mydła --- */
  --sh-rest:0 1px 0 rgba(31,36,30,.05), 0 10px 24px rgba(31,36,30,.10);
  --sh-lift:0 2px 0 rgba(31,36,30,.05), 0 18px 44px rgba(31,36,30,.17);
  --sh-float:0 34px 90px rgba(31,36,30,.22);  /* max 1 na sekcję */
  --sh-dark:0 24px 60px rgba(0,0,0,.45), inset 0 0 0 1px rgba(232,230,222,.05);

  /* --- aliasy wsteczne v-0.1 --- */
  --paper:var(--p0); --paper2:var(--p1); --paper3:var(--p2);
  --line:#C4C3B2; --khaki:var(--tx-mute); --sand:#79816F;
}

/* ===================== ATMOSFERY ===================== */
.atmo{position:relative; background:var(--bg); color:var(--tx,var(--ink));}

.atmo-surface{--bg:var(--p0); --tx:var(--ink); --tx2:var(--tx-body);
  --mut:var(--tx-mute); --kick:var(--rust-deep); --ghost:rgba(31,36,30,.08);
  --card-bg:var(--card); --card-line:var(--card-edge); --sh-card:var(--sh-rest);}

.atmo-return{--bg:var(--p1); --tx:var(--ink); --tx2:var(--tx-body);
  --mut:var(--tx-mute); --kick:var(--rust-deep); --ghost:rgba(31,36,30,.085);
  --card-bg:var(--card); --card-line:var(--card-edge); --sh-card:var(--sh-rest);}

.atmo-desk{--bg:var(--p2); --tx:var(--ink); --tx2:var(--tx-body);
  --mut:var(--tx-body); --kick:var(--rust-deep); --ghost:rgba(31,36,30,.09);
  --card-bg:var(--card); --card-line:var(--card-edge); --sh-card:var(--sh-lift);}

.atmo-deep{--bg:var(--p3); --tx:var(--ink); --tx2:var(--tx-body);
  --mut:var(--tx-body); --kick:var(--ink);
  --ghost:rgba(240,239,232,.45); /* watermark JAŚNIEJSZY od tła = tłoczenie */
  --card-bg:var(--card); --card-line:var(--card-edge); --sh-card:var(--sh-lift);}
.atmo-deep .s-kick{color:var(--ink);}
.atmo-deep .s-kick::before{content:""; display:inline-block; width:16px; height:3px;
  background:var(--rust); margin-right:9px; vertical-align:middle;}
  /* rust-deep na p3 tylko 3.7:1 — dla 11px kicker w ink + rust-kreska */

.atmo-dark{--bg:var(--dk); --tx:var(--dk-tx); --tx2:var(--dk-tx2);
  --mut:var(--dk-tx2); --kick:var(--rust-lift); --ghost:var(--dk-ghost);
  --card-bg:var(--dk-card); --card-line:var(--dk-line); --sh-card:var(--sh-dark);
  color:var(--dk-tx);}
.atmo-ink{--bg:var(--dk-ink); --tx:var(--dk-tx); --tx2:var(--dk-tx2);
  --mut:var(--dk-tx2); --kick:var(--rust-lift); --ghost:var(--dk-ghost);
  --card-bg:var(--dk-card); --card-line:var(--dk-line); --sh-card:var(--sh-dark);
  color:var(--dk-tx);}
.atmo-dark ::selection,.atmo-ink ::selection{background:var(--rust-lift); color:var(--dk);}

/* --- elementy czytają tokeny atmosfery (mapowanie na klasy v-0.1) --- */
.atmo .s-h2,.atmo .s-lead{color:var(--tx);}
.atmo .prose p{color:var(--tx2);}
.atmo .prose strong{color:var(--tx);}
.atmo .s-kick{color:var(--kick);}
.atmo .s-ghost{color:var(--ghost);}
.atmo .diag-karta,.atmo .sh-karta,.atmo .kd,.atmo .social-note,.atmo .forgiving{
  background:var(--card-bg); border-color:var(--card-line); box-shadow:var(--sh-card);}
.atmo .diag-karta::before,.atmo .sh-karta::before{background:var(--card-tape);
  mix-blend-mode:multiply;}
.atmo .diag-num,.atmo .sh-poz,.atmo .sh-licznik,.atmo .sh-metatxt,
.atmo .sh-cap span,.atmo .kd .lbl,.atmo .sh-atrapa .md{color:var(--mut);}

/* --- ciemnia: karty i atrapy = podświetlone slajdy, nie dziury --- */
.atmo-dark .sh-media{background:#1E2620; border-color:var(--dk-line);
  box-shadow:inset 0 0 34px rgba(0,0,0,.5);}
.atmo-dark .sh-atrapa{background:repeating-linear-gradient(-45deg,
  rgba(232,230,222,.05) 0 14px, rgba(232,230,222,0) 14px 28px);}
.atmo-dark .sh-atrapa .st{color:var(--gold-lift); border-color:var(--gold-lift); opacity:1;}
.atmo-dark .sh-tytul{color:var(--dk-tx);}
.atmo-dark .sh-podpis{color:var(--dk-tx2);}
.atmo-dark .sh-kat.rust{color:var(--rust-lift); border-color:var(--rust-lift);}
.atmo-dark .sh-kat.steel{color:var(--steel-lift); border-color:var(--steel-lift);}
.atmo-dark .sh-kat.gold{color:var(--gold-lift); border-color:var(--gold-lift);}
.atmo-dark .sh-anon{color:var(--steel-lift); border-color:var(--steel-lift);}
.atmo-dark .sh-chip{border-color:var(--dk-tx2); color:var(--dk-tx2);}
.atmo-dark .sh-chip[data-akcent="rust"]{border-color:var(--rust-lift); color:var(--rust-lift);}
.atmo-dark .sh-chip[data-akcent="steel"]{border-color:var(--steel-lift); color:var(--steel-lift);}
.atmo-dark .sh-chip[data-akcent="gold"]{border-color:var(--gold-lift); color:var(--gold-lift);}
.atmo-dark .sh-chip{mix-blend-mode:normal;}
.atmo-dark .sh-chip[aria-pressed="true"]{color:var(--dk) !important;}
.atmo-dark .sh-chip[aria-pressed="true"][data-akcent="rust"]{background:var(--rust-lift);}
.atmo-dark .sh-chip[aria-pressed="true"][data-akcent="steel"]{background:var(--steel-lift);}
.atmo-dark .sh-chip[aria-pressed="true"][data-akcent="gold"]{background:var(--gold-lift);}
.atmo-dark .sh-chip[aria-pressed="true"]:not([data-akcent]){background:var(--dk-tx2);}

/* --- grain lokalny ciemni (globalny multiply gaśnie na ciemnym) --- */
.dk-grain{position:absolute; inset:0; pointer-events:none; z-index:1;
  opacity:.05; mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* --- czerwona lampka ciemni (JS ustawia --mx/--my z kursora) --- */
.dk-lamp{position:absolute; inset:0; pointer-events:none; z-index:1;
  mix-blend-mode:screen;
  background:radial-gradient(420px 420px at var(--mx,50%) var(--my,28%),
    rgba(199,72,14,.13), transparent 70%);}
@media(pointer:coarse){.dk-lamp{background:radial-gradient(60% 40% at 50% 0%,
  rgba(199,72,14,.08), transparent 70%);}}

/* --- lampka na biurku w finale (v-0.4: finał ≠ repryza ciemni akt —
       cieplejszy, wyraźny stożek światła nad kartą kontaktu + delikatny
       ambient rust; ciemnia akt zostaje zimna/dokumentalna) --- */
.ink-lamp{position:absolute; inset:0; pointer-events:none; mix-blend-mode:screen;
  background:
    radial-gradient(640px 460px at 38% 58%, rgba(201,180,92,.22), transparent 72%),
    radial-gradient(1100px 700px at 62% 30%, rgba(245,128,60,.05), transparent 75%);}

/* ===== PASY PRZEJŚCIOWE (zero JS, zero pinów; fallback reduced-motion)
   mid-stopy w rodzinie forest — środek gradientu nie szarzeje ===== */
.prog{position:relative; pointer-events:none; z-index:0;}
.prog-p2-p3{height:26vh; background:linear-gradient(180deg,var(--p2),var(--p3));}
.prog-p3-dk{height:34vh; background:linear-gradient(180deg,
  var(--p3) 0%, #6B7263 34%, #39423A 62%, var(--dk) 100%);}
.prog-dk-p1{height:26vh; background:linear-gradient(180deg,
  var(--dk) 0%, #4A5449 30%, #9AA091 68%, var(--p1) 100%);}
.prog-p2-ink{height:22vh; background:linear-gradient(180deg,
  var(--p2) 0%, #6A7263 40%, var(--dk-ink) 100%);}
.prog-label{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.22em;
  text-transform:uppercase; color:#C9CDBF; white-space:nowrap;}

/* --- CTA finału (na .atmo-ink) --- */
.cta-ink{display:inline-flex; align-items:center; gap:12px; text-decoration:none;
  background:var(--rust-deep); color:#FFF6EE;   /* 6.3:1 */
  font-weight:600; font-size:15.5px; padding:16px 28px; border-radius:999px;
  box-shadow:0 18px 44px rgba(0,0,0,.4);
  transition:background .3s, transform .25s;}
.cta-ink:hover{background:var(--rust); transform:translateY(-2px);}  /* 4.5:1 */

/* --- stopka w finale (v-0.4 P0-fix: footer MA obie klasy na sobie — selektor bez zagnieżdżenia) --- */
.stopka.atmo-ink{border-top:1px solid var(--dk-line);}
.stopka.atmo-ink .wm{color:var(--dk-tx);}
.stopka.atmo-ink .mono{color:var(--dk-tx2);}

/* --- KASACJA mydła v-0.1 --- */
.sekcja-tinted{background:none;}  /* tinty rgba(.035) zastąpione osią papieru */



  /* ==== FULL v-0.2: SHOWROOM "LINKA DOWODOWA" ==== */
  .sh2{ padding-bottom:0; overflow:hidden; }
  .sh2-lampa{ position:absolute; inset:0; pointer-events:none; z-index:1;
    background:radial-gradient(56% 44% at 50% 42%, rgba(232,230,222,.10), transparent 70%); }
  /* ==== v-0.4: WARSZTAT (iframe biurka) zamiast galerii linki ==== */
  .shb{ position:relative; z-index:2; max-width:1160px; margin:30px auto 0; padding:0 clamp(16px,3vw,32px) 54px; }
  .shb-ramka{ position:relative; aspect-ratio:16/9; border-radius:10px; overflow:hidden;
    background:#141a16; box-shadow:var(--sh-dark); border:1px solid var(--dk-line); }
  .shb-ramka iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block;
    pointer-events:none; }               /* uspiony: scroll strony nie wpada w warsztat */
  .shb-ramka.aktywny iframe{ pointer-events:auto; }
  .shb-cloak{ position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; gap:12px;
    align-items:center; justify-content:center; cursor:pointer; border:0; width:100%;
    background:linear-gradient(180deg, rgba(20,25,20,.18), rgba(20,25,20,.55) 78%);
    color:var(--dk-tx); text-align:center; padding:24px; }
  .shb-cloak[hidden]{ display:none; }
  .shb-cl-glowny{ font-size:12.5px; letter-spacing:.24em; text-transform:uppercase; color:#F2EBD8;
    border:1.6px solid rgba(242,235,216,.85); border-radius:4px; padding:13px 22px;
    background:rgba(20,25,20,.55); transition:background .25s, transform .25s; }
  @media(hover:hover){ .shb-cloak:hover .shb-cl-glowny{ background:var(--rust-deep); transform:translateY(-2px); } }
  .shb-cl-sub{ font-size:13px; line-height:1.5; color:var(--dk-tx2); max-width:52ch;
    text-shadow:0 1px 8px rgba(0,0,0,.5); }
  .shb-cloak:focus-visible{ outline:2px solid var(--rust-lift); outline-offset:-4px; }
  .shb-pasek{ display:flex; align-items:center; justify-content:space-between; gap:16px;
    flex-wrap:wrap; margin-top:14px; }
  .shb-status{ font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--dk-tx2); }
  .shb-akcje{ display:flex; gap:10px; }
  .shb-btn{ font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; cursor:pointer;
    color:var(--dk-tx); background:none; border:1.4px solid var(--dk-line); border-radius:4px;
    padding:8px 14px; transition:border-color .25s, color .25s; }
  @media(hover:hover){ .shb-btn:hover{ border-color:var(--rust-lift); color:var(--rust-lift); } }
  .shb-btn:focus-visible{ outline:2px solid var(--rust-lift); outline-offset:2px; }
  .shb-ramka:fullscreen{ aspect-ratio:auto; border-radius:0; }
  @media(max-width:860px){
    .shb{ padding:0 4vw 40px; }
    .shb-ramka{ aspect-ratio:4/3; }
    .shb-cl-sub{ font-size:11.5px; }
  }

  /* ==== FULL v-0.2: SCENY ==== */
  :root{ --manila:#C9B98C; --manila-c:#BFAE7E; --manila-edge:#A6935F; }

  /* --- łuk tonalny v-0.4: zejście PODPIĘTE (sprostowanie p2 → geneza/dlakogo p3 → ciemnia).
     Poprzednie korekty v-0.2 nadpisywały tła po ID i trzymały genezę na p1 (jaśniej niż
     closer!) — to było sedno „rozjazdu" połówek. Pasy i sekcje idą teraz wg mapy atmosfer. --- */
  .prog-p2-p3{background:linear-gradient(180deg,var(--p2),var(--p3));}
  #geneza.atmo{background:linear-gradient(0deg, rgba(44,56,48,.045), rgba(44,56,48,.045)), var(--p3);}
  .prog-p3-dk{height:40vh; background:linear-gradient(180deg,
    var(--p3) 0%, #8A9082 30%, #4A5449 64%, var(--dk) 100%);}
  .prog-p2-ink{background:linear-gradient(180deg, var(--p2) 0%, #6A7263 40%, var(--dk-ink) 100%);}
  #rozmowa .s-kick{color:var(--steel);}
  .prog-depth{position:absolute; left:clamp(14px,3vw,44px); bottom:30px; font-family:'IBM Plex Mono',monospace;
    font-size:10.5px; letter-spacing:.14em; color:#C9CDBF; font-variant-numeric:tabular-nums; font-weight:500;}

  /* --- LINIA PROTOKOŁU: jedna nić akt w lewym marginesie --- */
  .poz{position:absolute; left:clamp(8px,2.2vw,40px); top:0; bottom:0; z-index:3; pointer-events:none; color:var(--mut,#57625A);}
  .poz-nic{position:absolute; left:0; top:0; bottom:0; width:0; border-left:1px dashed currentColor; opacity:.45; transform-origin:top; display:block;}
  .poz-tab{position:absolute; left:-5px; top:clamp(84px,12vh,150px); writing-mode:vertical-rl; font-size:9.5px;
    letter-spacing:.2em; opacity:.75; background:var(--bg); padding:8px 0;}
  .poz-ink{color:var(--dk-tx2);}
  .poz-ink .poz-tab{background:transparent;}
  @media(max-width:899px){ .poz{display:none;} }

  /* --- v-0.4: SPIS POZYCJI PROTOKOŁU (jedyna nawigacja na ~27k px strony) --- */
  .spis{position:fixed; right:clamp(12px,2.4vw,30px); bottom:clamp(12px,2.4vw,26px); z-index:90;
    display:flex; flex-direction:column; align-items:flex-end; gap:10px;}
  .spis-btn{font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; cursor:pointer;
    color:var(--ink); background:var(--card); border:1.4px solid var(--card-edge); border-radius:4px;
    padding:9px 14px; box-shadow:var(--sh-rest); transition:border-color .25s, color .25s;}
  @media(hover:hover){ .spis-btn:hover{border-color:var(--rust); color:var(--rust);} }
  .spis-btn:focus-visible{outline:2px solid var(--rust); outline-offset:2px;}
  .spis-btn[aria-expanded="true"]{color:var(--rust); border-color:var(--rust);}
  .spis-lista{list-style:none; margin:0; padding:12px 14px; background:var(--card);
    border:1px solid var(--card-edge); border-radius:6px; box-shadow:var(--sh-lift);
    display:flex; flex-direction:column; gap:2px; max-height:min(60vh,480px); overflow:auto;}
  .spis-lista[hidden]{display:none;}
  .spis-lista a{display:block; padding:6px 8px; font-size:10.5px; letter-spacing:.14em;
    text-transform:uppercase; color:#454D42; text-decoration:none; border-radius:3px;
    white-space:nowrap; transition:background .2s, color .2s;}
  @media(hover:hover){ .spis-lista a:hover{background:rgba(199,72,14,.09); color:var(--rust-deep);} }
  .spis-lista a:focus-visible{outline:2px solid var(--rust); outline-offset:-2px;}
  .spis-lista .spis-szczyt{border-bottom:1px dashed var(--card-edge); margin-bottom:6px; padding-bottom:6px;}

  /* --- GENEZA: zeznanie świadka --- */
  .gen-cialo{position:relative;}
  .gen-fraza{border-bottom:2px dotted var(--rust-deep); padding-bottom:1px; cursor:default;}
  .gen-marker{background-image:linear-gradient(rgba(176,141,46,.30), rgba(176,141,46,.30));
    background-repeat:no-repeat; background-size:100% 82%; background-position:0 62%;
    box-decoration-break:clone; -webkit-box-decoration-break:clone;}
  .gen-zwrot{font-size:clamp(17px,1.6vw,21px) !important; line-height:1.55 !important;
    color:var(--tx) !important; font-weight:500; max-width:56ch !important;}
  .gen-rozplatac{position:relative; white-space:nowrap;}
  .gen-splot{position:absolute; left:-4%; bottom:-.85em; width:108%; height:.95em; overflow:visible; pointer-events:none;}
  .gen-splot path{fill:none; stroke:var(--rust); stroke-width:2; stroke-linecap:round; opacity:.9;}
  .gen-dowody{display:none; position:absolute; right:calc(-1 * clamp(0px, 16vw - 130px, 190px)); top:0; width:132px;}
  #geneza.gen-on .gen-dowody{display:block;}
  .gen-dow-head{display:block; font-size:9px; letter-spacing:.18em; color:var(--mut); margin-bottom:10px; text-transform:uppercase;}
  .gen-dow-lista{display:flex; flex-direction:column; gap:14px;}
  .gen-mini{position:relative; margin:0; width:100%; will-change:transform;}
  .gen-mini::before{content:""; position:absolute; top:-8px; left:22%; width:46%; height:15px;
    background:var(--card-tape); mix-blend-mode:multiply; transform:rotate(-2.5deg); border-radius:2px; z-index:2;}
  .gen-mini img{display:block; width:100%; height:auto; filter:saturate(.7) contrast(1.04);
    box-shadow:0 8px 18px rgba(31,36,30,.16); border-radius:3px;}
  .gen-mini-tag{display:block; font-size:8.5px; letter-spacing:.16em; color:var(--mut); margin-top:5px; text-transform:uppercase;}

  /* --- DLA KOGO: karta kwalifikacji --- */
  .dk2-grid{display:grid; grid-template-columns:1.25fr .85fr; gap:clamp(22px,4vw,52px); align-items:start;}
  .kwal{position:relative; background:var(--card-bg); border:1px solid var(--card-line); border-radius:8px;
    padding:clamp(18px,2.4vw,28px); box-shadow:var(--sh-card); transform:rotate(.6deg); max-width:380px;}
  .kwal-tape{position:absolute; top:-12px; left:30px; width:84px; height:22px; background:var(--card-tape);
    mix-blend-mode:multiply; transform:rotate(-2deg); border-radius:2px;}
  .kwal-head{color:var(--steel); letter-spacing:.22em; margin-bottom:16px; border-bottom:1px solid var(--card-line); padding-bottom:10px;}
  .kwal-list{list-style:none; display:flex; flex-direction:column; gap:13px;}
  .kwal-poz{display:flex; align-items:center; gap:12px;}
  .kwal-poz .mono{color:var(--tx-body); font-size:10.5px; letter-spacing:.08em;}
  .kwal-znak{width:20px; height:20px; flex:0 0 20px;}
  .kwal-znak path{fill:none; stroke:var(--rust); stroke-width:2.6; stroke-linecap:round;}
  .kwal-x path{stroke:var(--steel);}
  .kwal-sk{position:relative; display:inline-block; padding:1px 2px;}
  .kwal-strike{position:absolute; left:-2px; right:-2px; top:50%; height:12px; transform:translateY(-50%); overflow:visible; pointer-events:none;}
  .kwal-strike path{stroke:var(--rust); stroke-width:2.2; fill:none; stroke-linecap:round;}
  .kwal-korpo .mono{color:var(--mut);}
  .kwal-stopka{display:flex; align-items:center; gap:14px; margin-top:20px; border-top:1px dashed var(--card-line); padding-top:14px; color:var(--forest);}
  .mini-kompas{width:44px; height:44px; flex:0 0 44px;}
  .kwal-podpis{font-size:9px; letter-spacing:.14em; color:var(--mut); line-height:1.8;}

  /* --- DIAGNOZY: trzy akta pod lampą --- */
  .dg-jasnosc{position:absolute; inset:0; z-index:2; pointer-events:none; opacity:0;
    background:radial-gradient(64% 54% at 50% 42%, rgba(232,230,222,.15), transparent 72%);}
  .dg-protokol{position:relative; background:var(--card); border:1px solid var(--card-edge); border-radius:4px;
    padding:14px 18px; margin:26px 0 8px; max-width:380px; box-shadow:var(--sh-dark);
    display:flex; flex-direction:column; gap:7px; transform:rotate(-.5deg);}
  .dg-protokol::before{content:""; position:absolute; top:-9px; left:26px; width:64px; height:17px;
    background:var(--card-tape); mix-blend-mode:multiply; transform:rotate(-2deg); border-radius:2px;}
  .dg-prot-head{color:#8F8A74; font-size:9px; letter-spacing:.2em;}
  .dg-prot-poz{display:flex; align-items:center; gap:10px;}
  .dg-prot-poz s{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.08em; color:var(--forest);
    text-decoration-color:var(--rust); text-decoration-thickness:1.8px;}
  .dg-prot-poz i{font-style:normal; font-size:8.5px; letter-spacing:.14em; color:var(--rust); border:1px solid var(--rust);
    border-radius:3px; padding:1px 5px; transform:rotate(-3deg);}
  .dg-prot-cta{color:var(--rust); font-size:9px; letter-spacing:.2em; margin-top:4px;}
  .dg-prog{display:flex; align-items:center; gap:14px; color:var(--dk-tx2); margin:18px 0 6px; font-variant-numeric:tabular-nums;}
  .dg-kreski{display:flex; gap:7px;}
  .dg-kreski i{width:26px; height:3px; background:rgba(232,230,222,.32); position:relative; overflow:hidden; display:block;}
  .dg-kreski i b{position:absolute; inset:0; background:var(--rust-lift); transform:scaleX(0); transform-origin:left; display:block;}
  .dg-teczka{position:relative; margin:0 0 30px;}
  .dg-okladka{position:relative; z-index:3; display:flex; align-items:center; gap:14px; flex-wrap:wrap;
    background:linear-gradient(180deg, var(--manila), var(--manila-c)); border:1px solid var(--manila-edge);
    border-radius:8px 8px 0 0; padding:13px 20px; box-shadow:var(--sh-dark); will-change:transform;}
  .dg-okladka::before{content:""; position:absolute; top:-11px; left:18px; width:120px; height:12px;
    background:var(--manila); border:1px solid var(--manila-edge); border-bottom:none; border-radius:5px 5px 0 0;}
  .dg-zakladka{color:#4A4126; font-size:10px; letter-spacing:.2em;}
  .dg-okl-zgl{position:relative; display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:11.5px;
    letter-spacing:.08em; color:var(--ink); padding:1px 2px;}
  .dg-okl-zgl svg{position:absolute; left:-2px; right:-2px; top:50%; height:13px; transform:translateY(-50%); overflow:visible; pointer-events:none;}
  .dg-okl-zgl svg path{stroke:var(--rust); stroke-width:2.4; fill:none; stroke-linecap:round;}
  .dg-okl-tag{font-size:8.5px; letter-spacing:.16em; color:var(--rust); border:1.2px solid var(--rust);
    border-radius:3px; padding:2px 6px; transform:rotate(-4deg);}
  #diagnozy .diag-karta{transform:none; border-radius:0 0 8px 8px; margin-top:-1px;
    padding-left:clamp(46px,5.5vw,62px); padding-bottom:70px; position:relative;}
  #diagnozy .diag-karta::before{display:none;}
  #diagnozy .diag-zgl{text-decoration:none; position:relative; display:inline-block; padding:4px 8px;}
  .dg-strike{position:absolute; left:2px; right:2px; top:50%; height:13px; transform:translateY(-50%); overflow:visible; pointer-events:none; width:calc(100% - 4px);}
  .dg-strike path{stroke:var(--rust); stroke-width:2.4; fill:none; stroke-linecap:round;}
  .dg-nic{position:absolute; left:14px; top:66px; bottom:88px; width:22px; height:auto; pointer-events:none;}
  .dg-nic path{fill:none; stroke-linecap:round;}
  .dg-nic-rdzen{stroke:#8A7040; stroke-width:3.4;}
  .dg-nic-splot{stroke:#D9C79B; stroke-width:1.2; stroke-dasharray:3 4;}
  #diagnozy .diag-karta .prose u{text-decoration:none;
    background-image:linear-gradient(var(--rust), var(--rust)); background-repeat:no-repeat;
    background-size:100% 2px; background-position:0 96%;}
  #diagnozy .diag-real{display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:10.5px;
    letter-spacing:.14em; text-transform:uppercase; color:var(--rust); border:1.6px solid var(--rust);
    border-radius:3px; padding:7px 11px; transform:rotate(-1.2deg); margin-top:4px; background:rgba(199,72,14,.05);}
  .dg-stemp{position:absolute; right:20px; bottom:16px; display:flex; flex-direction:column; align-items:center; gap:1px;
    font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.22em; text-transform:uppercase;
    color:var(--rust); border:2px solid var(--rust); border-radius:4px; padding:7px 12px;
    transform:rotate(-6deg); mix-blend-mode:multiply; will-change:transform;}
  .dg-final{position:relative; z-index:4;}
  /* v-0.4: stemple na CIEMNYCH kartach akt — rust-lift + normal blend (multiply gasił je do zera) */
  .atmo-dark .dg-stemp{color:var(--rust-lift); border-color:var(--rust-lift); mix-blend-mode:normal; opacity:.92;}
  #diagnozy .forgiving{border-color:rgba(232,230,222,.4); background:rgba(240,239,232,.06);}
  #diagnozy .forgiving p{color:var(--dk-tx);}
  #diagnozy .metoda p{font-family:Fraunces,serif; font-weight:500; font-size:clamp(17px,1.9vw,25px);
    line-height:1.45; color:var(--dk-tx); max-width:none;}
  #diagnozy .metoda strong{color:var(--gold-lift); font-weight:600;}
  .dg-trzy{margin-top:34px; position:relative; max-width:640px;}
  .dg-trzy-linia{position:absolute; left:0; right:0; top:8px; width:100%; height:34px; pointer-events:none;}
  .dg-trzy-linia path{fill:none; stroke:#8A7040; stroke-width:2;}
  .dg-trzy-teczki{display:flex; gap:clamp(14px,4vw,40px); justify-content:space-between; position:relative;}
  .dg-mini{display:flex; flex-direction:column; align-items:center; gap:8px; flex:1;}
  .dg-mini i{display:block; width:52px; height:34px; background:linear-gradient(180deg,var(--manila),var(--manila-c));
    border:1px solid var(--manila-edge); border-radius:3px; position:relative; box-shadow:0 6px 14px rgba(0,0,0,.35);}
  .dg-mini i::before{content:""; position:absolute; top:-6px; left:6px; width:20px; height:6px;
    background:var(--manila); border:1px solid var(--manila-edge); border-bottom:none; border-radius:3px 3px 0 0;}
  .dg-mini b{font-weight:400; font-size:8.5px; letter-spacing:.12em; color:var(--dk-tx2); text-align:center;}

  /* diagnozy: tryb pinowanej sceny (JS dodaje .dg-on tylko na desktopie z animacjami) */
  #diagnozy.dg-on{padding:0 4vw;}
  #diagnozy.dg-on .dg-pin{height:100svh; display:flex; align-items:center; overflow:hidden;}
  #diagnozy.dg-on .s-inner{width:100%; max-width:1060px; height:94svh; display:flex; flex-direction:column; padding-top:4svh; position:relative;}
  #diagnozy.dg-on .s-ghost{display:none;}
  #diagnozy.dg-on .s-kick{margin-bottom:10px;}
  #diagnozy.dg-on .s-h2{font-size:clamp(19px,2.1vw,28px); max-width:30ch; margin-bottom:8px;}
  #diagnozy.dg-on .dg-protokol{position:absolute; right:0; top:0; margin:0; width:min(330px,32%); z-index:1;}
  #diagnozy.dg-on .diag-lista{position:relative; flex:1; min-height:0; margin-top:6px;}
  #diagnozy.dg-on .dg-teczka{position:absolute; inset:0; margin:auto; width:min(660px,94%); height:fit-content; max-height:100%;}
  #diagnozy.dg-on .dg-okladka{position:absolute; inset:0; border-radius:8px; flex-direction:column; justify-content:center; gap:18px;}
  #diagnozy.dg-on .dg-okladka::before{top:-11px; left:26px;}
  #diagnozy.dg-on .dg-zakladka{font-size:13px;}
  #diagnozy.dg-on .dg-okl-zgl{font-size:15px;}
  #diagnozy.dg-on .diag-karta{border-radius:8px; margin-top:0;}
  #diagnozy.dg-on .diag-karta .prose p{font-size:14px; line-height:1.55; max-width:none; margin-bottom:12px;}
  #diagnozy.dg-on .dg-nic{top:58px; bottom:82px;}
  #diagnozy.dg-on .dg-final{position:absolute; inset:0; margin:auto; width:min(720px,94%); height:fit-content;
    display:flex; flex-direction:column; gap:18px; z-index:6; pointer-events:none; opacity:0;}
  #diagnozy.dg-on .forgiving{margin-top:0;}
  #diagnozy.dg-on .metoda{margin-top:0;}
  #diagnozy.dg-on .dg-trzy{margin-top:8px;}
  #diagnozy.dg-on .dg-prog{position:absolute; left:0; bottom:1.5svh; margin:0;}

  /* diagnozy: ciasne viewporty — finał musi zmieścić się w pinie */
  @media (max-height:900px){
    #diagnozy.dg-on .metoda p{font-size:16.5px; line-height:1.4;}
    #diagnozy.dg-on .forgiving{padding:14px 18px;}
    #diagnozy.dg-on .forgiving p{font-size:13.5px; line-height:1.55;}
    #diagnozy.dg-on .dg-final{gap:10px;}
    #diagnozy.dg-on .dg-trzy{margin-top:2px;}
    #diagnozy.dg-on .dg-mini i{width:42px; height:27px;}
    #diagnozy.dg-on .diag-karta .prose p{font-size:13px; line-height:1.5;}
    #diagnozy.dg-on .diag-karta{padding-bottom:60px;}
  }

  /* --- BIO: przebieg trasy --- */
  .bio-trasa{position:relative;}
  #bio.bio-on .bio-trasa{padding-left:clamp(64px,9vw,120px);}
  #bio.bio-on .bio-rail{display:block;}
  .bio-rail{display:none; position:absolute; left:0; top:0; bottom:0; width:clamp(48px,7vw,96px); pointer-events:none; color:var(--gold);}
  .bio-kompas{position:absolute; left:50%; top:-16px; transform:translateX(-50%); width:40px; color:var(--gold);}
  .bio-kompas .mini-kompas{width:40px; height:40px;}
  .bio-svg{position:absolute; left:0; top:34px; bottom:44px; width:100%; height:calc(100% - 78px);}
  .bio-path{fill:none; stroke:var(--gold); stroke-width:2px; stroke-dasharray:7 6; opacity:.85;}
  .bio-petla{position:absolute; left:50%; bottom:2px; transform:translateX(-50%); width:34px; height:34px;}
  .bio-petla path{fill:none; stroke:var(--gold); stroke-width:2.2; stroke-linecap:round;}
  .bio-dot{position:absolute; left:50%; width:11px; height:11px; margin-left:-5.5px; border-radius:50%;
    background:var(--gold); box-shadow:0 0 0 4px rgba(138,120,51,.18); pointer-events:auto;}
  @media(hover:hover){ .bio-dot:hover{animation:bioPuls .9s ease-in-out infinite;} }
  @keyframes bioPuls{ 0%,100%{box-shadow:0 0 0 4px rgba(138,120,51,.18);} 50%{box-shadow:0 0 0 9px rgba(138,120,51,.08);} }
  .bio-tab{position:absolute; left:calc(50% + 14px); margin-top:-4px; font-size:8.5px; letter-spacing:.16em;
    color:var(--gold); white-space:nowrap; background:var(--bg); padding:2px 4px; border:1px solid rgba(138,120,51,.4);
    border-radius:3px; transform:rotate(-1.6deg);}
  /* v-0.4: bio-final wraca do prozy (ściana 30px serifa grzebała puentę);
     wyróżnikiem jest TYLKO zdanie .bio-lacz — delikatnie większy Fraunces + podkreślenie */
  #bio .bio-final{font-size:17.5px; line-height:1.7; color:var(--tx2); max-width:66ch;}
  .bio-lacz{position:relative; font-family:Fraunces,serif; font-style:italic; font-weight:500;
    font-size:clamp(19px,1.9vw,24px); line-height:1.4; color:var(--rust); white-space:normal;}
  .bio-under{position:absolute; left:-1%; bottom:-.12em; width:102%; height:.28em; overflow:visible; pointer-events:none;}
  .bio-under path{fill:none; stroke:var(--rust); stroke-width:4; stroke-linecap:round;}

  /* --- ZASADY: wyłączenia z protokołu --- */
  .zas-klauzula{position:relative; margin:0 0 26px;}
  .zas-nr{display:inline-block; font-size:9.5px; letter-spacing:.22em; color:var(--rust-deep);
    border-bottom:1px solid rgba(162,58,8,.35); padding-bottom:3px; margin-bottom:9px; text-transform:uppercase;}
  .zas-cyt{position:relative; display:inline; padding:0 1px;}
  .zas-cyt svg{position:absolute; left:-2px; right:-2px; top:50%; height:13px; transform:translateY(-50%);
    overflow:visible; pointer-events:none; width:calc(100% + 4px);}
  .zas-cyt svg path{stroke:var(--rust); stroke-width:2.2; fill:none; stroke-linecap:round; opacity:.9;}
  .zas-katalog{position:absolute; right:calc(-1 * clamp(0px, 18vw - 150px, 220px)); top:6px; width:150px;
    background:var(--card-bg); border:1px solid var(--card-line); border-radius:6px; padding:12px 13px 40px;
    box-shadow:var(--sh-card); transform:rotate(1.2deg); will-change:transform;}
  .zk-tyt{display:block; font-size:8.5px; letter-spacing:.14em; color:var(--tx-body); margin-bottom:9px; text-transform:uppercase;}
  .zk-linia{display:block; height:5px; background:rgba(31,36,30,.14); border-radius:2px; margin:6px 0;}
  .zk-linia.kr{width:62%;}
  .zk-stemp{position:absolute; right:8px; bottom:8px; font-size:9.5px; letter-spacing:.18em; text-transform:uppercase;
    color:var(--rust); border:2px solid var(--rust); border-radius:3px; padding:4px 8px; transform:rotate(-8deg); will-change:transform;}
  .soc-ikony{display:flex; gap:14px; margin:4px 0 16px;}
  .soc-kw{display:block; width:48px; height:48px; border:1.5px dashed var(--steel); border-radius:8px; opacity:.9; will-change:transform;}
  .soc-kw svg{display:block; width:100%; height:100%;}
  .soc-x{fill:none; stroke:var(--rust); stroke-width:2.6; stroke-linecap:round;}

  /* --- ROZMOWA: procedura po sznurku --- */
  .rz-tor{position:relative; padding-left:clamp(52px,7vw,86px);}
  .rz-lina{position:absolute; left:clamp(6px,1.4vw,18px); top:6px; bottom:6px; width:30px; height:calc(100% - 12px); pointer-events:none;}
  .rz-lina-rdzen{fill:none; stroke:#8A7040; stroke-width:3.4px; stroke-linecap:round;}
  .rz-lina-splot{fill:none; stroke:#D9C79B; stroke-width:1.2px; stroke-dasharray:3 4;}
  .rz-stacja{position:relative; margin:0 0 34px;}
  .rz-krok{display:inline-block; font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--steel);
    border:1.6px solid var(--steel); border-radius:3px; padding:6px 10px; transform:rotate(-2deg);
    margin-bottom:12px; background:var(--card-bg); will-change:transform;}
  /* v-0.4: karty kroków dostają papierowość jak reszta rekwizytów (rotacja; taśma via ::before) */
  .rz-stacja:nth-child(2) .rz-karta{transform:rotate(-.35deg);}
  .rz-stacja:nth-child(3) .rz-karta{transform:rotate(.3deg);}
  .rz-stacja:nth-child(4) .rz-karta{transform:rotate(-.25deg);}
  .rz-karta::before{content:""; position:absolute; left:34px; top:-9px; width:74px; height:20px;
    background:var(--card-tape); transform:rotate(-2deg); mix-blend-mode:multiply; border-radius:2px;}
  .rz-karta{position:relative; background:var(--card-bg); border:1px solid var(--card-line); border-radius:8px 8px 8px 8px;
    padding:clamp(18px,2.4vw,28px); box-shadow:var(--sh-card); max-width:62ch; will-change:transform;}
  .rz-karta::after{content:""; position:absolute; right:0; bottom:0; width:0; height:0;
    border-style:solid; border-width:0 0 22px 22px; border-color:transparent transparent var(--bg) transparent;
    filter:drop-shadow(-2px -2px 2px rgba(31,36,30,.10)); border-bottom-right-radius:4px;}
  .rz-karta .prose p{margin:0;}
  .rz-widelki{position:relative; max-width:400px; margin:0 0 26px; padding-top:2px;}
  .rz-y{display:block; width:min(220px,70%); height:74px; margin-left:-14px;}
  .rz-y path{fill:none; stroke-width:3; stroke-linecap:round;}
  .rz-y-gold{stroke:var(--gold);}
  .rz-y-steel{stroke:var(--steel);}
  .rz-tail{position:absolute; font-size:9.5px; letter-spacing:.14em; white-space:nowrap;}
  .rz-tail-gold{left:-14px; bottom:-8px; color:var(--gold);}
  .rz-tail-steel{left:150px; bottom:-8px; color:var(--steel);}
  .rz-margines{position:relative; max-width:56ch; background:var(--paper); border:1px dashed #B7B29B; border-radius:8px;
    padding:clamp(16px,2.2vw,24px); transform:rotate(-1.6deg); margin-top:10px; will-change:transform;}
  .rz-margines .prose p{margin:0; font-size:14.5px;}

  /* --- KONTAKT: nowe zgłoszenie --- */
  .kt-biurko{position:relative; margin-top:26px;}
  .kt-tlo{position:absolute; right:-4%; top:-30px; width:min(300px,40%); z-index:0; opacity:.5;
    transform:rotate(-5deg); pointer-events:none; filter:saturate(.6) brightness(.8);}
  .kt-karta{position:relative; z-index:2; background:var(--card); border:1px solid var(--card-edge); border-radius:10px;
    padding:clamp(22px,3.4vw,40px); padding-bottom:88px; max-width:640px; box-shadow:var(--sh-dark); will-change:transform;
    /* v-0.4 P0-fix: jasna karta w ciemnej sekcji resetuje tokeny atmosfery —
       .atmo .prose p / .atmo .kd .lbl czytają --tx2/--mut z NAJBLIŻSZEGO przodka */
    --tx:var(--ink); --tx2:#454D42; --mut:#57625A;}
  .kt-karta .kwal-tape{left:36px;}
  .kt-stare{display:flex; flex-direction:column; gap:8px; border-bottom:1px dashed var(--card-edge);
    padding-bottom:16px; margin-bottom:20px;}
  .kt-head{color:#8F8A74; font-size:9px; letter-spacing:.2em;}
  .kt-zgl{display:flex; align-items:center; gap:10px; will-change:transform;}
  .kt-zgl s{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.08em; color:var(--forest);
    text-decoration-color:var(--rust); text-decoration-thickness:1.8px;}
  .kt-zgl i{font-style:normal; font-family:'IBM Plex Mono',monospace; font-size:8px; letter-spacing:.14em;
    color:#8F8A74; border:1px solid #B9B7A6; border-radius:3px; padding:1px 5px; text-transform:uppercase; transform:rotate(-2deg);}
  .kt-nowa{position:relative; display:flex; align-items:center; gap:12px; margin-top:6px; min-height:26px;}
  .kt-linia{width:min(320px,58%); height:8px; overflow:visible;}
  .kt-linia path{fill:none; stroke:var(--forest); stroke-width:1.6; stroke-dasharray:4 5; stroke-linecap:round; opacity:.75;}
  .kt-tag{font-size:8.5px; letter-spacing:.14em; color:#8F8A74; border:1.2px dashed #A9A695; border-radius:3px;
    padding:2px 6px; transform:rotate(-3deg); text-transform:uppercase;}
  .kt-olowek{width:74px; height:16px; color:var(--forest); opacity:.8;}
  .kt-copy p{color:#454D42;}
  .kt-karta .kontakt-dane{margin:22px 0 10px;}
  .kt-karta .kd{background:#FBF9F1; border-color:var(--card-edge); text-decoration:none; display:block;
    box-shadow:0 6px 16px rgba(31,36,30,.10); will-change:transform;}
  .kt-karta .kd::before{content:""; display:block; width:30px; height:9px; border:2px solid #8F8A74; border-bottom:none;
    border-radius:6px 6px 0 0; margin:-24px 0 8px 6px; opacity:.7;}
  .kt-karta .kd .val{background-image:linear-gradient(var(--rust), var(--rust)); background-repeat:no-repeat;
    background-size:0% 2px; background-position:0 98%; transition:background-size .35s;}
  @media(hover:hover){ .kt-karta .kd:hover .val{background-size:100% 2px;} }
  .kt-stempel{position:absolute; right:22px; bottom:18px; font-family:'IBM Plex Mono',monospace; font-size:15px;
    letter-spacing:.18em; text-transform:uppercase; color:var(--rust); border:2.6px solid var(--rust);
    border-radius:4px; padding:9px 16px; transform:rotate(-9deg); mix-blend-mode:multiply; will-change:transform;}

  /* --- STOPKA: odcinek dla zgłaszającego --- */
  footer.stopka.atmo-ink{position:relative; border-top:none; padding-top:40px; will-change:transform;}
  footer.stopka.atmo-ink::before{content:""; position:absolute; top:14px; left:6vw; right:6vw; height:2px;
    background:repeating-linear-gradient(90deg, rgba(232,230,222,.4) 0 7px, transparent 7px 16px);}
  .st-supel{width:76px; height:30px; color:var(--dk-tx2); opacity:.8;}
  .st-supel path{fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round;}
  .st-supel circle{fill:currentColor;}

  /* --- SCENY: mobile (<=860px) --- */
  @media(max-width:860px){
    .gen-dowody{position:static; width:auto; margin:6px 0 22px;}
    .gen-dow-lista{flex-direction:row; gap:10px; overflow-x:auto; padding-bottom:6px;}
    .gen-mini{flex:0 0 64px; width:64px;}
    .gen-mini::before{height:10px; top:-5px;}
    .gen-mini-tag{display:none;}
    .dk2-grid{display:block;}
    .kwal{margin-top:26px; max-width:420px;}
    .dg-protokol{max-width:none;}
    #diagnozy .diag-karta{padding-left:clamp(40px,10vw,52px); padding-bottom:76px;}
    .dg-nic{left:11px;}
    .dg-okladka{border-radius:8px 8px 0 0;}
    .bio-trasa{padding-left:34px;}
    .bio-rail{width:22px;}
    .bio-kompas{width:30px;}
    .bio-kompas .mini-kompas{width:30px; height:30px;}
    .bio-tab{display:none;}
    .bio-dot{width:9px; height:9px; margin-left:-4.5px;}
    .bio-petla{width:26px; height:26px;}
    .zas-katalog{display:none;}
    .rz-tor{padding-left:36px;}
    .rz-lina{left:2px; width:22px;}
    .rz-tail-steel{left:120px;}
    .kt-tlo{display:none;}
    .kt-karta{padding-bottom:76px;}
    .kt-stempel{font-size:12.5px; right:14px; bottom:14px;}
    .kt-linia{width:52%;}
  }

  /* --- SCENY: fallback bez animacji (stany końcowe) --- */
  html.no-anim .dg-jasnosc{opacity:0;}
  html.no-anim .gen-dowody{display:none;}  /* miniatury buduje JS */
  html.no-anim .bio-trasa{padding-left:0;}
  html.no-anim .bio-rail{display:none;}



/* ==== ANEKS 08b · zlecenia punktowe — minimalny CSS ponad bazę v-0.4 ==== */
/* pozycje aneksu — karty jak kroki rozmowy (rz-karta), rotacje jak w v-0.4 */
.an-pozycje{margin:34px 0 6px;}
.an-poz{position:relative; margin:0 0 34px;}
.an-poz:nth-of-type(1) .rz-karta{transform:rotate(-.35deg);}
.an-poz:nth-of-type(2) .rz-karta{transform:rotate(.3deg);}
.an-poz:nth-of-type(3) .rz-karta{transform:rotate(-.25deg);}
#zlecenia .rz-margines{margin-top:26px;}
#zlecenia .spr-puenta{max-width:30ch;}

/* hero: dopisek o zleceniach punktowych */
.hero-punkt{margin:14px 0 0; font-size:clamp(13.5px,1.2vw,15px); line-height:1.5; color:var(--tx-body); max-width:46ch;}
.hero-punkt a{color:var(--rust); text-decoration:none; border-bottom:1px solid rgba(199,72,14,.4);}
.hero-punkt a:hover{border-bottom-color:var(--rust);}

/* ==== ŁUK TONALNY v2 — ciągłość drugiej połowy + faktura powierzchni ==== */
.prog-p1-p2{height:18vh; background:linear-gradient(180deg,var(--p1),var(--p2));}
/* linie topograficzne jak w hero — czysta faktura, NIE zmienia odcienia tła */
#bio.atmo, #zasady.atmo, #rozmowa.atmo, #zlecenia.atmo{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 340'%3E%3Cg fill='none' stroke='%23232B26' stroke-opacity='.045' stroke-width='1.2'%3E%3Cpath d='M0 46 C 180 30, 360 66, 560 48 S 940 60, 1200 42'/%3E%3Cpath d='M0 132 C 220 118, 420 150, 640 130 S 1000 140, 1200 124'/%3E%3Cpath d='M0 214 C 160 202, 380 236, 620 216 S 980 228, 1200 208'/%3E%3Cpath d='M0 298 C 240 284, 460 314, 680 296 S 1020 306, 1200 290'/%3E%3C/g%3E%3C/svg%3E");
  background-size:1200px auto; background-repeat:repeat;}
/* rozmowa i aneks: dolna winieta prowadząca w pas (multi-bg: winieta NAD topo) */
#zlecenia.atmo{
  background-image:linear-gradient(180deg, rgba(31,36,30,0) 84%, rgba(31,36,30,.05) 100%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 340'%3E%3Cg fill='none' stroke='%23232B26' stroke-opacity='.045' stroke-width='1.2'%3E%3Cpath d='M0 46 C 180 30, 360 66, 560 48 S 940 60, 1200 42'/%3E%3Cpath d='M0 132 C 220 118, 420 150, 640 130 S 1000 140, 1200 124'/%3E%3Cpath d='M0 214 C 160 202, 380 236, 620 216 S 980 228, 1200 208'/%3E%3Cpath d='M0 298 C 240 284, 460 314, 680 296 S 1020 306, 1200 290'/%3E%3C/g%3E%3C/svg%3E");
  background-size:auto, 1200px auto; background-repeat:no-repeat, repeat;}

/* pasy przejściowe NIE znikają na mobile — .prog{display:none} @899px dotyczy tylko licznika compare */
@media(max-width:899px){
  .prog-p1-p2, .prog-p2-p3, .prog-p3-dk, .prog-dk-p1, .prog-p2-ink{display:block;}
}