/* ─────────────────────────────────────────────────────────────
   RISING SUN SKIN — active when <html data-skin="risingsun">.
   Not tied to a genre (players pick it by hand). Washi-paper light theme,
   crimson rays, the flag with a red clapperboard in place of the sun,
   hanko-seal hit stamps. Plain wording by user request (no themed callouts).
   Art: /skins/risingsun/flag.svg, clapper.svg (mapped in app.js → SKINS.risingsun.art)
   ───────────────────────────────────────────────────────────── */
[data-skin="risingsun"] {
  --bg: #f5f0e6; --bg2: #ece4d4; --panel: #fffdf8; --panel2: #f7f1e6; --line: #e6dac6; --line2: #cdb99b;
  --text: #1c1512; --muted: #6d5d52; --dim: #a08f80;
  --red: #bc002d; --red2: #d7193f; --deep: #7a0019; --amber: #1c1512; --bone: #3a2c25; --green: #1f8a5b;
  --common: #8a7a6c; --uncommon: #1c1512; --rare: #bc002d;
  --display: "Shippori Mincho B1", "Hiragino Mincho ProN", Georgia, serif;
  --body: "Zen Kaku Gothic New", system-ui, -apple-system, Segoe UI, sans-serif;
  --type: "Shippori Mincho B1", Georgia, serif;
  color-scheme: light;
}
[data-skin="risingsun"] body { background: var(--bg); }
[data-skin="risingsun"] .grain { display: none; }
[data-skin="risingsun"] .sunburst { position: absolute; left: 50%; top: 42%; width: 220vmax; height: 220vmax; translate: -50% -50%;
  background: repeating-conic-gradient(from -5.625deg, #bc002d 0deg 11.25deg, transparent 11.25deg 22.5deg);
  opacity: .07; animation: rs-spin 240s linear infinite; }
@keyframes rs-spin { to { rotate: 360deg; } }

/* type */
[data-skin="risingsun"] .h, [data-skin="risingsun"] .tcard .name { font-weight: 800; letter-spacing: 0; }
[data-skin="risingsun"] .tcard .name { font-size: 18px; line-height: 1.15; }
[data-skin="risingsun"] .trow .tcard .name { font-size: 15px; }

/* controls */
[data-skin="risingsun"] .btn { background: var(--panel); border: 1.5px solid var(--line2); }
[data-skin="risingsun"] .btn.primary { background: var(--red); border-color: var(--deep); color: #fff; box-shadow: 0 6px 18px -8px #bc002d99; }
[data-skin="risingsun"] .btn.amber { background: var(--text); border-color: var(--text); color: #fff; }
[data-skin="risingsun"] .btn.ghost { background: transparent; }
[data-skin="risingsun"] .input, [data-skin="risingsun"] select.input, [data-skin="risingsun"] .segb, [data-skin="risingsun"] .toggle { background: #fff; border: 1.5px solid var(--line2); }
[data-skin="risingsun"] .input:focus { border-color: var(--red); }
[data-skin="risingsun"] .segb.on { background: var(--text); color: #fff; border-color: var(--text); }
[data-skin="risingsun"] .switch { background: var(--line2); }
[data-skin="risingsun"] .pause-btn { color: var(--red); border-color: var(--red); }

/* home: flag title card */
[data-skin="risingsun"] .marquee { background: #fff; border: 3px solid var(--red); box-shadow: 0 18px 40px -18px #7a001966; padding-top: 0; overflow: hidden; }
[data-skin="risingsun"] .marquee::before { display: none; }
[data-skin="risingsun"] .art-flag { position: relative; display: block; width: calc(100% + 36px); margin: 0 -18px 14px; aspect-ratio: 2 / 1; border-bottom: 3px solid var(--red); }
/* both layers crop the same way; the clapstick hinges where it meets the board (25.8% 41.6% of the cropped box) */
[data-skin="risingsun"] .art-flag .ly { object-fit: cover; object-position: 39% 50%; }
[data-skin="risingsun"] .art-flag .ly1 { transform-origin: 25.8% 41.6%; }
[data-skin="risingsun"] .logo { color: var(--text); text-shadow: none; font-size: clamp(40px, 12vw, 58px); font-weight: 800; }
[data-skin="risingsun"] .logo span { color: var(--red); }
[data-skin="risingsun"] .edition { color: #fff; background: var(--red); border: 0; border-radius: 3px; animation: none; letter-spacing: .3em; }
[data-skin="risingsun"] .tagline { color: var(--muted); }
[data-skin="risingsun"] .card-panel { background: var(--panel); border: 1px solid var(--line); box-shadow: 0 10px 30px -18px #3a2c2555; }

/* shell */
[data-skin="risingsun"] .topbar { background: #fffdf8f2; border-bottom: 3px solid var(--red); }
[data-skin="risingsun"] .code-chip { background: var(--red); color: #fff; border: 0; }
[data-skin="risingsun"] .phase-pill { color: var(--red); }
[data-skin="risingsun"] .movie-strip { background: #fff; color: var(--bone); }
[data-skin="risingsun"] .tabbar { background: #fffdf8f5; border-top: 1px solid var(--line); }
[data-skin="risingsun"] .tab.on { background: var(--bg); box-shadow: inset 0 -3px 0 var(--red); }
[data-skin="risingsun"] .panel, [data-skin="risingsun"] .chat { box-shadow: 0 10px 30px -20px #3a2c2566; }
[data-skin="risingsun"] .banner, [data-skin="risingsun"] .banner.amber, [data-skin="risingsun"] .banner.green { background: #fff; border: 1px solid var(--line); border-left: 6px solid var(--red); }
[data-skin="risingsun"] .banner.green { border-left-color: var(--green); }
[data-skin="risingsun"] .method.mine { background: #fff; border-color: var(--red); box-shadow: inset 0 0 0 1px var(--red); }

/* cards */
[data-skin="risingsun"] .tcard { background: #fff; border: 1.5px solid var(--rc); box-shadow: 0 8px 20px -14px #3a2c2588; }
[data-skin="risingsun"] .tcard.uncommon { border-width: 2px; }
[data-skin="risingsun"] .tcard.rare { border-width: 2.5px; box-shadow: 0 8px 22px -12px #bc002d77; }
[data-skin="risingsun"] .tcard::after { border-top: 1px solid #0000000f; }
[data-skin="risingsun"] .tcard .mod { color: var(--deep); background: #bc002d0b; border-left-color: var(--red); }
[data-skin="risingsun"] .tag { background: #0000000c; color: var(--bone); }
[data-skin="risingsun"] .tag.blind { background: #1d4ed81a; color: #1d4ed8; }
[data-skin="risingsun"] .tag.mod { background: #bc002d14; color: var(--red); }
[data-skin="risingsun"] .tag.rev { background: #7a001914; color: var(--deep); }
[data-skin="risingsun"] .pill { background: #0000000c; }
[data-skin="risingsun"] .pill.host { background: #bc002d14; color: var(--red); }
[data-skin="risingsun"] .pill.loser { background: #7a001914; color: var(--deep); }
[data-skin="risingsun"] .tcard.hit { background: #f1f8f3; border-color: var(--green); }
/* hanko-seal stamp */
[data-skin="risingsun"] .stamp { color: var(--red); border: 3px double var(--red); background: #ffffffcc; border-radius: 6px; font-size: 19px; padding: 1px 8px; }
[data-skin="risingsun"] .rsticker { display: block; position: absolute; right: 7px; bottom: 7px; width: 26px; height: 24px; background: var(--art-clapper) center / contain no-repeat; opacity: .9; pointer-events: none; }
[data-skin="risingsun"] .tcard:not(.rare) .rsticker, [data-skin="risingsun"] .tcard.hit .rsticker, [data-skin="risingsun"] .tcard .call ~ .rsticker, [data-skin="risingsun"] .tcard .tags ~ .rsticker { display: none; }
[data-skin="risingsun"] .tcard .call { background: var(--red); border: 0; }

/* chat, claims, sheets */
[data-skin="risingsun"] .msg.sys { background: #0000000a; }
[data-skin="risingsun"] .msg.hit { color: #14603f; background: #1f8a5b14; }
[data-skin="risingsun"] .msg.revenge { color: var(--deep); background: #bc002d10; }
[data-skin="risingsun"] .reacts button { background: #0000000a; }
[data-skin="risingsun"] .claim { background: #fffdf8fa; border: 2px solid var(--text); }
[data-skin="risingsun"] .claim .bar { background: #0000001a; }
[data-skin="risingsun"] .claim .bar i { background: var(--red); }
[data-skin="risingsun"] .act.red { background: #fff; border-color: var(--red); }
[data-skin="risingsun"] .preq { border-color: var(--red); }
[data-skin="risingsun"] .preq-ico { background: var(--red); color: #fff; }
[data-skin="risingsun"] #toast div { background: var(--text); color: #fff; border: 0; }

/* FX: rays spin behind the card */
[data-skin="risingsun"] .fx-scrim { background: #f5f0e6f0; overflow: hidden; }
[data-skin="risingsun"] .fx-scrim::before { content: ""; position: absolute; left: 50%; top: 46%; width: 260vmax; height: 260vmax; translate: -50% -50%;
  background: repeating-conic-gradient(from -5.625deg, #bc002d 0deg 11.25deg, transparent 11.25deg 22.5deg); opacity: .9; animation: rs-spin 30s linear infinite; }
[data-skin="risingsun"] .fx-scrim::after { content: ""; position: absolute; left: 50%; top: 46%; width: 340px; height: 340px; translate: -50% -50%; border-radius: 50%; background: #fff; }
[data-skin="risingsun"] .fx-stampbig { color: var(--red); background: #fff; border: 7px double var(--red); text-shadow: none; }
[data-skin="risingsun"] .fx-pts { color: var(--text); text-shadow: 0 0 0 transparent, 0 3px 0 #fff; background: #fff; padding: 0 16px; border-radius: 12px; }
[data-skin="risingsun"] .fx-owner { background: #fff; padding: 2px 12px; border-radius: 6px; }
[data-skin="risingsun"] .fx-title { color: var(--text); background: #fff; padding: 6px 22px; border: 4px solid var(--red); border-radius: 8px; text-shadow: none; }
[data-skin="risingsun"] .fx-sub { color: var(--text); background: #fff; padding: 2px 12px; border-radius: 6px; }
[data-skin="risingsun"] .leader { background: #fff; box-shadow: 0 0 0 10px var(--red), 0 20px 60px #0005; }

@media (prefers-reduced-motion: reduce) {
  [data-skin="risingsun"] .sunburst, [data-skin="risingsun"] .fx-scrim::before { animation: none; }
}