:root {
            --bg: #070811;
            --bg-soft: #0d0f1b;
            --panel: rgba(17, 20, 35, .72);
            --panel-strong: #111421;
            --text: #f7f5ee;
            --muted: #989cad;
            --gold: #e9b96e;
            --gold-light: #ffe0a3;
            --cyan: #65e6f4;
            --violet: #9574ff;
            --pink: #dc6ed9;
            --line: rgba(255, 255, 255, .1);
            --display: 'Montserrat', Arial, sans-serif;
            --sans: 'Inter', Arial, sans-serif;
            --container: 1200px;
        }

        * { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            color: var(--text);
            background:
                radial-gradient(circle at 18% 12%, rgba(122, 76, 205, .12), transparent 26rem),
                radial-gradient(circle at 88% 42%, rgba(37, 157, 184, .09), transparent 32rem),
                var(--bg);
            font-family: var(--sans);
            overflow-x: hidden;
        }
        body::before {
            content: '';
            position: fixed;
            inset: 0;
            pointer-events: none;
            z-index: 20;
            opacity: .035;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
        }
        a { color: inherit; text-decoration: none; }
        button { font: inherit; }
        .container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }

        .site-header {
            position: fixed;
            z-index: 50;
            top: 0;
            left: 0;
            right: 0;
            height: 104px;
            display: flex;
            align-items: center;
            border-bottom: 1px solid transparent;
            transition: .35s ease;
        }
        .site-header.scrolled {
            height: 72px;
            background: rgba(7, 8, 17, .86);
            border-color: var(--line);
            backdrop-filter: blur(18px);
        }
        .nav-wrap { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
        .brand { display:flex; align-items:center; min-width:max-content; }
        .site-header .nav-wrap > .brand { margin-left:10px; transform:translateY(3px); transition:margin .35s ease, transform .35s ease; }
        .site-header.scrolled .nav-wrap > .brand { transform:translateY(0); }
        .brand-logo {
            display:block;
            width:235px;
            height:96px;
            object-fit:contain;
            object-position:left center;
            filter:drop-shadow(0 8px 20px rgba(0,0,0,.42)) drop-shadow(0 0 15px rgba(233,185,110,.1));
            transition:width .35s ease, height .35s ease, filter .25s ease;
        }
        .brand:hover .brand-logo { filter:drop-shadow(0 10px 24px rgba(0,0,0,.5)) drop-shadow(0 0 20px rgba(233,185,110,.2)); }
        .site-header.scrolled .brand-logo { width:170px; height:64px; }
        .main-nav { display: flex; align-items: center; gap: 34px; }
        .main-nav a {
            position: relative;
            color: #c5c6ce;
            font-size: 11px;
            font-weight: 700;
            letter-spacing: .16em;
            text-transform: uppercase;
            transition: color .25s ease;
        }
        .main-nav a::after {
            content: '';
            position: absolute;
            left: 0;
            right: 100%;
            bottom: -10px;
            height: 1px;
            background: linear-gradient(90deg, var(--gold), var(--cyan));
            transition: right .25s ease;
        }
        .main-nav a:hover, .main-nav a.active { color: #fff; }
        .main-nav a:hover::after, .main-nav a.active::after { right: 0; }
        .nav-actions { display: flex; align-items: center; gap: 11px; }

        .social-links { display:flex; align-items:center; gap:10px; }
        .social-link { width:28px; height:48px; display:grid; place-items:center; color:#c8cad2; background:transparent; border:0; transition:color .22s ease, transform .22s ease, filter .22s ease; }
        .social-link svg { width:18px; height:18px; }
        .social-link:hover { color:var(--gold-light); transform:translateY(-2px); filter:drop-shadow(0 0 10px rgba(233,185,110,.24)); }
        .mobile-auth-link { display:none; }

        .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            min-height: 48px;
            padding: 0 22px;
            border: 1px solid transparent;
            color: #080b13;
            background: linear-gradient(110deg, var(--gold-light), var(--gold));
            font-size: 10px;
            font-weight: 800;
            letter-spacing: .14em;
            text-transform: uppercase;
            cursor: pointer;
            clip-path: polygon(9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%, 0 9px);
            box-shadow: 0 10px 35px rgba(233, 185, 110, .15);
            transition: transform .25s ease, filter .25s ease, box-shadow .25s ease;
        }
        .btn:hover { transform: translateY(-3px); filter: brightness(1.08); box-shadow: 0 14px 42px rgba(233,185,110,.25); }
        .btn-ghost { color: #fff; border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.035); box-shadow: none; }
        .btn-ghost:hover { border-color: rgba(101,230,244,.45); background: rgba(101,230,244,.06); box-shadow: 0 12px 35px rgba(101,230,244,.1); }
        .btn svg { width: 16px; height: 16px; }
        .menu-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--line); color: #fff; background: rgba(255,255,255,.04); }

        .hero {
            min-height: 790px;
            height: min(900px, 100vh);
            position: relative;
            display: grid;
            align-items: center;
            overflow: hidden;
            isolation: isolate;
        }
        .hero-bg {
            position: absolute;
            inset: 0;
            z-index: -4;
            background-image: url('../images/hero-map.png');
            background-position: center 48%;
            background-size: cover;
            filter: saturate(.82) contrast(1.05) brightness(.83);
            transform: scale(1.035);
        }
        .hero::before {
            content: '';
            position: absolute;
            inset: 0;
            z-index: -3;
            background:
                linear-gradient(90deg, rgba(7,8,17,.96) 0%, rgba(7,8,17,.79) 35%, rgba(7,8,17,.22) 66%, rgba(7,8,17,.66) 100%),
                linear-gradient(0deg, var(--bg) 0%, transparent 30%, rgba(7,8,17,.35) 100%);
        }
        .hero::after {
            content: '';
            position: absolute;
            inset: auto 0 0;
            height: 210px;
            z-index: -2;
            background: linear-gradient(transparent, var(--bg));
        }
        .magic-orb {
            position: absolute;
            z-index: -1;
            top: 19%;
            right: 16%;
            width: 340px;
            height: 340px;
            border: 1px solid rgba(101,230,244,.18);
            border-radius: 50%;
            box-shadow: 0 0 100px rgba(101,230,244,.12), inset 0 0 90px rgba(149,116,255,.08);
            transition: transform .2s ease-out;
        }
        .magic-orb::before, .magic-orb::after { content:''; position:absolute; border-radius:50%; inset: 12%; border: 1px dashed rgba(233,185,110,.24); animation: spin 22s linear infinite; }
        .magic-orb::after { inset: 33%; border-style: solid; border-color: rgba(101,230,244,.24); animation-direction: reverse; animation-duration: 13s; }
        @keyframes spin { to { transform: rotate(360deg); } }

        .hero-character {
            position:absolute;
            z-index:-1;
            right:-10%;
            bottom:5%;
            width:min(60vw, 1000px);
            height:auto;
            pointer-events:none;
            user-select:none;
            object-fit:contain;
            object-position:right bottom;
            filter:drop-shadow(-28px 20px 42px rgba(0,0,0,.52)) saturate(.95) contrast(1.04);
            -webkit-mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.22) 13%, #000 39%), linear-gradient(180deg, transparent 0%, rgba(0,0,0,.72) 8%, #000 17%);
            -webkit-mask-composite:source-in;
            mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.22) 13%, #000 39%), linear-gradient(180deg, transparent 0%, rgba(0,0,0,.72) 8%, #000 17%);
            mask-composite:intersect;
        }

        .hero-content { padding-top: 85px; max-width: 735px; }
        .eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; color: var(--gold-light); font-size: 10px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; }
        .eyebrow::before { content:''; width: 38px; height: 1px; background: linear-gradient(90deg, transparent, var(--gold)); }
        .eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: #75f0a5; box-shadow: 0 0 12px #75f0a5; }
        .hero h1 { margin: 0; font: 800 clamp(45px, 5.65vw, 82px)/.98 var(--display); letter-spacing: -.055em; text-wrap: balance; text-shadow: 0 12px 40px rgba(0,0,0,.45); }
        .hero h1 span {
            display: block;
            color: transparent;
            background: linear-gradient(105deg, #fff 8%, var(--gold-light) 46%, var(--cyan) 92%);
            background-clip: text;
            -webkit-background-clip: text;
            font-style: normal;
            font-weight: 800;
        }
        .hero-lead { max-width: 585px; margin: 25px 0 31px; color: #bdc0cb; font-size: 16px; line-height: 1.75; }
        .hero-actions { display: flex; flex-wrap: wrap; gap: 13px; }
        .hero-actions .btn { min-width: 178px; min-height: 54px; }
        .server-mini { display: flex; gap: 28px; margin-top: 48px; }
        .server-mini-item { padding-left: 15px; border-left: 1px solid rgba(233,185,110,.35); }
        .server-mini-item small { display:block; margin-bottom:6px; color: #737887; font-size: 9px; letter-spacing:.17em; text-transform:uppercase; }
        .server-mini-item strong { font: 600 13px var(--display); color:#f6f1e5; letter-spacing:.05em; }
        .scroll-cue { position:absolute; left:50%; bottom:32px; display:flex; flex-direction:column; align-items:center; gap:9px; color:#676b79; font-size:8px; letter-spacing:.22em; text-transform:uppercase; transform:translateX(-50%); }
        .scroll-cue span { width:1px; height:35px; background:linear-gradient(var(--gold), transparent); animation:pulse 1.8s ease-in-out infinite; }
        @keyframes pulse { 50% { opacity:.35; transform:scaleY(.65); transform-origin:top; } }

        .status-ribbon { position:relative; z-index:5; margin-top:-8px; }
        .status-grid { display:grid; grid-template-columns: 1.15fr repeat(3, 1fr); background:rgba(12,14,25,.86); border:1px solid var(--line); backdrop-filter:blur(16px); box-shadow:0 22px 70px rgba(0,0,0,.22); }
        .status-item { min-height:104px; padding:26px 28px; display:flex; align-items:center; gap:16px; border-right:1px solid var(--line); }
        .status-item:last-child { border-right:0; }
        .status-icon { width:38px; height:38px; display:grid; place-items:center; border:1px solid rgba(233,185,110,.25); color:var(--gold-light); background:rgba(233,185,110,.06); transform:rotate(45deg); }
        .status-icon svg { width:17px; transform:rotate(-45deg); }
        .status-copy small { display:block; color:#777c8c; font-size:9px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:5px; }
        .status-copy strong { font-size:13px; font-weight:600; }
        .online { color:#79eeaa !important; }

        section { position: relative; }
        .section { padding: 118px 0; }
        .section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-bottom:48px; }
        .kicker { margin:0 0 10px; color:var(--gold); font-size:9px; font-weight:700; letter-spacing:.25em; text-transform:uppercase; }
        .section-heading h2 { margin:0; font:800 clamp(32px, 3.7vw, 50px)/1.05 var(--display); letter-spacing:-.045em; }
        .section-heading h2 em { color:var(--cyan); font-style:normal; font-weight:800; }
        .section-heading p { max-width:420px; margin:0; color:var(--muted); font-size:14px; line-height:1.7; }

        .castle-section::before { content:''; position:absolute; width:700px; height:700px; left:-350px; top:0; border-radius:50%; background:rgba(233,185,110,.07); filter:blur(80px); pointer-events:none; }
        .castle-grid { display:grid; grid-template-columns:1fr; gap:22px; }
        .castle-card {
            min-height:560px;
            position:relative;
            overflow:hidden;
            padding:46px;
            display:flex;
            flex-direction:column;
            justify-content:space-between;
            border:1px solid var(--line);
            background:#0e111e;
            clip-path:polygon(0 0, calc(100% - 25px) 0, 100% 25px, 100% 100%, 25px 100%, 0 calc(100% - 25px));
            transition:transform .35s ease, border-color .35s ease;
        }
        .castle-card:hover { transform:translateY(-6px); border-color:rgba(233,185,110,.3); }
        .castle-card::before { content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg, rgba(7,8,17,.94) 0%, rgba(7,8,17,.68) 40%, rgba(7,8,17,.12) 72%),linear-gradient(0deg, rgba(7,8,17,.88) 0%, transparent 55%, rgba(7,8,17,.2) 100%); }
        .castle-card::after { content:attr(data-short); position:absolute; z-index:1; right:32px; bottom:-38px; color:rgba(255,255,255,.055); font:900 210px/1 var(--display); }
        .castle-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 48%; filter:saturate(.86) contrast(1.04); transition:transform .8s ease; }
        .castle-card:hover .castle-image { transform:scale(1.035); }
        .castle-top, .castle-owner { position:relative; z-index:2; }
        .castle-top { display:flex; align-items:flex-start; justify-content:space-between; }
        .castle-label { color:#7d8291; font-size:9px; letter-spacing:.2em; text-transform:uppercase; }
        .castle-emblem { width:84px; height:84px; display:grid; place-items:center; color:var(--gold-light); border:1px solid rgba(233,185,110,.24); border-radius:50%; font:600 30px var(--display); box-shadow:0 0 50px rgba(233,185,110,.09), inset 0 0 25px rgba(233,185,110,.06); }
        .violet .castle-emblem { color:#c8b9ff; border-color:rgba(149,116,255,.28); box-shadow:0 0 50px rgba(149,116,255,.1), inset 0 0 25px rgba(149,116,255,.06); }
        .castle-owner small { color:#777c8c; font-size:9px; letter-spacing:.18em; text-transform:uppercase; }
        .castle-owner { width:min(760px,100%); padding:26px 28px; display:grid; grid-template-columns:112px 1fr; align-items:center; gap:26px; border-left:2px solid var(--gold); background:linear-gradient(90deg,rgba(7,8,17,.82),rgba(7,8,17,.34),transparent); backdrop-filter:blur(5px); }
        .castle-owner h3 { margin:8px 0 18px; font:800 clamp(27px,3.2vw,43px)/1.05 var(--display); letter-spacing:-.04em; }
        .guild-emblem-slot { width:112px; height:112px; position:relative; display:grid; place-items:center; overflow:hidden; border:1px solid rgba(233,185,110,.32); background:rgba(7,8,17,.72); box-shadow:inset 0 0 32px rgba(233,185,110,.08),0 15px 35px rgba(0,0,0,.22); clip-path:polygon(13px 0,100% 0,100% calc(100% - 13px),calc(100% - 13px) 100%,0 100%,0 13px); }
        .guild-emblem-slot img { width:100%; height:100%; object-fit:cover; }
        .guild-emblem-fallback { color:var(--gold-light); font:800 32px var(--display); text-shadow:0 0 22px rgba(233,185,110,.36); }
        .guild-emblem-slot small { position:absolute; left:0; right:0; bottom:9px; text-align:center; font-size:7px; letter-spacing:.15em; }
        .guild-data { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
        .guild-field { padding-left:14px; border-left:1px solid rgba(233,185,110,.3); }
        .guild-field span { display:block; margin-bottom:6px; color:#747987; font-size:8px; letter-spacing:.16em; text-transform:uppercase; }
        .guild-field strong { display:block; color:#e9e7df; font:600 13px var(--display); letter-spacing:.02em; }

        .news-section { background:linear-gradient(180deg, transparent, rgba(14,17,29,.8) 45%, transparent); }
        .news-tabs { display:flex; gap:7px; flex-wrap:wrap; }
        .news-tab { padding:10px 14px; color:#858997; border:1px solid var(--line); background:transparent; font-size:9px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; cursor:pointer; transition:.25s ease; }
        .news-tab:hover, .news-tab.active { color:#090b13; border-color:var(--gold); background:var(--gold); }
        .news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
        .news-card { position:relative; overflow:hidden; min-height:395px; padding:0; display:flex; flex-direction:column; justify-content:flex-start; border:1px solid var(--line); background:#10131f; transition:transform .35s ease, opacity .3s ease; }
        .news-card.hidden { display:none; }
        .news-card:hover { transform:translateY(-7px); }
        .news-art { position:relative; width:100%; aspect-ratio:16/9; flex-shrink:0; overflow:hidden; background:#10131f; }
        .news-art img { display:block; width:100%; height:100%; object-fit:contain; }
        .news-art::after { content:''; position:absolute; inset:auto 0 0; height:24px; background:linear-gradient(transparent,#10131f); pointer-events:none; }
        .news-content { position:relative; z-index:2; padding:18px 25px 25px; flex:1; display:flex; flex-direction:column; }
        .news-meta { display:flex; align-items:center; gap:10px; color:#7d8290; font-size:9px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
        .news-category { color:var(--cyan); }
        .pink .news-category { color:#f496ee; }
        .gold .news-category { color:var(--gold-light); }
        .news-content h3 { margin:13px 0 10px; font:700 20px/1.25 var(--display); letter-spacing:-.025em; }
        .news-content p { margin:0 0 18px; color:#9498a7; font-size:12px; line-height:1.65; }
        .news-link { margin-top:auto; align-self:flex-start; display:inline-flex; align-items:center; gap:9px; color:#dedfe4; font-size:9px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
        .news-link span { color:var(--gold); transition:transform .25s ease; }
        .news-card:hover .news-link span { transform:translateX(5px); }

        .cta-section { padding:40px 0 120px; }
        .cta-box { position:relative; overflow:hidden; min-height:320px; display:grid; place-items:center; text-align:center; padding:60px 30px; border:1px solid rgba(233,185,110,.22); background:linear-gradient(120deg,rgba(233,185,110,.06),rgba(149,116,255,.07),rgba(101,230,244,.05)); clip-path:polygon(22px 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 22px),calc(100% - 22px) 100%,22px 100%,0 calc(100% - 22px),0 22px); }
        .cta-box::before, .cta-box::after { content:''; position:absolute; width:260px; height:260px; border:1px solid rgba(255,255,255,.07); transform:rotate(45deg); }
        .cta-box::before { left:-170px; top:20px; }
        .cta-box::after { right:-170px; bottom:20px; }
        .cta-content { position:relative; z-index:2; }
        .cta-content h2 { margin:0 0 15px; font:800 clamp(32px,4.6vw,56px)/1.06 var(--display); letter-spacing:-.05em; }
        .cta-content h2 span { color:var(--gold-light); font-style:normal; }
        .cta-content p { margin:0 auto 28px; max-width:580px; color:#9ca0ad; font-size:14px; line-height:1.75; }

        footer { border-top:1px solid var(--line); background:#06070d; }
        .footer-top { min-height:190px; display:flex; align-items:center; justify-content:space-between; gap:32px; }
        .footer-top .brand-logo { width:235px; height:126px; }
        .footer-note { max-width:480px; color:#686c79; font-size:11px; line-height:1.7; }
        .footer-links { display:flex; gap:24px; color:#8b8e99; font-size:9px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
        .footer-links a:hover { color:var(--gold); }
        .footer-bottom { padding:21px 0; display:flex; justify-content:space-between; gap:20px; border-top:1px solid rgba(255,255,255,.06); color:#4d505c; font-size:9px; letter-spacing:.08em; text-transform:uppercase; }

        .reveal { opacity:0; transform:translateY(28px); transition:opacity .75s ease, transform .75s ease; }
        .reveal.visible { opacity:1; transform:none; }

        @media (max-width: 1040px) {
            .brand-logo { width:210px; height:88px; }
            .main-nav { gap:19px; }
            .nav-actions { gap:8px; }
            .social-links { gap:6px; }
            .social-link { width:25px; }
            .auth-action { padding-inline:16px; }
            .status-grid { grid-template-columns:1fr 1fr; }
            .status-item:nth-child(2) { border-right:0; }
            .status-item:nth-child(-n+2) { border-bottom:1px solid var(--line); }
        }
        @media (max-width: 780px) {
            .container { width:min(calc(100% - 30px),var(--container)); }
            .site-header { height:82px; }
            .site-header.scrolled { height:68px; }
            .brand-logo { width:174px; height:74px; }
            .site-header.scrolled .brand-logo { width:142px; height:56px; }
            .site-header .nav-wrap > .brand { margin-left:4px; transform:translateY(2px); }
            .main-nav { position:absolute; top:82px; left:15px; right:15px; padding:22px; display:none; flex-direction:column; align-items:flex-start; gap:23px; background:rgba(9,10,19,.98); border:1px solid var(--line); backdrop-filter:blur(16px); }
            .site-header.scrolled .main-nav { top:68px; }
            .main-nav.open { display:flex; }
            .main-nav .mobile-auth-link { display:block; }
            .nav-actions .btn { display:none; }
            .social-links { gap:4px; }
            .social-link { width:24px; height:44px; }
            .menu-toggle { display:grid; place-items:center; }
            .hero { min-height:690px; height:auto; padding:116px 0 70px; align-items:start; }
            .hero-bg { background-position:68% center; opacity:.82; }
            .hero::before { background:linear-gradient(90deg,rgba(7,8,17,.98) 0%,rgba(7,8,17,.82) 55%,rgba(7,8,17,.5) 100%),linear-gradient(0deg,var(--bg) 0%,transparent 54%,rgba(7,8,17,.28) 100%); }
            .hero-content { position:relative; z-index:2; max-width:560px; padding-top:24px; }
            .eyebrow { margin-bottom:15px; gap:9px; font-size:8px; }
            .eyebrow::before { width:25px; }
            .hero h1 { max-width:520px; font-size:clamp(32px,9.4vw,48px); line-height:1.01; }
            .hero-lead { max-width:480px; margin:18px 0 23px; font-size:13px; line-height:1.62; }
            .hero .hero-actions { width:min(100%,235px); flex-direction:column; align-items:stretch; gap:9px; }
            .hero .hero-actions .btn { width:100%; min-width:0; min-height:46px; padding:0 15px; font-size:9px; letter-spacing:.1em; }
            .magic-orb { width:210px; height:210px; right:-90px; top:29%; opacity:.48; }
            .hero-character { width:700px; max-width:none; right:-295px; bottom:-12px; opacity:.38; filter:drop-shadow(-16px 15px 30px rgba(0,0,0,.48)) saturate(.9); -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.25) 17%,#000 42%),linear-gradient(180deg,transparent 0%,#000 16%); mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.25) 17%,#000 42%),linear-gradient(180deg,transparent 0%,#000 16%); }
            .server-mini { gap:14px; margin-top:28px; flex-wrap:wrap; }
            .server-mini-item { padding-left:11px; }
            .server-mini-item small { font-size:8px; }
            .server-mini-item strong { font-size:11px; }
            .status-grid { grid-template-columns:1fr; }
            .status-item { border-right:0; border-bottom:1px solid var(--line); }
            .status-item:last-child { border-bottom:0; }
            .section { padding:90px 0; }
            .section-heading { align-items:flex-start; flex-direction:column; margin-bottom:34px; }
            .castle-grid, .news-grid { grid-template-columns:1fr; }
            .castle-card { min-height:480px; }
            .castle-owner { grid-template-columns:82px 1fr; gap:16px; padding:22px; }
            .guild-emblem-slot { width:82px; height:82px; }
            .guild-data { grid-template-columns:1fr; gap:11px; }
            .castle-owner h3 { margin-bottom:14px; }
            .news-card { min-height:370px; }
            .footer-top { padding:55px 0; flex-direction:column; align-items:flex-start; }
            .footer-links { flex-wrap:wrap; }
            .footer-bottom { flex-direction:column; }
        }
        @media (max-width: 480px) {
            .brand-logo { width:164px; height:70px; }
            .site-header.scrolled .brand-logo { width:138px; height:54px; }
            .footer-top .brand-logo { width:205px; height:112px; }
            .hero { min-height:660px; padding-top:105px; }
            .hero-content { padding-top:18px; }
            .hero h1 { font-size:clamp(30px,9.2vw,41px); }
            .hero-lead { max-width:92%; font-size:12px; line-height:1.6; }
            .hero .hero-actions { display:flex; }
            .hero .hero-actions .btn { padding-inline:10px; }
            .hero-actions .btn svg { width:13px; height:13px; }
            .hero-character { width:650px; right:-305px; opacity:.34; }
            .server-mini-item { flex:1; min-width:120px; }
            .scroll-cue { display:none; }
            .castle-card { padding:28px; }
            .castle-emblem { width:67px; height:67px; }
        }
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
            .reveal { opacity:1; transform:none; }
        }

.hero-actions.centered{justify-content:center}

.reveal-delay-0{transition-delay:0ms}.reveal-delay-1{transition-delay:90ms}.reveal-delay-2{transition-delay:180ms}

.language-picker { position:relative; }
.language-picker summary { min-width:74px; height:48px; padding:0 12px; display:flex; align-items:center; justify-content:center; gap:8px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.035); color:#fff; list-style:none; cursor:pointer; font-size:9px; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.language-picker summary::-webkit-details-marker { display:none; }
.language-picker[open] summary { border-color:rgba(101,230,244,.4); background:rgba(101,230,244,.06); }
.language-flag { width:24px; height:18px; display:block; object-fit:cover; flex:0 0 auto; border:1px solid rgba(255,255,255,.12); box-shadow:0 2px 8px rgba(0,0,0,.28); }
.language-code { white-space:nowrap; }
.language-menu { position:absolute; z-index:100; top:calc(100% + 10px); right:0; width:245px; padding:9px; border:1px solid rgba(255,255,255,.11); background:rgba(8,10,19,.985); box-shadow:0 24px 70px rgba(0,0,0,.55); backdrop-filter:blur(18px); }
.language-option-form { margin:0; }
.language-option { width:100%; min-height:44px; padding:0 10px; display:grid; grid-template-columns:24px 1fr auto; align-items:center; gap:9px; border:0; background:transparent; color:#c6c9d2; text-align:left; cursor:pointer; }
.language-option:hover,.language-option.active { background:rgba(255,255,255,.055); color:#fff; }
.language-option.active { box-shadow:inset 2px 0 0 var(--gold); }
.language-name { font-size:10px; font-weight:700; }
.language-region { color:#626775; font-size:7px; font-weight:800; letter-spacing:.12em; }
.footer-disclaimer { max-width:900px; padding:0 0 20px; color:#555966; font-size:9px; line-height:1.75; text-align:center; }
.footer-legal-links { padding:0 0 18px; display:flex; justify-content:center; flex-wrap:wrap; gap:18px; }
.footer-legal-links a { color:#777b88; font-size:8px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.footer-legal-links a:hover { color:var(--gold-light); }

@media (max-width:1040px) {
    .language-picker summary { width:48px; min-width:48px; padding:0; }
    .language-code { display:none; }
}
@media (max-width:780px) {
    .language-picker summary { height:44px; }
    .language-menu { right:-52px; width:min(245px,calc(100vw - 30px)); }
}

html:lang(th) body,
html:lang(th) button { font-family:'Noto Sans Thai',var(--sans); }
html:lang(th) h1,
html:lang(th) h2,
html:lang(th) h3,
html:lang(th) .btn,
html:lang(th) .main-nav a { font-family:'Noto Sans Thai',var(--display); letter-spacing:0; }
html:lang(zh) body,
html:lang(zh) button { font-family:'Noto Sans TC',var(--sans); }
html:lang(zh) h1,
html:lang(zh) h2,
html:lang(zh) h3,
html:lang(zh) .btn,
html:lang(zh) .main-nav a { font-family:'Noto Sans TC',var(--display); letter-spacing:.01em; }