/* FANTASY SKIN — "Enchanted Tome". Active when <html data-skin="fantasy"> (light tone).
   Aged parchment, burgundy & gold, illuminated initials, candlelight vignette, wax-seal stamps. Art: /skins/fantasy/ */
[data-skin="fantasy"] {
  --bg: #e9dcc0; --bg2: #e2d2b0; --panel: #f6ecd6; --panel2: #efe2c4; --line: #d4c09a; --line2: #b89c6c;
  --text: #2b1d12; --muted: #6e5a40; --dim: #9a8463;
  --red: #8c1c22; --red2: #a8262e; --deep: #5a0f14; --amber: #b8862b; --bone: #4a3725; --green: #3f7a3a;
  --common: #8a7350; --uncommon: #b8862b; --rare: #8c1c22;
  --display: "Cinzel", "Trajan Pro", Georgia, serif; --body: "EB Garamond", Georgia, serif; --type: "IM Fell English", Georgia, serif;
  --gold: linear-gradient(180deg, #f6e7b0, #d4a640 45%, #8a6418 55%, #e8c46a);
}
[data-skin="fantasy"] body { font-size: 17px; background:
  radial-gradient(#00000008 1px, transparent 1.5px) 0 0 / 9px 9px,
  radial-gradient(120% 90% at 50% 40%, #f3e8cf 0%, #e9dcc0 55%, #c9b088 100%) fixed, var(--bg); }
[data-skin="fantasy"] .vignette { position: absolute; inset: 0; background: radial-gradient(110% 80% at 50% 45%, transparent 55%, #3a220e55 100%); animation: candle 3.2s ease-in-out infinite; }
@keyframes candle { 25% { opacity: .85; } 50% { opacity: 1; } 70% { opacity: .9; } }
[data-skin="fantasy"] .mote { position: absolute; width: var(--size); height: var(--size); border-radius: 50%; background: #f6d77a; box-shadow: 0 0 8px 2px #f6d77a99;
  animation: mote var(--dur) ease-in-out var(--delay) infinite; opacity: .6; }
@keyframes mote { 50% { transform: translate(18px, -40px); opacity: .1; } }

[data-skin="fantasy"] .h { font-weight: 700; letter-spacing: .02em; }
[data-skin="fantasy"] .tcard .name { font-family: var(--display); font-weight: 700; font-size: 17px; line-height: 1.15; }
[data-skin="fantasy"] .tcard .name::first-letter { color: var(--red); font-size: 1.45em; }
[data-skin="fantasy"] .trow .tcard .name { font-size: 14px; }
[data-skin="fantasy"] .kicker { color: var(--red); font-family: var(--display); }
[data-skin="fantasy"] .btn.primary { background: linear-gradient(180deg, #a8262e, #8c1c22 60%, #6a1218); border-color: #5a0f14; font-family: var(--display); letter-spacing: .04em; }
[data-skin="fantasy"] .btn.amber { background: var(--gold); color: #2b1d12; border-color: #8a6418; font-family: var(--display); }

/* home */
[data-skin="fantasy"] .marquee { background: radial-gradient(120% 100% at 50% 0%, #fbf3e0, #efe0bd); border: 3px double #8a6418; box-shadow: 0 0 0 6px #f6ecd6, 0 0 0 8px #8a6418, 0 20px 50px -20px #3a220e88; overflow: visible; isolation: isolate; padding: 30px 26px 22px; }
[data-skin="fantasy"] .logo { font-weight: 800; font-size: clamp(36px, 11vw, 52px); color: var(--text); text-shadow: 0 1px 0 #fff8; letter-spacing: .04em; }
[data-skin="fantasy"] .logo span { background: var(--gold); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 1px 0 #5a3e0e); }
[data-skin="fantasy"] .edition { background: var(--red); color: #f6e7b0; border-radius: 2px; font-family: var(--display); letter-spacing: .3em; font-size: 12px; animation: none; }
[data-skin="fantasy"] .tagline { font-style: italic; color: var(--muted); }
[data-skin="fantasy"] .sk-f-candle1 { left: -30px; bottom: -14px; height: 116px; aspect-ratio: 205 / 360; animation: flick 2.4s ease-in-out infinite; }
[data-skin="fantasy"] .sk-f-candle2 { right: -30px; bottom: -14px; height: 100px; aspect-ratio: 205 / 360; animation: flick 2.9s ease-in-out -1s infinite; }
@keyframes flick { 50% { filter: brightness(1.08) drop-shadow(0 0 6px #ffcf66); } }
[data-skin="fantasy"] .sk-f-quill { right: 18px; top: -44px; height: 128px; transform: rotate(6deg); filter: drop-shadow(2px 3px 2px #0003); }
/* the flame shrinks onto the wick when a candle is tapped (clickables.js) */
[data-skin="fantasy"] .sk-f-candle1 .ly1, [data-skin="fantasy"] .sk-f-candle2 .ly1 { transform-origin: 50% 23%; }
[data-skin="fantasy"] .sk-f-seal { left: 18px; top: -22px; width: 54px; transform: rotate(-12deg); filter: drop-shadow(2px 3px 2px #0004); }
[data-skin="fantasy"] .sk-f-results { right: 12px; top: -16px; width: 52px; transform: rotate(10deg); filter: drop-shadow(2px 3px 2px #0004); }

/* panels & cards */
[data-skin="fantasy"] .panel, [data-skin="fantasy"] .card-panel, [data-skin="fantasy"] .chat { background: var(--panel); border: 1px solid var(--line2); box-shadow: inset 0 0 0 4px var(--panel), inset 0 0 0 5px #d4b77a, 0 10px 26px -18px #3a220e88; }
[data-skin="fantasy"] .topbar { background: #f6ecd6f2; border-bottom: 3px double #8a6418; }
[data-skin="fantasy"] .mini-logo { font-family: var(--display); font-weight: 800; }
[data-skin="fantasy"] .mini-logo span { color: var(--red); }
[data-skin="fantasy"] .code-chip { background: var(--red); color: #f6e7b0; font-family: var(--display); }
[data-skin="fantasy"] .tcard { background: linear-gradient(170deg, #fbf3e0, #efe2c4); border: 1.5px solid var(--rc); box-shadow: inset 0 0 0 3px #fbf3e0, inset 0 0 0 4px color-mix(in srgb, var(--rc) 45%, transparent), 0 8px 18px -14px #3a220e99; }
[data-skin="fantasy"] .tcard.rare { box-shadow: inset 0 0 0 3px #fbf3e0, inset 0 0 0 4px #d4a640, 0 8px 22px -12px #8c1c2288; }
[data-skin="fantasy"] .tcard .desc { font-style: italic; }
[data-skin="fantasy"] .tcard .mod { font-family: var(--type); }
[data-skin="fantasy"] .tcard.hit { background: linear-gradient(170deg, #f1f4e2, #e3ead0); border-color: var(--green); }
/* wax-seal hit stamp */
[data-skin="fantasy"] .stamp { color: #f6e7b0; background: radial-gradient(circle at 40% 35%, #c2323d, #8c1c22 70%); border: 2px solid #5a0f14; border-radius: 999px; font-family: var(--display); font-size: 14px; padding: 4px 10px; box-shadow: 0 2px 4px #0005; }
[data-skin="fantasy"] .rsticker { display: block; position: absolute; right: 6px; bottom: 6px; width: 30px; height: 30px; background: center / contain no-repeat; pointer-events: none; filter: drop-shadow(1px 2px 1px #0004); }
[data-skin="fantasy"] .tcard.rare .rsticker { background-image: var(--art-waxseal); }
[data-skin="fantasy"] .tcard:not(.rare) .rsticker, [data-skin="fantasy"] .tcard.hit .rsticker, [data-skin="fantasy"] .tcard .call ~ .rsticker, [data-skin="fantasy"] .tcard .tags ~ .rsticker { display: none; }
[data-skin="fantasy"] .tcard .call { background: linear-gradient(180deg, #a8262e, #8c1c22 60%, #6a1218); font-family: var(--display); letter-spacing: .08em; }
[data-skin="fantasy"] .msg { font-size: 16px; }

/* FX */
[data-skin="fantasy"] .fx-scrim { background: repeating-conic-gradient(from 0deg at 50% 46%, #d4a64033 0deg 4deg, transparent 4deg 12deg), radial-gradient(circle at 50% 46%, #fbf3e0f5, #e9dcc0f2 50%, #3a220ee6 100%); }
[data-skin="fantasy"] .fx-flash { background: #fff6d6; }
[data-skin="fantasy"] .fx-stampbig { font-family: var(--display); font-weight: 800; font-size: clamp(30px, 9vw, 58px); color: transparent; background: var(--gold); -webkit-background-clip: text; background-clip: text;
  border: 0; padding: 0 6px; transform: none; -webkit-text-stroke: 1.5px #4a2f08; filter: drop-shadow(0 3px 0 #2b1d12) drop-shadow(0 0 18px #f6d77a); animation-name: foretold; text-align: center; max-width: 92vw; }
[data-skin="fantasy"] .fx-stampbig.long { font-size: clamp(24px, 7vw, 46px); }
@keyframes foretold { 0% { opacity: 0; letter-spacing: .6em; filter: blur(8px); } 100% { opacity: 1; letter-spacing: .02em; filter: drop-shadow(0 2px 0 #5a3e0e) drop-shadow(0 0 18px #f6d77a); } }
[data-skin="fantasy"] .particle { width: 12px; height: 12px; border-radius: 0; clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); }
[data-skin="fantasy"] .fx-title { font-family: var(--display); color: var(--text); text-shadow: 0 0 20px #f6d77a, 0 2px 0 #fff; }
[data-skin="fantasy"] .fx-owner { font-family: var(--display); }
[data-skin="fantasy"] .fx-mine { background: var(--red); color: #f6e7b0; font-family: var(--display); }
[data-skin="fantasy"] .leader { background: #fbf3e0; box-shadow: 0 0 0 8px #8a6418, 0 0 0 12px #f6ecd6, 0 20px 60px #3a220e88; }
@media (prefers-reduced-motion: reduce) { [data-skin="fantasy"] .mote, [data-skin="fantasy"] .vignette { animation: none; } }