/* ================================================================
   ANIME PORTFOLIO v2 — DESIGN TOKENS
   One token system, seven arc palettes. Arcs switch via data-arc
   on <section>; global system colors stay constant for cohesion.
   ================================================================ */
:root{
  /* ---- system constants (present in every arc) ---- */
  --void:#04060c;
  --void2:#070b16;
  --panel:rgba(9,13,24,.82);
  --panel-solid:#0a0f1c;
  --sys-cyan:#35e0ff;
  --sys-violet:#a06bff;
  --sys-green:#3ddc97;
  --sys-gold:#f0c24b;
  --sys-red:#ff4d6b;
  --ink:#c7d5e8;
  --bright:#ecf7ff;
  --dim:#66788f;
  --slate:#8aa0b8;
  --line:rgba(53,224,255,.22);
  --line-dim:rgba(53,224,255,.10);

  /* ---- typography ---- */
  --font-sys:'Orbitron',sans-serif;           /* system UI / HUD */
  --font-mono:'Share Tech Mono',ui-monospace,monospace; /* body */
  --font-impact:'Bakbak One','Russo One',sans-serif;    /* onomatopoeia, impact */
  --font-jp:'Noto Sans JP',sans-serif;        /* decorative JP accents */
  --font-jp-pixel:'DotGothic16',monospace;    /* retro JP */
  --font-brush:'Yuji Syuku',serif;            /* murim/ink arc */
  --font-map:'Cinzel',Georgia,serif;          /* voyage chart + ascension */

  --fs-hud:11px;
  --fs-body:15px;
  --fs-h2:clamp(16px,2.4vw,22px);
  --fs-hero:clamp(34px,6vw,60px);
  --fs-bang:clamp(40px,8vw,110px);            /* onomatopoeia */

  /* ---- sakuga easing library ----
     anticipation -> snap -> overshoot -> settle */
  --ease-snap:cubic-bezier(.19,1.24,.28,1);       /* fast attack, soft land */
  --ease-pop:cubic-bezier(.22,1.42,.36,1);        /* overshoot, alive */
  --ease-antic:cubic-bezier(.68,-.28,.27,1.18);   /* wind-up dip first */
  --ease-slide:cubic-bezier(.16,1,.3,1);          /* fast-out settle */
  --ease-draw:cubic-bezier(.55,.06,.25,1);        /* stroke/edge draw */
  --ease-smash:cubic-bezier(.9,0,.1,1);           /* hard cut, hold-hold-SNAP */

  /* timing: anime holds are long, actions are instant */
  --t-blink:80ms;      /* impact frame */
  --t-action:180ms;    /* snappy ui */
  --t-move:340ms;      /* panel movement */
  --t-scene:700ms;     /* section entrances */
  --t-hold:1200ms;     /* dramatic hold */

  /* ---- z-layers ---- */
  --z-bg:-2; --z-tone:5; --z-hud:60; --z-companion:70;
  --z-chat:90; --z-eyecatch:120; --z-impact:130; --z-boot:200;

  /* ---- shared motif ---- */
  --bk-size:16px;                /* corner bracket length */
  --bk:var(--sys-cyan);
}

/* ================= ARC PALETTES =================
   Usage: <section data-arc="murim"> ... var(--arc-a) */

/* Awakening / Status — Solo Leveling · Nanomachine */
[data-arc="system"]{
  --arc-a:var(--sys-cyan); --arc-b:var(--sys-violet);
  --arc-bg:transparent; --arc-ink:var(--ink);
  --arc-accent:var(--sys-gold);
}

/* Skill Tree — Northern Blade · Absolute Sword Sense · Heavenly Demon */
[data-arc="murim"]{
  --arc-a:#3ddc97;              /* jade */
  --arc-b:#e8d5a3;              /* aged gold */
  --arc-bg:#0b0e0a;             /* ink-black w/ green cast */
  --arc-paper:#e9e2cf;          /* rice paper */
  --arc-ink:#d8d2c0;
  --arc-accent:#c73e3e;         /* seal red */
  --arc-font:var(--font-brush);
}

/* Dungeon Log — Shangri-La Frontier · Blue Lock */
[data-arc="dungeon"]{
  --arc-a:#35e0ff; --arc-b:#ff4d6b;
  --arc-bg:#05070f; --arc-ink:var(--bright);
  --arc-accent:var(--sys-gold);
}

/* Voyage — One Piece (deliberate warm break) */
[data-arc="voyage"]{
  --arc-a:#ff9a3d;              /* sunset orange */
  --arc-b:#4da3ff;              /* open sea */
  --arc-bg:#1a1208;             /* dark wood */
  --arc-paper:#f0e0c0;          /* parchment */
  --arc-ink:#f0e6d4;
  --arc-accent:#ffd23d;
}

/* Previous Life — seinen manga, monochrome */
[data-arc="manga"]{
  --arc-a:#e8e8e8; --arc-b:#8a8a8a;
  --arc-bg:#101010; --arc-paper:#f2efe8;
  --arc-ink:#1a1a1a; --arc-accent:#c73e3e;
}

/* Ascension Hall — Tensura evolution / divine */
[data-arc="divine"]{
  --arc-a:#f0c24b; --arc-b:#fff3d0;
  --arc-bg:#0e0a04; --arc-ink:#f4ead2;
  --arc-accent:#8ab4ff;
}

/* Contact — portal / rift */
[data-arc="portal"]{
  --arc-a:var(--sys-violet); --arc-b:var(--sys-cyan);
  --arc-bg:#0a0614; --arc-ink:var(--ink);
  --arc-accent:#ff4d9e;
}