@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#080406;--ink:#fff4f4;--muted:#a5848b;--line:#4b202b;--red:#ff4f60;--red2:#b91535;--hot:#ff7b65;--card:#160a10;--card2:#211019;--mono:'DM Mono',monospace;--sans:'Space Grotesk',system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;color:var(--ink);font-family:var(--sans);background:radial-gradient(ellipse at 50% -20%,#46121e 0,#15080e 28%,#080406 63%),var(--bg);overflow-x:hidden}.noise,.scanlines{position:fixed;inset:0;pointer-events:none;z-index:20}.noise{opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.scanlines{opacity:.025;background:repeating-linear-gradient(0deg,transparent 0 3px,#ff6874 4px,#ff6874 4px)}.shell-wide{width:min(1500px,calc(100% - 72px));margin-inline:auto}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,79,96,.23);position:relative;z-index:30}.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none}.brand-mark{width:34px;height:34px;display:grid;place-items:center;background:var(--red);color:#17070b;font-size:21px;font-weight:700;clip-path:polygon(0 0,100% 0,100% 78%,78% 100%,0 100%);box-shadow:0 0 22px rgba(255,79,96,.28)}.brand strong,.brand small{display:block}.brand strong{font-size:13px;letter-spacing:.18em}.brand small{font:9px var(--mono);color:var(--muted);letter-spacing:.16em;margin-top:3px}.top-nav{display:flex;gap:11px;color:#d29ca4;font:10px var(--mono);letter-spacing:.13em}.nav-slash{color:var(--red)}.live-dot{width:6px;height:6px;background:var(--red);border-radius:50%;box-shadow:0 0 16px var(--red);margin-top:2px}.source-link{color:var(--red);font:10px var(--mono);letter-spacing:.12em;text-decoration:none}.hero{height:570px;display:grid;grid-template-columns:1fr 1fr;position:relative;overflow:hidden}.hero:after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--red),transparent);opacity:.7}.hero-copy{align-self:center;position:relative;z-index:2}.eyebrow{font:10px var(--mono);letter-spacing:.18em;color:var(--red);margin:0 0 15px}.hero h1{font-size:clamp(76px,11vw,168px);line-height:.77;letter-spacing:-.1em;margin:0 0 30px;font-weight:700}.hero h1 span{color:transparent;-webkit-text-stroke:1px var(--ink);display:inline-block;transform:translateX(58px)}.hero-text{font-size:15px;line-height:1.6;color:#d2afb5;max-width:450px;margin:0 0 28px}.hero-actions{display:flex;align-items:center;gap:17px}.search-wrap{height:54px;width:min(480px,100%);display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid #76313f;background:rgba(16,7,11,.72);transition:.25s}.search-wrap:focus-within{border-color:var(--red);box-shadow:0 0 0 3px rgba(255,79,96,.12),0 0 28px rgba(255,32,65,.12)}.search-icon{color:var(--red);font-size:24px}.search-wrap input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:var(--ink);font:13px var(--sans)}.search-wrap input::placeholder{color:#9e7780}.search-wrap kbd{font:10px var(--mono);border:1px solid #743440;padding:4px 6px;color:#c28790}.hero-hints{display:grid;gap:7px;color:#c88791;font:9px var(--mono);white-space:nowrap}.hero-hints span:before{content:'↗';color:var(--red);margin-right:5px}.hero-stage{position:relative;overflow:hidden}.stage-grid{position:absolute;inset:50px 0 0;background:linear-gradient(rgba(255,79,96,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(255,79,96,.14) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,transparent,#000 24%,#000 80%,transparent);transform:perspective(460px) rotateX(57deg) translateY(130px) scale(1.5);transform-origin:center bottom;opacity:.38}.stage-sigil{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-11deg);width:275px;height:275px;border:1px solid rgba(255,79,96,.64);border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,rgba(119,23,38,.7),rgba(11,5,8,.95) 65%);box-shadow:0 0 0 15px rgba(255,79,96,.045),0 0 100px rgba(255,23,55,.25),inset 0 0 80px rgba(255,23,55,.15);animation:float 5s ease-in-out infinite}.stage-sigil:before,.stage-sigil:after{content:'';position:absolute;border:1px solid rgba(255,79,96,.35);border-radius:50%;transform:rotate(44deg)}.stage-sigil:before{width:370px;height:170px}.stage-sigil:after{width:180px;height:350px}.stage-sigil span{font-size:116px;line-height:.8;font-weight:700;color:#fff1f2;letter-spacing:-.18em}.stage-sigil small{position:absolute;bottom:76px;left:50%;transform:translateX(-50%);font:10px var(--mono);letter-spacing:.4em;color:var(--red)}.stage-caption,.stage-index{position:absolute;color:#d48f98;font:10px var(--mono);letter-spacing:.14em;line-height:1.5}.stage-caption{right:5%;top:21%}.stage-caption b{color:var(--red);font-weight:400}.stage-index{bottom:24%;right:8%;color:var(--red);writing-mode:vertical-rl}@keyframes float{0%,100%{transform:translate(-50%,-50%) rotate(-11deg)}50%{transform:translate(-50%,-54%) rotate(-7deg)}}
.styles-section{padding:68px 0 35px}.section-top{display:flex;justify-content:space-between;align-items:end;gap:24px}.section-top h2{font-size:clamp(38px,5vw,72px);letter-spacing:-.08em;line-height:.9;margin:0}.section-top h2 span,.dossier-title span{color:var(--red)}.section-tools{display:flex;align-items:center;gap:12px}.section-tools label{font:9px var(--mono);color:#b9818a;letter-spacing:.1em}.section-tools select{margin-left:7px;background:#180b11;border:1px solid #60303b;color:var(--ink);padding:11px 10px;font:11px var(--sans);outline:0}.compare-button{border:1px solid var(--red);background:var(--red);color:#1a060a;padding:11px 13px;font:10px var(--mono);cursor:pointer;transition:.2s}.compare-button:hover{background:var(--hot);transform:translateY(-2px);box-shadow:0 8px 22px rgba(255,79,96,.2)}.compare-button span{background:#250910;color:#ffbac0;padding:3px 6px;margin-left:4px}.style-count-line{display:flex;align-items:center;gap:8px;color:#b38089;font:10px var(--mono);margin:30px 0 13px}.style-count-line>span:first-child{color:var(--red);font-size:16px}.line-grow{height:1px;background:var(--line);flex:1}.style-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.style-button{position:relative;min-height:205px;overflow:hidden;border:1px solid #542531;background:#16090f;color:var(--ink);padding:0;text-align:left;cursor:pointer;transition:.35s;isolation:isolate}.style-button:before{content:'';position:absolute;inset:0;background:linear-gradient(145deg,rgba(255,79,96,.1),transparent 45%,#080406 92%);z-index:1}.style-button:hover{transform:translateY(-8px);border-color:var(--red);box-shadow:0 22px 35px rgba(0,0,0,.42),0 0 28px rgba(255,32,65,.14)}.style-button.is-active{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red),0 0 32px rgba(255,32,65,.17)}.style-thumb{position:absolute;inset:0;z-index:0;background:#251019}.style-thumb img{width:100%;height:100%;object-fit:cover;opacity:.55;filter:grayscale(.25) saturate(.8);transition:.5s;mix-blend-mode:screen}.style-button:hover .style-thumb img,.style-button.is-active .style-thumb img{opacity:.82;transform:scale(1.1);filter:grayscale(0) saturate(1.35)}.style-card-top,.style-card-bottom{position:absolute;z-index:2;left:14px;right:14px;display:flex;justify-content:space-between;align-items:start}.style-card-top{top:13px}.style-card-bottom{bottom:14px;align-items:end}.style-number,.style-meta{font:9px var(--mono);color:#db8b95}.style-number{color:var(--red)}.style-compare{display:grid;place-items:center;width:22px;height:22px;border:1px solid #9a4654;color:#ffabb3;font:14px var(--mono);background:rgba(10,3,6,.48)}.style-compare.is-compared{background:var(--red);border-color:var(--red);color:#17070b}.style-card-name{font-size:20px;line-height:.95;letter-spacing:-.06em;max-width:155px;text-shadow:0 2px 12px #000}.style-card-skill{color:#d899a1;font:9px var(--mono);text-align:right}.style-actions{display:contents}.style-button>span:nth-child(2){display:none}.style-button mark{background:var(--red);color:#16070a}.empty-state{grid-column:1/-1;border:1px dashed #6d3340;padding:55px;text-align:center;color:#b98790}.empty-state h3{color:var(--ink)}
.detail-section{padding:35px 0 80px}.content-toolbar{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:15px}.dossier-header{display:grid;grid-template-columns:1fr 320px;gap:38px;padding:32px 0 28px;align-items:center}.dossier-kicker{display:flex;gap:10px;align-items:center;font:10px var(--mono);color:#c38891;letter-spacing:.15em}.dossier-kicker .line{width:45px;height:1px;background:var(--red)}.dossier-title{font-size:clamp(50px,7vw,105px);letter-spacing:-.1em;line-height:.82;margin:17px 0 23px}.dossier-intro{max-width:660px;color:#d4afb5;line-height:1.6;font-size:14px}.feature-tags,.chips{display:flex;flex-wrap:wrap;gap:5px}.tag,.chip{font:9px var(--mono);padding:5px 7px;border:1px solid #713440;color:#e2a1a9;background:rgba(103,29,43,.27)}.tag.accent,.chip.accent{color:#ffd1d5;border-color:var(--red);background:rgba(255,79,96,.12)}.dossier-art{height:230px;position:relative;overflow:hidden;border:1px solid #713440;background:#210c13}.dossier-art img{width:100%;height:100%;object-fit:cover;opacity:.78;filter:saturate(1.25) contrast(1.1)}.dossier-art:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(8,4,6,.95))}.art-caption{position:absolute;bottom:14px;left:14px;z-index:1;color:var(--red);font:9px var(--mono);letter-spacing:.12em}.overview-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.stat-tile{padding:16px;background:rgba(24,10,16,.8);border:1px solid var(--line)}.stat-label{display:block;color:#b47e88;font:9px var(--mono);text-transform:uppercase;letter-spacing:.1em}.stat-value{display:block;margin-top:9px;font-size:28px;letter-spacing:-.06em}.stat-value.accent{color:var(--red)}.section-heading{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:11px;margin:35px 0 14px}.section-heading h3{margin:0;font-size:22px;letter-spacing:-.05em}.section-heading span{font:9px var(--mono);color:#b47e88}.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.profile-card{padding:17px;background:#150a10;border:1px solid var(--line)}.profile-card h4{color:var(--hot);font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px}.profile-card p,.profile-card li{color:#d0aab1;font-size:12px;line-height:1.6}.profile-card ul{padding-left:19px;margin:5px 0}.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.skill-card{background:#150a10;border:1px solid var(--line);cursor:pointer;overflow:hidden;transition:.3s;position:relative}.skill-card:hover{transform:translateY(-5px) scale(1.01);border-color:var(--red);box-shadow:0 17px 28px rgba(0,0,0,.4)}.skill-media{height:170px;background:#24101a;overflow:hidden;position:relative}.skill-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.8);transition:.4s}.skill-card:hover .skill-media img{transform:scale(1.08);filter:saturate(1.35)}.skill-media:after{content:'PLAY / OPEN ↗';position:absolute;bottom:10px;right:10px;background:rgba(10,3,6,.78);color:#ffb6be;padding:5px;font:8px var(--mono);opacity:0;transition:.2s}.skill-card:hover .skill-media:after{opacity:1}.media-fallback{height:100%;display:grid;place-items:center;color:#9f5561;font:10px var(--mono);letter-spacing:.13em;background:repeating-linear-gradient(135deg,#24101a 0 10px,#150a10 10px 20px)}.skill-body{padding:15px}.skill-top{display:flex;justify-content:space-between;gap:8px}.skill-name{font-size:18px;letter-spacing:-.06em;margin:0}.skill-index{color:#aa6f7a;font:9px var(--mono)}.skill-description{color:#c9a6ae;font-size:12px;line-height:1.55;min-height:56px}.source-notes{margin-top:28px;border:1px solid var(--line);background:#11070c}.source-notes summary{padding:14px;color:var(--red);font:9px var(--mono);letter-spacing:.12em;cursor:pointer}.source-content{padding:14px;border-top:1px solid var(--line);color:#ccaab0;font-size:12px;line-height:1.6}.source-content a{color:var(--red)}.result-note{color:#bf8992;font:10px var(--mono)}
.compare-drawer,.modal{position:fixed;inset:0;z-index:60;visibility:hidden;pointer-events:none}.compare-drawer.is-open,.modal.is-open{visibility:visible;pointer-events:auto}.drawer-backdrop,.modal-backdrop{position:absolute;inset:0;background:rgba(5,1,3,.82);backdrop-filter:blur(9px);opacity:0;transition:.25s}.is-open .drawer-backdrop,.is-open .modal-backdrop{opacity:1}.drawer-panel{position:absolute;right:0;top:0;height:100%;width:min(850px,100%);padding:28px;background:#10060b;border-left:1px solid var(--red);transform:translateX(100%);transition:.3s;overflow:auto}.is-open .drawer-panel{transform:translateX(0)}.drawer-head{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:18px}.drawer-head h2{margin:0;font-size:34px;letter-spacing:-.07em}.icon-button{width:34px;height:34px;background:transparent;color:var(--ink);border:1px solid #763440;font-size:23px;cursor:pointer}.icon-button:hover{border-color:var(--red);color:var(--red)}.compare-empty{padding:40px 0;color:#c4949d}.compare-table{overflow:auto;margin-top:23px}.compare-row{display:grid;grid-template-columns:155px repeat(var(--cols),minmax(190px,1fr));min-width:max-content;border-bottom:1px solid var(--line)}.compare-row>div{padding:14px;border-right:1px solid var(--line)}.compare-row>div:first-child{color:#bd858f;font:9px var(--mono);text-transform:uppercase}.compare-head{background:#251019}.compare-head h3{margin:0;font-size:19px}.compare-head p{color:var(--red);font:9px var(--mono)}.compare-cell{font-size:12px;color:#e0bdc3}.modal-panel{position:absolute;left:50%;top:50%;width:min(850px,calc(100% - 28px));max-height:calc(100vh - 42px);overflow:auto;padding:25px;background:#13080e;border:1px solid var(--red);box-shadow:0 25px 100px #000;transform:translate(-50%,-47%) scale(.96);transition:.25s}.is-open .modal-panel{transform:translate(-50%,-50%) scale(1)}.modal-close{position:absolute;right:15px;top:15px}.modal-skill{padding-right:44px}.modal-style{color:var(--red);font:9px var(--mono);letter-spacing:.15em}.modal-skill h2{font-size:42px;letter-spacing:-.08em;margin:8px 0}.modal-media{height:320px;margin:20px 0;background:#1f0c15}.modal-media img{width:100%;height:100%;object-fit:contain}.modal-copy{font-size:14px;line-height:1.7;color:#dfbdc3}.site-footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);padding:23px 0 34px;color:#a87580;font:9px var(--mono);letter-spacing:.08em}.site-footer a{color:var(--red);text-decoration:none}
@media(max-width:1100px){.style-list{grid-template-columns:repeat(4,1fr)}.skills-grid{grid-template-columns:repeat(2,1fr)}.hero h1{font-size:clamp(68px,11vw,125px)}}@media(max-width:760px){.shell-wide{width:calc(100% - 30px)}.topbar{height:64px}.top-nav{display:none}.source-link{font-size:8px}.hero{height:auto;min-height:670px;display:block;padding-top:65px}.hero-copy{z-index:3}.hero h1{font-size:82px}.hero h1 span{transform:translateX(28px)}.hero-text{font-size:13px}.hero-actions{display:block}.search-wrap{width:100%}.hero-hints{display:flex;margin-top:15px;gap:15px}.hero-stage{position:absolute;inset:220px -110px 0 0;opacity:.5}.stage-sigil{transform:translate(-50%,-50%) scale(.8) rotate(-11deg)}.styles-section{padding-top:44px}.section-top{display:block}.section-tools{display:flex;margin-top:24px}.section-tools label{flex:1}.section-tools select{max-width:145px}.style-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.style-button{min-height:165px}.style-card-name{font-size:17px}.style-card-skill{display:none}.dossier-header{display:flex;flex-direction:column-reverse;gap:18px}.dossier-art{height:185px}.dossier-title{font-size:57px}.overview-grid{grid-template-columns:repeat(2,1fr)}.profile-grid,.skills-grid{grid-template-columns:1fr}.skill-media{height:200px}.site-footer{flex-direction:column;line-height:1.5}.drawer-panel{padding:20px}.modal-panel{padding:19px}.modal-media{height:220px}}