/* PIRATE (One Piece palette) — the anime's own palette: straw-hat yellow, Luffy red, bright Grand Line blue, white sails, thick manga ink. Light and loud. */
[data-theme="pirate"] {
  --ink: #DDF3FF; --panel: #FFFFFF; --panel-2: #FFF6D6; --line: #14213D; --text: #14213D; --muted: #4E5D78;
  --accent: #F2C14E; --accent-ink: #14213D; --accent-2: #D62828; --gold: #F2C14E; --danger: #D62828; --ok: #1E88E5;
  --rank-E: #8A9BB5; --rank-D: #1E88E5; --rank-C: #2BB673; --rank-B: #F2C14E; --rank-A: #D62828; --rank-S: #7B2CBF;
  --display: "Luckiest Guy", "Bangers", Impact, sans-serif; --radius: 12px; --skew: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  background-color: var(--ink);
  /* sky to sea */
  background-image: linear-gradient(180deg, #1976D2 0, #4FC3F7 28%, #DDF3FF 60%, #B3E5FC 100%), radial-gradient(circle at 80% 8%, rgba(255,255,255,.9) 0 34px, transparent 36px);
  background-blend-mode: normal, screen;
}
[data-theme="pirate"] .panel { border: 3px solid var(--line); box-shadow: 4px 4px 0 var(--line); }
[data-theme="pirate"] .panel.primary { background: #FFF6D6; border-color: var(--line); box-shadow: 5px 5px 0 var(--accent-2); }
[data-theme="pirate"] .rank, [data-theme="pirate"] .flame, [data-theme="pirate"] .row.between .small.muted { color: #fff; text-shadow: 0 1px 0 var(--line), 0 0 6px rgba(0,0,0,.4); }
[data-theme="pirate"] .rank b { border-color: #fff; color: #fff; }
[data-theme="pirate"] .screen > div:nth-child(2) .muted { color: #fff; text-shadow: 0 1px 0 var(--line); }
[data-theme="pirate"] .btn { border: 3px solid var(--line); box-shadow: 3px 3px 0 var(--line); background: #fff; letter-spacing: .06em; }
[data-theme="pirate"] .btn.accent { background: var(--accent); color: var(--accent-ink); }
[data-theme="pirate"] .btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--line); }
[data-theme="pirate"] h1, [data-theme="pirate"] h2 { letter-spacing: .03em; color: var(--accent-2); -webkit-text-stroke: .6px var(--line); }
[data-theme="pirate"] .bar { border: 2px solid var(--line); background: #fff; height: 12px; } [data-theme="pirate"] .bar > i { background: var(--accent-2); } [data-theme="pirate"] .bar.gold > i { background: var(--accent); }
[data-theme="pirate"] .choice { border: 2px solid var(--line); background: #fff; border-radius: 10px; } [data-theme="pirate"] .choice b { color: var(--accent-2); }
[data-theme="pirate"] .choice.right { background: #FFF1B8; border-color: var(--accent-2); box-shadow: 3px 3px 0 var(--line); } [data-theme="pirate"] .choice.wrong { background: #FFD6D6; }
[data-theme="pirate"] .tag { border: 2px solid var(--line); color: var(--line); background: #fff; } [data-theme="pirate"] .tag.new { color: var(--accent-2); border-color: var(--accent-2); }
[data-theme="pirate"] .verdict.ok { color: var(--accent-2); } [data-theme="pirate"] .combo { color: var(--accent); text-shadow: 0 1px 0 var(--line), 0 0 6px rgba(0,0,0,.5); }
[data-theme="pirate"] .progress i { border: 1px solid rgba(20,33,61,.4); } [data-theme="pirate"] .progress i.done { background: var(--accent); } [data-theme="pirate"] .progress i.cur { background: #fff; }
[data-theme="pirate"] .stem { color: var(--text); }
/* jolly roger with the straw hat */
[data-theme="pirate"] .roger { position: absolute; right: 16px; bottom: 18px; width: 72px; height: 72px; pointer-events: none; opacity: .9; }
[data-theme="pirate"] .roger .hat { position: absolute; left: 6px; top: 10px; z-index: 2; width: 60px; height: 14px; background: var(--accent); border: 3px solid var(--line); border-radius: 50%; }
[data-theme="pirate"] .roger .hat::after { content: ""; position: absolute; left: 14px; top: -12px; width: 26px; height: 16px; background: var(--accent); border: 3px solid var(--line); border-bottom: 0; border-radius: 12px 12px 0 0; box-shadow: inset 0 -5px 0 var(--accent-2); }
[data-theme="pirate"] .roger .skull { position: absolute; left: 12px; top: 16px; font-size: 52px; line-height: 1; color: #fff; -webkit-text-stroke: 2px var(--line); text-shadow: 3px 3px 0 var(--line); }