
  
  :root {
    --night: #0B0D12; --panel: #151A22; --panel-2: #181C25; --panel2: #1C222C; --ink: #F6F2E9; --dim: #A3AAB6; --line: #262B36; --line2: #2C3340;
    --maple: #E0452B; --meso: #F2B53A; --wood: #8A5A2B; --wood-dark: #5B3A1A; --parch: #F3E3C0;
    --display: 'Montserrat', 'Arial Black', system-ui, sans-serif;
    --body: 'IBM Plex Sans KR', '苹果 SD Gothic Neo', system-ui, sans-serif;
    --pixel: 'Silkscreen', ui-monospace, monospace;
  }
  * { box-sizing: border-box; }
  html { background: var(--night); }
  body { background: var(--night); color: var(--ink); font-family: var(--body); margin: 0; overflow-x: hidden;
    
    display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
  body > .foot { margin-top: auto; }
  img { image-rendering: pixelated; max-width: 100%; }

  .nav { position: fixed; top: 0; left: 0; right: 0; z-index: 50; padding: calc(env(safe-area-inset-top, 0px) + 10px) 16px 10px; display: flex; align-items: center; gap: 18px;
    background: linear-gradient(rgba(11,13,18,.8), rgba(11,13,18,0)); }
  .brand { font: 900 18px var(--display); letter-spacing: .04em; display: flex; align-items: center; gap: 8px; }
  .brand img { width: 24px; height: 24px; }
  .menu { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; flex: 1; }
  
  .menu a { font: 700 15px var(--display); letter-spacing: .08em; color: #D6D4F0; white-space: nowrap; text-decoration: none;
    display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border-radius: 10px; transition: color .12s, background .12s; }
  .menu a:hover { color: var(--ink); background: rgba(255,255,255,.08); }
  .menu a:focus-visible { outline: 2px solid var(--meso); outline-offset: 1px; }
  .notes-toggle { font: 600 12px var(--body); color: var(--night); background: var(--meso); border: 0; border-radius: 999px; padding: 7px 12px; cursor: pointer; white-space: nowrap; }

  
  .hero { position: relative; height: 100svh; min-height: 560px; overflow: hidden; background: #000; }
  .hero video, .hero .poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .hero video { opacity: 0; transition: opacity .6s; }
  .hero.play video { opacity: 1; }
  .flash { position: absolute; inset: 0; background: #fff; opacity: 0; pointer-events: none; }
  .flash.go { animation: flash .9s ease-out; }
  @keyframes flash { 0% { opacity: 0; } 15% { opacity: 1; } 100% { opacity: 0; } }

  
  .intro { position: absolute; inset: 0; display: grid; place-items: center; background: #000; transition: opacity .5s; z-index: 5; }
  .intro.gone { opacity: 0; pointer-events: none; }
  
  .panelbox { width: calc(201px * var(--s, 2)); height: calc(332px * var(--s, 2)); margin: 0 auto; }
  .panel { position: relative; width: 201px; height: 332px; transform: scale(var(--s, 2)); transform-origin: top left; image-rendering: pixelated; }
  .panel > img { position: absolute; left: 0; top: 0; }
  .panel .num { position: absolute; width: 20px; text-align: center; font: 700 10px/1 Tahoma, Verdana, sans-serif; color: #3A2410; }
  .panel .arw { position: absolute; }
  .panel .pts { position: absolute; left: 118px; top: 176px; width: 62px; text-align: center; font: 400 22px/1 Tahoma, Verdana, sans-serif; color: #1a1208; }
  .panel .nm { position: absolute; left: 30px; top: 90px; font: 700 10px/1 Tahoma, Verdana, sans-serif; color: #FFF1D6; }
  .panel .bt { position: absolute; top: 289px; transition: transform .08s, filter .08s; }
  .panel .bt.press, .panel .arw.press { transform: translateY(1px); filter: brightness(1.35); }
  
  .title { position: absolute; left: 0; right: 0; top: 11%; text-align: center; padding-inline: 16px; opacity: 0; transform: translateY(16px); transition: opacity .9s, transform .9s; z-index: 3; }
  .title.on { opacity: 1; transform: none; }
  .title::before { content: ''; position: absolute; left: 50%; top: -6%; width: min(1100px, 130vw); height: 118%; transform: translateX(-50%); z-index: -1;
    background: radial-gradient(closest-side, rgba(10, 10, 30, .72), rgba(10, 10, 30, .45) 60%, rgba(10, 10, 30, 0)); pointer-events: none; }
  .title .count small { opacity: 1; color: #F3E3C0; }
  .title .dates span { opacity: 1; color: #E9E3D2; }
  .countlabel { margin: 18px 0 -12px; font: 600 13px var(--body); color: #F3E3C0; }
  
  .when { display: grid; grid-template-columns: repeat(2, minmax(0, 250px)); justify-content: center; gap: 12px; margin: 18px auto 0; max-width: 560px; }
  .slot { display: grid; gap: 3px; padding: 12px 16px; border-radius: 14px; background: rgba(10, 10, 30, .62); border: 1px solid rgba(243, 227, 192, .28); text-align: center; }
  .slot .lab { font: 700 12px var(--body); color: #F3E3C0; }
  .slot b { font: 800 19px/1.2 var(--display); color: #fff; }
  .slot .tm { font: 700 14px var(--display); color: #F6F2E9; }
  .slot .ref { font: 600 12px/1.45 var(--body); color: #CFC8B6; white-space: pre-line; }
  .slot.founder .tm { color: #2A1A08; }
  .slot.founder { background: #F2B53A; border-color: #F2B53A; }
  
  .slot:not(.founder) { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  @media (min-width: 1024px) {
    .when { grid-template-columns: repeat(2, minmax(0, 290px)); gap: 16px; max-width: 620px; }
    .slot { padding: 16px 24px; gap: 4px; }
    .slot:not(.founder) { border-color: rgba(243, 227, 192, .4); }
    .slot .lab { font-size: 12px; } .slot b { font-size: 24px; } .slot .tm { font-size: 16px; } .slot .ref { font-size: 13px; }
    .title .count b { font-size: clamp(30px, 5vw, 72px); }
    .title .cta .btn { font-size: 14px; padding: 14px 24px; }
  }
  .slot.founder .lab { color: #3A2410; } .slot.founder b { color: #14100a; } .slot.founder .ref { color: #3A2410; font-weight: 700; }
  .est { margin: 10px auto 0; max-width: 46ch; font-size: 12px; line-height: 1.45; color: #D9D2C0; text-shadow: 0 0 16px rgba(10,10,30,.9); }
  @media (max-width: 560px) { .when { grid-template-columns: minmax(0, 1fr); max-width: 320px; gap: 8px; } .slot { padding: 10px 14px; } .slot b { font-size: 16px; } }
  .tag { font: 800 clamp(40px, 6.7vw, 96px)/1 var(--display); letter-spacing: -.015em; margin: 0; text-wrap: balance; text-shadow: 0 4px 24px rgba(0,0,0,.7), 0 0 50px rgba(18,12,48,.7); }
  .vh { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
  .count { display: inline-flex; gap: clamp(12px, 2.6vw, 30px); margin-top: 22px; font-variant-numeric: tabular-nums; }
  .count b { display: block; font: 800 clamp(30px, 5vw, 62px)/1 var(--display); text-shadow: 0 0 24px rgba(18,12,48,.7); }
  .count small { font: 10px var(--pixel); letter-spacing: .04em; opacity: .8; }
  .dates { margin-top: 12px; font-size: 14px; font-weight: 600; text-shadow: 0 0 20px rgba(18,12,48,.8); }
  .dates span { display: block; font-weight: 400; font-size: 12px; opacity: .85; }
  .cta { display: inline-flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; justify-content: center; }
  .btn { font: 800 13px var(--display); letter-spacing: .06em; padding: 12px 18px; border-radius: 999px; border: 0; cursor: pointer; }
  .btn.red { background: var(--maple); color: #fff; }
  .btn.ghost { background: rgba(10,10,30,.6); color: var(--ink); border: 1px solid rgba(255,255,255,.35); }
  .btn:focus-visible, .ctl:focus-visible { outline: 3px solid var(--meso); outline-offset: 2px; }
  .ctls { position: absolute; right: 16px; bottom: calc(80px + env(safe-area-inset-bottom, 0px)); display: flex; gap: 8px; z-index: 6; }   
  .ctl { font: 600 12px var(--body); color: var(--ink); background: rgba(11,13,18,.62); border: 1px solid rgba(255,255,255,.25); border-radius: 999px; padding: 7px 12px; cursor: pointer; }

  @media (max-width: 520px) { .brand { font-size: 16px; } .menu a { font-size: 12px; } .menu a:nth-child(n+3) { display: none; } }

  .note { max-width: 1180px; margin: 0 auto 20px; padding-inline: 16px; }
  .note div { background: #111827; border: 1px solid rgba(242,181,58,.45); border-radius: 12px; padding: 14px 16px; font-size: 13px; line-height: 1.6; }
  .note b { color: var(--meso); font-weight: 600; }
  body.hide-notes .note { display: none; }
  .foot { padding: 28px 16px calc(env(safe-area-inset-bottom, 0px) + 28px); font-size: 12px; color: var(--dim); text-align: center; border-top: 1px solid var(--line); }
  .cta-note { margin: 8px auto 0; max-width: 34em; font-size: 12px; line-height: 1.45; color: var(--dim); }
  
  @media (max-width: 640px) {
    .ctls { top: calc(env(safe-area-inset-top, 0px) + 52px); bottom: auto; }
    .ctl { padding: 5px 10px; font-size: 11px; }
    .title { top: calc(env(safe-area-inset-top, 0px) + 92px); }
    .notes-toggle { position: fixed; left: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 60; box-shadow: 0 2px 8px rgba(0,0,0,.4); }
  }
  @media (prefers-reduced-motion: reduce) { .hero video { display: none; } .intro { display: none; } .title { opacity: 1; transform: none; } }
  
  .mbtn { display: none; }
  @media (max-width: 640px) {
    .nav { gap: 10px; }
    .nav .menu { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0; padding: 6px 12px 12px; background: rgba(9,11,17,.98); border-bottom: 1px solid var(--line); box-shadow: 0 14px 30px rgba(0,0,0,.5); }
    .nav.open .menu { display: flex; }
    .nav .menu a, .nav .menu a:nth-child(n+3) { display: block; font: 700 15px var(--display); letter-spacing: .02em; padding: 14px 12px; border-radius: 10px; color: var(--ink); }
    .nav .menu a + a { border-top: 1px solid rgba(255,255,255,.06); }
    .nav .menu a[aria-current="page"] { color: #FFD27A; background: rgba(242,181,58,.08); }
    .mbtn { display: inline-grid; place-items: center; margin-left: auto; width: 38px; height: 38px; border-radius: 10px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.05); color: #fff; cursor: pointer; padding: 0; }
    .mbtn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
    .mbtn i, .mbtn i::before, .mbtn i::after { display: block; width: 18px; height: 2px; border-radius: 2px; background: currentColor; position: relative; transition: transform .18s, background .18s; }
    .mbtn i::before, .mbtn i::after { content: ""; position: absolute; left: 0; } .mbtn i::before { top: -6px; } .mbtn i::after { top: 6px; }
    .nav.open .mbtn i { background: transparent; } .nav.open .mbtn i::before { transform: translateY(6px) rotate(45deg); } .nav.open .mbtn i::after { transform: translateY(-6px) rotate(-45deg); }
  }
  @media (max-width: 640px) and (prefers-reduced-motion: reduce) { .mbtn i, .mbtn i::before, .mbtn i::after { transition: none; } }
  
  html { scrollbar-width: thin; scrollbar-color: transparent transparent; transition: scrollbar-color .3s; }
  html.sb-on { scrollbar-color: #C99A3A transparent; }
  html::-webkit-scrollbar { width: 10px; background: transparent; }
  html::-webkit-scrollbar-track { background: transparent; }
  html::-webkit-scrollbar-thumb { background: transparent; border-radius: 999px; border: 3px solid transparent; background-clip: padding-box; }
  html.sb-on::-webkit-scrollbar-thumb { background: #C99A3A; background-clip: padding-box; }
  html.sb-on::-webkit-scrollbar-thumb:hover { background: #E3A11C; background-clip: padding-box; }
  
  @media (min-width: 901px) {
    header.nav { padding-top: calc(env(safe-area-inset-top, 0px) + 16px); padding-bottom: 16px; gap: 28px; background: linear-gradient(rgba(11,13,18,.94), rgba(11,13,18,.55) 70%, rgba(11,13,18,0)); }
    header.nav .brand { font-size: 30px; gap: 12px; } header.nav .brand img { width: 42px; height: 42px; }
    header.nav .menu { gap: 8px; }
    header.nav .menu a { font-size: 21px; font-weight: 800; color: #ECEAFF; min-height: 54px; padding: 0 20px; border-radius: 12px; text-shadow: 0 1px 6px rgba(0,0,0,.6); }
    header.nav .menu a:hover { background: rgba(255,255,255,.12); color: #FFD27A; }
    header.nav .gs { flex: 1 1 520px; min-width: 200px; } header.nav .menu { flex: none; overflow: visible; } header.nav .brand { flex: none; }
    header.nav .gs input { height: 54px; font-size: 17px; padding-left: 50px; }
    header.nav .gs .mag { width: 20px; height: 20px; left: 18px; }
    header.nav .signin { font-size: 17px; padding: 14px 22px; }
  }
  
  .countlabel { margin: 14px 0 -10px; font: 600 13px var(--body); color: #D5D3E4; }
  .count small { font: 700 10px var(--body); color: #A3AAB6; opacity: 1; text-shadow: 0 1px 3px rgba(11,13,18,.95); }
  .title .count small { color: #D5D3E4; }
  .count > div { display: flex; flex-direction: column; align-items: center; }
  .when { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 620px; gap: 8px; }
  .slot { gap: 1px; padding: 10px 12px; border-radius: 12px; text-align: left; background: rgba(12,15,22,.85); border: 1px solid rgba(255,255,255,.14); }
  .slot .lab { font: 700 12px var(--body); color: #C9C6E4; }
  .slot b { font: 800 17px/1.3 var(--display); }
  .slot .tm { font: 600 12px/1.4 var(--body); color: #D5D3E4; }
  .slot .ref { font: 400 12px/1.4 var(--body); color: #D5D3E4; }
  .slot.founder { background: #F2B53A; border-color: #C98A1A; }
  .slot.founder .lab { color: #5A4308; } .slot.founder b { color: #15120A; } .slot.founder .tm, .slot.founder .ref { color: #3A2E10; font-weight: 600; }
  .est { font-size: 11.5px; max-width: 52ch; display: table; padding: 3px 12px; border-radius: 999px; background: rgba(11,13,18,.62); }   
  
  .cta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: 100%; max-width: 460px; margin: 14px auto 0; }
  @media (min-width: 900px) { .cta { max-width: 580px; gap: 10px; } }
  .btn { word-break: keep-all; display: inline-flex; align-items: center; justify-content: center; min-height: 32px; padding: 6px 13px; border-radius: 999px; font: 800 12px/1.2 var(--display); letter-spacing: .02em; text-align: center; }
  .btn.gold { background: #F2B53A; color: #15120A; border: 1px solid #C98A1A; }
  .btn.gold:hover { background: #FFC24D; }
  .btn.ghost { background: rgba(255,255,255,.05); color: #F6F2E9; border: 1px solid rgba(255,255,255,.16); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
  .btn.ghost:hover { background: rgba(255,255,255,.1); }
  @media (min-width: 1024px) {
    .title .count b { font-size: clamp(40px, 5vw, 72px); }
    .when { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 620px; gap: 10px; }
    .slot { padding: 10px 14px; gap: 2px; } .slot .lab { font-size: 12px; } .slot b { font-size: 19px; } .slot .tm, .slot .ref { font-size: 12.5px; }
    .title .cta .btn { font-size: 13px; padding: 8px 16px; min-height: 36px; }
  }
  
  @media (min-width: 901px) and (max-width: 1279px) {
    header.nav { gap: 16px; } header.nav .brand { font-size: 24px; flex: none; } header.nav .brand img { width: 34px; height: 34px; }
    header.nav .menu { flex: none; overflow: visible; } header.nav .menu a { font-size: 16px; padding: 0 12px; min-height: 46px; }
    header.nav .gs { flex: 1 1 220px; min-width: 160px; } header.nav .gs input { height: 46px; font-size: 15px; }
    header.nav .signin { font-size: 15px; padding: 11px 16px; } header.nav .signin .lg { display: none; } header.nav .signin .sm { display: inline; }
  }
  @media (min-width: 641px) and (max-width: 900px) {
    header.nav { gap: 10px; } header.nav .brand { flex: none; }
    header.nav .menu { flex: none; overflow: visible; gap: 0; } header.nav .menu a { font-size: 13px; letter-spacing: .04em; padding: 0 8px; }
    header.nav .gs { flex: 1 1 160px; min-width: 120px; }
    header.nav .signin .lg { display: none; } header.nav .signin .sm { display: inline; }
  }
  
  @media (max-width: 640px) {
    header.nav { background: rgba(11,13,18,.92); border-bottom: 1px solid rgba(255,255,255,.08); padding-top: calc(env(safe-area-inset-top, 0px) + 9px); padding-bottom: 9px; }
    .hero { height: calc(env(safe-area-inset-top, 0px) + 616px); min-height: 0; }
    .title { top: auto; bottom: 16px; }
    .title::before { display: none; }
    .countlabel { margin: 10px 0 -14px; font-size: 12px; }
    .count { gap: 18px; margin-top: 18px; }
    .title .count b { font-size: 40px; }
    .when { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: none; gap: 8px; margin-top: 12px; }
    .slot { padding: 10px 12px; } .slot b { font-size: 16px; }
    .est { margin-top: 8px; font-size: 11px; }
    .cta { margin-top: 12px; }
    .ctls { top: calc(env(safe-area-inset-top, 0px) + 66px); }
    :lang(en) .tag { font-size: min(40px, 9vw); }
    header.nav .mbtn { order: 4; margin-left: 0; flex: none; } header.nav .signin { order: 3; } header.nav .brand { flex: none; }
  }

  
  :root { --xsky1: #223247; --xparch: #171d26; --xparch2: #1f2733; --xslot: #262f3c; --xwoodd: #3b4756; --xwoodl: #2a3340; --xink: #e7edf4; --xdim: #9aa8b6; --xdim2: #74828f; --xline: #232b36;
    --xmeso: #E79A12; --xmesod: #ffc250; --xgood: #3fb565; --xhigh: #e0603d; --xhead: #eef3f8; --xk: #ffcf6b; --xshadow: #0a0e13; --xfeed: #141a22; --xhover: #1e2733;
    --xm: 'Jua', system-ui, sans-serif; --xb: 'Gowun Dodum', '苹果 SD Gothic Neo', system-ui, sans-serif; }
  html[data-theme="light"] { --xsky1: #CFEBFF; --xparch: #FCF5E4; --xparch2: #F4E7C8; --xslot: #EFE1BE; --xwoodd: #875A28; --xwoodl: #E4C58A; --xink: #43321F; --xdim: #735D3D; --xdim2: #9b8460;
    --xline: #EADCB6; --xmesod: #8F5B06; --xgood: #2F9E51; --xhigh: #C0411F; --xhead: #3A2A18; --xk: #8F5B06; --xshadow: #ddc488; --xfeed: #fff; --xhover: #fff7e3; color-scheme: light; }
  html[data-theme="light"], html[data-theme="light"] body { background: #F2EDDC; color: var(--xink); }
  .hx { box-sizing: border-box; width: 100%; max-width: 1120px; margin: 0 auto; padding: calc(env(safe-area-inset-top, 0px) + 78px) 18px 48px; display: flex; flex-direction: column; gap: 16px;
    color: var(--xink); font: 400 14px/1.6 var(--xb); word-break: keep-all; }
  .hx a { color: inherit; text-decoration: none; }
  .hx .vh { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .hx .card { background: var(--xparch); border: 2px solid var(--xwoodl); border-radius: 16px; box-shadow: 0 2px 0 var(--xshadow); overflow: hidden; min-width: 0; }
  .hx .sect { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 18px 0; }
  .hx .sect h2 { margin: 0; font: 400 19px/1.3 var(--xm); color: var(--xhead); letter-spacing: 0; }
  .hx .sect h2 .k { color: var(--xk); }
  .hx .more { font: 400 13px var(--xm); color: var(--xdim); flex: none; } .hx .more:hover { color: var(--xk); }
  .hx .sdesc { margin: 0; padding: 4px 18px 0; color: var(--xdim); font-size: 12.5px; }
  .hx .row2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
  
  .hx-hero { position: relative; border-radius: 16px; overflow: visible; border: 2px solid var(--xwoodd); box-shadow: 0 3px 0 #c7a24a; background: #0b1320 url("https://gmsimg.planet-helper.com/hero/home_hero.webp") center right / cover no-repeat;
    min-height: 260px; padding: 24px 26px; display: flex; align-items: center; z-index: 3; }
  .hx-hero::before { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: 14px; background: linear-gradient(90deg, rgba(8,12,22,.92) 0%, rgba(8,12,22,.62) 42%, rgba(8,12,22,0) 70%); }
  .hx-hero .in2 { position: relative; z-index: 2; width: 100%; max-width: 560px; }
  .hx-hero .tag { display: inline-flex; align-items: center; gap: 7px; font: 400 12.5px var(--xm); color: #ffe6a6; background: rgba(0,0,0,.42); border: 1px solid rgba(231,154,18,.55); border-radius: 999px; padding: 4px 12px; }
  .hx-hero .hx-qk { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
  .hx-hero .hx-hs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
  .hx-hero .hx-hs .hl { font: 400 12.5px var(--xm); color: #ffe6a6; margin-right: 2px; }
  .hx-hero .hx-hs a { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border-radius: 999px; background: rgba(0,0,0,.42); border: 1px solid rgba(231,154,18,.55); color: #fff; font: 400 13px var(--xb); text-decoration: none; }
  .hx-hero .hx-hs a:hover, .hx-hero .hx-hs a:focus-visible { background: rgba(231,154,18,.28); }
  .hx-hero .hx-nu { margin: 0; font: 400 13px var(--xb); color: #e8eef5; }
  .hx-hero .hx-nu:empty { display: none; }
  .hx-hero .hx-nu .k { font: 400 12.5px var(--xm); color: #ffe6a6; margin-right: 4px; }
  .hx-hero .hx-nu a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
  .hx-hero .hx-nu .hx-cd { color: #ffcf6b; margin-left: 6px; font-weight: 700; }
  @media (max-width: 640px) { .hx-hero .hx-hs a:nth-of-type(n+5) { display: none; } }
  .hx-hero .dotlive { width: 8px; height: 8px; border-radius: 50%; background: #2F9E51; box-shadow: 0 0 0 3px rgba(47,158,81,.3); }
  .hx-hero .ttl { margin: 9px 0 0; font: 400 30px/1.14 var(--xm); color: #fff; text-shadow: 0 2px 7px rgba(0,0,0,.7); }
  .hx-hero .lead { margin: 7px 0 0; color: #dde7f0; font-size: 13px; max-width: 440px; text-shadow: 0 1px 4px rgba(0,0,0,.65); }
  .hx .hm-dbs { position: relative; margin: 16px 0 0; max-width: 560px; color: #9b8460; }
  .hx .hm-dbs .mag { position: absolute; z-index: 1; left: 15px; top: 50%; width: 19px; height: 19px; transform: translateY(-50%); pointer-events: none; }
  .hx .hm-dbs input { box-sizing: border-box; width: 100%; height: 48px; border-radius: 13px; border: 2px solid #E4C58A; background: #fff; box-shadow: 0 3px 0 #ddc488;
    color: #43321F; font: 15px var(--xb); padding: 0 16px 0 44px; -webkit-appearance: none; appearance: none; text-overflow: ellipsis; }
  .hx .hm-dbs input::placeholder { color: #9b8460; } .hx .hm-dbs input::-webkit-search-cancel-button { display: none; }
  .hx .hm-dbs input:focus { outline: 2px solid #E79A12; outline-offset: 1px; }
  
  .hx .tabs { display: flex; gap: 7px; padding: 12px 18px 0; }
  .hx .tabs > * { display: inline-flex; align-items: center; height: 36px; padding: 0 15px; border-radius: 11px; border: 2px solid var(--xwoodl); background: var(--xparch2); color: var(--xdim); font: 400 14px var(--xm); box-shadow: 0 2px 0 var(--xshadow); }
  .hx .tabs .on { background: linear-gradient(180deg, #FFD36B, #F2A51C); border-color: #B0710A; color: #5a3b06; box-shadow: 0 2px 0 #c9820b; }
  .hx .tabs a:hover { color: var(--xk); }
  .hx .state { display: flex; align-items: center; gap: 7px; margin: 11px 18px 0; padding: 8px 13px; border-radius: 10px; font-size: 12px; background: #15241b; border: 1px solid #2b4635; color: #86cf9c; }
  .hx .state[hidden] { display: none; }
  html[data-theme="light"] .hx .state { background: #EAF3E8; border-color: #C6E0C0; color: #2f6b3a; }
  .hx .state.late { background: #2a2414; border-color: #5a4a1e; color: #f0cf7a; } html[data-theme="light"] .hx .state.late { background: #FFF6DA; border-color: #EAD48F; color: #7a5a06; }
  .hx .state .sd { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; } .hx .state b { white-space: nowrap; }
  .hx .feed { list-style: none; margin: 12px 14px 14px; padding: 0; background: var(--xfeed); border: 1px solid var(--xline); border-radius: 12px; overflow: hidden; }
  .hx .feed li + li { border-top: 1px solid var(--xline); }
  @media (max-width: 860px) { .hx #hxFm:empty { min-height: 530px; } }   
  .hx .lr { display: flex; align-items: center; gap: 11px; padding: 10px 12px; } .hx .lr:hover { background: var(--xhover); }
  .hx .ico { width: 38px; height: 38px; flex: none; border-radius: 9px; background: var(--xslot); border: 1px solid var(--xwoodl); display: grid; place-items: center; overflow: hidden; }
  .hx .ico img { width: 31px; height: 31px; object-fit: contain; image-rendering: auto; }
  .hx .lr .l { flex: 1; min-width: 0; display: grid; }
  .hx .lr .t { font-size: 14px; color: var(--xink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .hx .lr .t .hb { font: 400 10.5px var(--xm); color: #8a5a06; background: linear-gradient(180deg, #FFE08A, #F2C24A); border: 1px solid #B0710A; border-radius: 5px; padding: 0 6px; margin-right: 5px; }
  .hx .lr .t .hb.buy { color: #1d4f8f; background: #dce9fb; border-color: #9cbbe6; }
  .hx .lr .o { font-size: 11.5px; color: var(--xdim2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .hx .lr .pr { flex: none; text-align: right; min-width: 78px; display: grid; }
  .hx .lr .pr .v { font: 400 16px var(--xm); color: var(--xmesod); font-variant-numeric: tabular-nums; white-space: nowrap; }
  .hx .lr .pr .cmp { font-size: 11px; color: var(--xdim2); white-space: nowrap; } .hx .lr .pr .cmp.low { color: var(--xgood); } .hx .lr .pr .cmp.hi { color: var(--xhigh); }
  
  .hx .tl { list-style: none; margin: 0; padding: 11px 18px 16px; }
  .hx .tl li { display: flex; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--xline); } .hx .tl li:last-child { border-bottom: 0; }
  .hx .tl .d { flex: none; width: 50px; font: 400 12px var(--xm); color: var(--xmesod); font-variant-numeric: tabular-nums; padding-top: 1px; }
  .hx .tl .b { min-width: 0; display: grid; } .hx .tl .ti { font-size: 13.5px; color: var(--xink); }
  .hx .tg { display: inline-block; font: 400 10.5px var(--xm); border-radius: 6px; padding: 1px 7px; margin-right: 6px; vertical-align: 1px; }
  .hx .tg.ev { color: #2f6b3a; background: #dff0da; border: 1px solid #bfe0b4; } .hx .tg.up { color: #8a5a06; background: #fcefd2; border: 1px solid #ecd9a4; }
  .hx .tl .sub { font-size: 11.5px; color: var(--xdim2); margin-top: 1px; }
  
  .hx .hw-pin { --hwp: #221A3D; --hwl: #4C3F75; --hwink: #F3E9D2; --hwdim: #BBAED0; --hwbig: #FFA14A; --hwslot: #2E2550; --hwslotl: #5B4C86; --hws: #0a0e13;
    margin: 12px 14px 2px; padding: 12px 13px 13px; background: var(--hwp); border: 1px solid var(--hwl); border-radius: 12px; color: var(--hwink); display: grid; gap: 10px; }
  html[data-theme="light"] .hx .hw-pin { --hwp: #FFF3E0; --hwl: #D98A3A; --hwink: #43321F; --hwdim: #7A5A33; --hwbig: #D4611B; --hwslot: #FFE7C4; --hwslotl: #E9B477; --hws: #E1B274; }
  .hx .hw-pin:empty { display: none; }
  .hx .hw-pin p { margin: 0; }
  .hx .hw-hd { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 0 11px; align-items: center; }
  .hx .hw-npc { width: 40px; height: 55px; object-fit: contain; object-position: bottom; }
  .hx .hw-t { min-width: 0; } .hx .hw-t b { display: block; font: 400 17px/1.25 var(--xm); color: var(--hwink); }
  .hx .hw-t span { display: block; font-size: 11.5px; color: var(--hwdim); margin-top: 2px; font-variant-numeric: tabular-nums; }
  .hx .hw-dd { text-align: right; white-space: nowrap; } .hx .hw-dd b { display: block; font: 400 24px/1 var(--xm); color: var(--hwbig); font-variant-numeric: tabular-nums; }
  .hx .hw-dd small { display: block; font-size: 11px; color: var(--hwdim); margin-top: 4px; font-variant-numeric: tabular-nums; }
  .hx .hw-l { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13px; line-height: 1.55; }
  .hx .hw-l li { display: flex; gap: 8px; text-wrap: pretty; } .hx .hw-l li::before { content: "✓"; flex: none; font: 400 12px var(--xm); color: var(--hwbig); margin-top: 1px; }
  .hx .hw-pin .ico { background: var(--hwslot); border-color: var(--hwslotl); }
  .hx .hw-it { display: flex; align-items: center; gap: 10px; padding: 7px 9px; border-radius: 10px; background: var(--hwslot); border: 1px solid var(--hwslotl); }
  .hx .hw-it .ico { background: var(--hwp); } .hx .hw-it:hover { border-color: var(--hwbig); }
  .hx .hw-it .l { min-width: 0; display: grid; } .hx .hw-it b { font: 400 14.5px/1.3 var(--xm); color: var(--hwink); } .hx .hw-it small { font-size: 11.5px; line-height: 1.45; color: var(--hwdim); text-wrap: pretty; }
  .hx .hw-dr { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 11.5px; color: var(--hwdim); }
  .hx .hw-dr .ico { width: 30px; height: 30px; border-radius: 7px; } .hx .hw-dr .ico img { width: 24px; height: 24px; } .hx .hw-dr .ico:hover { border-color: var(--hwbig); }
  .hx .hw-dr span { margin-left: 3px; }
  .hx .hw-acts { display: flex; gap: 8px; flex-wrap: wrap; }
  .hx .hw-btn { display: inline-flex; align-items: center; justify-content: center; height: 34px; padding: 0 14px; border-radius: 10px; border: 2px solid var(--hwslotl); background: var(--hwslot); color: var(--hwink); font: 400 13.5px var(--xm); box-shadow: 0 2px 0 var(--hws); white-space: nowrap; }
  .hx .hw-btn.p { border-color: #B4500A; background: linear-gradient(180deg, #FFB15C, #F08A24); color: #3A1A05; box-shadow: 0 2px 0 #B4500A; }
  .hx .hw-btn:hover { border-color: #F08A24; }
  .hx .hw-t i, .hx .hw-it small i { font-style: normal; white-space: nowrap; }
  @media (max-width: 860px) { .hx .hw-btn { flex: 1 1 auto; } }
  @media (max-width: 520px) { .hx .hw-dd small { white-space: normal; max-width: 96px; margin-left: auto; text-wrap: balance; } }
  
  .hx .mt-pin { --mtp: #13202D; --mtl: #2F4C68; --mtink: #E7EEF6; --mtdim: #9DB2C7; --mtbig: #7CC7FF; --mtslot: #1B2D3F; --mts: #0a0e13;
    margin: 12px 14px 2px; padding: 12px 13px 13px; background: var(--mtp); border: 1px solid var(--mtl); border-radius: 12px; color: var(--mtink); display: grid; gap: 10px; }
  html[data-theme="light"] .hx .mt-pin { --mtp: #EDF5FC; --mtl: #9CC0E2; --mtink: #1D3245; --mtdim: #4F6A83; --mtbig: #1F6FB5; --mtslot: #DCEAF7; --mts: #A9C6E2; }
  .hx .mt-pin[hidden] { display: none; }
  .hx .mt-pin p { margin: 0; }
  .hx .mt-pin.on { --mtbig: #FF8A6B; --mtl: #6B3A33; } html[data-theme="light"] .hx .mt-pin.on { --mtbig: #C2412A; --mtl: #E2A597; --mtp: #FDF1EE; --mtslot: #F8DED7; }
  .hx .mt-pin.end { --mtbig: #6FD49A; } html[data-theme="light"] .hx .mt-pin.end { --mtbig: #1F8A4C; }
  .hx .mt-hd { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 0 11px; align-items: center; }
  .hx .mt-ic { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--mtslot); border: 1px solid var(--mtl); color: var(--mtbig); }
  .hx .mt-ic svg { width: 22px; height: 22px; }
  .hx .mt-t { min-width: 0; } .hx .mt-t b { display: block; font: 400 17px/1.25 var(--xm); color: var(--mtink); text-wrap: balance; }
  .hx .mt-t i, .hx .mt-when i { font-style: normal; white-space: nowrap; }
  .hx .mt-when { font-size: 12px; color: var(--mtdim); font-variant-numeric: tabular-nums; margin-top: -3px; }
  .hx .mt-st { display: inline-block; font: 400 10.5px var(--xm); border-radius: 6px; padding: 1px 7px; margin-right: 6px; vertical-align: 2px; color: var(--mtp); background: var(--mtbig); }
  .hx .mt-dd { text-align: right; white-space: nowrap; } .hx .mt-dd b { display: block; font: 400 24px/1 var(--xm); color: var(--mtbig); font-variant-numeric: tabular-nums; }
  .hx .mt-dd small { display: block; font-size: 11px; color: var(--mtdim); margin-top: 4px; }
  .hx .mt-bar { height: 6px; border-radius: 6px; background: var(--mtslot); overflow: hidden; } .hx .mt-bar i { display: block; height: 100%; background: var(--mtbig); border-radius: 6px; }
  .hx .mt-l { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13px; line-height: 1.55; }
  .hx .mt-l li { display: flex; gap: 8px; text-wrap: pretty; } .hx .mt-l li::before { content: "✓"; flex: none; font: 400 12px var(--xm); color: var(--mtbig); margin-top: 1px; }
  .hx .mt-acts { display: flex; gap: 8px; flex-wrap: wrap; }
  .hx .mt-btn { display: inline-flex; align-items: center; justify-content: center; height: 34px; padding: 0 14px; border-radius: 10px; border: 2px solid var(--mtl); background: var(--mtslot); color: var(--mtink); font: 400 13.5px var(--xm); box-shadow: 0 2px 0 var(--mts); white-space: nowrap; }
  .hx .mt-btn:hover { border-color: var(--mtbig); }
  @media (max-width: 860px) { .hx .mt-btn { flex: 1 1 auto; } }
  
  .hx .sact { display: flex; align-items: center; gap: 12px; flex: none; }
  .hx .gmo { height: 30px; padding: 0 11px; border-radius: 9px; border: 2px solid var(--xwoodl); background: var(--xparch2); color: var(--xhead); font: 400 12.5px var(--xm); box-shadow: 0 2px 0 var(--xshadow); cursor: pointer; white-space: nowrap; }
  .hx .gmo:hover, .hx .gmo[aria-expanded="true"] { border-color: #E79A12; } .hx .gmo.on { border-color: #E79A12; color: var(--xk); }
  .hx .gmo:focus-visible, .hx .gmp .gsw:focus-visible { outline: 2px solid #E79A12; outline-offset: 2px; }
  .hx .gmp { margin: 12px 14px 2px; padding: 4px 13px 6px; border: 1px solid var(--xwoodl); border-radius: 12px; background: var(--xparch2); }
  .hx .gmp[hidden] { display: none; }
  .hx .gmp .gl { margin: 8px 0; font-size: 12.5px; line-height: 1.55; color: var(--xdim); text-wrap: pretty; } .hx .gmp .gl a { color: var(--xk); text-decoration: underline; }
  .hx .gmp .gr { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--xline); font-size: 13.5px; color: var(--xink); }
  .hx .gmp .gr small { display: block; font-size: 11.5px; color: var(--xdim2); }
  .hx .gmp .gsw { position: relative; flex: none; width: 46px; height: 28px; border-radius: 999px; border: 1px solid var(--xwoodl); background: var(--xparch); cursor: pointer; }
  .hx .gmp .gsw::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--xdim2); transition: transform .15s; }
  .hx .gmp .gsw[aria-checked="true"] { background: #F0A030; border-color: #C98E1C; } .hx .gmp .gsw[aria-checked="true"]::after { transform: translateX(18px); background: #fff; }
  @media (prefers-reduced-motion: reduce) { .hx .gmp .gsw::after { transition: none; } }
  .hx .gmp .glg { display: block; margin: 4px 0 8px; text-align: center; padding: 10px; border-radius: 10px; background: #5865F2; color: #fff; font: 400 13.5px var(--xm); }
  .hx .tg.gm { color: #6E4700; background: #FFE7A8; border: 1px solid #E2B24E; }
  .hx .tl li.gml .ti i { font-style: normal; white-space: nowrap; } .hx .tl li.gml.on .ti { font-weight: 700; } .hx .tl li.gml .sub b { color: var(--xk); font-weight: 400; }
  
  .hx .nw { margin: 0 0 4px; border-top: 1px dashed var(--xline); }
  .hx .nw[hidden] { display: none; }
  .hx .nw-h { display: flex; justify-content: space-between; align-items: baseline; margin: 0; padding: 10px 18px 0; font: 400 13px var(--xm); color: var(--xdim); }
  .hx .nw-h a { font-size: 12px; color: var(--xdim); } .hx .nw-h a:hover { color: var(--xk); }
  .hx .nw .tl { padding-top: 4px; }
  .hx .tl .sub, .hx .tl .ti, .hx .lr .t { text-wrap: pretty; word-break: keep-all; overflow-wrap: anywhere; }
  .hx .tg.nw { color: #fff; background: #C0411F; border: 1px solid #A8361A; }
  .hx .tabs button { cursor: pointer; } .hx .pane[hidden] { display: none; }
  .hx .lr .loc { display: flex; align-items: center; gap: 9px; margin-top: 6px; }
  .hx .mini { position: relative; width: 78px; height: 46px; flex: none; border: 2px solid var(--xwoodd); border-radius: 7px; overflow: hidden; background: #CDEBFF url("https://gmsimg.planet-helper.com/hero/fm_map.webp") center 44% / cover no-repeat; }
  .hx .mini.p { background-image: url("https://gmsimg.planet-helper.com/hero/fm_map_p.webp"); background-position: center 0; image-rendering: pixelated; }
  .hx .mini .dot { position: absolute; width: 12px; height: 12px; border-radius: 50%; background: radial-gradient(circle at 38% 32%, #FFF0B0, #F2A51C); border: 2px solid #fff; box-shadow: 0 0 0 1.5px #B0710A; transform: translate(-50%, -50%); }
  .hx .lr .loc { min-width: 0; } .hx .mloc { display: grid; min-width: 0; overflow: hidden; line-height: 1.4; }
  .hx .mloc b { font: 400 12px var(--xm); color: var(--xmesod); white-space: nowrap; }
  .hx .mloc span { font-size: 11px; color: var(--xdim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .hx .mloc b { overflow: hidden; text-overflow: ellipsis; }
  .hx .lr .pr .when { font-size: 11px; color: var(--xdim2); white-space: nowrap; }
  @media (max-width: 480px) { .hx .mini { width: 54px; height: 34px; } .hx .lr .loc { gap: 7px; } .hx .lr .pr { min-width: 64px; } }
  .hx .nw .tl a.b { display: grid; min-width: 0; } .hx .nw .tl a.b:hover .ti { color: var(--xk); }
  .hx .nw .tl .ti { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .hx .nw .tl .sub { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .hx .tg.pt { color: #2c5aa8; background: #e3ecfb; border: 1px solid #c3d4f2; } .hx .tg.nt { color: #5B6472; background: #ECE9DE; border: 1px solid #D9D4C4; }
  
  .hx .nxhead { padding: 13px 18px 2px; } .hx .nxhead .big { font: 400 25px var(--xm); color: var(--xmesod); }
  .hx .tw { overflow-x: auto; margin-top: 6px; }
  .hx .nxt { width: 100%; border-collapse: collapse; font-size: 12.5px; }
  .hx .nxt th, .hx .nxt td { padding: 7px 18px; text-align: right; white-space: nowrap; }
  .hx .nxt th { font: 400 11.5px var(--xm); color: var(--xdim2); border-bottom: 1px solid var(--xline); }
  .hx .nxt th:first-child, .hx .nxt td:first-child { text-align: left; }
  .hx .nxt.xp th:nth-child(2), .hx .nxt.xp td:nth-child(2), .hx .nxt.xp td.mp, .hx .nxt.xp th:last-child { text-align: left; }
  .hx .nxt.xp th:first-child, .hx .nxt.xp td:first-child { padding-right: 4px; width: 1%; }
  .hx .nxt td { border-bottom: 1px solid var(--xline); font-variant-numeric: tabular-nums; color: var(--xdim); }
  .hx .nxt td:first-child, .hx .nxt.xp td:nth-child(2) { color: var(--xink); } .hx .nxt td a:hover { color: var(--xk); }
  .hx .nxt .eff { color: var(--xmesod); font-family: var(--xm); } .hx .nxt tr:last-child td { border-bottom: 0; }
  .hx .nxt td.mp { max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
  .hx .nxn { margin: 0; padding: 9px 18px 15px; font-size: 11px; color: var(--xdim2); }
  
  .hx .qgrid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 11px; }
  .hx .qc { display: grid; gap: 4px; background: var(--xparch); border: 2px solid var(--xwoodl); border-radius: 14px; box-shadow: 0 2px 0 var(--xshadow); padding: 15px 13px; text-align: center; }
  .hx .qc:hover { background: var(--xhover); border-color: #E79A12; }
  .hx .qc .qt { font: 400 15px var(--xm); color: var(--xhead); } .hx .qc .qd { font-size: 11px; color: var(--xdim2); line-height: 1.45; }
  
  .hx .rk { list-style: none; margin: 0; padding: 10px 18px 15px; }
  .hx .rk a { display: flex; gap: 9px; align-items: baseline; padding: 7px 0; border-bottom: 1px solid var(--xline); font-size: 13px; }
  .hx .rk li:last-child a { border-bottom: 0; } .hx .rk a:hover .nm { color: var(--xk); }
  .hx .rk .n { flex: none; width: 18px; height: 18px; border-radius: 5px; background: var(--xparch2); border: 1px solid var(--xline); font: 400 11px var(--xm); color: var(--xdim); display: grid; place-items: center; }
  .hx .rk .nm { flex: 1; min-width: 0; color: var(--xink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .hx .rk .lv { flex: none; color: var(--xdim2); font-size: 11px; font-family: var(--xm); }
  .hx .hposts { display: flex; flex-direction: column; padding: 10px 18px 15px; }
  .hx .hpost { display: flex; gap: 10px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--xline); font-size: 13px; min-width: 0; }
  .hx .hpost:last-child { border-bottom: 0; } .hx .hpost:hover b { color: var(--xk); }
  .hx .hpost .bd { flex: none; font: 400 10.5px var(--xm); color: #8a5a06; background: #fcefd2; border: 1px solid #ecd9a4; border-radius: 6px; padding: 1px 7px; white-space: nowrap; }
  .hx .hpost > span:nth-child(2) { flex: 1; min-width: 0; } .hx .hpost b { display: block; font-weight: 400; color: var(--xink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .hx .hpost .mt { flex: none; color: var(--xdim2); font-size: 11px; font-family: var(--xm); }
  .hx .hempty { margin: 0; padding: 6px 0; color: var(--xdim2); font-size: 13px; }
  
  .hx .seo { padding: 16px 6px 2px; border-top: 1px solid var(--xline); margin-top: 4px; }
  .hx .seo h3 { font: 400 13px var(--xm); color: var(--xdim); margin: 0 0 6px; } .hx .seo p { font-size: 11.5px; line-height: 1.75; margin: 0; color: var(--xdim2); }
  .hx .hm-ix { margin-top: 14px; } .hx .hm-ixg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px 24px; }
  .hx .hm-ixc { min-width: 0; } .hx .hm-ixc h3 { display: flex; justify-content: space-between; gap: 8px; font: 400 12px var(--xm); color: var(--xdim); margin: 0 0 4px; }
  .hx .hm-ixc h3 a { font: 400 11px var(--xb); color: var(--xdim2); } .hx .hm-ixc ul { list-style: none; margin: 0; padding: 0; }
  .hx .hm-ixc li { display: flex; justify-content: space-between; gap: 8px; font-size: 11.5px; line-height: 1.9; color: var(--xdim2); }
  .hx .hm-ixa { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .hx .hm-ixa:hover { color: var(--xk); }
  .hx .hm-ixc .lv { flex: none; font-size: 10.5px; } .hx .hm-ixc .lv:empty { display: none; }
  .hx a:focus-visible, .hx input:focus-visible { outline: 2px solid #FFD27A; outline-offset: 2px; }
  
  .hx-thm { flex: none; width: 38px; height: 36px; padding: 0; display: grid; place-items: center; border-radius: 10px; border: 1px solid rgba(255,255,255,.22); background: rgba(10,12,20,.55); cursor: pointer; }
  .hx-thm svg { width: 17px; height: 17px; stroke: #FFD36B; fill: none; stroke-width: 2.1; stroke-linecap: round; }
  .hx-thm .ic-moon { display: none; } html[data-theme="light"] .hx-thm .ic-moon { display: block; stroke: #735D3D; } html[data-theme="light"] .hx-thm .ic-sun { display: none; }
  .hx-thm:focus-visible { outline: 2px solid #FFD27A; outline-offset: 2px; }
  .ph-theme .hx-thm { display: none; }   
  header.nav { background: rgba(11,13,18,.97); border-bottom: 1px solid rgba(255,255,255,.06); }
  html[data-theme="light"] header.nav { background: rgba(252,245,228,.98); border-bottom: 2px solid #E4C58A; }
  html[data-theme="light"] header.nav .brand { color: #3A2A18; }
  html[data-theme="light"] header.nav .menu a, html[data-theme="light"] header.nav .menu a.top { color: #735D3D; text-shadow: none; }
  html[data-theme="light"] header.nav .menu a:hover, html[data-theme="light"] header.nav .menu a.top:hover { color: #43321F; background: #F4E7C8; }
  html[data-theme="light"] header.nav .menu .dd { color: #735D3D; }
  html[data-theme="light"] .nav .menu .dpanel { background: #FCF5E4; border-color: #E4C58A; box-shadow: 0 22px 50px rgba(120,90,40,.25); }
  html[data-theme="light"] .nav .menu .dpanel a.sb-i { color: #5b4527; } html[data-theme="light"] .nav .menu .dpanel a.sb-i:hover { background: #F4E7C8; color: #3A2A18; }
  html[data-theme="light"] .nav .gs input { background: #fff; border-color: #E4C58A; color: #43321F; -webkit-backdrop-filter: none; backdrop-filter: none; }
  html[data-theme="light"] .nav .gs input::placeholder { color: #9b8460; } html[data-theme="light"] .nav .gs { color: #9b8460; }
  html[data-theme="light"] .nav .gs kbd { color: #9b8460; border-color: #E4C58A; }
  html[data-theme="light"] .gsr { background: #FCF5E4; border-color: #E4C58A; box-shadow: 0 22px 50px rgba(120,90,40,.25); }
  html[data-theme="light"] .gsr li a { color: #43321F; } html[data-theme="light"] .gsr li a em, html[data-theme="light"] .gsr li a small { color: #9b8460; }
  html[data-theme="light"] .gsr li:hover a, html[data-theme="light"] .gsr li[aria-selected="true"] a { background: #F4E7C8; color: #3A2A18; }
  html[data-theme="light"] .hx-thm { background: #fff; border-color: #E4C58A; }
  html[data-theme="light"] header.nav .mbtn i, html[data-theme="light"] header.nav .mbtn i::before, html[data-theme="light"] header.nav .mbtn i::after { background: #5b4527; }
  html[data-theme="light"] .foot { color: #735D3D; } html[data-theme="light"] .foot a { color: #875A28; }
  html[data-theme="light"] footer.foot .legal a { color: #875A28; } html[data-theme="light"] .langsw a { color: #875A28 !important; } html[data-theme="light"] .langsw a[aria-current] { color: #3A2A18 !important; }   
  html[data-theme="light"] .nav .enm, html[data-theme="light"] .nav .signin.me { color: #5b4527; background: #fff; border-color: #E4C58A; }   
  @media (max-width: 640px) { html[data-theme="light"] header.nav.open .menu { background: #FCF5E4; } }
  @media (max-width: 860px) {
    .hx { padding: calc(env(safe-area-inset-top, 0px) + 66px) 12px 32px; gap: 13px; }
    .hx .row2 { grid-template-columns: minmax(0, 1fr); } .hx .qgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hx .qgrid .qc:last-child { grid-column: 1 / -1; }
    .hx-hero { min-height: 0; padding: 20px 16px; background-position: 70% center; } .hx-hero .ttl { font-size: 25px; }
    .hx .hm-ixg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 640px) { header.nav .hx-thm { order: 2; width: 34px; height: 32px; } .hx .nxt th, .hx .nxt td { padding: 7px 12px; } .hx .hm-ixc li:nth-child(n+6) { display: none; } }
  html[lang|="ko"] .hx :is(p, li, a, span, b, h2, h3) { word-break: keep-all; overflow-wrap: break-word; } .hx p { text-wrap: pretty; }
  @media (prefers-reduced-motion: reduce) { .hx * { transition: none !important; } }
  
  .nav .gs { position: relative; flex: 0 1 440px; margin-left: auto; color: #CFCDE8; }
  .nav .gs .mag { position: absolute; z-index: 1; left: 14px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); pointer-events: none; }
  .nav .gs input { box-sizing: border-box; width: 100%; height: 38px; border-radius: 999px; border: 1px solid rgba(255,255,255,.22); background: rgba(10,12,20,.72);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font: 14px var(--body); padding: 0 44px 0 40px; -webkit-appearance: none; appearance: none; }
  .nav .gs input::placeholder { color: #9B99C4; } .nav .gs input::-webkit-search-cancel-button { display: none; }
  .nav .gs input:focus { outline: 2px solid var(--meso); outline-offset: 1px; }
  .nav .gs kbd { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font: 700 10px var(--display); color: #9B99C4; border: 1px solid rgba(255,255,255,.2); border-radius: 5px; padding: 2px 6px; pointer-events: none; }
  .nav .gs input:focus ~ kbd { opacity: 0; }
  .gsr { position: absolute; z-index: 70; left: 0; right: 0; top: calc(100% + 8px); margin: 0; padding: 6px; list-style: none; max-height: min(70vh, 520px); overflow: auto;
    background: #10141F; border: 1px solid rgba(255,255,255,.14); border-radius: 14px; box-shadow: 0 24px 56px rgba(0,0,0,.6); text-align: left; }
  .gsr li a { display: flex; align-items: baseline; gap: 8px; padding: 8px 10px; border-radius: 9px; color: #E8E6FF; text-decoration: none; font: 13.5px var(--body); }
  .gsr li a b { font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .gsr li a em { font-style: normal; color: #8683B0; font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
  .gsr li a small { margin-left: auto; color: #8E8CBE; font-size: 11.5px; flex: none; }
  .gsr li:hover a, .gsr li[aria-selected="true"] a { background: rgba(242,181,58,.13); color: #fff; }
  .gsr li.grp { display: flex; justify-content: space-between; padding: 10px 11px 4px; }
  .gsr li.grp span { font: 800 11px var(--body); color: var(--meso); } .gsr li.grp small { font: 700 10.5px var(--body); color: #8683B0; }
  .gsr li.more a { justify-content: flex-end; font: 700 11.5px var(--body); color: #8E8CBE; } .gsr li.none { padding: 12px; color: #8E8CBE; font: 13px var(--body); }
  @media (max-width: 900px) { .nav .gs kbd { display: none; } .nav .gs { flex-basis: 300px; } }
  @media (max-width: 640px) { .nav .gs { order: 2; flex: 1 1 auto; min-width: 0; margin-left: 0; } .nav .gs input { height: 36px; font-size: 13px; padding-right: 12px; } }
  
  .nav .menu > .mi { position: relative; display: flex; align-items: center; flex: none; }
  .nav .menu .dd { all: unset; cursor: pointer; width: 22px; height: 30px; margin-left: -12px; display: grid; place-items: center; border-radius: 6px; color: #D6D4F0; }
  .nav .menu .dd i { width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .15s; }
  .nav .menu .mi.open .dd i { transform: translateY(1px) rotate(225deg); }
  .nav .menu .dd:focus-visible { outline: 2px solid var(--meso); }
  .nav .menu .dpanel { position: absolute; z-index: 70; top: calc(100% + 8px); left: 0; width: 460px; padding: 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 2px 6px;
    background: #10141F; border: 1px solid rgba(255,255,255,.12); border-radius: 14px; box-shadow: 0 26px 60px rgba(0,0,0,.6);
    opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .14s, transform .14s, visibility 0s .14s; }
  .nav .menu .dpanel .dph { grid-column: 1 / -1; display: block; padding: 8px 8px 3px; font: 800 11px var(--display); letter-spacing: .08em; color: var(--dim); }   
  .nav .menu .dpanel .dph:first-child { padding-top: 2px; }
  .nav .menu .dpanel.dmore { right: 0; left: auto; }
  @media (max-width: 1180px) { .nav .menu .mi.mq { display: none; } }
  .nav .menu .dpanel::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
  .nav .menu .mi.open .dpanel { opacity: 1; visibility: visible; transform: none; transition: opacity .14s, transform .14s; }
  .nav .menu .dpanel .sb-i, header.nav .menu .dpanel a.sb-i { display: flex; align-items: center; gap: 10px; min-height: 0; padding: 7px 8px; border-radius: 9px; font: 700 12.5px var(--display); letter-spacing: .04em; color: #C9C6E4; text-shadow: none; background: none; text-decoration: none; }
  .nav .menu .dpanel a.sb-i:hover { background: rgba(242,181,58,.1); color: #fff; }
  .nav .menu .dpanel .ic { flex: none; width: 28px; height: 28px; border-radius: 6px; display: grid; place-items: center; background: var(--cell); border: 1px solid var(--cell-edge); box-shadow: inset 0 1px 0 #fff; }
  .nav .menu .dpanel .ic img { width: 22px; height: 22px; object-fit: contain; image-rendering: pixelated; }
  .nav .menu .dpanel .l { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nav .menu .dpanel .cnt { margin-left: auto; font: 600 10.5px var(--body); color: #8A8EAE; }
  .nav .menu .dpanel small { margin-left: auto; font: 700 10px var(--body); letter-spacing: .02em; color: #F2B53A; }
  .nav .menu .dpanel .soon { opacity: .45; cursor: default; }
  @media (min-width: 641px) { .nav .menu { overflow: visible; } }
  @media (max-width: 640px) { .nav .menu .dd, .nav .menu .dpanel { display: none !important; } .nav .menu > .mi { display: block; } .nav .menu > .mi + .mi { border-top: 1px solid rgba(255,255,255,.06); } }
  @media (pointer: coarse) { .hx a.more, .hx .nw-h a, .hx .sect a.more { padding-top: 10px; padding-bottom: 10px; margin-top: -10px; margin-bottom: -10px; } }   
  .signin { flex: none; display: inline-flex; align-items: center; gap: 6px; font: 700 14px var(--display); letter-spacing: .02em; color: #fff; background: #5865F2; border-radius: 999px; padding: 8px 14px; text-decoration: none; white-space: nowrap; }
  .signin img { width: 20px; height: 20px; border-radius: 50%; image-rendering: auto; }
  .signin.me { background: rgba(255,255,255,.1); }
  .signin .sm { display: none; }
  .ctls .ctl { font-size: 13px; min-height: 40px; padding: 0 16px; white-space: nowrap; }   
  @media (max-width: 520px) { .signin { padding: 6px 11px; font-size: 12px; } .signin .lg { display: none; } .signin .sm { display: inline; } }
  @media (max-width: 640px) { header.nav .brand { order: 0; } header.nav .gs { order: 1; } header.nav .enm { order: 2; margin-right: 0; } header.nav .signin { order: 3; display: none; } header.nav.open .signin { display: inline-flex; } header.nav.open .gs { display: none; } header.nav .mbtn { order: 4; } }   
  
  @media (min-width: 1280px) and (max-width: 1500px) { header.nav .menu a.top { font-size: 18px; padding-left: 14px; padding-right: 14px; } .signin .lg { display: none; } .signin .sm { display: inline; } }
  
  @media (min-width: 901px) and (max-width: 1680px) { html[lang^="es"] header.nav .menu a.top { font-size: 16px; padding-left: 12px; padding-right: 12px; } html[lang^="es"] .signin .lg { display: none; } html[lang^="es"] .signin .sm { display: inline; } }
  @media (min-width: 901px) and (max-width: 1300px) { html[lang^="es"] header.nav .menu a.top { font-size: 14px; padding-left: 8px; padding-right: 8px; } html[lang^="es"] header.nav { gap: 14px; } }   
  @media (min-width: 641px) and (max-width: 900px) { html[lang^="es"] header.nav .menu a.top { font-size: 12px; padding-left: 5px; padding-right: 5px; letter-spacing: 0; } html[lang^="es"] header.nav .menu .dd { display: none; } html[lang^="es"] header.nav { gap: 6px; } html[lang^="es"] header.nav .gs { flex-basis: 92px; min-width: 92px; } html[lang^="es"] .signin .lg { display: none; } html[lang^="es"] .signin .sm { display: inline; } }
