:root {
  color-scheme: light;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  color: #16302b;
  background: #f4f7f2;
  line-height: 1.65;
}
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #075b4b; text-underline-offset: .2em; }
a:focus-visible { outline: 3px solid #d97830; outline-offset: 3px; }
.shell { max-width: 1120px; margin: auto; padding: 0 24px; }
.site-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 0; border-bottom: 1px solid #cfdcd5; }
.brand { margin: 0; color: #174a3e; font-weight: 850; letter-spacing: .07em; text-decoration: none; }
.brand span { color: #7d8f83; font-weight: 600; }
.hold { display: inline-block; border: 1px solid #af553a; border-radius: 999px; color: #8d352a; background: #fff5ef; padding: 4px 12px; font-size: .82rem; font-weight: 750; }
main { padding: 32px 0 64px; }
.hero { padding: 46px 50px; background: #d9eee2; border-radius: 22px; margin-bottom: 46px; }
.eyebrow { text-transform: uppercase; letter-spacing: .12em; font-size: .77rem; color: #376556; font-weight: 800; margin: 0 0 12px; }
h1, h2, h3 { line-height: 1.3; letter-spacing: -.025em; }
h1 { font-size: clamp(2rem, 4vw, 3.25rem); margin: 0 0 20px; }
h2 { font-size: 1.55rem; margin: 0 0 12px; }
h3 { font-size: 1.4rem; margin: 0 0 12px; }
.hero > p:not(.eyebrow) { max-width: 760px; }
.notice { border-left: 4px solid #a85838; background: #fff4e9; padding: 13px 17px; color: #663623; font-weight: 650; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: 16px; }
.small { color: #556963; font-size: .88rem; }
.cards, .detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.cards[hidden] { display: none; }
.card, .panel, .source-box { border: 1px solid #d4e2da; border-radius: 18px; padding: 25px; background: #fff; }
.card { display: flex; flex-direction: column; }
.card[hidden] { display: none; }
.card p { margin: 0 0 16px; }
.tag { color: #1b6955; font-weight: 700; font-size: .85rem; }
dl { display: grid; grid-template-columns: minmax(100px, 31%) 1fr; row-gap: 12px; margin: 16px 0 24px; }
dt { color: #5a6c64; font-size: .88rem; font-weight: 700; }
dd { margin: 0; overflow-wrap: anywhere; }
.button { display: inline-block; align-self: start; margin-top: auto; border-radius: 9px; padding: 10px 15px; background: #095b4b; color: white; text-decoration: none; font-weight: 700; }
.button:hover { background: #063e34; }
.return-box { margin-top: 38px; padding: 23px 27px; border-radius: 16px; background: #e8ede7; }
.return-box p:last-child { margin-bottom: 0; }
.back { display: inline-block; margin-bottom: 20px; font-weight: 700; }
.detail > .notice { margin-bottom: 24px; }
.source-box { margin-top: 20px; }
.url { overflow-wrap: anywhere; font-family: ui-monospace, Consolas, monospace; background: #f2f6f3; padding: 12px; border-radius: 7px; }
footer { border-top: 1px solid #cfdcd5; padding: 20px 0 35px; font-size: .85rem; color: #4e6259; }
@media (max-width: 720px) {
  .shell { padding: 0 16px; }
  .site-header, .section-heading { align-items: start; flex-direction: column; }
  .hero { padding: 27px 24px; }
  .cards, .detail-grid { grid-template-columns: 1fr; }
  dl { grid-template-columns: 1fr; row-gap: 3px; }
  dd { margin-bottom: 10px; }
}

.free-to-play-cards { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }

/* Scope the compact list so shared mother-site styles and detail pages stay intact. */
body[data-n6-choice-layout] { font-size: 1.0625rem; line-height: 1.75; background: #f5f7f4; }
body[data-n6-choice-layout] .shell { max-width: 1060px; padding-inline: 24px; }
body[data-n6-choice-layout] .site-header { padding-block: 16px; gap: 12px; }
/* The embedded version already has the shared brand, return link and jump. */
body[data-n6-choice-layout][data-botai-product="0006"] .site-header { display: none; }
body[data-n6-choice-layout] .brand { font-size: 1rem; letter-spacing: .015em; }
body[data-n6-choice-layout] .choice-jump { padding: 8px 0; font-size: 1rem; }
body[data-n6-choice-layout] main { padding-block: 20px 40px; }
body[data-n6-choice-layout] .choice-intro { margin-bottom: 24px; }
body[data-n6-choice-layout] .choice-intro h1 { font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.3; margin: 0 0 12px; max-width: none; }
body[data-n6-choice-layout] .choice-intro h1 span { display: inline-block; }
body[data-n6-choice-layout] .choice-intro p { margin: 0; max-width: 60ch; }
body[data-n6-choice-layout] h2 { font-size: 1.25rem; line-height: 1.5; margin: 0 0 16px; }
body[data-n6-choice-layout] #free-to-play { margin-bottom: 28px; scroll-margin-top: 16px; }
body[data-n6-choice-layout] .free-to-play-cards { gap: 20px; }
body[data-n6-choice-layout] .card { padding: 22px; border: 1px solid #cedbd4; border-radius: 16px; min-width: 0; }
body[data-n6-choice-layout] .card .tag { font-size: 1rem; color: #075b4b; margin: 0 0 8px; }
body[data-n6-choice-layout] .card h3 { font-size: 1.5rem; margin: 0 0 10px; line-height: 1.35; }
body[data-n6-choice-layout] .card p { margin: 0 0 12px; }
body[data-n6-choice-layout] .quick-facts { display: flex; flex-wrap: wrap; gap: 4px 14px; list-style: none; padding: 0; margin: 0 0 10px; font-size: 1rem; font-weight: 650; }
body[data-n6-choice-layout] .checked-date { font-size: 1rem; color: #475e56; }
body[data-n6-choice-layout] .card .button { font-size: 1rem; line-height: 1.6; min-height: 48px; width: 100%; padding: 11px 14px; margin-top: auto; border-radius: 9px; text-align: center; overflow-wrap: anywhere; }
body[data-n6-choice-layout] .choice-note { font-size: 1rem; line-height: 1.75; color: #475e56; margin: 16px 0 0; }
body[data-n6-choice-layout] .limited-offers { border-top: 1px solid #cfdcd5; padding-top: 24px; margin-bottom: 24px; }
body[data-n6-choice-layout] .limited-offers .notice { font-weight: 400; }
body[data-n6-choice-layout] .choice-help { border: 1px solid #cfdcd5; background: #fff; border-radius: 12px; }
body[data-n6-choice-layout] .choice-help summary { padding: 16px 20px; min-height: 48px; font-weight: 650; cursor: pointer; }
body[data-n6-choice-layout] .choice-help > div { border-top: 1px solid #cfdcd5; padding: 0 20px 12px; }
body[data-n6-choice-layout] .choice-help dt { font-size: 1rem; }
body[data-n6-choice-layout] .destination-note { color: var(--muted, #475e56); font-size: 1rem; margin: -4px 0 16px; }
body[data-n6-choice-layout] .product-workspace-anchor { display: block; width: 0; height: 0; scroll-margin-top: 20px; }
body[data-n6-choice-layout] .product-guide-content ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; list-style: none; padding: 20px 0; margin: 0 0 20px; border-bottom: 1px solid var(--line, #cfdcd5); }
body[data-n6-choice-layout] .product-guide-content li { min-width: 0; }
body[data-n6-choice-layout] .product-guide-content h2 { margin-top: 24px; }
body[data-n6-choice-layout] .product-return { display: flex; flex-wrap: wrap; gap: 12px 24px; max-width: 1060px; margin: auto; padding: 0 24px 32px; }
body[data-n6-choice-layout] .product-return a { display: inline-flex; align-items: center; min-height: 48px; }
body[data-n6-choice-layout] footer { margin-top: 28px; font-size: 1rem; }
body[data-n6-choice-layout] :is(a,summary):focus-visible { outline: 3px solid #a84b10; outline-offset: 4px; }
body[data-n6-choice-layout] :is(p,li,dd,h1,h2,h3) { overflow-wrap: anywhere; }
@media (max-width: 720px) {
  body[data-n6-choice-layout] .shell { padding-inline: 16px; }
  body[data-n6-choice-layout] .site-header { flex-direction: row; align-items: center; flex-wrap: wrap; }
  body[data-n6-choice-layout] .choice-intro { margin-bottom: 20px; }
  body[data-n6-choice-layout] .card { padding: 18px; }
  body[data-n6-choice-layout] .free-to-play-cards { grid-template-columns: minmax(0, 1fr); }
  body[data-n6-choice-layout] .product-guide-content ol { grid-template-columns: 1fr; gap: 12px; }
}

.offer-review{margin:1rem 0;padding:1rem;border:1px solid #dbe3d9;border-radius:12px;background:#eff5ee}.offer-review h4{margin:0 0 .75rem;font-size:1rem;line-height:1.6}.offer-review dl{margin:0;display:grid;gap:.3rem}.offer-review dt{font-weight:700}.offer-review dd{margin:0 0 .65rem;line-height:1.7;overflow-wrap:anywhere}
.personal-offers{margin:2rem 0;padding:1.25rem;border:1px solid #b4c9db;border-radius:1rem;background:#f7fbff;color:#18324a}
.personal-offers form{display:grid;gap:.85rem;max-width:40rem}.personal-offers label{display:grid;gap:.25rem;font-weight:700}
.personal-offers input{box-sizing:border-box;width:100%;max-width:100%;padding:.65rem;border:1px solid #68829a;border-radius:.4rem;font:inherit}
.personal-offers button{width:fit-content;padding:.55rem .8rem;cursor:pointer}
.personal-offers ul{list-style:none;padding:0;display:grid;gap:.75rem}.personal-offers li{display:grid;gap:.35rem;padding:.75rem;background:#fff;border:1px solid #cad6e0;border-radius:.5rem;overflow-wrap:anywhere}
.personal-offers li p{margin:0}.personal-offers li a{width:fit-content;max-width:100%}
