/* L2Next Design System — tokens (gerado de project/tokens.json do Design System
   compartilhado em 29/09/2026). Valores idênticos aos do CSS original da home;
   não editar valores aqui sem atualizar o Design System de origem. */

@font-face {
  font-family: "Cinzel";
  src: url("../../fonts/cinzel-latin-wght.woff2") format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Oswald";
  src: url("../../fonts/oswald-latin-wght.woff2") format("woff2");
  font-weight: 200 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "EB Garamond";
  src: url("../../fonts/ebgaramond-latin-wght.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "EB Garamond";
  src: url("../../fonts/ebgaramond-latin-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

:root {
  /* cor */
  --bg-0: #070b09;
  --bg-1: #0a120d;
  --bg-2: #0d1712;
  --panel: #0a120db8;
  --panel-2: #101a14d9;
  --overlay-top: #03080557;

  --line: #78b48c38;
  --line-2: #78b48c66;

  --green: #35c66b;
  --green-bright: #57f39a;
  --green-deep: #1c7a45;
  --green-glow: #35c66b8c;
  --gem: #23e08a;

  --steel-1: #e9efe9;
  --steel-2: #aab6ad;
  --steel-3: #6f7d73;

  --ink: #d8e2da;
  --ink-dim: #95a79b;
  --ink-mut: #6d7c72;
  --parch: #cbd4cc;
  --white: #f2f6f0;
  --heading: #eef2ec;
  --subnav-ink: #b7cbbd;
  --features-ink: #cbd5ce;

  --gold-accent: #c9a24a;
  --rate-cream: #f5f0df;
  --signature-gold: #d7c38c;
  --scroll-gold: #d6aa4e;
  --bronze: #cb8b2c;

  --online-top: #46cd7880;
  --online-bottom: #28965580;
  --online-line: #8cebb4b3;
  --online-ink: #eafff2;
  --offline-top: #cd41419e;
  --offline-bottom: #8b1e1ead;
  --offline-line: #ff7d7dd1;
  --offline-ink: #fff0f0;

  --tag-bg: #35c66bd9;
  --tag-ink: #052a14;
  --input-bg: #0000008c;

  --ring-telegram: #2aa9e0;
  --ring-telegram-deep: #0d2a3a;
  --ring-discord: #7a86f0;
  --ring-discord-deep: #2a2f6a;
  --ring-ticket: #3fd77a;
  --ring-ticket-deep: #123a24;

  --focus: var(--green-bright);

  /* tipografia */
  --font-head: "Cinzel", "Times New Roman", serif;
  --font-ui: "Oswald", "Arial Narrow", sans-serif;
  --font-body: "EB Garamond", Georgia, serif;

  /* espaço */
  --space-4: 4px; --space-8: 8px; --space-12: 12px; --space-14: 14px;
  --space-16: 16px; --space-18: 18px; --space-20: 20px; --space-22: 22px;
  --space-24: 24px; --space-26: 26px; --space-28: 28px; --space-30: 30px;
  --space-34: 34px; --space-40: 40px; --space-48: 48px; --space-80: 80px;
  --space-130: 130px;

  /* cantos */
  --radius-4: 4px; --radius-5: 5px; --radius-6: 6px; --radius-8: 8px;
  --radius-10: 10px; --radius-16: 16px; --radius-22: 22px; --radius-round: 50%;

  /* sombra */
  --glow-green: 0 0 16px rgba(53,198,107,.55);
  --glow-green-sm: 0 0 12px rgba(53,198,107,.55);
  --shadow-panel: inset 0 0 40px rgba(0,0,0,.4);
  --shadow-cell: inset 0 0 18px rgba(0,0,0,.5);
  --shadow-card-hover: 0 20px 40px rgba(0,0,0,.5), 0 0 24px rgba(53,198,107,.15);
  --shadow-menu: 0 12px 30px rgba(0,0,0,.55), 0 0 18px rgba(53,198,107,.12);
  --shadow-status-on: 0 0 12px rgba(53,198,107,.35), inset 0 1px 0 rgba(210,255,225,.28);
  --shadow-status-off: 0 0 13px rgba(225,48,48,.38), inset 0 1px 0 rgba(255,220,220,.18);
  --focus-input: 0 0 0 2px rgba(53,198,107,.18);
  --focus-ring: 0 0 0 2px #070b09, 0 0 0 4px #57f39a;

  /* medida */
  --size-maxw: 1180px;
  --size-emblem: 54px;
  --size-control: 31px;
  --size-rail: 40px;
  --size-cell: 54.4px;
  --size-frame-lg: 65px;
  --size-frame-md: 52px;
  --size-btn-md: 44px;
  --size-btn-sm: 36px;
  --size-btn-xs: 28px;
  --size-badge: 96px;
  --size-ring: 92px;
  --size-skill: 64px;
}

body { background: var(--bg-0); }

/* O template legado (css/global.css) estiliza elemento <nav> solto, sem classe
   (nav{position:absolute;left:0;top:-84px;width:1010px;height:84px;padding:49px 0 0 0;
   display:table;background:url(...)}). Como <nav class="l2-drawer"> e
   <nav class="l2-top__nav"> do Design System são <nav> também, herdam left/height/
   padding/background/display de lá para as propriedades que a classe l2- não
   redeclara. Zera só essas propriedades específicas, só nesses dois elementos —
   não um reset genérico de <nav>, para não brigar com a especificidade do
   bundle.css em outros pontos. */
.l2-ds nav.l2-drawer { left: auto; top: auto; height: auto; }
.l2-ds nav.l2-top__nav { left: auto; top: auto; height: auto; padding: 0; background: none; border-radius: 0; }
