@charset "UTF-8";
:root{--ink:#101010;--paper:#eeeDE8;--white:#faf9f5;--muted:#a5a5a0;--line:#3b3b39;--gutter:clamp(22px,6vw,100px);--max:1280px;color-scheme:dark;font-family:"Malgun Gothic","Apple SD Gothic Neo",sans-serif;font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--ink);color:var(--white);line-height:1.8;overflow-x:hidden}body.modal-open{overflow:hidden}button,input,a,summary{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a,summary{touch-action:manipulation}button{color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.35}button,a,summary{outline-offset:6px}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid currentColor}a{color:inherit;text-decoration:none}button{border:0;background:none}img{max-width:100%;display:block}h1,h2,h3,h4,p{margin:0}p+p{margin-top:20px}button svg{width:20px;height:20px}section[id]{scroll-margin-top:90px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;z-index:100;top:-100px;left:20px;background:white;color:black;padding:10px 20px}.skip:focus{top:10px}
.site-header{position:fixed;z-index:30;top:0;left:0;right:0;min-height:82px;padding:13px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid transparent;transition:background .25s,border-color .25s}.site-header.scrolled{background:rgba(16,16,16,.95);border-color:#353535;backdrop-filter:blur(12px)}.brand{font-family:"Yu Mincho","MS Mincho",serif;font-size:19px;font-weight:900;letter-spacing:-1px;line-height:1.05;display:flex;flex-direction:column;transform:skew(-5deg)}.brand span{font-size:22px}.site-header nav{display:flex;align-items:center;gap:32px}.site-header nav a{font-family:Arial,sans-serif;font-size:11px;font-weight:800;letter-spacing:1.6px;position:relative;padding:12px 0}.site-header nav a::after{content:"";height:1px;background:currentColor;position:absolute;left:0;bottom:6px;width:0;transition:width .2s}.site-header nav a:hover::after,.site-header nav a[aria-current]::after{width:100%}.site-header nav a:last-child{border:1px solid #777;padding:8px 18px}.menu-toggle{display:none}
.hero{height:100svh;min-height:620px;width:100%;position:relative;isolation:isolate;overflow:hidden;background:#131313}.hero>img{position:absolute;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 35%;z-index:-3}.hero>img.failed{visibility:hidden}.hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(0deg,rgba(0,0,0,.72),transparent 60%,rgba(0,0,0,.38))}.hero.no-image{background:repeating-linear-gradient(115deg,transparent 0,transparent 120px,#ffffff03 121px,#ffffff03 122px),#131313}.hero.no-image::before{content:"";position:absolute;inset:17% 6% 10% 37%;background:url('assets/marks.svg') center/contain no-repeat;opacity:.19;z-index:-1}.hero-title{position:absolute;left:var(--gutter);bottom:14%;}.hero-title p{font:11px Arial,sans-serif;letter-spacing:.45em;margin-bottom:26px}.hero-title h1{font-size:clamp(58px,9.2vw,150px);letter-spacing:-.08em;line-height:1.06;font-weight:900;transform:skew(-5deg);text-shadow:0 2px 35px #0005}.hero-title h1 span{padding-left:.14em}.hero-side{position:absolute;right:30px;top:42%;writing-mode:vertical-rl;letter-spacing:12px;font-family:serif;font-size:13px}.scroll-cue{position:absolute;bottom:30px;left:var(--gutter);font:10px Arial,sans-serif;letter-spacing:3px;display:flex;align-items:center;gap:25px}.scroll-cue span{font-size:27px;font-weight:100;animation:drift 2.5s ease-in-out infinite}@keyframes drift{50%{transform:translateY(8px)}}
.section{padding:105px var(--gutter);max-width:calc(var(--max) + var(--gutter)*2);margin:auto}.section-head{position:relative;margin-bottom:48px}.section-index{font:10px Arial,sans-serif;letter-spacing:3px;margin-bottom:20px;color:var(--muted)}.section-head h2{font-family:Impact,"Arial Narrow",sans-serif;font-weight:900;font-size:clamp(48px,7.8vw,102px);letter-spacing:-.025em;line-height:1;display:flex;align-items:baseline;gap:26px}.section-head h2 span{font-family:"Malgun Gothic",sans-serif;font-size:13px;letter-spacing:2px;font-weight:400}.section-head::after{content:"";display:block;width:95px;height:6px;margin-top:22px;background:currentColor;clip-path:polygon(0 30%,100% 0,91% 72%,3% 100%);transform:rotate(-3deg)}.head-note{font-size:12px;color:var(--muted);display:block;margin-top:25px}.eyebrow{font:10px Arial,sans-serif;letter-spacing:2px;margin-bottom:12px}.reveal{transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.js-reveal .reveal:not(.visible){opacity:0;transform:translateY(30px)}
.music-section{position:relative;padding-bottom:115px}.tracks{max-width:850px;margin:0 auto}.track+.track{margin-top:70px}.track-art{aspect-ratio:1344/768;background:#181818;position:relative;border:1px solid #333}.track-art:empty::before,.image-slot::before{content:"";position:absolute;width:20px;height:20px;top:50%;left:50%;transform:translate(-50%,-50%);background:linear-gradient(currentColor,currentColor) center/1px 100% no-repeat,linear-gradient(currentColor,currentColor) center/100% 1px no-repeat;opacity:.18}.track-art img{width:100%;height:100%;object-fit:cover}.track-title{font-size:22px;min-height:48px;margin-top:22px;line-height:1.5}.audio-controls{display:flex;align-items:center;gap:18px;padding:8px 0 22px}.play-button{height:44px;width:44px;flex:none;border:1px solid #777;display:grid;place-items:center}.play-button svg{width:14px;fill:currentColor}.seek,.volume{accent-color:#fff;height:3px;cursor:pointer;min-width:0}.seek{flex:1}.volume{width:70px}.audio-time{font:11px monospace;color:#aaa;white-space:nowrap}.volume-label{font:9px Arial;letter-spacing:1px}.lyrics{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}summary{cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}.lyrics summary{display:flex;justify-content:space-between;align-items:center;font-size:13px;padding:16px 0}.lyrics summary::after{content:"+";font:23px Arial}.lyrics[open] summary::after{content:"−"}.lyrics-content{white-space:pre-wrap;min-height:140px;padding:15px 0 35px;color:#ccc;font-size:14px;line-height:2.2}
.story-section{max-width:none;margin:0;padding:120px var(--gutter) 140px;position:relative;overflow:hidden;border-top:1px solid #292929;border-bottom:1px solid #292929;background:#151515}.story-section>.section-head{max-width:var(--max);margin:0 auto 70px}.story-mark{position:absolute;font:clamp(180px,36vw,540px) Impact,sans-serif;top:7%;right:-2%;color:#ffffff04;transform:rotate(-9deg);pointer-events:none}.story-copy{position:relative;text-align:center;max-width:850px;margin:auto}.story-copy>p{font-size:clamp(15px,1.55vw,18px);line-height:2.5;word-break:keep-all}.story-copy>p+p{margin-top:45px}.story-copy .story-lead{font-size:clamp(24px,3.3vw,42px);line-height:1.65;font-weight:700;letter-spacing:-.04em;margin-bottom:52px}.story-copy .story-last{font-size:clamp(20px,2.4vw,28px);margin-top:60px;font-weight:700}.story-last::after{content:"";display:block;height:7px;width:170px;background:var(--white);margin:25px auto 0;clip-path:polygon(2% 50%,96% 0,100% 38%,0 100%);transform:rotate(-2deg)}
.filters{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:32px;padding-bottom:18px;border-bottom:1px solid var(--line)}.filters button{font-size:12px;color:#aaa;padding:9px 16px;border:1px solid transparent;transition:.2s}.filters button:hover{color:white;border-color:#666}.filters button[aria-pressed="true"]{background:var(--white);color:var(--ink);font-weight:700}.character-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:38px 20px}.character-card{padding:0;text-align:left;width:100%;display:block}.portrait{aspect-ratio:832/1216;position:relative;background:#1b1b1b;overflow:hidden;border:1px solid #333;isolation:isolate}.portrait::before{content:"";position:absolute;inset:15px;border:1px solid #ffffff0b;z-index:-1}.portrait>img{width:100%;height:100%;object-fit:cover;transition:transform .5s,filter .5s}.failed{display:none}.portrait .fallback-number{position:absolute;left:20px;bottom:7px;font:clamp(55px,7vw,108px) Impact,sans-serif;color:#303030;z-index:-1}.portrait .corner{position:absolute;right:12px;top:12px;font:10px monospace;letter-spacing:1px;background:#101010cc;padding:4px 7px;color:#fff}.portrait .card-arrow{position:absolute;right:12px;bottom:12px;width:30px;height:30px;background:var(--white);color:#111;display:grid;place-items:center;line-height:1;transform:translateY(45px);transition:transform .25s}.character-card:hover .portrait>img{transform:scale(1.035)}.character-card:hover .card-arrow,.character-card:focus-visible .card-arrow{transform:translateY(0)}.character-card:hover .portrait{border-color:#bdbdbd}.card-info{padding-top:14px}.card-info small{font-size:10px;color:#a0a09b;display:block;margin-bottom:3px}.card-info h3{font-size:17px;font-weight:600;line-height:1.5;word-break:keep-all}
.world-section{background:var(--paper);color:var(--ink);padding:110px var(--gutter) 100px;position:relative;isolation:isolate;color-scheme:light}.world-section>.section-head,.world-opening,.world-nav,.world-subsection{max-width:var(--max);margin-left:auto;margin-right:auto}.world-section .section-index{color:#666}.world-section>.section-head::before{content:"";position:absolute;right:0;top:-40px;width:200px;height:200px;background:url('assets/marks.svg') center/contain no-repeat;filter:invert(1);opacity:.65;z-index:-1}.world-opening{display:grid;grid-template-columns:1fr 2fr;gap:50px;align-items:start;padding:25px 0 45px}.world-opening h3{font-size:clamp(40px,6vw,74px);font-weight:800;letter-spacing:-.06em;line-height:1.15}.world-opening p{max-width:700px;font-size:16px;line-height:2;word-break:keep-all}.world-nav{border-top:1px solid #bbb;border-bottom:1px solid #bbb;display:flex;gap:30px;font-size:12px;padding:15px 0;flex-wrap:wrap}.world-nav a:hover{text-decoration:underline;text-underline-offset:5px}.world-subsection{padding-top:75px}.minor-head{display:flex;align-items:baseline;gap:14px;border-bottom:2px solid #191919;padding-bottom:15px;margin-bottom:30px}.minor-head>span:first-child{font:11px monospace}.minor-head>span:last-child{margin-left:auto;font:10px Arial;letter-spacing:2px;color:#777}.minor-head h3{font-size:23px;letter-spacing:-1px}.region-tabs{display:flex;gap:25px;margin-bottom:25px}.region-tabs button{padding:7px 0;font-size:15px;position:relative;color:#777}.region-tabs button[aria-selected="true"]{color:#111;font-weight:700}.region-tabs button[aria-selected="true"]::after{content:"";position:absolute;height:2px;background:#111;bottom:0;left:0;right:0}.region-panel{display:grid;grid-template-columns:1.4fr 1fr;gap:50px;align-items:center}.region-image{height:clamp(230px,28vw,380px);position:relative;overflow:hidden;background:#d7d6d0;border:1px solid #c4c3be}.region-image>img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}.region-image>span{position:absolute;font:clamp(38px,5vw,70px) Impact,sans-serif;color:#bdbcb5;bottom:0;left:18px}.region-copy h4{font-size:36px;margin-bottom:20px;letter-spacing:-1.5px}.region-copy>p:not(.eyebrow){font-size:14px;line-height:2;word-break:keep-all}.region-tags{font-size:10px;color:#777;letter-spacing:.5px;margin-top:30px}.accordion-list details{border-bottom:1px solid #bbb}.accordion-list summary{display:flex;align-items:center;gap:20px;font-size:21px;padding:24px 0;line-height:1.4}.accordion-list summary::after{content:"+";font:25px Arial;margin-left:8px}.accordion-list details[open] summary::after{content:"−"}.small-number{font:10px monospace;color:#777}.summary-en{font:10px Arial;letter-spacing:2px;margin-left:auto;color:#777}.accordion-body{margin-left:35px;max-width:860px;font-size:14px;line-height:2;word-break:keep-all;padding:0 0 30px}.accordion-body p+p{margin-top:12px}.definition{display:grid;grid-template-columns:1fr 2fr;gap:50px;padding:35px 0;border-bottom:1px solid #c4c3bd}.definition h4,.life-layout h4,.threat h4{font-size:30px;letter-spacing:-1px}.definition>div>p:not(.eyebrow),.life-layout p{font-size:14px;line-height:2;word-break:keep-all}.implant-types{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}.implant-types span{border:1px solid #aaa;font-size:11px;padding:5px 12px}.text-details{margin-top:20px}.text-details summary{font-size:12px;text-decoration:underline;text-underline-offset:5px}.text-details summary::after{content:" +"}.text-details[open] summary::after{content:" −"}.text-details>div{padding-top:20px;font-size:14px;line-height:2}.threat{padding-top:45px;display:grid;grid-template-columns:1fr 1.6fr;gap:45px;align-items:center}.threat p:not(.eyebrow){font-size:12px;margin-top:16px}.grade-scale{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #bbb;border-bottom:1px solid #bbb;padding:25px 0}.grade-scale>span{font:52px Impact,sans-serif;white-space:nowrap}.grade-scale small{font:11px "Malgun Gothic",sans-serif;margin-left:5px}.grade-scale i{font-size:15px;font-style:normal;color:#aaa}.life-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px}.life-layout h4{margin-bottom:25px}.life-layout table{width:100%;border-collapse:collapse;font-size:13px}.life-layout caption{text-align:left;font-size:18px;font-weight:700;margin-bottom:15px}.life-layout th,.life-layout td{text-align:left;border-bottom:1px solid #ccc;padding:12px 5px;font-weight:400}.life-layout thead th{font-size:10px;color:#777}.life-layout td{text-align:right;font:15px monospace}.life-layout .table-note{font-size:10px;color:#666;margin-top:12px}.timeline{padding:0;list-style:none;margin:0}.timeline li{display:grid;grid-template-columns:1fr 2fr;gap:50px;padding:32px 0;border-bottom:1px solid #bfbfb8}.timeline time{font:48px Impact,sans-serif;display:flex;align-items:baseline;gap:18px}.timeline time small{font:11px monospace}.timeline h4{font-size:18px;margin-bottom:5px}.timeline p{font-size:13px}.timeline .current{border-bottom:2px solid #222}
.vote-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.vote-heading p{font-size:18px}.vote-heading>span{font:11px monospace;color:#aaa}.vote-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:24px 14px}.vote-choice{padding:0;text-align:left;position:relative}.vote-choice .portrait{transition:border-color .2s}.vote-choice[aria-pressed="true"] .portrait{border:3px solid var(--white)}.vote-choice[aria-pressed="true"] .portrait::after{content:"✓";position:absolute;right:8px;bottom:8px;background:var(--white);color:#111;width:26px;height:26px;display:grid;place-items:center;font-size:15px;font-weight:bold}.vote-choice>span{display:block;margin-top:8px;font-size:11px;word-break:keep-all}.vote-choice .fallback-number{font-size:55px;left:12px}.vote-action{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:35px;padding:25px 0}.vote-action>p{color:#bbb;font-size:12px}.solid-button{background:var(--white);color:#111;font-size:13px;font-weight:700;padding:14px 28px;display:flex;align-items:center;gap:55px;white-space:nowrap}.solid-button:hover:not(:disabled){background:#cecec7}.ranking-heading{display:flex;justify-content:space-between;align-items:center;margin-top:55px;padding-bottom:15px;border-bottom:1px solid #888}.ranking-heading h3{font-size:20px}.text-button{font-size:11px;color:#aaa}.rankings{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:0 50px}.rankings li{display:grid;grid-template-columns:28px 1fr auto;gap:12px;align-items:center;padding:16px 0;border-bottom:1px solid #303030;font-size:12px;position:relative}.rank-number{font:20px Impact,sans-serif;color:#777}.rankings li:nth-child(-n+3) .rank-number{color:#fff}.rank-count{font:11px monospace}.rank-bar{position:absolute;height:1px;bottom:0;left:0;width:var(--score,0%);background:#bbb}.rank-empty{grid-column:1/-1;color:#999;padding:25px 0;font-size:13px}
footer{border-top:1px solid #353535;max-width:var(--max);margin:20px var(--gutter) 0;padding:40px 0 55px;display:flex;align-items:center;gap:22px}.footer-title{font-size:18px;font-weight:800;letter-spacing:-1px}footer>span{font:8px Arial;letter-spacing:2px;color:#777}.back-top{margin-left:auto;font:10px Arial;letter-spacing:2px}.noscript-note{padding:20px;text-align:center}
dialog{background:var(--ink);color:var(--white);padding:0;border:0;box-shadow:0 20px 80px #0008;width:min(1020px,94vw);max-height:92svh;overflow:auto;overscroll-behavior:contain}dialog::backdrop{background:#000c;backdrop-filter:blur(8px)}.dialog-close{position:sticky;display:block;top:12px;margin:12px 12px -54px auto;width:42px;height:42px;font:30px Arial;background:#111e;border:1px solid #777;z-index:3}.detail-image{aspect-ratio:1344/738;position:relative;background:var(--ink);display:grid;place-items:center}/* Feather the artwork into the dialog while keeping the central image sharp. */
.detail-image img{
  width:100%;height:100%;object-fit:contain;position:absolute;inset:0;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent),linear-gradient(to bottom,transparent,#000 9%,#000 78%,transparent);
  mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent),linear-gradient(to bottom,transparent,#000 9%,#000 78%,transparent);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}.detail-image .detail-fallback{font:24px "Malgun Gothic",sans-serif;color:#3b3b3b}.detail-body{padding:35px 45px 45px}.detail-kicker{font-size:11px;color:#999;letter-spacing:1px}.detail-body h2{font-size:clamp(25px,4vw,42px);margin:6px 0 18px;letter-spacing:-1.5px}.detail-description{font-size:14px;line-height:2;color:#ccc;word-break:keep-all}.detail-stats{display:grid;grid-template-columns:repeat(4,1fr);margin:30px 0;border-top:1px solid #555;border-bottom:1px solid #555}.detail-stats>div{padding:18px 10px 18px 0}.detail-stats dt{font-size:10px;color:#999;margin-bottom:4px}.detail-stats dd{margin:0;font-size:14px}.detail-mode{border-left:2px solid white;padding-left:20px;margin:25px 0}.detail-mode>span{font-size:10px;color:#999}.detail-mode h3{font-size:22px;margin:4px 0}.detail-mode p{font-size:13px;color:#ccc}.detail-more{display:grid;grid-template-columns:1fr;gap:25px;font-size:12px;color:#bbb}.detail-more h3{font-size:11px;color:#888;font-weight:400;margin-bottom:8px}.personality-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:25px}.personality-tags span{font-size:11px;border:1px solid #444;padding:4px 10px}.detail-type{margin-top:15px;font-size:11px;color:#888}.detail-controls{display:flex;justify-content:space-between;border-top:1px solid #333;margin-top:25px;padding-top:20px;font-size:12px}.detail-controls button{padding:6px 0}
@media(min-width:1500px){footer{margin-left:auto;margin-right:auto}}
@media(max-width:1000px){.character-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.vote-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.site-header nav{gap:20px}.region-panel{gap:30px;grid-template-columns:1.2fr 1fr}.life-layout{gap:35px}.section-head h2{font-size:70px}.threat{grid-template-columns:1fr}.grade-scale{max-width:600px}.world-opening{gap:30px}}
@media(max-width:640px){:root{--gutter:22px}html{scroll-padding-top:72px}.site-header{min-height:66px;padding:12px 20px}.brand{font-size:16px}.brand span{font-size:18px}.menu-toggle{display:flex;flex-direction:column;gap:6px;padding:12px 4px;width:34px;z-index:2}.menu-toggle span{height:1px;width:100%;background:white;transition:transform .2s}.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.site-header nav{display:none;position:absolute;top:66px;left:0;right:0;background:#111;padding:25px;flex-direction:column;align-items:flex-start;border-bottom:1px solid #555}.site-header nav.open{display:flex}.site-header nav a{font-size:13px}.hero{min-height:550px}.hero-title{bottom:18%;left:25px}.hero-title h1{font-size:clamp(55px,13vw,83px)}.hero-title p{font-size:8px;letter-spacing:.25em;margin-bottom:20px}.hero-side{right:15px;font-size:10px;letter-spacing:8px}.hero.no-image::before{inset:15% -15% 10% 10%}.section{padding-top:70px;padding-bottom:70px}.section-head{margin-bottom:32px}.section-head h2{font-size:clamp(42px,12vw,67px);gap:16px}.section-head h2 span{font-size:11px;letter-spacing:0}.section-index{font-size:9px;letter-spacing:2px}.head-note{font-size:11px}.track-title{min-height:37px;font-size:19px}.audio-controls{gap:10px}.volume-label,.volume{display:none}.audio-time{font-size:10px}.play-button{width:36px;height:36px}.story-section{padding:80px 22px 95px}.story-section>.section-head{margin-bottom:60px}.story-copy>p{font-size:13px;line-height:2.3}.story-copy .story-lead{font-size:25px}.story-copy .story-last{font-size:20px}.character-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:27px 12px}.filters{gap:3px}.filters button{font-size:11px;padding:7px 10px}.card-info h3{font-size:14px}.card-info small{font-size:9px}.portrait .corner{font-size:9px;top:7px;right:7px}.portrait .fallback-number{font-size:65px;left:12px}.world-section{padding:75px 22px}.world-section>.section-head::before{width:120px;height:120px;top:0;opacity:.25}.world-opening{grid-template-columns:1fr;gap:20px;padding-top:5px;padding-bottom:35px}.world-opening h3{font-size:43px}.world-opening p{font-size:13px}.world-nav{gap:23px;font-size:11px}.world-subsection{padding-top:55px}.minor-head{gap:10px}.minor-head h3{font-size:20px}.minor-head>span:last-child{font-size:8px;letter-spacing:.8px}.region-panel{grid-template-columns:1fr;gap:25px}.region-image{height:230px}.region-copy h4{font-size:30px;margin-bottom:12px}.region-copy>p:not(.eyebrow){font-size:13px}.region-tags{margin-top:18px}.accordion-list summary{font-size:17px;gap:12px;padding:22px 0}.summary-en{font-size:8px;letter-spacing:.5px}.accordion-body{font-size:13px;margin-left:0}.definition{grid-template-columns:1fr;gap:20px;padding:30px 0}.definition h4,.life-layout h4{font-size:27px}.definition>div>p:not(.eyebrow),.life-layout p{font-size:13px}.definition .eyebrow{margin-bottom:5px}.grade-scale>span{font-size:38px}.life-layout{grid-template-columns:1fr;gap:35px}.timeline li{grid-template-columns:110px 1fr;gap:20px}.timeline time{font-size:36px;flex-direction:column;gap:4px}.timeline h4{font-size:16px}.timeline p{font-size:12px}.vote-heading{align-items:baseline;gap:10px}.vote-heading p{font-size:15px}.vote-heading>span{font-size:9px}.vote-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 9px}.vote-choice>span{font-size:10px}.vote-choice .fallback-number{font-size:42px;left:8px}.vote-action{align-items:stretch;flex-direction:column;gap:15px}.solid-button{justify-content:space-between}.rankings{grid-template-columns:1fr}.rankings li{font-size:12px}.detail-body{padding:25px 22px}.detail-stats{grid-template-columns:repeat(2,1fr);margin:22px 0}.detail-stats>div{padding:12px 0}.detail-more{grid-template-columns:1fr;gap:15px}.detail-mode h3{font-size:19px}.detail-description{font-size:13px}.detail-image{margin-top:0}.dialog-close{width:34px;height:34px;margin-bottom:-46px}.detail-controls{font-size:11px}footer{gap:12px;flex-wrap:wrap;padding:30px 0}.footer-title{font-size:15px}footer>span{font-size:7px}.back-top{font-size:9px}.text-details>div{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.js-reveal .reveal:not(.visible){opacity:1;transform:none}}

/* OST controls and bilingual lyrics */
.volume-controls{display:flex;align-items:center;gap:9px;flex:none}
.mute-button{width:30px;height:32px;display:grid;place-items:center;padding:3px}
.mute-button svg{width:21px;height:21px}
.volume-controls .volume{width:82px;display:block}
.volume-value{font:10px monospace;color:#aaa;min-width:32px;text-align:right}
.lyrics-toolbar{display:flex;justify-content:flex-end;padding:12px 0 8px}
.translation-toggle{display:flex;align-items:center;gap:15px;border:1px solid #555;padding:6px 11px;font-size:11px}
.translation-toggle span{font:10px monospace;color:#888}
.translation-toggle[aria-pressed="true"]{background:var(--white);color:var(--ink);border-color:var(--white)}
.translation-toggle[aria-pressed="true"] span{color:#333}
.lyrics-content{white-space:normal}
.lyric-line{line-height:1.9;margin-bottom:10px;word-break:keep-all;overflow-wrap:anywhere}
.lyric-original,.lyric-translation{display:block}
.lyric-translation{color:#999;font-size:.88em;margin-top:2px}
.lyric-break{height:25px}
@media(max-width:640px){.audio-controls{flex-wrap:wrap;row-gap:14px}.volume-controls{width:100%;justify-content:flex-end}.volume-controls .volume{width:110px;display:block}.lyrics-content{font-size:13px}.translation-toggle{min-height:36px}}

/* Desktop hero: native-size image on the left, title on the right. */
@media(min-width:1024px){
  .hero>img{left:0;top:0;width:50%;height:100%;max-width:none;object-fit:scale-down;object-position:center center}
  .hero-shade{background:none}
  .hero-title{left:calc(50% + clamp(28px,4vw,80px));right:clamp(50px,6vw,110px);top:50%;bottom:auto;transform:translateY(-50%)}
  .hero-title h1{font-size:clamp(52px,5.2vw,100px);line-height:1.12}
  .hero-title p{font-size:clamp(9px,.7vw,12px);letter-spacing:.25em;line-height:1.8;margin-bottom:28px}
  .hero .scroll-cue{left:calc(50% + clamp(28px,4vw,80px));bottom:40px}
  .hero.no-image::before{inset:12% 52% 12% 2%}
}

/* Scrollable portrait dossier. Artwork: assets/details/<name>.webp, 650 x 1536. */
#character-dialog{width:min(650px,calc(100vw - 24px));max-width:none;max-height:92svh;border:0;background:#101010;scrollbar-width:thin;scrollbar-color:#777 #101010;box-shadow:0 24px 100px #0009}
#character-dialog .dialog-close{position:sticky;top:12px;margin:12px 12px -56px auto;width:44px;height:44px;border:1px solid #ffffff40;border-radius:50%;background:#101010b8;backdrop-filter:blur(10px);font-size:28px;line-height:1;z-index:5}
#detail-content{container-type:inline-size}
.detail-poster{position:relative;isolation:isolate;min-height:1536px;min-height:calc(100cqw * 1536 / 650);display:flex;flex-direction:column;overflow:hidden;background:#101010}
.detail-poster-art{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.detail-poster-art img{width:100%;height:auto;max-width:none;display:block;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 86%,rgba(0,0,0,.85) 90%,rgba(0,0,0,.4) 96%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 86%,rgba(0,0,0,.85) 90%,rgba(0,0,0,.4) 96%,transparent 100%)}
.detail-poster-art img.failed{display:none}
.detail-poster-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#101010aa 0%,#10101008 24%,#10101012 40%,#10101040 60%,#10101059 81%,#10101073 100%),linear-gradient(90deg,#101010b0 0%,#10101050 25%,transparent 60%)}
.detail-heading{padding:clamp(58px,12cqw,78px) clamp(24px,7cqw,46px) 0;text-shadow:0 2px 22px #000b}
.detail-heading .detail-kicker{font-size:12px;letter-spacing:.2em;color:#eee;margin:0 0 12px}
.detail-heading h2{font-size:clamp(34px,9cqw,58px);line-height:1.15;letter-spacing:-.055em;font-weight:900;word-break:keep-all;overflow-wrap:anywhere;max-width:95%;margin:0}
.detail-serial{display:block;font:10px monospace;letter-spacing:.18em;color:#ccc;margin-top:22px}
.detail-poster .detail-stats{display:flex;flex-direction:column;align-self:flex-start;gap:24px;border:0;margin:clamp(40px,10cqw,65px) 0 0;padding:0 clamp(24px,7cqw,46px);max-width:52%;text-shadow:0 2px 12px #000}
.detail-poster .detail-stats>div{padding:0}
.detail-poster .detail-stats dt{font-size:10px;letter-spacing:.12em;color:#ddd;margin-bottom:4px}
.detail-poster .detail-stats dd{font-size:clamp(16px,3.7cqw,24px);font-weight:700;line-height:1.4;word-break:keep-all}
.detail-narrative{position:relative;margin-top:auto;padding:clamp(140px,30cqw,195px) clamp(24px,7cqw,46px) 30px;text-shadow:0 2px 16px #0009}
.detail-label{font:10px "Malgun Gothic",sans-serif;letter-spacing:.18em;font-weight:400;color:#bcbcbc;margin:0 0 14px;display:block}
.detail-poster .detail-description{font-size:clamp(13px,2.3cqw,15px);line-height:2;word-break:keep-all;color:#f3f3f3}
.detail-weapon{margin-top:30px;text-align:right}
.detail-weapon p{font-size:clamp(18px,4cqw,26px);font-weight:600;line-height:1.5}
.detail-poster .detail-mode{border:0;padding:26px 0 0;margin:32px 0 0;border-top:1px solid #ffffff40}
.detail-poster .detail-mode h3{font-size:clamp(24px,5.4cqw,35px);letter-spacing:-.045em;line-height:1.3;margin:0 0 14px;word-break:keep-all}
.detail-poster .detail-mode p{font-size:13px;line-height:1.9;color:#eee;word-break:keep-all}
.detail-poster .personality-tags{margin-top:28px;gap:5px 12px}
.detail-poster .personality-tags span{border:0;padding:0;font-size:11px;color:#ddd}
.detail-poster .detail-type{font-size:10px;line-height:1.8;color:#aaa;margin-top:12px;overflow-wrap:anywhere}
.detail-poster .detail-controls{margin-top:30px;padding-top:18px;border-color:#ffffff30;align-items:center;gap:8px;font-size:11px}
.detail-poster .detail-controls button{min-height:44px}
@media(max-width:640px){#character-dialog{width:100vw;max-height:100svh;height:100svh;margin:0}.detail-poster .detail-stats{gap:18px}.detail-poster .detail-controls{font-size:10px}}

/* Manga introduction: the revolution in Part 1 and the return in Part 2. */
.story-part+.story-part{margin-top:64px;padding-top:54px;border-top:1px solid #ffffff20}
.story-part .story-part-label{font-size:12px;letter-spacing:.18em;color:#aaa;margin:0 0 18px}
.story-part h3{font-size:clamp(22px,3vw,36px);line-height:1.55;letter-spacing:-.045em;word-break:keep-all;margin:0 0 26px}
.story-part>p:not(.story-part-label){font-size:clamp(13px,1.55vw,17px);line-height:2.3;word-break:keep-all}
.story-part>p+p{margin-top:26px}
@media(max-width:640px){.story-part+.story-part{margin-top:46px;padding-top:38px}.story-part h3{font-size:22px}.vote-section .section-head h2{flex-wrap:wrap;row-gap:10px}}
