/* ==== KONKAI — Apresentação pública
   Papel, tinta e vermelho. A página funciona sem fontes ou imagens externas.
   A navegação e as ilustrações respeitam preferências de movimento reduzido.
==== */
:root{--ink:#111310;--paper:#f3f0e7;--red:#b62b25;--red-light:#dd5042;--muted:#68685e;--line:#d4d0c4;--serif:"Yu Mincho","Palatino Linotype","Book Antiqua",Georgia,serif;--sans:"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65}
body::after{content:"";pointer-events:none;position:fixed;inset:0;z-index:30;opacity:.035;background:repeating-linear-gradient(0deg,transparent 0,transparent 2px,#000 3px,transparent 4px);mix-blend-mode:multiply}
button,a,summary{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--red-light);outline-offset:5px}
::selection{color:var(--paper);background:var(--red)}
h1,h2,h3,p,figure{margin:0}
h1,h2,h3{font-family:var(--serif);line-height:1.08;font-weight:600}
h2{font-size:clamp(36px,4.25vw,64px);letter-spacing:-2px}
h2 em{font-style:normal;color:var(--red)}
p{max-width:65ch}
canvas{display:block;max-width:100%}
.skip-link{position:fixed;top:8px;left:12px;z-index:100;background:var(--paper);color:var(--ink);padding:12px 20px;transform:translateY(-160%)}
.skip-link:focus{transform:translateY(0)}
.site-header{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:100px;padding:20px 4.5%;color:var(--paper);border-bottom:1px solid #f3f0e71c}
.brand{display:inline-flex;align-items:center;gap:12px;flex-shrink:0;font-size:27px;font-family:var(--serif);font-weight:700;letter-spacing:3px;line-height:1}
.brand small{display:block;font-family:var(--sans);font-size:8px;letter-spacing:3.3px;font-weight:500;margin-top:9px}
.brand-seal{height:48px;width:43px;display:grid;place-items:center;background:var(--red);font-size:32px;color:var(--paper);letter-spacing:0;transform:rotate(-4deg);border:1px solid #d3554d}
.site-nav{display:flex;align-items:center;gap:30px;font-size:12px;letter-spacing:1px;font-weight:600}
.site-nav>a{padding:10px 0}
.site-nav>a:hover{color:#f19c92}
.site-nav .nav-play{padding:12px 20px;border:1px solid #f3f0e777}
.site-nav .nav-play span{padding-left:20px}
.site-nav .nav-play:hover{background:var(--paper);color:var(--ink)}
.nav-toggle{display:none}
.hero{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr 1fr;min-height:900px;min-height:min(900px,100svh);background:var(--ink);color:var(--paper);overflow:hidden;padding:155px 4.5% 115px}
.hero::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:12px;background:var(--paper);clip-path:polygon(0 70%,12% 65%,25% 75%,36% 30%,55% 55%,68% 30%,81% 65%,100% 0,100% 100%,0 100%)}
.hero-lines{position:absolute;inset:0;z-index:-1;opacity:.25;background:linear-gradient(115deg,transparent 40%,#74796e18 40.1%,transparent 40.25%),repeating-linear-gradient(90deg,transparent 0,transparent 249px,#f3f0e717 250px,transparent 251px)}
.hero-copy{align-self:center;position:relative;z-index:3;max-width:630px}
.eyebrow{font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:#d2cfc4;display:flex;align-items:center;gap:10px;line-height:1.6}
.eyebrow.ink{color:var(--red)}
.status-dot{width:6px;height:6px;border-radius:50%;background:var(--red-light)}
.hero h1{font-size:clamp(64px,7.4vw,112px);letter-spacing:-4px;line-height:.98;margin:28px 0 28px}
.hero h1 em{font-style:normal;color:var(--red-light);position:relative;display:inline-block}
.hero h1 em::after{content:"";position:absolute;height:8px;background:var(--red);bottom:-11px;left:0;right:-5px;clip-path:polygon(0 30%,65% 0,100% 55%,40% 90%,3% 100%)}
.hero-description{font-size:15px;line-height:1.85;color:#bbbdb2;max-width:415px;margin:35px 0 29px}
.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.button{display:inline-flex;min-height:56px;align-items:center;justify-content:center;gap:36px;padding:15px 25px;font-size:12px;font-weight:700;letter-spacing:.5px;border:1px solid transparent;transition:background .2s,color .2s,transform .2s}
.button:hover{transform:translateY(-2px)}
.button-red{color:var(--paper);background:var(--red)}
.button-red:hover{background:#d03c32}
.button-paper{color:var(--ink);background:var(--paper)}
.button-paper:hover{background:#fff}
.text-link{display:inline-flex;min-height:44px;align-items:center;gap:18px;font-size:11px;font-weight:600;letter-spacing:.35px;border-bottom:1px solid #f3f0e755}
.text-link:hover{color:#e67c6d}
.text-link.dark{border-color:#5e605d66}
.text-link.dark:hover{color:var(--red)}
.hero-note{font-size:10px;color:#8e9387;margin-top:20px;letter-spacing:.3px}
.hero-art{position:absolute;right:0;top:82px;bottom:0;width:58%;z-index:1;pointer-events:none}
.hero-art canvas{width:100%;height:100%;object-fit:contain;object-position:right bottom}
.hero-art figcaption{position:absolute;bottom:83px;left:34%;font-size:9px;letter-spacing:2px;color:#c5c7bd;writing-mode:vertical-rl}
.hero-art figcaption span{font-family:var(--serif);font-size:18px;margin-bottom:15px;letter-spacing:8px;color:#e56d5a}
.art-label{position:absolute;top:16%;right:7%;font-size:8px;letter-spacing:3px;writing-mode:vertical-rl;color:#d3cfc2}
.art-label span{font-family:var(--serif);font-size:42px;letter-spacing:5px;margin-bottom:25px;border:1px solid #b62b25aa;padding:8px;color:#dd5042}
.hero-scroll{position:absolute;bottom:44px;left:4.5%;font-size:9px;letter-spacing:2px;color:#a8ad9e;display:flex;align-items:center;gap:18px;z-index:4}
.hero-scroll span{font-size:22px;line-height:1}
.world-strip{display:flex;justify-content:space-between;align-items:center;gap:22px;margin:0 4.5%;padding:32px 0;border-bottom:1px solid var(--line);font-size:9px;letter-spacing:2px;text-transform:uppercase}
.world-strip>span:not(.strip-note){display:flex;align-items:baseline;gap:9px}
.world-strip strong{font-family:var(--serif);font-size:30px;letter-spacing:-1px;line-height:1}
.world-strip .strip-note{letter-spacing:.5px;text-transform:none;font-size:11px;color:var(--muted)}
.section{padding:90px 4.5%;max-width:1600px;margin:auto}
.section-index{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:2px;color:var(--muted);padding-bottom:24px;border-bottom:1px solid var(--line);margin-bottom:50px}
.section-index>span:last-child{font-family:var(--serif);font-size:24px;color:var(--red);line-height:1}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:8%;margin-bottom:70px}
.intro-grid .eyebrow{margin-bottom:20px}
.intro-prose{padding-top:7px;font-size:14px;color:#5e6056;line-height:1.9}
.intro-prose p+p{margin-top:18px}
.intro-prose .text-link{margin-top:16px;color:var(--ink)}
.journey{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.journey li{position:relative;border-top:1px solid var(--line);padding-top:24px}
.step-number{font-size:10px;color:var(--red);letter-spacing:2px;position:absolute;left:0;top:22px}
.step-art{height:125px;position:relative;display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.step-art b{font-family:var(--serif);font-weight:400}
.art-path::before{content:"";width:110px;height:60px;border:1px dashed #a1a191;transform:skew(-25deg) rotate(-18deg)}
.art-path b{position:absolute;font-size:32px;color:var(--ink);transform:rotate(-10deg)}
.art-path i{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--red);transform:translate(-75px,30px)}
.art-path i:nth-child(2){transform:translate(65px,-35px);width:9px;height:9px}
.art-path i:nth-child(3){transform:translate(0,30px)}
.art-loadout{gap:13px}
.art-loadout i{font-family:var(--serif);font-size:30px;display:grid;place-items:center;border:1px solid #acac9e;height:58px;width:48px;font-style:normal;transform:rotate(-6deg)}
.art-loadout i:nth-child(2){background:var(--ink);color:var(--paper);transform:translateY(-8px) rotate(4deg);border-color:var(--ink)}
.art-loadout i:nth-child(3){border-color:var(--red);color:var(--red);transform:rotate(9deg)}
.art-gate i{width:78px;height:92px;border:8px solid var(--ink);border-bottom:0;border-top-width:13px;transform:skew(-3deg);position:absolute;bottom:12px}
.art-gate i::before{content:"";position:absolute;top:-18px;left:-20px;right:-20px;height:7px;background:var(--ink);transform:rotate(-5deg)}
.art-gate b{font-size:38px;color:var(--red);z-index:1;padding-top:26px}
.journey h3{font-size:24px;margin-bottom:16px;letter-spacing:-.5px}
.journey p{font-size:13px;line-height:1.8;color:var(--muted)}
.classes{padding-top:25px}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin-bottom:55px}
.section-heading p{font-size:12px;color:var(--muted);max-width:350px;margin-bottom:4px;line-height:1.9}
.class-stage{display:grid;grid-template-columns:27% 36% 37%;border-top:1px solid var(--line);border-bottom:1px solid var(--line);min-height:520px}
.class-tabs{padding:45px 0;align-self:center}
.class-tab{background:transparent;border:0;border-bottom:1px solid var(--line);padding:22px 14px 22px 0;width:100%;display:grid;grid-template-columns:24px 1fr auto 20px;align-items:center;gap:10px;text-align:left;color:var(--ink);min-height:83px}
.class-tab>span{font-size:9px;color:var(--muted)}
.class-tab strong{font-family:var(--serif);font-size:23px;font-weight:500;letter-spacing:-.7px}
.class-tab i{font-family:var(--serif);font-size:18px;color:#9a9a8d;font-style:normal}
.class-tab b{font-size:16px;opacity:0;font-weight:400;transition:transform .2s}
.class-tab.active{color:var(--red);border-color:var(--red)}
.class-tab.active>span,.class-tab.active i{color:var(--red)}
.class-tab.active b,.class-tab:hover b{opacity:1}
.class-tab:hover b{transform:translate(2px,-2px)}
.class-portrait{position:relative;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;min-height:520px}
.class-portrait canvas{position:relative;width:100%;height:100%;object-fit:contain;z-index:1}
.portrait-ring{position:absolute;inset:20% 6% 19%;border:1px solid #b7b5a7;border-radius:50%}
.portrait-ring::before,.portrait-ring::after{content:"";position:absolute;inset:10px;border:1px solid #d5d1c6;border-radius:50%}
.portrait-ring::after{inset:-15px;border-style:dashed;opacity:.45}
.portrait-caption{position:absolute;bottom:16px;font-size:8px;text-transform:uppercase;letter-spacing:2px;color:var(--muted);z-index:2}
.class-details{align-self:center;padding:40px 0 40px 28px}
.class-panel+.class-panel{margin-top:45px}
.js .class-panel+.class-panel{margin-top:0}
.class-panel[hidden]{display:none}
.class-panel .eyebrow{font-size:8px;letter-spacing:1.4px;margin-bottom:20px}
.class-panel h3{font-size:clamp(29px,2.6vw,40px);letter-spacing:-1px;line-height:1.12;margin-bottom:22px}
.class-panel>p:not(.eyebrow){font-size:12px;line-height:1.9;color:var(--muted)}
.class-panel dl{margin:28px 0 15px;font-size:11px;line-height:1.7}
.class-panel dl>div{padding:11px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:65px 1fr;gap:10px}
.class-panel dt{color:#757567;font-size:9px;text-transform:uppercase;letter-spacing:1px}
.class-panel dd{margin:0;color:var(--ink)}
.class-panel .text-link{font-size:10px}
.world-section{background:var(--ink);color:var(--paper);position:relative;overflow:hidden}
.world-section::before{content:"";position:absolute;inset:0;opacity:.06;background:repeating-linear-gradient(120deg,transparent,transparent 17px,#9c9c8d 18px,transparent 19px)}
.world-inner{position:relative;padding-bottom:55px}
.world-inner .section-index{color:#a0a396;border-color:#f3f0e730}
.world-top{display:flex;justify-content:space-between;align-items:flex-end;gap:10%;margin-bottom:30px}
.world-top h2{margin-top:18px}
.world-top h2 em{color:#db6150}
.world-top>p{max-width:360px;font-size:13px;line-height:1.9;color:#a7ad9c}
.world-panorama{margin-top:45px}
.world-panorama canvas{width:100%;height:auto}
.world-panorama figcaption{display:flex;justify-content:space-between;font-size:8px;letter-spacing:2px;color:#a6ab9d;padding:13px 0;border-top:1px solid #f3f0e730}
.world-places{display:grid;grid-template-columns:repeat(3,1fr);gap:55px;margin-top:55px}
.world-places article{position:relative}
.world-places article>span{font-family:var(--serif);font-size:18px;color:#ca4d3f;letter-spacing:5px}
.world-places h3{font-size:29px;margin:12px 0 18px}
.world-places p{font-size:12px;line-height:1.8;color:#a7ad9c}
.world-bottom{display:flex;justify-content:space-between;align-items:center;gap:35px;border-top:1px solid #f3f0e730;padding-top:24px;margin-top:50px}
.world-bottom p{font-size:11px;line-height:1.9;color:#a7ad9c}
.world-bottom strong{color:var(--paper);font-weight:500}
.systems-grid{display:grid;grid-template-columns:41% 59%;gap:6%;width:94%}
.systems-lead h2{margin:20px 0 25px}
.systems-lead>p:not(.eyebrow){font-size:13px;color:var(--muted);max-width:300px;line-height:1.9}
.ink-stamp{display:inline-flex;align-items:center;gap:20px;margin:45px 0 0;color:var(--red);transform:rotate(-5deg)}
.ink-stamp span{font-family:var(--serif);font-size:65px;line-height:1;border:3px double var(--red);padding:5px}
.ink-stamp small{font-size:8px;letter-spacing:2px;line-height:2}
.systems-list article{display:flex;gap:28px;border-bottom:1px solid var(--line);padding:27px 0}
.systems-list article:first-child{padding-top:4px}
.system-number{font-family:var(--serif);font-size:20px;width:25px;flex-shrink:0;color:var(--red);line-height:1.3}
.systems-list h3{font-size:23px;margin-bottom:13px}
.systems-list p{font-size:12px;line-height:1.8;color:var(--muted)}
.system-tag{display:block;margin-top:13px;color:#8d3a30;text-transform:uppercase;font-size:8px;letter-spacing:1px}
.mode-note{display:flex;align-items:center;gap:28px;padding:30px;border:1px solid var(--line);margin-top:60px}
.mode-note>span{font-family:var(--serif);font-size:44px;color:var(--red);flex-shrink:0}
.mode-note h3{font-size:23px;margin-bottom:9px}
.mode-note p{font-size:11px;line-height:1.8;color:var(--muted);max-width:660px}
.mode-note a{font-size:10px;flex-shrink:0;margin-left:auto;padding:12px 0;border-bottom:1px solid var(--ink)}
.mode-note a>span{margin-left:12px}
.faq{padding-top:15px}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:9%}
.faq-grid h2{font-size:clamp(32px,3.4vw,50px);margin:22px 0}
.faq-grid>div>p:not(.eyebrow){font-size:12px;color:var(--muted);max-width:310px;line-height:1.9;margin-bottom:20px}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list details:first-child{border-top:1px solid var(--line)}
.faq-list summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;list-style:none;font-size:13px;font-weight:600;padding:22px 0;line-height:1.5}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary span{font-size:20px;font-weight:400;color:var(--red);transition:transform .2s}
.faq-list details[open] summary span{transform:rotate(45deg)}
.faq-list details p{font-size:12px;line-height:1.9;color:var(--muted);padding:0 24px 25px 0}
.closing{position:relative;background:var(--red);color:var(--paper);text-align:center;padding:85px 20px 80px;overflow:hidden}
.closing .eyebrow{justify-content:center;color:#f0c9bd;position:relative}
.closing h2{font-size:clamp(40px,5vw,72px);margin:25px 0 35px;letter-spacing:-2px;position:relative}
.closing h2 em{color:var(--paper)}
.closing .button{position:relative}
.closing-mark{position:absolute;font-family:var(--serif);font-size:500px;line-height:1;right:2%;bottom:-90px;opacity:.06;transform:rotate(-15deg)}
.closing-note{font-size:9px;letter-spacing:1px;color:#f0c9bd;margin:20px auto 0}
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:40px 4.5%;background:var(--ink);color:var(--paper)}
.site-footer .brand{font-size:23px}
.site-footer .brand-seal{height:42px;width:38px;font-size:27px}
.site-footer .brand small{font-size:7px}
.site-footer>p{font-size:10px;color:#a8ad9f;line-height:1.8}
.site-footer nav{display:flex;gap:25px;font-size:11px}
.site-footer nav a{padding:10px 0}
.site-footer nav a:hover{color:#e67c6d}
.footer-year{font-size:8px;line-height:2;color:#8c9382;text-align:right}

@media(min-width:1600px){
 .hero{padding-left:max(4.5%,calc((100% - 1456px)/2));min-height:900px}
 .hero-art{right:calc((100% - 1600px)/2);width:900px}
 .hero-scroll{left:max(4.5%,calc((100% - 1456px)/2))}
 .site-header{padding-left:max(4.5%,calc((100% - 1456px)/2));padding-right:max(4.5%,calc((100% - 1456px)/2))}
 .world-strip{max-width:1456px;margin:auto}
}
@media(max-width:1100px){
 .site-nav{gap:20px}
 .hero{min-height:790px;padding-top:155px}
 .hero h1{font-size:85px}
 .hero-art{width:60%;right:-9%}
 .hero-description{max-width:360px}
 .hero-actions{gap:15px}
 .hero-actions .text-link{font-size:10px}
 .section{padding-top:70px;padding-bottom:70px}
 .class-stage{grid-template-columns:28% 35% 37%;min-height:470px}
 .class-portrait{min-height:470px}
 .class-details{padding-left:14px}
 .class-tab{gap:5px}
 .class-tab strong{font-size:21px}
 .class-tab i{font-size:14px}
 .class-tab b{display:none}
 .class-tab{grid-template-columns:20px 1fr auto}
 .world-top{gap:6%}
 .world-top>p{max-width:300px}
 .world-places{gap:35px}
 .site-footer>p{display:none}
}
@media(max-width:820px){
 html{scroll-padding-top:30px}
 .site-header{min-height:86px;padding-top:18px;padding-bottom:18px}
 .brand{font-size:24px}
 .brand-seal{width:37px;height:43px;font-size:29px}
 .brand small{font-size:7px;letter-spacing:3px}
 .js .nav-toggle{display:flex;align-items:center;gap:10px;background:none;border:1px solid #f3f0e74d;color:var(--paper);padding:10px 13px;min-height:44px;font-size:11px}
 .nav-toggle-icon{width:15px;height:11px;border-top:1px solid currentColor;border-bottom:1px solid currentColor}
 .nav-toggle[aria-expanded="true"] .nav-toggle-icon{transform:rotate(-45deg);height:1px;border-bottom:0}
 .site-nav{gap:14px;font-size:10px;flex-wrap:wrap;justify-content:flex-end}
 .js .site-nav{display:none;position:absolute;top:85px;left:0;right:0;background:var(--ink);padding:16px 4.5% 25px;border-bottom:1px solid #f3f0e744;box-shadow:0 20px 30px #0005}
 .js .site-nav.open{display:flex;align-items:stretch;flex-direction:column;gap:0}
 .js .site-nav>a{padding:14px 10px;font-size:13px}
 .js .site-nav .nav-play{margin-top:10px}
 .hero{min-height:780px;padding-top:140px;grid-template-columns:65% 35%}
 .hero h1{font-size:80px}
 .hero-copy .eyebrow{font-size:8px;letter-spacing:1.2px}
 .hero-art{right:-24%;width:80%;opacity:.7}
 .hero-art figcaption,.art-label{display:none}
 .hero-description{font-size:14px;max-width:335px;color:#d0d2c6}
 .hero-actions{max-width:280px;gap:10px}
 .hero-actions .text-link{font-size:11px}
 .hero-note{max-width:245px;font-size:9px}
 .world-strip{flex-wrap:wrap;gap:24px 20px;padding:25px 0}
 .world-strip .strip-note{display:none}
 .world-strip strong{font-size:27px}
 .intro-grid{gap:7%;margin-bottom:45px}
 .intro-prose{font-size:12px}
 .journey{gap:26px}
 .journey h3{font-size:21px}
 .journey p{font-size:12px}
 .section-index{margin-bottom:36px}
 .section-heading{align-items:start;gap:25px}
 .section-heading p{max-width:220px;font-size:11px}
 .class-stage{grid-template-columns:43% 57%}
 .class-tabs{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);padding:0;gap:15px}
 .class-tab{display:block;position:relative;min-height:90px;padding:15px 0}
 .class-tab>span{display:block;margin-bottom:7px}
 .class-tab strong{font-size:20px}
 .class-tab i{display:none}
 .class-portrait{min-height:440px}
 .class-details{padding:40px 15px 40px 10px}
 .class-panel h3{font-size:34px}
 .class-panel .eyebrow{font-size:8px;letter-spacing:1px}
 .world-top h2{font-size:45px}
 .world-top>p{max-width:260px;font-size:12px}
 .world-places{gap:24px}
 .world-places h3{font-size:25px}
 .world-places p{font-size:11px}
 .world-bottom{align-items:flex-start;gap:20px}
 .world-bottom p{max-width:300px}
 .world-bottom .text-link{white-space:nowrap;font-size:10px}
 .systems-grid{grid-template-columns:38% 62%;gap:6%;width:94%}
 .systems-lead h2{font-size:45px}
 .systems-list article{gap:16px}
 .systems-list h3{font-size:22px}
 .mode-note{padding:25px;gap:20px;flex-wrap:wrap}
 .mode-note>div{flex:1;min-width:60%}
 .mode-note a{margin:0 0 0 64px}
 .faq-grid{gap:7%}
 .faq-grid h2{font-size:37px}
 .faq-list summary{font-size:12px}
 .site-footer{flex-wrap:wrap;gap:30px}
 .footer-year{width:100%;text-align:left;border-top:1px solid #f3f0e733;padding-top:20px}
}
@media(max-width:560px){
 .site-header{padding-left:6%;padding-right:6%;gap:10px}
 .brand{font-size:23px;letter-spacing:2px}
 .brand small{letter-spacing:2.2px}
 .site-nav{position:static;font-size:9px;gap:9px}
 .site-nav .nav-play{display:none}
 .js .site-nav .nav-play{display:block}
 .hero{min-height:900px;display:block;padding:132px 6% 310px}
 .hero-copy{max-width:none}
 .hero-copy .eyebrow{font-size:7px;letter-spacing:1.05px}
 .hero h1{font-size:clamp(65px,17vw,90px);letter-spacing:-3px;margin-top:24px}
 .hero-description{max-width:330px;font-size:13px;line-height:1.8;margin-top:30px;margin-bottom:24px}
 .hero-actions{gap:12px;max-width:none;align-items:flex-start;flex-direction:column}
 .button{min-height:54px;padding:15px 22px;font-size:11px}
 .hero-actions .text-link{font-size:10px}
 .hero-note{font-size:8px;max-width:230px}
 .hero-art{top:auto;bottom:0;right:-15%;width:92%;height:470px;opacity:.85;z-index:0}
 .hero-scroll{left:6%;bottom:35px;max-width:130px;font-size:8px;letter-spacing:1px;line-height:1.6;gap:10px}
 .hero-scroll span{font-size:20px}
 .world-strip{margin:0 6%;gap:12px;justify-content:space-between;padding:25px 0}
 .world-strip>span:not(.strip-note){display:block;font-size:7px;letter-spacing:1px}
 .world-strip strong{display:block;margin-bottom:8px;font-size:28px}
 .section{padding:55px 6%}
 .section-index{padding-bottom:18px;margin-bottom:32px;font-size:8px;letter-spacing:1.6px}
 .section-index>span:last-child{font-size:22px}
 h2{font-size:42px;letter-spacing:-1.7px}
 .intro-grid{grid-template-columns:1fr;gap:28px;margin-bottom:30px}
 .intro-grid .eyebrow{font-size:8px;margin-bottom:15px}
 .intro-prose{font-size:13px}
 .intro-prose .text-link{font-size:10px}
 .journey{grid-template-columns:1fr;gap:0}
 .journey li{display:grid;grid-template-columns:100px 1fr;gap:7px 20px;padding:30px 0;align-items:center}
 .step-number{top:15px;font-size:8px}
 .step-art{grid-row:1/3;height:100px;margin-bottom:0}
 .journey h3{font-size:22px;align-self:end}
 .journey p{font-size:12px;align-self:start}
 .art-path::before{width:60px;height:50px}
 .art-path b{font-size:28px}
 .art-path i{transform:translate(-35px,30px)}
 .art-path i:nth-child(2){transform:translate(35px,-25px);width:7px;height:7px}
 .art-loadout{gap:4px}
 .art-loadout i{font-size:23px;height:42px;width:28px}
 .art-gate i{width:55px;height:69px;border-width:5px;border-top-width:8px}
 .art-gate i::before{top:-12px;left:-13px;right:-13px;height:5px}
 .art-gate b{font-size:28px;padding-top:30px}
 .classes{padding-top:5px}
 .section-heading{display:block;margin-bottom:25px}
 .section-heading h2{font-size:40px}
 .section-heading p{max-width:none;margin-top:23px;font-size:12px}
 .section-heading p br{display:none}
 .class-stage{grid-template-columns:1fr}
 .class-tabs{gap:9px}
 .class-tab{padding:15px 0;min-height:80px}
 .class-tab strong{font-size:15px;letter-spacing:-.4px}
 .class-tab>span{font-size:8px}
 .class-portrait{min-height:0;height:370px;grid-row:2}
 .class-portrait canvas{height:100%;width:auto;max-width:100%}
 .portrait-ring{inset:12% 17% 14%}
 .portrait-caption{bottom:7px}
 .class-details{padding:20px 0 32px}
 .class-panel h3{font-size:34px}
 .class-panel>p:not(.eyebrow){font-size:13px}
 .class-panel dl{font-size:12px}
 .class-panel .text-link{font-size:10px}
 .world-top{display:block}
 .world-top h2{font-size:42px}
 .world-top>p{max-width:none;margin-top:25px;font-size:13px}
 .world-panorama{margin-top:20px;margin-left:-6.8%;margin-right:-6.8%;overflow:hidden}
 .world-panorama canvas{max-width:none;width:170%;margin-left:-30%;height:auto}
 .world-panorama figcaption{margin:0 6%;font-size:6px;letter-spacing:1px}
 .world-places{grid-template-columns:1fr;gap:27px;margin-top:30px}
 .world-places article{padding-left:50px}
 .world-places article>span{writing-mode:vertical-rl;position:absolute;left:0;top:2px;letter-spacing:4px;font-size:20px}
 .world-places h3{font-size:28px;margin-top:0;margin-bottom:12px}
 .world-places p{font-size:12px}
 .world-bottom{display:block;padding-top:20px;margin-top:32px}
 .world-bottom p{max-width:none;font-size:11px}
 .world-bottom .text-link{margin-top:10px}
 .systems-grid{display:block;width:100%}
 .systems-lead h2{font-size:44px}
 .systems-lead>p:not(.eyebrow){max-width:none;font-size:13px}
 .ink-stamp{display:none}
 .systems-list{margin-top:35px}
 .systems-list article:first-child{padding-top:25px;border-top:1px solid var(--line)}
 .systems-list article{gap:20px}
 .systems-list h3{font-size:24px}
 .systems-list p{font-size:12px}
 .mode-note{padding:23px 20px;align-items:flex-start;gap:15px;margin-top:35px}
 .mode-note>span{font-size:32px}
 .mode-note>div{min-width:calc(100% - 50px)}
 .mode-note h3{font-size:21px;line-height:1.2}
 .mode-note p{font-size:11px}
 .mode-note a{margin-left:46px}
 .faq{padding-top:0}
 .faq-grid{display:block}
 .faq-grid h2{font-size:39px}
 .faq-grid>div>p:not(.eyebrow){max-width:none}
 .faq-list{margin-top:30px}
 .faq-list summary{font-size:13px;padding:20px 0}
 .faq-list details p{font-size:12px}
 .closing{padding:65px 6% 60px}
 .closing .eyebrow{font-size:8px;letter-spacing:1.5px}
 .closing h2{font-size:40px;letter-spacing:-1.4px;line-height:1.15;margin:22px 0 30px}
 .closing-mark{font-size:350px;right:-25%;bottom:-60px}
 .site-footer{padding:35px 6%;gap:30px}
 .site-footer .brand{font-size:21px}
 .site-footer nav{gap:20px;font-size:10px}
 .site-footer nav a{min-height:44px;display:inline-flex;align-items:center;gap:6px}
 .footer-year{font-size:8px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{transition:none!important;animation:none!important}
}