
/* Black lacquer, metallic gold and ruby. Keep native dimensions and ordering. */
body[data-ww-game-active], #winwin-roadmap {
  --wwg-gold: linear-gradient(125deg,#fff8b0 0%,#ffdc43 19%,#fff3a0 36%,#ffc21b 57%,#f6a700 78%,#ffe67a 100%);
  --wwg-ruby: linear-gradient(155deg,#ff344e 0%,#ed0033 42%,#bb0026 100%);
  --wwg-metal: linear-gradient(145deg,#353947 0%,#191b24 46%,#0a0b10 100%);
  --wwg-edge: #e8b635;
  --wwg-card-gap: 32px;
  --wwg-section-gap: 36px;
}
/* Clip horizontal artwork without creating an unscrolled overflow container:
   overflow:hidden on the native shell traps sticky positioning while the page
   itself scrolls. The height-locked map layout still scrolls its own main. */
[data-ww-game-shell] { overflow: clip !important; background: #101117 !important; font-family: "Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif; }
[data-ww-game-header] { position: sticky; top: 0; z-index: 50; background: #0c0d13 !important; box-shadow: 0 5px 18px #0007 !important; }
[data-ww-game-header] > div:first-child { background: linear-gradient(110deg,#151720,#090a10 65%,#211a13); border-bottom-color: #e9b632 !important; }
[data-ww-game-header] button[aria-label="WINWIN コミュニティ"] > span:first-child { color: #ffdc4c !important; text-shadow: 0 1px 0 #fff4b2,0 2px 0 #985600,0 0 14px #ffd20055; }
[data-ww-game-header] button[aria-label="WINWIN コミュニティ"] > span:last-child { text-shadow: 0 2px 0 #000; }
[data-ww-game-header] [data-testid="mission-reminder-settings-button"] { background: var(--wwg-metal); box-shadow: inset 0 1px 1px #fff7,0 2px 0 #000,0 0 9px #ffd73925; }
[data-ww-game-stats] { background: linear-gradient(115deg,#976007,#eab62b 23%,#fff5a3 49%,#d3950b 77%,#a9710b) !important; border-top: 1px solid #fff0a0; border-bottom: 1px solid #8f5908; }
[data-ww-game-stats] > button { position: relative; background: var(--wwg-gold) !important; color: #251705 !important; border-color: #a56908 !important; border-radius: 16px; box-shadow: inset 0 1px 0 #fffce6,inset 0 0 0 2px #ffef9b90,inset 0 -3px 0 #c6891877,0 3px 0 #754306,0 5px 9px #56330040 !important; text-shadow: 0 1px 0 #fff7; transition: transform .12s,filter .12s; }
[data-ww-game-stats] > button > svg { filter: drop-shadow(0 1px 0 #fff9); stroke-width: 2.2; }
[data-ww-game-stats] > button[aria-label="メッセージ"] { border-radius: 50%; }
[data-ww-game-stats] > button > span { font-weight: 800; }
[data-ww-game-stats] > button > span > b { font-weight: 900; font-variant-numeric: tabular-nums; text-shadow: 0 1px 0 #fff9; }
[data-ww-game-stats] > button > b { background: var(--wwg-ruby) !important; color: white; text-shadow: 0 1px 2px #840015; box-shadow: 0 0 0 1px #ffe594,0 2px 4px #a24b0e88; }
[data-ww-game-nav] { position: relative; scroll-behavior: smooth !important; background: linear-gradient(#20212a,#0c0d13) !important; border-top-color: #ffd96b !important; padding-bottom: 12px !important; scrollbar-width: none; }
@media (prefers-reduced-motion: reduce) { [data-ww-game-nav] { scroll-behavior: auto !important; } }
[data-ww-game-nav]::-webkit-scrollbar { display: none; }
[data-ww-game-nav] > :is(button,a) { position: relative; border-radius: 13px !important; border: 1px solid #d7ad4e !important; background: linear-gradient(155deg,#fff9e6,#f4dfaa 55%,#e8c779) !important; color: #38260c !important; font-weight: 900 !important; text-shadow: none; box-shadow: inset 0 1px 0 #fffdf4,inset 0 -2px 0 #ae7d2644,0 3px 0 #654514,0 4px 9px #0008 !important; transition: transform .12s,filter .12s,box-shadow .15s; }
[data-ww-game-nav] > :is(button,a)[aria-current="page"] { background: linear-gradient(145deg,#ac2045,#841331) !important; color: #fff !important; border-color: #ffe184 !important; box-shadow: inset 0 1px 0 #ffafb9,inset 0 -2px 0 #600d25,0 3px 0 #500b1d,0 0 14px #ff294e44 !important; }
[data-ww-game-nav] > .wwr-top-navigation { position: sticky; left: 8px; z-index: 2; }
[data-ww-game-nav] > .wwr-top-navigation[aria-current="page"] { background: var(--wwg-gold) !important; color: #291b05 !important; text-shadow: 0 1px 0 #fff9; box-shadow: inset 0 1px 0 #ffffde,inset 0 -2px 0 #d99b13,0 3px 0 #895409,0 0 16px #ffcb4055 !important; }
[data-ww-game-nav] > :is(button,a) > span[data-testid$="-count"] { color: #fff !important; border: 1px solid #fff2c9 !important; background: #8f1737 !important; text-shadow: none; box-shadow: 0 1px 2px #38260c33; }
[data-ww-game-nav] > :is(button,a)[aria-current="page"] > span[data-testid$="-count"] { color: #75122c !important; background: #fff2c9 !important; border-color: #fff !important; }

/* Existing member pages, cards and form controls. */
[data-ww-game-shell] > main :is(h1,h2,h3) { font-weight: 900; text-wrap: pretty; }
[data-ww-game-shell] > main :is(article,[data-social-member-card]) { border-color: #d9ad42 !important; box-shadow: inset 0 1px 0 #fff,0 4px 0 #b4862855,0 10px 24px #4e350d24 !important; }
[data-ww-game-shell] > main [data-ww-game-control] { font-weight: 900 !important; box-shadow: inset 0 1px 0 #ffffff77,inset 0 -2px 0 #00000019,0 3px 0 #50361b45,0 5px 10px #00000016; transition: transform .12s,filter .12s; }
[data-ww-game-shell] > main :is(input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=file]),textarea,select):focus-visible { outline: 3px solid #ffbd20; outline-offset: 2px; box-shadow: 0 0 0 5px #ffcc2222; }
[data-ww-game-shell] > main .ww-followback-toggle { border-color: #ffe179; background: var(--wwg-ruby); color: #fff; box-shadow: inset 0 1px 0 #ffadbc,0 4px 0 #8c0021,0 6px 16px #d6002833; }
[data-ww-game-shell] > main .ww-followback-toggle :is(strong,.ww-followback-eyebrow) { color: #fff4bc; text-shadow: 0 2px #9b001c; }
[data-ww-game-shell] > main .ww-followback-icon { background: var(--wwg-gold); color: #442705; border-color: #fff3b2; box-shadow: inset 0 1px #fff,0 3px #a1610b; }

/* Vertical card rhythm only: leave card interiors, forms, navigation and
   horizontal swipe lists at their native spacing. Normalize both Tailwind
   space-y implementations (next-child top / previous-child bottom margins). */
[data-ww-game-shell] > main :is(
  [data-testid="social-member-list"],
  :is(.space-y-3,.space-y-4):not(.flex):not(.grid):has(> article + article),
  :is(.space-y-3,.space-y-4):not(.flex):not(.grid):has(> [data-slot="card"] + [data-slot="card"])
) > :is(article,[data-slot="card"]) { margin-block: 0 !important; }
[data-ww-game-shell] > main :is(
  [data-testid="social-member-list"],
  :is(.space-y-3,.space-y-4):not(.flex):not(.grid):has(> article + article),
  :is(.space-y-3,.space-y-4):not(.flex):not(.grid):has(> [data-slot="card"] + [data-slot="card"])
) > :is(article,[data-slot="card"]):not(:last-child) { margin-block-end: var(--wwg-card-gap) !important; }
[data-ww-game-shell] > main :is(
  [data-testid="event-referral-invite-card"],
  [data-testid="event-google-review-card"],
  [data-testid="event-gallery"],
  [data-testid="new-members-follow-frame"],
  [data-testid="important-owner-invite-card"],
  [data-testid="recent-following-frame"]
) { margin-top: var(--wwg-section-gap) !important; }
#winwin-roadmap .wwr-step:not(:last-child) { padding-bottom: var(--wwg-card-gap); }
body[data-ww-game-active] [role="dialog"] .space-y-2 > article:is([data-mission-type],[data-mission-kind]) { margin-block: 0 !important; }
body[data-ww-game-active] [role="dialog"] .space-y-2 > article:is([data-mission-type],[data-mission-kind]):has(~ article:is([data-mission-type],[data-mission-kind])) { margin-block-end: 24px !important; }

/* Start roadmap: preserve the entire five-stage composition and every CTA. */
main[data-ww-roadmap-host] { background: #101118 !important; }
#winwin-roadmap { color: #fff5d7; background: radial-gradient(ellipse at 100% 0,#69400024,transparent 650px),repeating-linear-gradient(135deg,#ffffff02 0 1px,transparent 1px 12px),#101118; }
#winwin-roadmap .wwr-hero { border: 2px solid #e9ba43; border-radius: 22px; background: linear-gradient(120deg,transparent 25%,#ffda7120 25.2%,transparent 25.5%,transparent 70%,#ffda7114 70.2%,transparent 70.7%),radial-gradient(ellipse at 100% 0,#9b61094d,transparent 75%),linear-gradient(145deg,#272835,#10121c 65%,#0a0b11); box-shadow: inset 0 1px 0 #fff0a4,inset 0 0 0 4px #e2b34512,0 6px 0 #714508,0 12px 28px #0009,0 0 24px #ffc0261a; }
#winwin-roadmap .wwr-hero::before { content: ''; position: absolute; pointer-events: none; top: 0; right: 0; width: 42%; height: 3px; background: linear-gradient(90deg,transparent,#fff4b2,#ffc91a); box-shadow: 0 0 14px #ffce33; }
#winwin-roadmap .wwr-kicker { font-size: 10px; color: #ffe57c; letter-spacing: .14em; }
#winwin-roadmap .wwr-kicker span { background: #ffcf32; box-shadow: 0 0 9px #ffb700; transform: rotate(45deg); border-radius: 1px; }
#winwin-roadmap h1 { font-size: clamp(24px,6.5vw,32px); font-weight: 950; line-height: 1.5; letter-spacing: -.035em; color: #fff; text-shadow: 0 2px 0 #090a11,0 4px 12px #0009; }
#winwin-roadmap h1 em { color: #ffdb47; text-shadow: 0 1px 0 #fff1a6,0 3px 0 #9d5608,0 5px 14px #ffb90033; }
#winwin-roadmap .wwr-hero > p { color: #eee9d9; font-size: 14px; }
#winwin-roadmap .wwr-progress-head { color: #eee4c9; font-size: 12px; }
#winwin-roadmap .wwr-progress-head strong { font-size: 31px; color: #ffe253; text-shadow: 0 2px 0 #8a4a00,0 0 14px #ffbd3333; }
#winwin-roadmap .wwr-progress-head small { color: #fff0ca; font-size: 12px; }
#winwin-roadmap .wwr-progress span { height: 8px; border-radius: 3px; transform: skewX(-10deg); background: #080b12; box-shadow: inset 0 1px 3px #000,0 1px 0 #ffffff26; }
#winwin-roadmap .wwr-progress .is-complete { background: linear-gradient(#fff8b9,#ffd438 49%,#e99800 51%,#ffd633); box-shadow: inset 0 1px #ffffdf,0 0 10px #ffd32455; }
#winwin-roadmap .wwr-next { border-left: 3px solid #ff3150; padding-left: 11px; }
#winwin-roadmap .wwr-next > span { color: #ffd64b; font-size: 11px; letter-spacing: .16em; text-shadow: 0 0 12px #ffb50044; }
#winwin-roadmap .wwr-next strong { font-size: 16px; color: #fff7db; text-shadow: 0 2px 0 #000; }
#winwin-roadmap .wwr-step:not(:last-child)::before { border-color: #977b36; }
#winwin-roadmap .wwr-marker { background: linear-gradient(#585d6d,#272a36); border: 1px solid #a8abb6; color: #e9eaf0; box-shadow: inset 0 1px #ffffff77,0 3px 0 #090a10; }
#winwin-roadmap .wwr-card { border-radius: 18px; border-color: #9fa3b0; background: linear-gradient(125deg,#f2f2f5,#c6cad3 45%,#e5e6ec 73%,#a7adbc); color: #232633; box-shadow: inset 0 1px 0 #fff,inset 0 0 0 3px #ffffff44,0 5px 0 #5a6070,0 9px 20px #0006; }
#winwin-roadmap .wwr-current .wwr-card { border-color: #ffd75a; background: radial-gradient(ellipse at top right,#ff865455,transparent 55%),linear-gradient(145deg,#ff2445,#e6002c 52%,#b10028); color: white; box-shadow: inset 0 1px #ffcb9b,inset 0 0 0 3px #ffea741a,0 5px 0 #6e001b,0 0 0 1px #be6e1a,0 9px 22px #ff153133; }
#winwin-roadmap .wwr-done .wwr-card { background: radial-gradient(ellipse at 90% 15%,#fffde9b0,transparent 42%),linear-gradient(125deg,#e7a100,#ffce00 14%,#fff171 30%,#fff8c0 39%,#ffcc0e 50%,#ffac00 67%,#fff58b 82%,#ffc400); border-color: #ffe269; box-shadow: inset 0 1px #ffffe7,inset 0 0 0 3px #fff6c25c,inset 0 -5px 12px #e58c0055,0 5px 0 #9a5900,0 9px 22px #ffc60026; }
#winwin-roadmap .wwr-current .wwr-marker { color: #ffe794; border-color: #fff0a1; background: var(--wwg-ruby); box-shadow: inset 0 1px #ffb8b8,0 3px #75001b,0 0 12px #ff174966; }
#winwin-roadmap .wwr-done .wwr-marker { border-color: #fff0a0; background: var(--wwg-gold); color: #372003; box-shadow: inset 0 1px #fff,0 3px #94620b,0 0 12px #ffce5566; }
#winwin-roadmap .wwr-clear-stamp { position: relative; background: linear-gradient(120deg,#fa2443,#e80027 45%,#c4002a); border-bottom-color: #7d001b; color: #fff5c9; text-shadow: 0 2px 0 #8a001b,0 4px 0 #74001855; box-shadow: inset 0 1px #ff9e8d; font-style: italic; letter-spacing: -.03em; }
#winwin-roadmap .wwr-step-label { font-size: 11px; letter-spacing: .12em; }
#winwin-roadmap .wwr-status { border-radius: 5px; font-size: 11px; background: #4f5361; color: #fff; box-shadow: inset 0 1px #fff4,0 2px #0002; }
#winwin-roadmap .wwr-current .wwr-status { background: var(--wwg-gold); color: #6c1300; }
#winwin-roadmap h2 { font-size: 16px; letter-spacing: -.025em; text-shadow: 0 1px #ffffff44; }
#winwin-roadmap .wwr-current h2 { text-shadow: 0 2px #930019; }
#winwin-roadmap .wwr-card p { font-size: 14px; line-height: 1.8; color: #444653; }
#winwin-roadmap .wwr-done .wwr-card p { color: #413007; }
#winwin-roadmap .wwr-current .wwr-card p { color: #fff5e4; }
#winwin-roadmap .wwr-icon { border-radius: 9px; border: 1px solid #687184; background: linear-gradient(#5f6676,#323746); color: #fff; box-shadow: inset 0 1px #fff6,0 3px 0 #3b404c; }
#winwin-roadmap .wwr-done .wwr-icon { border-color: #ab6c09; background: linear-gradient(#fff8b0,#e8a717); color: #4e2a00; box-shadow: inset 0 1px #fff,0 3px #9b620b; }
#winwin-roadmap .wwr-current .wwr-icon { border-color: #ffd664; background: linear-gradient(#5c152e,#300c22); color: #ffe276; box-shadow: inset 0 1px #ffbf9444,0 3px #790020; }
#winwin-roadmap .wwr-action { position: relative; border: 1px solid #fff0a1; border-radius: 11px; font-size: 14px; font-weight: 900; background: var(--wwg-gold); color: #322005; box-shadow: inset 0 1px #fffde2,inset 0 -2px #bc730066,0 4px 0 #8b5507,0 6px 12px #0002; text-shadow: 0 1px #fff8; transition: transform .12s,filter .12s,box-shadow .12s; }
#winwin-roadmap .wwr-done .wwr-action { background: linear-gradient(145deg,#383334,#19191e); border-color: #ffedab; color: #ffe9a0; text-shadow: 0 1px #000; box-shadow: inset 0 1px #ffe77b55,0 4px 0 #101014,0 5px 9px #0003; }
#winwin-roadmap .wwr-action > span[aria-hidden] { font-size: 20px; line-height: 1; }
#winwin-roadmap .wwr-action.wwr-line { background: linear-gradient(#08ae58,#087b40); color: white; border-color: #69e794; text-shadow: 0 1px #00552a; box-shadow: inset 0 1px #a5ffbb77,0 4px #004c2b; }
#winwin-roadmap .wwr-footer p { color: #c2bdaf; font-size: 12px; }
#winwin-roadmap .wwr-footer .wwr-congrats { color: #ffe079; font-size: 14px; }
#winwin-roadmap .wwr-learn { color: #ffe079; font-size: 13px; font-weight: 800; }
#winwin-roadmap .wwr-error { color: #4f2810; }
.wwr-back { background: linear-gradient(#302c26,#18181c); border-color: #aa8334; color: #ffe4a0; box-shadow: inset 0 1px #ffffff22,0 3px #090a0d; }

/* Three text-only navigation tiles. */
#winwin-fixed-actions .ww-dock { box-shadow:inset 0 1px #fff6b5,0 -4px 20px #0005; }
#winwin-fixed-actions .ww-action { text-shadow:none;box-shadow:inset 0 1px #fff6d4,0 3px #896117; }

/* Page-local registration, dialogs and the existing contact guide. */
#ww-welfare-registration { background: linear-gradient(#fffaf0,#fff2cc); }
#ww-welfare-registration .wwf-intro { padding: 18px; border: 1px solid #f3c65b; border-radius: 16px; background: var(--wwg-metal); color: #fff0ac; box-shadow: inset 0 1px #fff2ab77,0 4px 0 #71501b; }
#ww-welfare-registration .wwf-intro > span { color: #ffd464; }
#ww-welfare-registration h1 { font-weight: 900; text-shadow: 0 2px #000; }
#ww-welfare-registration fieldset { border: 1px solid #cdab54; box-shadow: inset 0 1px #fff,0 4px #b4872822,0 9px 20px #70510c11; }
#ww-welfare-registration label { font-size: 14px; }
#ww-welfare-registration .wwf-submit { background: var(--wwg-ruby); border-color: #f7c863; font-size: 14px; text-shadow: 0 2px #9a001b; box-shadow: inset 0 1px #ffb1af,0 4px #820020,0 7px 14px #b7002226; }
#ww-welfare-registration .wwf-image-picker { background: var(--wwg-gold); border-color: #b38829; box-shadow: inset 0 1px #fff,0 3px #b4831f; }
body[data-ww-game-active] [role="dialog"][data-slot="dialog-content"] { border-color: #d7ad48; box-shadow: inset 0 1px #ffefae,0 0 0 3px #ffe39622,0 18px 60px #0008; }
#winwin-contact-guide { border-top-color: #ffd147; background: #fff9e8; }
#winwin-contact-guide .ww-guide-header { background: linear-gradient(135deg,#292a34,#101019); box-shadow: inset 0 -1px #edb548; }
#winwin-contact-guide h2 { color: #fff0ba; text-shadow: 0 2px #000; }
#winwin-contact-guide .ww-guide-topics button { border-radius: 10px; background: linear-gradient(#39352d,#191a21); color: #ffe6a3; border-color: #bd9442; box-shadow: inset 0 1px #ffe8aa55,0 3px #14151b; }
#winwin-contact-guide .ww-guide-mine { background: var(--wwg-gold); border-color: #d6a139; }
#winwin-contact-guide .ww-guide-send:not(:disabled) { background: var(--wwg-ruby); color: #fff; border-color: #dc9b41; box-shadow: inset 0 1px #ffbab5,0 3px #8d0022; }
#winwin-contact-guide .ww-guide-close { border-radius: 12px; border-color: #d7b157; background: linear-gradient(#42372c,#211c1d); box-shadow: inset 0 1px #fff3,0 3px #000; }

/* Immediate press feedback; opt-out and reduced motion are applied below. */
:is([data-ww-game-stats] > button,[data-ww-game-nav] > button,[data-ww-game-nav] > a,[data-ww-game-control],#winwin-roadmap .wwr-action,#ww-welfare-registration .wwf-submit):not(:disabled):not([aria-disabled="true"]):active { transform: translateY(2px) scale(.985); filter: brightness(1.1); }
@media (hover:hover) { :is([data-ww-game-stats] > button,[data-ww-game-nav] > button,[data-ww-game-nav] > a,[data-ww-game-control],#winwin-roadmap .wwr-action,#ww-welfare-registration .wwf-submit):not(:disabled):not([aria-disabled="true"]):hover { filter: brightness(1.1); } }
:is([data-ww-game-shell],#winwin-fixed-actions) :is(button,a,input,textarea,select):focus-visible { outline: 3px solid #f8b927; outline-offset: 3px; }
@media (prefers-reduced-motion:reduce) { :is([data-ww-game-stats] > button,[data-ww-game-nav] > button,[data-ww-game-nav] > a,[data-ww-game-control],#winwin-roadmap .wwr-action,#winwin-fixed-actions .ww-action) { transition: none !important; } :is([data-ww-game-stats] > button,[data-ww-game-nav] > button,[data-ww-game-nav] > a,[data-ww-game-control],#winwin-roadmap .wwr-action,#winwin-fixed-actions .ww-action):active { transform: none !important; } }
@media (max-width:360px) { #winwin-roadmap h1 { font-size: 23px; } #winwin-roadmap h2 { font-size: 15px; } #winwin-roadmap .wwr-action { padding-inline: 10px; font-size: 13px; } #winwin-fixed-actions .ww-title,#winwin-fixed-actions .ww-contact-label { font-size: .72rem; } #winwin-fixed-actions .ww-eyebrow { font-size: .625rem; } }

/* WINWIN arcade system: engraved type, gold armour and punchy action surfaces. */
body[data-ww-game-active], #winwin-roadmap { --ww-display: "Barlow Condensed","Arial Narrow","Noto Sans JP",sans-serif; --ww-japanese: "Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif; }
[data-ww-game-shell],#winwin-fixed-actions,#winwin-contact-guide,#winwin-roadmap { font-family: var(--ww-japanese); }
[data-ww-game-header] { border-bottom: 1px solid #f9dc76; }
[data-ww-game-header] button[aria-label="WINWIN コミュニティ"] > span:first-child { font-family: var(--ww-display); font-weight: 900; font-style: italic; letter-spacing: -.035em; }
[data-ww-game-stats] > button { background: linear-gradient(125deg,#fffaad 0%,#ffe253 18%,#fff9bc 33%,#ffd122 45%,#f7a900 70%,#ffe979 100%) !important; border-radius: 17px 10px 17px 10px; border-width: 2px; box-shadow: inset 0 2px 0 #fffce4,inset 0 0 0 2px #ffe985,0 4px 0 #804400,0 7px 9px #4f2b0055 !important; }
[data-ww-game-stats] > button > span > b { font-family: var(--ww-display); font-weight: 900; }
/* Navigation colors stay in game-theme so the text and badges share one palette. */
[data-ww-game-nav] > :is(button,a) { font-family: var(--ww-japanese); letter-spacing: .015em; border-radius: 17px 7px 17px 7px !important; border-width: 2px !important; }
#winwin-roadmap { background: radial-gradient(ellipse at 90% 1%,#5f2e6650,transparent 680px),radial-gradient(ellipse at 0 36%,#29417724,transparent 600px),repeating-linear-gradient(135deg,#ffffff02 0 1px,transparent 1px 12px),#0b0d16; }
#winwin-roadmap .wwr-hero { position: relative; border-radius: 26px 10px 26px 10px; background: radial-gradient(ellipse at 110% -15%,#b56e1b88,transparent 68%),linear-gradient(145deg,#282c3f,#121725 50%,#080c14); box-shadow: inset 0 2px #ffffcd,inset 0 0 0 5px #d9ad3f18,0 7px 0 #6c440d,0 16px 35px #0008; }
#winwin-roadmap .wwr-hero::before { width: 65%; height: 2px; }
#winwin-roadmap .wwr-kicker { font-family: var(--ww-display); font-size: 14px; letter-spacing: .2em; font-weight: 800; }
#winwin-roadmap h1 { font-size: clamp(25px,6.4vw,34px); font-family: var(--ww-japanese); font-weight: 900; letter-spacing: -.045em; line-height: 1.45; }
#winwin-roadmap h1 em { display: inline-block; font-style: normal; color: #ffe466; background: linear-gradient(#fffbd4 5%,#fff083 36%,#ffd52d 40%,#fdb600 77%,#fff3a8); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-shadow: none; filter: drop-shadow(0 2px 0 #915106) drop-shadow(0 4px 0 #060a13) drop-shadow(0 0 12px #ffc12330); }
#winwin-roadmap .wwr-hero > p { font-size: 16px; line-height: 1.8; }
#winwin-roadmap .wwr-progress-head { font-size: 14px; }
#winwin-roadmap .wwr-progress-head strong { font-family: var(--ww-display); font-size: 44px; font-weight: 900; font-style: italic; }
#winwin-roadmap .wwr-progress-head small { font-family: var(--ww-japanese); font-style: normal; font-size: 13px; }
#winwin-roadmap .wwr-progress span { height: 10px; transform-origin: left; border: 1px solid #b78c292a; }
#winwin-roadmap .wwr-next { padding: 12px 14px; border: 1px solid #a7783444; border-left: 4px solid #ff3157; border-radius: 0 10px 10px 0; background: linear-gradient(100deg,#731b353b,transparent); }
#winwin-roadmap .wwr-next > span { font-family: var(--ww-display); font-size: 15px; font-weight: 800; }
#winwin-roadmap .wwr-next strong { font-size: 17px; line-height: 1.7; }
#winwin-roadmap .wwr-card { position: relative; border-radius: 22px 8px 22px 8px; }
#winwin-roadmap .wwr-step-label { font: 900 18px/1 var(--ww-display); letter-spacing: .1em; }
#winwin-roadmap .wwr-status { font-size: 12px; border: 1px solid #ffffff44; }
#winwin-roadmap .wwr-marker { font: 900 14px/1 var(--ww-display); }
#winwin-roadmap .wwr-clear-stamp { font-family: var(--ww-display); font-size: 44px; letter-spacing: .02em; padding-block: 5px; background: linear-gradient(110deg,#ef0040,#c6002c 50%,#f50032); text-shadow: 0 3px 0 #760015,0 5px 0 #2e001755; }
#winwin-roadmap .wwr-clear-stamp b { display: inline-block; transform-origin: center; }
#winwin-roadmap .wwr-done .wwr-card { background: linear-gradient(120deg,#d78a00,#ffca0b 15%,#fffabf 33%,#ffd326 45%,#f5a100 70%,#fff59b 87%,#ffc52d); }
#winwin-roadmap .wwr-done .wwr-card::after { top: 78px; width: 14px; height: 14px; filter: drop-shadow(0 0 5px #fff5bd); }
#winwin-roadmap .wwr-current .wwr-card { background: radial-gradient(ellipse at 100% 0,#ff996366,transparent 65%),linear-gradient(145deg,#f91e53,#da0039 50%,#a6002e); }
#winwin-roadmap h2 { font-size: 18px; line-height: 1.55; font-weight: 900; }
#winwin-roadmap .wwr-card p { font-size: 16px; line-height: 1.8; }
#winwin-roadmap .wwr-action { min-height: 48px; font-size: 14px; border-width: 2px; border-radius: 12px 5px 12px 5px; }
#winwin-roadmap .wwr-card small { font-size: 12px; }
#winwin-roadmap .wwr-current .wwr-action { box-shadow: inset 0 2px #ffffd8,inset 0 -2px #bb720077,0 5px 0 #713805,0 8px 17px #31000e66; }
#winwin-roadmap .wwr-icon { width: 36px; height: 36px; border-radius: 12px 5px 12px 5px; }
[data-ww-game-shell] > main [data-ww-game-control] { font-family: var(--ww-japanese); border-radius: 16px 7px 16px 7px; }
#ww-welfare-registration .wwf-intro { border-radius: 20px 7px 20px 7px; background: radial-gradient(ellipse at top right,#70452970,transparent 70%),var(--wwg-metal); }
#winwin-fixed-actions .ww-dock { background: linear-gradient(170deg,#424752 0%,#1c2230 18%,#0d101b 62%,#181b26 100%); border-color: #ffe38a; box-shadow: inset 0 1px #ffffd8,inset 0 0 0 4px #b9882625,0 -5px 24px #05071177,0 0 12px #ffcc362a; }
#winwin-fixed-actions .ww-medallion { width: 38px; height: 38px; border-width: 2px; }
#winwin-fixed-actions .ww-medallion::after { content: ''; position: absolute; inset: 3px; border: 1px solid #fff2; border-radius: inherit; pointer-events: none; }
#winwin-fixed-actions .ww-action { -webkit-tap-highlight-color: transparent; }
#winwin-fixed-actions .ww-action:not(:disabled):active .ww-medallion { filter: brightness(1.18); }
#winwin-fixed-actions .ww-title,#winwin-fixed-actions .ww-contact-label { font-family: var(--ww-japanese); font-weight: 900; }
.wwfx-preferences { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 7px; margin-top: 15px; }
.wwfx-preferences button { font: 700 12px/1.4 var(--ww-japanese); min-height: 34px; border: 1px solid #b4944666; border-radius: 6px; background: #060b1580; color: #ffe7a1; padding: 6px 10px; cursor: pointer; }
.wwfx-preferences button[aria-pressed=false] { color: #d1cfcd; border-color: #8c91a555; }
.wwfx-preferences button:disabled { opacity: .65; cursor: default; }
.wwfx-preferences button:focus-visible { outline: 3px solid #ffe67f; outline-offset: 3px; }
.wwfx-layer { position: fixed; inset: 0; pointer-events: none !important; z-index: 2147483000; overflow: hidden; contain: strict; }
.wwfx-burst { position: absolute; width: 0; height: 0; pointer-events: none; }
.wwfx-ring { position: absolute; width: 48px; height: 48px; border: 2px solid var(--wwfx-color); border-radius: 50%; box-shadow: 0 0 12px var(--wwfx-color),inset 0 0 8px var(--wwfx-color); opacity: 0; }
.wwfx-spark { position: absolute; display: block; width: 5px; height: 5px; border-radius: 1px; background: var(--wwfx-color); box-shadow: 0 0 6px var(--wwfx-color); opacity: 0; }
body[data-ww-effects=on] #winwin-roadmap .wwr-current .wwr-action { overflow: hidden; }
body[data-ww-effects=on] #winwin-roadmap .wwr-current .wwr-action::after { content: ''; position: absolute; inset: -30% auto -30% -50%; width: 22%; pointer-events: none; background: linear-gradient(90deg,transparent,#fff9,transparent); transform: skewX(-24deg); animation: wwfx-sweep 1.5s ease-out .6s 1 both; }
@keyframes wwfx-sweep { from { left: -50%; } to { left: 150%; } }
body[data-ww-effects=off] :is([data-ww-game-shell],#winwin-fixed-actions,#winwin-contact-guide,#winwin-roadmap) :is(button,a) { animation: none !important; transition: none !important; }
body[data-ww-effects=off] :is([data-ww-game-shell],#winwin-fixed-actions,#winwin-contact-guide,#winwin-roadmap) :is(button,a):active { transform: none !important; }
@media (prefers-reduced-motion:reduce) { .wwfx-layer { display: none; } #winwin-roadmap .wwr-action::after { animation: none !important; } }
@media (max-width:360px) { #winwin-roadmap h1 { font-size: 25px; } #winwin-roadmap h2 { font-size: 16px; } #winwin-roadmap .wwr-card p { font-size: 16px; } #winwin-roadmap .wwr-action { font-size: 14px; } #winwin-roadmap .wwr-kicker { font-size: 13px; letter-spacing: .13em; } }

/* Replace only the original mission cell. The native four-column grid,
   social buttons and row height remain authoritative. */
[data-ww-referral-stats] > [data-testid="mission-summary-button"] { display:none!important; }
[data-ww-referral-stats] > .ww-header-referral { box-sizing:border-box;display:flex;align-items:center;justify-content:center;min-width:0;padding:3px 4px;border:1px solid #fff1a2;border-radius:16px;background:linear-gradient(120deg,#123f32,#075238 52%,#113b2f);color:#fff4b0;text-decoration:none;text-align:center;box-shadow:inset 0 1px 0 #fff6bd80,inset 0 0 0 2px #d6ad3b4d,0 3px 0 #664412,0 5px 9px #452b0038; }
.ww-header-referral-copy { display:flex;flex-direction:column;align-items:center;min-width:0;line-height:1.2; }
.ww-header-referral-copy > * { display:block;white-space:nowrap;font-style:normal; }
.ww-header-referral-copy > span:first-child { color:#fff8d8;font-size:clamp(9px,2.75vw,11px);font-weight:900; }
.ww-header-referral-copy > strong { color:#ffe16b;font-size:clamp(8px,2.45vw,10px);font-weight:900; }
.ww-header-referral-copy > span:last-child { color:#fff5ca;font-size:clamp(8px,2.3vw,9px);font-weight:700; }
.ww-header-referral:focus-visible { outline:3px solid #fff!important;outline-offset:2px; }
.ww-header-referral:active { filter:brightness(1.12); }
