/* Página: Minha história (autor) */
.hist{--ink:#070D18}
.mood{position:fixed;inset:0;z-index:0;pointer-events:none}
.mood i{position:absolute;inset:0;opacity:0;transition:opacity 1s ease}
.mood i.on{opacity:1}
.mood i[data-m=m1]{background:radial-gradient(70% 60% at 85% 20%,rgba(235,77,29,.28),transparent 65%),radial-gradient(60% 50% at 0% 100%,rgba(246,196,49,.16),transparent 70%),#0b0a12}
.mood i[data-m=m2]{background:radial-gradient(70% 60% at 15% 15%,rgba(74,163,255,.28),transparent 65%),radial-gradient(60% 60% at 100% 90%,rgba(255,111,181,.2),transparent 70%),#070b1c}
.mood i[data-m=m3]{background:radial-gradient(80% 60% at 50% 0%,rgba(52,199,89,.26),transparent 65%),repeating-linear-gradient(0deg,rgba(52,199,89,.04) 0 1px,transparent 1px 4px),#030c07}
.mood i[data-m=m4]{background:radial-gradient(90% 70% at 50% 50%,rgba(125,136,155,.12),transparent 70%),#07090f}
.mood i[data-m=m5]{background:radial-gradient(70% 55% at 50% 0%,rgba(74,184,245,.34),transparent 65%),radial-gradient(60% 50% at 90% 100%,rgba(235,77,29,.18),transparent 70%),#07142a}
.mood i[data-m=m6]{background:radial-gradient(70% 60% at 85% 15%,rgba(130,57,238,.36),transparent 65%),radial-gradient(60% 60% at 0% 100%,rgba(74,184,245,.16),transparent 70%),#0e0920}
.mood i[data-m=m7]{background:radial-gradient(70% 60% at 20% 20%,rgba(74,184,245,.22),transparent 65%),radial-gradient(70% 60% at 90% 90%,rgba(235,77,29,.26),transparent 65%),radial-gradient(50% 50% at 60% 40%,rgba(130,57,238,.2),transparent 70%),#070d18}
.hist #bg{opacity:.55}
.hist .page,.hist-hero,.hist-wrap,.sheet,.hist-end{position:relative;z-index:1}
.hist-progress{position:fixed;left:0;right:0;top:3px;height:3px;z-index:61;pointer-events:none}
.hist-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-2),var(--accent-3))}

/* hero */
.hist-hero{min-height:calc(100vh - 80px);display:flex;align-items:center;padding:var(--space-9) var(--gutter)}
.hist-hero-in{max-width:var(--container-max);margin:0 auto;width:100%;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--space-9);align-items:center}
.hist-hero h1{font-size:clamp(2.6rem,8vw,var(--text-5xl));margin:var(--space-3) 0}
.start{animation:startblink 1.6s ease-in-out infinite}
@keyframes startblink{50%{box-shadow:0 0 0 6px rgba(235,77,29,.25),var(--glow-orange)}}

/* fases */
.hist-wrap{max-width:1200px;margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:150px minmax(0,1fr);gap:var(--space-7)}
.hist-rail{position:sticky;top:110px;align-self:start;padding:var(--space-4) 0}
.rail-t{margin:0 0 var(--space-3);font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--ls-wider);text-transform:uppercase;color:var(--text-secondary)}
.hist-rail ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.hist-rail a{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:var(--radius-md);color:var(--text-secondary);font-size:var(--text-sm);text-decoration:none;opacity:.55;transition:all .3s}
.hist-rail a b{display:grid;place-items:center;width:24px;height:24px;border-radius:6px;border:1px solid var(--border-default);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-primary)}
.hist-rail a.on{opacity:1;background:var(--accent-soft);color:var(--text-primary)}.hist-rail a.on b{background:var(--accent);border-color:var(--accent)}
.hist-rail a.done{opacity:.85}.hist-rail a.done b{border-color:var(--accent)}
.rail-bar{height:4px;margin-top:var(--space-4);border-radius:2px;background:var(--surface-3);overflow:hidden}.rail-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-3))}
.fase{position:relative;min-height:88vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--space-7);align-items:center;padding:var(--space-9) 0;border-top:1px solid rgba(255,255,255,.06)}
.fnum{position:absolute;left:-6px;top:var(--space-6);font-family:var(--font-display);font-weight:700;font-size:clamp(5rem,16vw,12rem);line-height:1;color:transparent;-webkit-text-stroke:2px rgba(255,255,255,.12);pointer-events:none;user-select:none}
.ftxt{position:relative;z-index:1}
.fase h2{font-size:clamp(1.9rem,5vw,var(--text-4xl));margin:var(--space-3) 0 var(--space-5)}
.fp{color:var(--text-secondary);font-size:var(--text-lg);line-height:var(--lh-relaxed);margin:0 0 var(--space-4);max-width:560px}
.fart{position:relative;z-index:1;display:grid;place-items:center}
.fart svg{width:100%;max-width:420px;height:auto;filter:drop-shadow(0 0 28px color-mix(in oklch,var(--glow,var(--accent)) 45%,transparent));animation:fartfloat 6s ease-in-out infinite}
@keyframes fartfloat{50%{transform:translateY(-10px)}}
.fase[data-mood=m1]{--glow:#EB4D1D}.fase[data-mood=m2]{--glow:#4aa3ff}.fase[data-mood=m3]{--glow:#34c759}.fase[data-mood=m4]{--glow:#7D889B}.fase[data-mood=m5]{--glow:#4AB8F5}.fase[data-mood=m6]{--glow:#8239EE}.fase[data-mood=m7]{--glow:#EB4D1D}
.fase[data-mood=m4] .fart svg{animation:fartpause 3s ease-in-out infinite;opacity:.8}
@keyframes fartpause{50%{opacity:.35}}
.blink{animation:cursor 1s steps(2) infinite}@keyframes cursor{50%{opacity:0}}
.emblem{position:relative;width:min(300px,70vw);aspect-ratio:1;display:grid;place-items:center}
.emblem img{width:78%;height:auto;border-radius:50%;position:relative;z-index:1;filter:drop-shadow(0 0 30px rgba(235,77,29,.5))}
.emblem i{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,255,255,.18);animation:ring 5s ease-out infinite}.emblem i+i{animation-delay:2.5s}
@keyframes ring{from{transform:scale(.6);opacity:.9}to{transform:scale(1.25);opacity:0}}

/* origem do símbolo e evolução da marca */
.origin{position:relative;z-index:1;padding:clamp(72px,10vw,136px) var(--gutter);background:linear-gradient(180deg,transparent,rgba(9,18,35,.72) 12%,rgba(9,18,35,.78) 88%,transparent)}
.origin-in{max-width:1120px;margin:0 auto}.origin-head{max-width:780px}.origin-head h2,.logo-head h2{font-size:clamp(2.25rem,6vw,4.6rem);margin:var(--space-3) 0 var(--space-5)}
.origin-story{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:clamp(32px,6vw,76px);align-items:center;margin-top:var(--space-7)}
.origin-copy{display:grid;gap:var(--space-4)}.origin-copy p{margin:0;color:var(--text-secondary);font-size:clamp(1rem,1.4vw,1.12rem);line-height:1.85}.origin-copy b{color:var(--text-primary)}
.tentacle-map{position:relative;min-height:480px;display:grid;place-items:center;margin:0}.octo-core{position:relative;z-index:2;width:190px;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,rgba(74,184,245,.18),transparent 66%)}.octo-core::before,.octo-core::after{content:"";position:absolute;inset:-18px;border:1px solid rgba(74,184,245,.28);border-radius:50%;animation:ring 5s ease-out infinite}.octo-core::after{animation-delay:2.5s}.octo-core img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 30px rgba(74,184,245,.35))}
.tentacle-map ul{position:absolute;inset:0;list-style:none;margin:0;padding:0}.tentacle-map li{position:absolute;padding:7px 12px;border:1px solid var(--border-default);border-radius:var(--radius-pill);background:rgba(7,13,24,.82);font:600 var(--text-xs) var(--font-display);text-transform:uppercase;letter-spacing:var(--ls-wide);color:var(--text-secondary);box-shadow:var(--shadow-sm)}.tentacle-map li::after{content:"";position:absolute;width:58px;height:1px;background:linear-gradient(90deg,var(--blue-400),transparent)}
.tentacle-map li:nth-child(1){left:4%;top:12%}.tentacle-map li:nth-child(2){right:8%;top:10%}.tentacle-map li:nth-child(3){left:0;top:39%}.tentacle-map li:nth-child(4){right:0;top:37%}.tentacle-map li:nth-child(5){left:4%;bottom:28%}.tentacle-map li:nth-child(6){right:8%;bottom:26%}.tentacle-map li:nth-child(7){left:20%;bottom:5%}.tentacle-map li:nth-child(8){right:14%;bottom:3%}.tentacle-map li:nth-child(odd)::after{left:100%}.tentacle-map li:nth-child(even)::after{right:100%;transform:rotate(180deg)}
.dream-note{display:grid;grid-template-columns:auto 1fr;gap:var(--space-5);align-items:start;margin:var(--space-9) 0;padding:clamp(24px,4vw,40px);border:1px solid var(--border-accent);border-radius:var(--radius-xl);background:radial-gradient(circle at 0 50%,rgba(235,77,29,.16),transparent 38%),linear-gradient(150deg,rgba(130,57,238,.12),rgba(255,255,255,.02));box-shadow:var(--glow-soft)}.dream-note>span{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--accent);box-shadow:var(--glow-orange);font-size:1.4rem}.dream-note h3{margin:0 0 var(--space-2);font-size:clamp(1.35rem,3vw,2rem)}.dream-note p{margin:0;color:var(--text-secondary);line-height:1.8}
.logo-head{max-width:820px;margin:clamp(80px,10vw,128px) 0 var(--space-7)}.logo-head .sub{max-width:760px;line-height:1.8}
.logo-timeline{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5)}.logo-timeline::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:linear-gradient(transparent,var(--blue-400),var(--purple-400),transparent);opacity:.25}
.logo-era{position:relative;margin:0;padding:var(--space-4);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);background:linear-gradient(155deg,rgba(255,255,255,.055),rgba(255,255,255,.015));box-shadow:var(--shadow-lg);overflow:hidden}.logo-era.current{border-color:var(--border-accent);box-shadow:var(--glow-soft),var(--shadow-lg)}
.logo-frame{aspect-ratio:1;display:grid;place-items:center;overflow:hidden;border-radius:calc(var(--radius-xl) - 8px);background:#03050a}.logo-frame img{width:100%;height:100%;object-fit:contain;transition:transform .55s var(--ease-out)}.logo-era:hover .logo-frame img{transform:scale(1.035)}
.logo-era figcaption{display:grid;gap:5px;padding:var(--space-4) var(--space-2) var(--space-2)}.logo-era figcaption b{font-family:var(--font-display);text-transform:uppercase;font-size:var(--text-lg);color:var(--text-primary)}.logo-era figcaption span{color:var(--text-secondary);font-size:var(--text-sm);line-height:1.65}

/* ficha */
.sheet{padding:var(--space-10) var(--gutter)}
.sheet-in{max-width:1100px;margin:0 auto}
.sheet-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-5);margin-top:var(--space-6)}
.sheet-grid article{padding:var(--space-6);border-radius:var(--radius-xl);border:1px solid var(--border-default);background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.sheet-grid small{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--ls-wider);text-transform:uppercase;color:var(--blue-300)}
.sheet-grid h3{margin:var(--space-2) 0;font-size:var(--text-xl)}
.sheet-grid p{margin:0;color:var(--text-secondary);font-size:var(--text-sm);line-height:1.7}
.sheet-grid .quest{border-color:var(--border-accent);background:linear-gradient(160deg,var(--accent-soft),rgba(255,255,255,.02));box-shadow:var(--glow-soft)}
.sheet-grid .quest small{color:var(--orange-300,#ff9b72)}
.hist-end{padding:var(--space-10) var(--gutter) var(--space-12)}
.end-in{max-width:760px;margin:0 auto;text-align:center}
.end-in .fp{margin-left:auto;margin-right:auto}
.end-in .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:var(--space-6) 0}
.end-in .social{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
@media (max-width:900px){.hist-hero-in{grid-template-columns:1fr}.hist-wrap{grid-template-columns:1fr}.hist-rail{display:none}.fase{grid-template-columns:1fr;min-height:auto;gap:var(--space-5)}.fase .fart{order:-1}.fnum{top:0;font-size:5.5rem}}
@media (prefers-reduced-motion:reduce){.fart svg,.start,.emblem i,.blink{animation:none!important}}

/* Revisão responsiva: leitura, proporção e ritmo visual */
.hist .page{overflow:clip}
.hist-hero{min-height:auto;padding:clamp(44px,7vw,88px) var(--gutter) clamp(64px,8vw,104px)}
.hist-hero-in{max-width:1120px;grid-template-columns:minmax(260px,380px) minmax(0,1fr);gap:clamp(40px,7vw,96px)}
.hist-hero .medal{width:min(100%,360px);max-width:none}
.hist-hero h1{font-size:clamp(2.75rem,6.5vw,5.75rem);line-height:.94;max-width:720px}
.hist-hero .sub{max-width:660px;font-size:clamp(1rem,1.6vw,1.2rem);line-height:1.75}
.hist-hero .medal-hint{bottom:-18px}
.hist-hero .scroll-hint{bottom:22px}

.hist-wrap{max-width:1180px;grid-template-columns:180px minmax(0,1fr);gap:clamp(28px,5vw,68px);padding-bottom:var(--space-8)}
.hist-rail{top:96px}
.hist-main{display:flex;flex-direction:column;gap:var(--space-7)}
.fase{min-height:0;grid-template-columns:minmax(0,1.1fr) minmax(220px,.75fr);gap:clamp(28px,5vw,64px);padding:clamp(36px,6vw,72px);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);background:linear-gradient(145deg,rgba(15,27,46,.92),rgba(7,13,24,.78));box-shadow:0 22px 60px rgba(0,0,0,.22);overflow:hidden}
.fase:nth-child(even){grid-template-columns:minmax(220px,.75fr) minmax(0,1.1fr)}
.fase:nth-child(even) .ftxt{order:2}
.fase:nth-child(even) .fart{order:1}
.fnum{left:24px;top:12px;font-size:clamp(4.5rem,10vw,8rem);-webkit-text-stroke-width:1px;opacity:.7}
.fase h2{font-size:clamp(1.9rem,3.7vw,3.15rem);line-height:1.05;max-width:650px}
.fp{font-size:clamp(1rem,1.45vw,1.12rem);line-height:1.8;max-width:650px}
.fart{min-width:0}
.fart svg{width:min(100%,280px);max-height:230px}
.emblem{width:min(230px,70vw)}

.sheet{padding:clamp(72px,9vw,120px) var(--gutter)}
.sheet-in{max-width:1040px}
.sheet-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
.sheet-grid article{padding:var(--space-5)}
.hist-end{padding:clamp(64px,8vw,112px) var(--gutter) clamp(80px,10vw,140px)}
.end-in h2{font-size:clamp(2rem,5vw,4rem)}

@media (max-width:900px){
  .hist-hero{padding:28px var(--gutter) 56px}
  .hist-hero-in{grid-template-columns:1fr;gap:28px;text-align:center}
  .hist-hero .medal{width:min(58vw,250px)}
  .hist-hero h1{font-size:clamp(2.35rem,11vw,3.35rem);margin-top:8px}
  .hist-hero .sub{font-size:1rem;line-height:1.65;margin-left:auto;margin-right:auto}
  .hist-hero .medal-hint{display:none}
  .hist-wrap{display:block;padding-left:var(--gutter);padding-right:var(--gutter)}
  .hist-main{gap:20px}
  .fase,.fase:nth-child(even){grid-template-columns:1fr;gap:20px;padding:28px 22px 24px}
  .fase:nth-child(even) .ftxt,.fase:nth-child(even) .fart{order:initial}
  .fase .fart,.fase:nth-child(even) .fart{order:2}
  .fnum{left:auto;right:18px;top:10px;font-size:4.25rem}
  .fase h2{font-size:clamp(1.65rem,8vw,2.3rem);padding-right:24px;margin-bottom:14px}
  .fp{font-size:1rem;line-height:1.7}
  .fart svg{width:min(100%,210px);max-height:170px}
  .emblem{width:min(180px,56vw)}
  .sheet{padding:64px var(--gutter)}
  .sheet-grid{grid-template-columns:1fr;gap:14px}
  .sheet-grid article{padding:22px}
  .hist-end{padding:64px var(--gutter) 88px}
  .origin-story{grid-template-columns:1fr}.tentacle-map{min-height:410px}.logo-timeline{grid-template-columns:1fr}.logo-timeline::before{display:none}
}

@media (max-width:430px){
  .hist-hero{padding-top:18px}
  .hist-hero .medal{width:min(52vw,210px)}
  .hist-hero h1{font-size:2.35rem}
  .hist-hero .btn.lg{width:100%;justify-content:center}
  .fase{padding:26px 18px 22px}
  .fase h2{font-size:1.75rem}
  .fart svg{width:min(100%,180px);max-height:145px}
  .end-in .row{display:grid}
  .end-in .row .btn{width:100%;justify-content:center}
  .origin{padding:64px var(--gutter)}.tentacle-map{min-height:360px}.octo-core{width:140px}.tentacle-map li{font-size:10px;padding:6px 9px}.tentacle-map li::after{width:32px}.dream-note{grid-template-columns:1fr}.dream-note>span{width:44px;height:44px}.logo-era{padding:10px}
}