:root{color-scheme:dark;--bg:#020b14;--panel:#071725;--gold:#ffcf60;--text:#f2f5fa;--muted:#b9c6d6;--line:#284258}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.5}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}:focus-visible{outline:3px solid #fff;outline-offset:5px}.skip{position:fixed;top:-60px;z-index:20;background:#fff;color:#000;padding:12px}.skip:focus{top:0}.header{position:absolute;z-index:3;top:0;left:50%;transform:translateX(-50%);width:min(1100px,100%);padding:20px 26px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:8px;line-height:1}.brand b{font-size:42px;font-weight:900;color:#ffe09c;text-shadow:0 3px #7c4712,0 0 16px #000}.brand small{display:block;font-size:9px;font-weight:bold;margin-top:7px;color:var(--gold);letter-spacing:1px}.crown{display:block;font-size:76px;line-height:1;color:#ffd164;text-shadow:0 3px 1px #633202,0 0 20px #c8842480}.crown.small{font-size:48px}.nav{position:relative}.nav summary{list-style:none;cursor:pointer;border:1px solid #c79b46;background:#041322d9;border-radius:9px;padding:3px 14px;font-size:29px}.nav summary::-webkit-details-marker{display:none}.nav nav{position:absolute;right:0;top:58px;width:220px;background:#081624;border:1px solid var(--line);border-radius:12px;box-shadow:0 15px 45px #0009;padding:10px}.nav nav a{display:block;padding:12px;border-radius:6px}.nav nav a:hover{background:#1c2c3a}.hero{position:relative;isolation:isolate;text-align:center;padding:330px 22px 34px}.hero-art{position:absolute;z-index:-1;inset:0 0 auto;height:710px;background:linear-gradient(0deg,var(--bg),transparent 46%),url("/assets/jaw-castle-red-purple-v1.png") center top/cover no-repeat}.hero-content{max-width:820px;margin:auto}h1{margin:5px -10px 24px;font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:clamp(39px,7vw,78px);line-height:1.07;letter-spacing:.015em;color:#ffe099;text-shadow:0 3px #96621d,0 6px #301803,0 9px 20px #000}p{margin:12px 0}.values{display:flex;justify-content:center;max-width:580px;margin:auto}.values span{flex:1;letter-spacing:1.6px;font-size:13px;border-right:1px solid #66747e}.values span:last-child{border:0}.values i{display:block;font-style:normal;color:var(--gold);font-size:30px;line-height:1.4;letter-spacing:-5px}.intro{font-size:20px;color:#d8e0ea;margin:22px 0}.actions{max-width:510px;margin:auto;display:grid;gap:12px}.button{display:flex;justify-content:center;align-items:center;gap:18px;min-height:48px;padding:10px 16px;border-radius:8px;font-size:15px;font-weight:800;letter-spacing:.3px}.button span{font-size:22px;line-height:1}.primary{border:1px solid #ffe9a5;background:linear-gradient(#ffe58c,#edb52f);color:#151306;box-shadow:0 0 24px #eab33128,inset 0 1px #fff9}.secondary{background:#071626b3;border:1px solid #9abbdb}.content{max-width:1050px;margin:auto;padding:0 22px}.panel{background:linear-gradient(125deg,#0a1e30a8,#04111da8);border:1px solid var(--line);padding:22px;border-radius:15px;margin-bottom:20px}h2{font-size:23px;line-height:1.25;margin:0;letter-spacing:.3px}h2>span{color:var(--gold);font-size:30px;margin-right:8px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.section-heading p{font-size:11px;color:var(--muted);letter-spacing:2px}.clans{display:grid;grid-template-columns:1fr 1fr;gap:18px}.clan{padding:20px;border:1px solid #bd914c;border-radius:12px;background:radial-gradient(ellipse at 75% 0%,#6d341f66,transparent 70%),#061320}.jaw2{background:radial-gradient(ellipse at 75% 0%,#5a286166,transparent 70%),#061320}.clan-identity{display:flex;gap:18px;align-items:center}.clan-identity img{object-fit:contain;width:100px;height:100px}.clan h3{font-size:32px;color:var(--gold);line-height:1.1;margin:0}.clan p{margin:5px 0 1px}.clan small{font-size:11px;color:var(--muted)}dl{display:flex;justify-content:space-around;margin:22px 0}dl>div{text-align:center}dt{font-size:10px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted)}dd{margin:0;font-size:20px}.outline{width:100%;color:var(--text);background:linear-gradient(#201c1199,#020b14);border:1px solid #d5a747;box-shadow:inset 0 0 8px #d9a63922}.data-note{font-size:12px;color:#a9b7c7}.panel>.data-note{text-align:center;margin:16px 0 0}.community>p{color:var(--muted);margin-left:42px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}.features button{border:1px solid var(--line);border-radius:12px;background:#041320;color:var(--text);padding:20px 10px}.features button>span{display:block;color:var(--gold);font-size:40px;line-height:1.2;letter-spacing:-5px}.features strong{display:block;font-size:18px;margin:10px 0 5px}.features small{font-size:14px;line-height:1.35;display:block;color:var(--muted)}button:hover,.button:hover{filter:brightness(1.13)}.culture{min-height:290px;border:1px solid var(--line);border-radius:15px;padding:30px;background:linear-gradient(90deg,#03101c 20%,#03101ccc 57%,#03101c11),url("/assets/jaw-castle-red-purple-v1.png") right 22%/65% auto no-repeat}.culture>div{max-width:530px}.eyebrow{color:var(--gold);font-weight:bold;font-size:13px;letter-spacing:1px;margin:0 0 15px}.culture h2{font-size:32px}.culture div>p:last-child{color:var(--muted);max-width:480px}footer{text-align:center;padding:32px 12px;color:#9eacba;font-size:11px}footer strong{letter-spacing:2px;font-size:10px}dialog{max-width:440px;width:calc(100% - 36px);background:#091927;color:var(--text);border:1px solid #bd914c;border-radius:16px;padding:30px;box-shadow:0 20px 90px #000}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}dialog h2{margin-top:14px}dialog .close{float:right;border:0;background:none;color:white;font-size:28px}
@media(min-width:1200px){.hero-art{background-size:1150px auto}.hero{padding-top:365px}}
@media(max-width:600px){.header{padding:16px 20px}.brand b{font-size:32px}.brand small{font-size:7px}.crown.small{font-size:38px}.nav summary{font-size:26px;padding:1px 12px}.hero{padding:218px 20px 25px}.hero-art{height:570px;background-size:auto 570px}.hero-content>.crown{font-size:59px}h1{font-size:clamp(32px,8.7vw,51px);margin:5px -12px 20px}.values span{font-size:10px;letter-spacing:1px}.values i{font-size:26px}.intro{font-size:16px;margin:20px -4px}.content{padding:0 12px}.panel{padding:13px;margin-bottom:14px;border-radius:12px}.section-heading{gap:6px;margin-bottom:12px}.section-heading h2{font-size:17px}.section-heading p{font-size:8px;letter-spacing:1px;text-align:right;max-width:100px}h2{font-size:18px}h2>span{font-size:24px;margin-right:4px}.clans{gap:10px}.clan{padding:12px 8px}.clan-identity{flex-direction:column;text-align:center;gap:5px}.clan-identity img{width:90px;height:90px}.clan h3{font-size:26px}.clan p{font-size:12px}.clan small{font-size:9px}dl{margin:17px 0;gap:3px}dt{font-size:8px;letter-spacing:0}dd{font-size:18px}.clan .button{font-size:10px;gap:6px;padding:8px 4px;min-height:42px}.clan .button span{font-size:16px}.community>p{margin-left:29px;font-size:13px}.features{gap:7px;margin-top:14px}.features button{padding:16px 4px}.features button>span{font-size:32px}.features strong{font-size:13px}.features small{font-size:11px}.culture{padding:22px;min-height:270px;background-size:auto,auto 300px;background-position:center,right center}.culture>div{max-width:330px}.culture h2{font-size:27px}.culture div>p:last-child{font-size:14px}.desktop{display:none}.data-note{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* V2: closer to the approved illustrated mobile composition. */
.gold-icon{width:30px;height:30px;fill:#ffd366;filter:drop-shadow(0 2px 1px #85531e);flex-shrink:0;vertical-align:middle}.brand>.gold-icon{width:45px;height:49px}.brand b{font-family:Impact,'Arial Narrow',sans-serif;font-size:42px;font-style:italic}.hero{padding-top:240px;padding-bottom:22px}.hero-art{height:650px;background-size:980px auto;background-position:center -30px}.hero-content{max-width:680px}.hero h1{margin:0 -12px 8px;line-height:0;text-shadow:none}.title-art{width:100%;height:auto;display:block}.values .gold-icon{display:block;margin:0 auto 7px;width:27px;height:27px}.values span{font-size:11px}.intro{font-size:17px;margin:17px 0}.button>.gold-icon{width:23px;height:23px}.section-heading h2>.gold-icon,.community h2>.gold-icon{margin-right:8px}.features button>.gold-icon{width:40px;height:40px}.eyebrow .gold-icon{width:21px;height:21px;margin-right:6px}.clan{padding:0 12px 12px;overflow:hidden;position:relative;background:#04111f}.clan-art{margin:0 -12px;height:230px;background:url('clans-v2.png') left top/200% 100% no-repeat}.jaw2 .clan-art{background-position:right top}.clan-identity{justify-content:center;text-align:center;margin-top:-27px;position:relative}.clan-identity small{display:none}.clan h3{font-size:29px}.clan p{font-size:14px}dl{margin:15px 0}.content{max-width:930px}.culture h2{font-size:27px}.culture{min-height:225px}.features strong{margin:7px 0 4px}
@media(min-width:1200px){.hero{padding-top:235px}.hero-art{background-size:1020px auto}}
@media(max-width:600px){.header{padding:14px 19px}.brand b{font-size:31px}.brand>.gold-icon{width:33px;height:38px}.brand{gap:5px}.nav summary{font-size:25px;padding:0 10px;border-radius:6px}.hero{padding:139px 22px 16px}.hero-art{height:410px;background-size:610px auto;background-position:center -14px}.hero h1{margin:0 -13px 7px}.values{max-width:300px}.values .gold-icon{width:23px;height:23px;margin-bottom:4px}.values span{font-size:8px;letter-spacing:1px}.intro{font-size:13px;line-height:1.4;margin:14px 0}.actions{max-width:320px;gap:9px}.button{min-height:36px;padding:6px 10px;font-size:11px;gap:10px;border-radius:6px}.button>.gold-icon{width:19px;height:19px}.button span{font-size:18px}.content{padding:0 11px}.panel{padding:9px;margin-bottom:9px}.section-heading{margin-bottom:9px}.section-heading h2{font-size:14px}.section-heading p{max-width:none;font-size:7px;letter-spacing:1.1px;margin:0}.section-heading h2>.gold-icon,.community h2>.gold-icon{width:23px;height:23px;margin-right:5px}.clans{gap:8px}.clan{padding:0 7px 8px;border-color:#b98e43}.clan-art{height:auto;aspect-ratio:1.5;margin:0 -7px}.clan-identity{margin-top:-7px;gap:0}.clan h3{font-size:21px}.clan p{font-size:10px;margin:1px 0}.clan dl{margin:10px 0 8px}.clan dt{font-size:7px}.clan dd{font-size:15px}.clan .button{font-size:9px;min-height:29px;padding:4px;gap:5px}.panel>.data-note{font-size:8px;margin:7px 0 0}.community h2{font-size:15px}.community>p{font-size:10px;line-height:1.3;margin:4px 0 10px 29px}.features{margin-top:8px;gap:7px}.features button{padding:10px 3px}.features button>.gold-icon{width:28px;height:28px}.features strong{font-size:11px}.features small{font-size:10px}.culture{padding:13px;min-height:155px;border-radius:10px;background-size:auto,auto 240px}.culture .eyebrow{font-size:10px;margin:0 0 8px}.eyebrow .gold-icon{width:17px;height:17px}.culture h2{font-size:20px}.culture div>p:last-child{font-size:11px;line-height:1.4;max-width:265px;margin:8px 0}.data-note{font-size:9px}footer{padding:20px 8px;font-size:9px}footer strong{font-size:8px}.desktop{display:block}}

/* V2.1 visual polish — prototype only. */
:root{--line:#22394b}
.panel{box-shadow:inset 0 1px 0 #ffffff04;border-color:#294255aa}
.clan{border-color:#b78b43b3;box-shadow:0 4px 16px #0003}
.primary>.gold-icon{fill:#352508;filter:none}
.actions>.button{display:grid;grid-template-columns:22px auto 22px;gap:10px}
.actions>.button>span{justify-self:center}
.secondary{border-color:#8cabc2b3;background:linear-gradient(#0b1c2c99,#03101a)}
.values span{border-color:#6c82945c}
.features button{border-color:#284358b3;border-radius:9px;background:linear-gradient(150deg,#0b2132,#03111d);box-shadow:inset 0 1px 0 #ffffff05}
.features small{color:#b8c7d6}
.culture{background-image:linear-gradient(90deg,#03101cf5 5%,#03101cdf 48%,#03101c38 100%),url("/assets/jaw-castle-red-purple-v1.png");background-position:center,right center;background-size:auto,auto 310px}
.culture h2{text-wrap:balance;text-shadow:0 2px 8px #020912}
.culture div>p:last-child{color:#c5d0db;text-shadow:0 1px 4px #020912}
.nav summary{display:flex;align-items:center;justify-content:center;min-width:42px;min-height:42px}
.nav summary span{line-height:1}
@media(max-width:600px){
 .hero{padding-bottom:19px}
 .hero h1{margin-left:-8px;margin-right:-8px;margin-bottom:12px}
 .values{max-width:282px}
 .intro{max-width:350px;margin:15px auto 16px;font-size:13px;line-height:1.45}
 .actions{max-width:350px;width:100%;gap:9px}
 .actions>.button{min-height:41px;padding:8px 22px;font-size:11px}
 .panel{padding:10px;margin-bottom:11px}
 .section-heading{margin-bottom:10px;min-height:25px}
 .section-heading p{font-size:7px;letter-spacing:.8px}
 .clan-identity{margin-top:-14px}
 .clan h3{font-size:20px;text-shadow:0 2px 6px #000}
 .clan p{font-size:10px}
 .clan dl{margin-top:9px;margin-bottom:8px}
 .clan dl>div{flex:1;min-width:0}
 .clan dl>div+div{border-left:1px solid #30435560}
 .clan dt{font-size:7px;color:#a7b8c9}
 .clan dd{font-size:14px;line-height:1.5;color:#ced8e1}
 .clan .button{min-height:36px;font-size:9px;border-color:#bd944a;background:linear-gradient(#25210f70,#030d16)}
 .panel>.data-note{font-size:8px;line-height:1.4;margin-top:8px}
 .community>p{margin-top:6px;margin-bottom:11px;line-height:1.4}
 .features{gap:7px}
 .features button{padding:12px 4px}
 .features strong{font-size:11px;margin-top:8px;margin-bottom:5px}
 .features small{font-size:10px;line-height:1.35}
 .culture{padding:15px 13px;min-height:145px;background-size:auto,auto 220px}
 .culture h2{font-size:19px;line-height:1.2;letter-spacing:0}
 .culture div>p:last-child{font-size:11px;max-width:270px;line-height:1.45}
 footer{padding:22px 8px 28px}
}
@media(max-width:360px){.section-heading{flex-wrap:wrap}.section-heading p{margin-left:29px}.actions>.button{padding-left:12px;padding-right:12px}.features strong{font-size:10px}}
/* V3: illustrated brand, integrated clan cards, dimensional gold, culture scene. */
.icon-defs{position:absolute;pointer-events:none;overflow:hidden}
.brand-art{width:174px;height:auto;display:block;filter:drop-shadow(0 3px 5px #0009)}
.gold-icon{fill:url(#jaw-gold);stroke:#fff0ae;stroke-width:.45;paint-order:stroke fill;filter:drop-shadow(0 2px 0 #8b4d0c) drop-shadow(0 0 5px #ffb62d26)}
.primary>.gold-icon{fill:#382608;stroke:none;filter:none}
.values .gold-icon{width:30px;height:30px}
.values span{letter-spacing:1.1px}
.clan{isolation:isolate;background:linear-gradient(135deg,#061a2b,#020b14);box-shadow:inset 0 0 12px #d6a3400d,0 5px 20px #0004}
.clan-art{height:auto;aspect-ratio:1.5;position:relative;z-index:-1}
.clan-identity{margin-top:-48px;padding-bottom:4px;text-shadow:0 2px 6px #000,0 0 12px #000}
.clan h3{font-size:31px;color:#ffdb73;font-weight:800;letter-spacing:.2px}
.clan p{color:#e6edf4}
.clan dl{padding:10px 0 3px;margin-top:4px}
.clan .outline{box-shadow:inset 0 1px 0 #ffe6a426,inset 0 0 11px #ffca3c16,0 0 8px #e8ab3110}
.community{background:linear-gradient(125deg,#0b2134b0,#03101c);border-color:#304c63}
.features button{background:radial-gradient(ellipse at 50% 0,#14364c77,transparent 75%),linear-gradient(#061a2b,#030d17)}
.features button>.gold-icon{width:42px;height:42px}
.culture{min-height:230px;background-image:linear-gradient(90deg,#03101c22,#03101c00),url('culture-v3.png');background-size:cover;background-position:center;border-color:#36526a}
.culture>div{max-width:65%}
.culture h2{font-size:26px;line-height:1.2;text-wrap:initial}
.culture div>p:last-child{max-width:440px;line-height:1.5}
@media(max-width:600px){
 .header{padding:14px 17px}
 .brand-art{width:132px}
 .hero{padding-top:145px}
 .hero h1{margin-left:-10px;margin-right:-10px;margin-bottom:13px}
 .values .gold-icon{width:25px;height:25px}
 .values{max-width:290px}
 .values span{font-size:8px}
 .intro{margin-top:14px;margin-bottom:16px}
 .clan-art{aspect-ratio:1.35;background-size:200% auto;background-color:#03101c}
 .clan-identity{margin-top:-27px;padding-bottom:0}
 .clan h3{font-size:22px;line-height:1.1}
 .clan p{font-size:10px;margin:3px 0 0}
 .clan dl{padding:7px 0 0;margin-top:2px;margin-bottom:8px}
 .features button{padding-top:12px;padding-bottom:13px}
 .features button>.gold-icon{width:33px;height:33px}
 .features strong{font-size:11px}
 .culture{min-height:172px;padding:14px 12px;background-size:auto 100%;background-position:right center}
 .culture>div{max-width:73%}
 .culture h2{font-size:18px;line-height:1.2;max-width:265px;text-shadow:0 2px 8px #000}
 .culture div>p:last-child{font-size:10px;line-height:1.45;max-width:230px;color:#d7e0e8;margin-bottom:0;text-shadow:0 1px 5px #000,0 0 8px #000}
 .culture .eyebrow{font-size:9px;letter-spacing:.7px;margin-bottom:9px}
}
@media(max-width:360px){.brand-art{width:116px}.culture{min-height:186px}.culture>div{max-width:72%}.culture h2{font-size:17px}}