/* badmintonapi.com: the home page sections. */
.card { background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.s-live .pill { background: #FBEDE6; color: #B24A22; }
.s-live .ln b { color: #B24A22; }
.cap { display: block; font-size: 11.5px; color: var(--muted); margin-top: 6px; text-align: center; }
@keyframes pulse { 50% { opacity: .25; } }
.g-major { background: var(--deep); color: var(--gold-lt); }
.ev { display: inline-grid; place-items: center; width: 30px; height: 22px; border-radius: 4px; background: var(--paper); border: 1px solid var(--line); font-size: 11px; font-weight: 700; color: var(--deep); }
.m td { padding-top: 10px; padding-bottom: 10px; }
.pl { display: flex; flex-direction: column; gap: 6px; }
.pl span { display: flex; align-items: center; gap: 10px; }
.pl .w { font-weight: 700; color: var(--deep); }
.mv { font-size: 12px; font-weight: 700; }
.mv.sh { color: #1E7A4C; }
.mv.eq { color: var(--muted); }
.up { color: #1E7A4C; font-size: 12px; font-weight: 700; }
.dn { color: #A33232; font-size: 12px; font-weight: 700; }
.sh { display: flex; align-items: flex-end; gap: 20px; margin-bottom: 30px; }
.sh h2 { margin: 0; font: 700 34px/1.2 "Shippori Mincho", serif; color: var(--deep); }
.sh h2::after { content: ""; display: block; width: 44px; height: 2px; background: var(--gold); margin-top: 16px; }
.sh p { margin: 0 0 4px auto; max-width: 420px; color: #4A544F; font-size: 15px; }
@media (max-width: 960px) {
.sh { flex-direction: column; align-items: flex-start; gap: 12px; }
.sh p { margin-left: 0; }
.sh h2 { font-size: 28px; }
}
.hero2 { position: relative; overflow: hidden; color: #fff; isolation: isolate; background: linear-gradient(160deg, #0B4538 0%, #083A30 38%, #062B25 70%, #041F1A 100%); border-bottom: 1px solid var(--gold); }
.hero2 .glow { position: absolute; inset: -20%; z-index: -2; pointer-events: none; background: radial-gradient(38% 42% at 76% 44%, rgba(34,150,112,.55) 0%, rgba(34,150,112,0) 70%), radial-gradient(30% 36% at 92% 90%, rgba(20,110,120,.45) 0%, rgba(20,110,120,0) 70%), radial-gradient(34% 30% at 18% 8%, rgba(226,199,127,.22) 0%, rgba(226,199,127,0) 70%), radial-gradient(40% 40% at 40% 100%, rgba(10,63,53,.9) 0%, rgba(10,63,53,0) 70%); animation: drift 26s ease-in-out infinite alternate; }
@keyframes drift { 0% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(-3%,2%,0) scale(1.05); } 100% { transform: translate3d(2%,-2%,0) scale(1.02); } }
.hero2 .wrap2 { position: relative; max-width: 1200px; margin: 0 auto; padding: 88px 24px 84px; display: grid; grid-template-columns: 1fr 560px; gap: 64px; align-items: center; }
.hero2 .wrap2 > * { min-width: 0; }
.hero2 .over { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-lt); font-weight: 700; }
.hero2 .over::before { content: ""; width: 34px; height: 1px; background: var(--gold-lt); }
.hero2 h1 { font: 700 64px/1.04 "Shippori Mincho", serif; margin: 22px 0 0; letter-spacing: -.012em; color: #fff; }
.hero2 h1 em { font-style: normal; color: var(--gold-lt); display: block; }
.hero2 .lead { font-size: 18px; line-height: 1.7; color: rgba(255,255,255,.82); margin: 24px 0 0; max-width: 500px; }
.hero2 .cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.hero2 .fine { margin-top: 16px; font-size: 13.5px; color: rgba(255,255,255,.62); }
.hero2 .fine b { color: #fff; font-weight: 700; }
.hero2 .facts { display: flex; gap: 0; margin-top: 40px; padding-top: 22px; border-top: 1px solid rgba(226,199,127,.25); max-width: 500px; }
.hero2 .facts div { flex: 1; }
.hero2 .facts div + div { padding-left: 18px; border-left: 1px solid rgba(226,199,127,.25); }
.hero2 .facts b { display: block; font: 700 24px/1.1 "Shippori Mincho", serif; color: #fff; }
.hero2 .facts small { font-size: 12.5px; color: rgba(255,255,255,.58); }
.mc { position: relative; border-radius: 10px; background: linear-gradient(180deg, rgba(10,63,53,.92), rgba(5,36,30,.96)); border: 1px solid rgba(226,199,127,.32); box-shadow: 0 60px 100px -40px rgba(0,0,0,.75), inset 0 1px 0 rgba(255,255,255,.06); overflow: hidden; }
.mc .hdr { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid rgba(226,199,127,.16); font-size: 12.5px; color: rgba(255,255,255,.7); }
.mc .hdr b { color: #fff; font-weight: 700; }
.mc .hdr .grd { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; color: var(--gold-lt); border: 1px solid rgba(226,199,127,.5); border-radius: 4px; padding: 3px 6px; }
.mc .hdr .lv { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #FF9A73; }
.mc .hdr .lv i { width: 7px; height: 7px; border-radius: 50%; background: #FF7A4D; box-shadow: 0 0 0 4px rgba(255,122,77,.18); animation: pulse 1.6s ease-in-out infinite; }
.mc .score { padding: 6px 18px 10px; }
.mc .row { display: grid; grid-template-columns: 38px 1fr 34px 34px 56px; align-items: center; height: 38px; }
.mc .row + .row { border-top: 1px solid rgba(255,255,255,.06); }
.mc .cc { font-size: 10.5px; letter-spacing: .12em; color: rgba(255,255,255,.5); }
.mc .nm { font-size: 15px; color: #fff; display: flex; align-items: center; gap: 9px; white-space: nowrap; }
.mc .nm .sw { width: 9px; height: 9px; border-radius: 50%; }
.mc .row1 .sw { background: var(--gold-lt); }
.mc .row2 .sw { background: #7FD6C2; }
.mc .g { text-align: center; font: 500 14px/1 "IBM Plex Mono", monospace; color: rgba(255,255,255,.45); }
.mc .g.w { color: rgba(255,255,255,.85); }
.mc .cur { text-align: right; font: 700 26px/1 "Shippori Mincho", serif; color: #fff; font-variant-numeric: tabular-nums; }
.mc .courtbox { padding: 4px 14px 14px; }
.mc .court { display: block; width: 100%; height: auto; border-radius: 6px; }
.mc .court .cl { stroke: #fff; stroke-width: 1.6; opacity: .82; }
.mc .court .net { stroke: #F3E3B5; stroke-width: 2.4; }
.mc .court .post { fill: var(--gold); }
.mc .court .trail { fill: none; stroke: #FFF4D6; stroke-width: 1.6; stroke-linecap: round; opacity: .75; stroke-dasharray: 1 5; }
.mc .court .sh { fill: #fff; }
.mc .court .sh-glow { fill: rgba(255,244,214,.28); }
.mc .court .pl { stroke: rgba(0,0,0,.25); stroke-width: 1; transition: cx .5s ease, cy .5s ease; }
.mc .court .pl1 { fill: var(--gold-lt); }
.mc .court .pl2 { fill: #7FD6C2; }
.mc .court .mk { fill: none; stroke-width: 1.6; }
.mc .api { border-top: 1px solid rgba(226,199,127,.16); background: rgba(2,20,16,.55); padding: 12px 18px 14px; font: 500 12.5px/1.8 "IBM Plex Mono", ui-monospace, monospace; color: rgba(255,255,255,.55); }
.mc .api .l1 { display: flex; gap: 10px; align-items: center; }
.mc .api .m { color: #0A3F35; background: var(--gold-lt); font-weight: 700; font-size: 10.5px; padding: 1px 6px; border-radius: 3px; }
.mc .api .u { color: #fff; }
.mc .api .ok { margin-left: auto; color: #8EDDB6; }
.mc .api .k { color: var(--gold-lt); }
.mc .api .n { color: #FFB38F; }
.mc .api .s { color: #9FD9C8; }
.mc .api > div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hero2 .cap { margin-top: 14px; font-size: 13px; color: rgba(255,255,255,.62); display: flex; gap: 10px; align-items: center; }
.hero2 .cap::before { content: ""; width: 22px; height: 1px; background: var(--gold-lt); flex: none; }
.hero2 .cap b { color: #fff; }
@media (max-width: 1120px) {
.hero2 .wrap2 { grid-template-columns: 1fr 480px; gap: 44px; }
.hero2 h1 { font-size: 54px; }
}
@media (max-width: 960px) {
.hero2 .wrap2 { grid-template-columns: 1fr; padding: 56px 20px 60px; gap: 40px; }
.hero2 h1 { font-size: 44px; }
}
@media (max-width: 560px) {
.hero2 h1 { font-size: 36px; }
.hero2 .lead { font-size: 16.5px; }
.hero2 .cta .b { width: 100%; }
.hero2 .facts b { font-size: 20px; }
.mc .row { grid-template-columns: 34px 1fr 28px 28px 44px; }
.mc .nm { font-size: 13.5px; }
.mc .cur { font-size: 22px; }
.mc .api { font-size: 11px; padding: 10px 12px 12px; }
.mc .courtbox { padding: 4px 8px 10px; }
.mc .hdr { padding: 12px 14px; white-space: nowrap; }
.mc .hdr .grd, .mc .hdr > span:nth-child(3) { display: none; }
.mc .score { padding: 4px 14px 8px; }
}
@media (prefers-reduced-motion: reduce) {
.mc .hdr .lv i { animation: none; }
}
.hero2 .shapes { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
@media (max-width: 960px) {
.hero2 .shapes { opacity: .7; }
.hero2 .fly { display: none; }
}
@media (prefers-reduced-motion: reduce) {
.hero2 .glow { animation: none; }
}
.lay { background: linear-gradient(180deg, #F7F4EC 0%, #F3EFE4 100%); padding: 96px 0 88px; border-bottom: 1px solid var(--line); }
.lay-in { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.lay-hd { max-width: 760px; }
.lay-over { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.lay-over::before { content: ""; width: 34px; height: 1px; background: var(--gold); }
.lay-hd h2 { margin: 18px 0 0; font: 700 42px/1.16 "Shippori Mincho", serif; color: var(--deep); letter-spacing: -.005em; }
.lay-hd p { margin: 16px 0 0; font-size: 17px; line-height: 1.7; color: #4A544F; max-width: 600px; }
.bento { display: grid; grid-template-columns: repeat(12, 1fr); gap: 20px; margin-top: 44px; }
.card { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 24px 26px 22px; display: flex; flex-direction: column; min-width: 0; box-shadow: 0 1px 0 rgba(10,63,53,.04), 0 24px 48px -32px rgba(10,63,53,.25); }
.c-arc { grid-column: span 7; grid-row: span 2; }
.c-odd { grid-column: span 5; }
.c-live { grid-column: span 5; }
.c-free { grid-column: span 5; }
.c-ai { grid-column: span 7; }
.c-top { display: flex; align-items: center; justify-content: space-between; }
.tag { display: inline-flex; align-items: center; gap: 7px; font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; padding: 5px 9px; border-radius: 999px; }
.t-arc { background: #EFE7D2; color: #6E5A26; }
.t-odd { background: var(--gold); color: var(--deeper); }
.t-free { background: #E5F2EA; color: #1E6B47; }
.t-live { background: rgba(255,122,77,.16); color: #FFB08F; }
.t-live i { width: 6px; height: 6px; border-radius: 50%; background: #FF7A4D; animation: pulse 1.6s ease-in-out infinite; }
.t-ai { background: rgba(226,199,127,.16); color: var(--gold-lt); }
.c-n { font: 500 11.5px "IBM Plex Mono", monospace; color: var(--muted); }
.card h3 { margin: 16px 0 0; font: 700 23px/1.28 "Shippori Mincho", serif; color: var(--deep); max-width: 460px; }
.card > p { margin: 10px 0 0; font-size: 14.5px; line-height: 1.65; color: #56605B; max-width: 520px; }
.eps { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 18px; }
.eps code { font: 500 11.5px/1 "IBM Plex Mono", monospace; color: var(--deep); background: var(--paper); border: 1px solid var(--hair); padding: 6px 8px; border-radius: 10px; }
.samp { position: absolute; right: 12px; bottom: 10px; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: #A5ACA6; }
.vis-arc { position: relative; margin-top: 20px; background: linear-gradient(180deg, #FBFAF6, #F6F3EA); border: 1px solid var(--hair); border-radius: 10px; padding: 18px 16px 26px; }
.brk { display: block; width: 100%; height: auto; }
.brk .rh { font: 700 9.5px "Zen Kaku Gothic New", sans-serif; letter-spacing: .16em; fill: #9AA19B; }
.brk .bx rect { fill: #fff; stroke: #E2DCCB; }
.brk .bx.fin rect { fill: #0A3F35; stroke: #0A3F35; }
.brk .mid { stroke: #F0ECE2; }
.brk .bx.fin .mid { stroke: rgba(255,255,255,.1); }
.brk .cc { font: 500 9px "Zen Kaku Gothic New", sans-serif; letter-spacing: .1em; fill: #A5ACA6; }
.brk .nm { font: 500 12px "Zen Kaku Gothic New", sans-serif; fill: #56605B; }
.brk .nm.w { font-weight: 700; fill: #0A3F35; }
.brk .sd { font-size: 10px; fill: #C8A24A; font-weight: 700; }
.brk .fin .nm { fill: rgba(255,255,255,.6); }
.brk .fin .nm.w { fill: #fff; }
.brk .fin .cc { fill: rgba(255,255,255,.4); }
.brk .dot { fill: #C8A24A; }
.brk .sc { font: 500 9.5px "IBM Plex Mono", monospace; fill: #8A918C; text-anchor: end; }
.brk .ln { fill: none; stroke: #D6CFBD; stroke-width: 1.2; }
.brk .ln.won { stroke: #C8A24A; stroke-width: 1.6; }
.links { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 16px; border-top: 1px solid var(--hair); }
.links div { padding: 14px 12px 0 0; }
.links div + div { padding-left: 14px; border-left: 1px solid var(--hair); }
.links small { display: block; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; color: var(--muted); }
.links b { display: block; font: 700 19px/1.2 "Shippori Mincho", serif; color: var(--deep); margin-top: 6px; }
.links span { font-size: 12px; color: var(--muted); }
@media (max-width: 760px) {
.links { grid-template-columns: 1fr 1fr; }
.links div:nth-child(3) { padding-left: 0; border-left: 0; }
.links div:nth-child(n+3) { margin-top: 12px; }
}
.odd-row { display: grid; grid-template-columns: 150px 1fr; gap: 14px; align-items: center; margin-top: 16px; }
.odd-big b { font: 700 30px/1 "Shippori Mincho", serif; color: #8A918C; }
.odd-big b.g { color: var(--deep); }
.odd-big i { font-style: normal; color: var(--gold); margin: 0 6px; font-size: 20px; }
.odd-big small { display: block; margin-top: 10px; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.ods { width: 100%; height: auto; display: block; }
.ods .gl { stroke: #F0ECE2; }
.ods .ax { font: 500 9.5px "IBM Plex Mono", monospace; fill: #A5ACA6; letter-spacing: .06em; }
.ods .mv { stroke: #B9C9C1; stroke-width: 1.3; }
.ods .mv.hi { stroke: #1E7A4C; stroke-width: 2.2; }
.ods .op { fill: #fff; stroke: #B9C9C1; stroke-width: 1.3; }
.ods .cl { fill: #1E7A4C; }
.bt { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--hair); font-size: 12.5px; color: var(--muted); }
.bt span { width: 100%; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; }
.bt b { font: 600 13px "IBM Plex Mono", monospace; color: var(--ink); }
.bt b.g { color: #1E7A4C; }
.c-live { background: radial-gradient(120% 120% at 100% 0%, #115446 0%, #0A3F35 45%, #072E27 100%); border-color: #0A3F35; }
.c-live h3 { color: #fff; }
.c-live .c-n { color: rgba(255,255,255,.45); }
.lv-rows { margin-top: 16px; }
.lv-rows .lv { display: grid; grid-template-columns: 34px 1fr auto 34px; gap: 12px; align-items: center; padding: 11px 0; border-top: 1px solid rgba(255,255,255,.08); }
.lv-rows .lv-none { grid-template-columns: minmax(0, 1fr); }
.lv .ev { background: transparent; width: auto; height: auto; display: block; font: 700 10.5px "Zen Kaku Gothic New", sans-serif; letter-spacing: .06em; color: var(--gold-lt); border: 1px solid rgba(226,199,127,.4); border-radius: 4px; text-align: center; padding: 3px 0; }
.lv .who { font-size: 13.5px; line-height: 1.55; color: #fff; }
.lv .who em { font-style: normal; color: rgba(255,255,255,.62); }
.lv .gs { display: flex; gap: 10px; font: 500 12px/1.55 "IBM Plex Mono", monospace; color: rgba(255,255,255,.42); }
.lv .gs s { text-decoration: none; width: 18px; text-align: center; }
.lv .cur { font: 700 18px/1.2 "Shippori Mincho", serif; color: #fff; text-align: right; }
.c-live .eps code { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.1); color: #fff; }
.hook { font-size: 12px; color: rgba(255,255,255,.55); align-self: center; margin-left: 4px; }
.days { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 18px; border: 1px solid var(--hair); border-radius: 10px; overflow: hidden; }
.days div { padding: 14px 14px 12px; background: #FBFAF6; }
.days div + div { border-left: 1px solid var(--hair); }
.days .now { background: #fff; box-shadow: inset 0 3px 0 var(--gold); }
.days small { display: block; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; color: var(--muted); }
.days b { display: block; font: 700 30px/1.1 "Shippori Mincho", serif; color: var(--deep); margin-top: 8px; }
.days span { font-size: 12px; color: var(--muted); }
.fk { margin: 14px 0 0; font-size: 13.5px; line-height: 1.6; color: #56605B; }
.c-ai { background: linear-gradient(135deg, #0B4538 0%, #072E27 60%, #062922 100%); border-color: #0A3F35; }
.c-ai h3 { color: #fff; }
.c-ai .c-n { color: rgba(255,255,255,.45); }
.chat { margin-top: 18px; display: grid; gap: 10px; }
.chat .q { justify-self: end; max-width: 78%; background: #fff; color: var(--ink); font-size: 13.5px; line-height: 1.55; padding: 11px 14px; border-radius: 10px 10px 4px 10px; }
.chat .call { justify-self: start; font: 500 12px "IBM Plex Mono", monospace; color: var(--gold-lt); background: rgba(226,199,127,.08); border: 1px dashed rgba(226,199,127,.35); padding: 7px 10px; border-radius: 10px; }
.chat .call span { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.45); margin-right: 8px; }
.chat .call em { font-style: normal; color: #9FD9C8; }
.chat .a { justify-self: start; max-width: 84%; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.9); font-size: 13.5px; line-height: 1.6; padding: 11px 14px; border-radius: 10px 10px 10px 4px; }
@media (max-width: 1060px) {
.c-arc, .c-ai { grid-column: span 12; grid-row: auto; }
.c-odd, .c-live, .c-free { grid-column: span 6; }
.c-free { grid-column: span 12; }
}
@media (max-width: 760px) {
.lay { padding: 64px 0 60px; }
.lay-hd h2 { font-size: 30px; }
.bento { gap: 14px; margin-top: 30px; }
.c-odd, .c-live, .c-free { grid-column: span 12; }
.card { padding: 20px 18px 18px; }
.card h3 { font-size: 20px; }
.vis-arc { overflow-x: auto; padding: 14px 10px 24px; }
.brk { min-width: 560px; }
.odd-row { grid-template-columns: 1fr; }
.chat .q, .chat .a { max-width: 100%; }
}
.rksec { position: relative; overflow: hidden; color: #fff; padding: 104px 0 100px; background: radial-gradient(60% 80% at 85% 20%, rgba(34,150,112,.30) 0%, rgba(34,150,112,0) 70%), radial-gradient(50% 60% at 0% 100%, rgba(226,199,127,.10) 0%, rgba(226,199,127,0) 70%), linear-gradient(170deg, #083A30 0%, #062B25 55%, #041F1A 100%); border-top: 1px solid var(--gold); border-bottom: 1px solid var(--gold); }
.rk-in { position: relative; max-width: 1200px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: center; }
.rk-in > * { min-width: 0; }
.rk-over { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-lt); font-weight: 700; }
.rk-over::before { content: ""; width: 34px; height: 1px; background: var(--gold-lt); }
.rk-copy h2 { margin: 18px 0 0; font: 700 42px/1.16 "Shippori Mincho", serif; color: #fff; }
.rk-copy p { margin: 18px 0 0; font-size: 16.5px; line-height: 1.75; color: rgba(255,255,255,.75); }
.rk-code { display: flex; gap: 10px; align-items: center; margin-top: 26px; padding: 12px 14px; border-radius: 10px; background: rgba(2,20,16,.55); border: 1px solid rgba(226,199,127,.22); font: 500 13px "IBM Plex Mono", monospace; color: rgba(255,255,255,.7); white-space: nowrap; overflow: hidden; }
.rk-code .m { color: #072E27; background: var(--gold-lt); font-weight: 700; font-size: 10.5px; padding: 2px 6px; border-radius: 3px; }
.rk-code b { font-weight: 500; color: #FFB38F; }
.rk-facts { list-style: none; margin: 26px 0 0; padding: 0; border-top: 1px solid rgba(226,199,127,.2); }
.rk-facts li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid rgba(226,199,127,.12); font-size: 13.5px; }
.rk-facts b { color: #fff; font-weight: 700; }
.rk-facts span { color: rgba(255,255,255,.55); text-align: right; }
.rk-card { background: linear-gradient(180deg, rgba(10,63,53,.85), rgba(4,31,26,.92)); border: 1px solid rgba(226,199,127,.28); border-radius: 10px; padding: 22px 24px 18px; box-shadow: 0 60px 100px -40px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.05); }
.rk-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.rk-tabs { display: inline-flex; padding: 3px; border-radius: 10px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); }
.rk-tabs button, .rk-play { all: unset; cursor: pointer; font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,.6); padding: 7px 12px; border-radius: 10px; white-space: nowrap; }
.rk-tabs button.on { background: #fff; color: var(--deep); }
.rk-play { border: 1px solid rgba(255,255,255,.18); color: rgba(255,255,255,.75); font-weight: 600; }
.rk-tabs button:focus-visible, .rk-play:focus-visible { outline: 2px solid var(--gold-lt); }
.rk-date { display: flex; align-items: baseline; gap: 10px; margin-top: 18px; padding-bottom: 14px; border-bottom: 1px solid rgba(226,199,127,.18); font: 700 34px/1 "Shippori Mincho", serif; }
.rk-date #rkDay { min-width: 1.3em; font-variant-numeric: tabular-nums; }
.rk-date #rkMon { color: var(--gold-lt); min-width: 5em; }
.rk-date em { font-style: normal; color: rgba(255,255,255,.4); font-size: 22px; }
.rk-date small { margin-left: auto; font: 500 11.5px "IBM Plex Mono", monospace; color: rgba(255,255,255,.45); }
.rk-date small i { font-style: normal; color: #fff; display: inline-block; min-width: 2ch; text-align: right; }
.rk-cols { display: grid; grid-template-columns: 64px 1fr 90px; padding: 12px 0 6px; font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.4); font-weight: 700; }
.rk-cols span:last-child { text-align: right; }
.rk-list { position: relative; list-style: none; margin: 0; padding: 0; height: 432px; }
.rk-row { position: absolute; left: 0; right: 0; height: 54px; display: grid; grid-template-columns: 64px 1fr 90px; align-items: center; transition: transform .9s cubic-bezier(.65,0,.35,1); will-change: transform; }
.rk-row::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: rgba(255,255,255,.06); }
.rk-n { display: flex; align-items: center; gap: 8px; font: 700 20px/1 "Shippori Mincho", serif; color: #fff; }
.rk-mv { font: 700 10px/1 "Zen Kaku Gothic New", sans-serif; width: 18px; }
.rk-mv.up { color: #6FD39E; }
.rk-mv.dn { color: #FF8F6B; }
.rk-mv.eq { color: rgba(255,255,255,.25); }
.rk-p { position: relative; min-width: 0; padding: 0 14px 0 6px; line-height: 1.25; }
.rk-p b { display: block; font-size: 14.5px; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; z-index: 1; }
.rk-p small { display: block; margin-top: 2px; font-size: 10.5px; letter-spacing: .14em; color: rgba(255,255,255,.5); position: relative; z-index: 1; }
.rk-bar { position: absolute; left: -6px; top: 50%; height: 44px; transform: translateY(-50%); border-radius: 10px; background: linear-gradient(90deg, rgba(31,136,102,.55), rgba(31,136,102,.08)); transition: width .9s cubic-bezier(.65,0,.35,1); }
.rk-row.first .rk-bar { background: linear-gradient(90deg, rgba(200,162,74,.55), rgba(200,162,74,.06)); }
.rk-row.first .rk-n { color: var(--gold-lt); }
.rk-pts { text-align: right; font: 500 14px "IBM Plex Mono", monospace; color: rgba(255,255,255,.85); font-variant-numeric: tabular-nums; }
.rk-time { margin-top: 16px; }
.rk-track { height: 3px; border-radius: 2px; background: rgba(255,255,255,.1); overflow: hidden; }
.rk-track i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--gold), var(--gold-lt)); transition: width .9s linear; }
.rk-months { display: flex; justify-content: space-between; margin-top: 8px; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.4); }
.rk-samp { margin: 12px 0 0; font-size: 11px; color: rgba(255,255,255,.35); }
@media (max-width: 960px) {
.rksec { padding: 72px 0 70px; }
.rk-in { grid-template-columns: 1fr; gap: 36px; }
.rk-copy h2 { font-size: 31px; }
}
@media (max-width: 560px) {
.rk-card { padding: 18px 14px 14px; }
.rk-tabs button { padding: 7px 9px; font-size: 12px; }
.rk-date { font-size: 26px; }
.rk-date em { font-size: 17px; }
.rk-date small { display: none; }
.rk-cols, .rk-row { grid-template-columns: 50px 1fr 76px; }
.rk-p b { font-size: 13.5px; }
.rk-pts { font-size: 12.5px; }
.rk-code { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
.rk-row, .rk-bar, .rk-track i { transition: none; }
}
.bk { background: #fff; padding: 104px 0 100px; border-bottom: 1px solid var(--line); }
.bk-in { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: start; }
.bk-in > * { min-width: 0; }
.bk-over { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.bk-over::before { content: ""; width: 34px; height: 1px; background: var(--gold); }
.bk-copy h2 { margin: 18px 0 0; font: 700 38px/1.18 "Shippori Mincho", serif; color: var(--deep); }
.bk-copy > p { margin: 18px 0 0; font-size: 16px; line-height: 1.75; color: #4A544F; }
.bk-ctl { margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--line); }
.bk-lab { display: block; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); font-weight: 700; margin-bottom: 10px; }
.bk-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.bk-chips button { all: unset; cursor: pointer; font-size: 13.5px; font-weight: 600; color: var(--deep); padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); background: #fff; }
.bk-chips button:hover { border-color: var(--jade); }
.bk-chips button.on { background: var(--deep); border-color: var(--deep); color: #fff; }
.bk-chips button:focus-visible { outline: 2px solid var(--jade); outline-offset: 2px; }
.bk-chips.evt button { min-width: 30px; text-align: center; padding: 7px 12px; font-size: 12.5px; }
.bk-what { margin: 12px 0 22px; min-height: 24px; font-size: 14px; color: #56605B; }
.bk-card { background: linear-gradient(180deg, #FBFAF6, #F7F4EC); border: 1px solid var(--line); border-radius: 10px; padding: 22px 24px 18px; box-shadow: 0 30px 60px -40px rgba(10,63,53,.35); }
.bk-call { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; background: #0B2923; font: 500 12.5px "IBM Plex Mono", monospace; color: #D8E4DF; white-space: nowrap; overflow: hidden; }
.bk-call .m { color: #072E27; background: var(--gold-lt); font-weight: 700; font-size: 10.5px; padding: 2px 6px; border-radius: 3px; }
.bk-call #bkQ { overflow: hidden; text-overflow: ellipsis; }
.bk-call .ok { margin-left: auto; color: #8EDDB6; }
.bk-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 18px 0 0; }
.bk-stats div { padding: 0 12px; }
.bk-stats div:first-child { padding-left: 0; }
.bk-stats div + div { border-left: 1px solid var(--line); }
.bk-stats dt { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bk-stats dd { margin: 8px 0 0; font: 700 24px/1 "Shippori Mincho", serif; color: var(--deep); font-variant-numeric: tabular-nums; }
.bk-stats dd.roi.pos { color: #1E7A4C; }
.bk-stats dd.roi.neg { color: #A33232; }
.bk-chart { position: relative; margin-top: 18px; background: #fff; border: 1px solid var(--hair); border-radius: 10px; padding: 14px 14px 8px; }
.bk-ct { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.bk-ct b { font-size: 13px; color: var(--ink); }
.bk-ct span { font-size: 11.5px; color: var(--muted); }
#bkG { display: block; width: 100%; height: 240px; }
#bkG .gl { stroke: #EEEAE0; stroke-width: 1; vector-effect: non-scaling-stroke; }
#bkG .zero { stroke: #B9B5AE; stroke-width: 1; stroke-dasharray: 3 4; vector-effect: non-scaling-stroke; }
#bkG .line { fill: none; stroke: #0E5E4E; stroke-width: 2; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
#bkG .area { fill: url(#bkFill); }
#bkG .xh { stroke: #6B736E; stroke-width: 1; vector-effect: non-scaling-stroke; opacity: 0; }
#bkG .hd { fill: #0E5E4E; stroke: #fff; stroke-width: 2; opacity: 0; vector-effect: non-scaling-stroke; }
#bkG.hov .xh, #bkG.hov .hd { opacity: 1; }
.bk-yrs { display: flex; justify-content: space-between; padding: 6px 0 0; font: 500 11px "IBM Plex Mono", monospace; color: var(--muted); }
.bk-tip { position: absolute; top: 44px; pointer-events: none; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 7px 10px; font-size: 12px; color: var(--ink); box-shadow: 0 8px 20px -10px rgba(0,0,0,.25); opacity: 0; transform: translateX(-50%); white-space: nowrap; }
.bk-tip b { font-family: "IBM Plex Mono", monospace; }
.bk-tip.on { opacity: 1; }
.bk-samp { margin: 12px 0 0; font-size: 11.5px; color: #9AA19B; }
@media (max-width: 960px) {
.bk { padding: 72px 0 70px; }
.bk-in { grid-template-columns: 1fr; gap: 36px; }
.bk-copy h2 { font-size: 30px; }
}
@media (max-width: 560px) {
.bk-card { padding: 16px 14px 14px; }
.bk-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 16px; }
.bk-what { min-height: 48px; }
.bk-stats div:nth-child(4) { padding-left: 0; border-left: 0; }
.bk-stats dd { font-size: 20px; }
#bkG { height: 190px; }
.bk-call { font-size: 11px; }
}
.sz { color: #fff; padding: 100px 0 96px; border-bottom: 1px solid var(--gold); background: radial-gradient(55% 70% at 15% 10%, rgba(34,150,112,.26) 0%, rgba(34,150,112,0) 70%), radial-gradient(40% 50% at 95% 100%, rgba(226,199,127,.10) 0%, rgba(226,199,127,0) 70%), linear-gradient(175deg, #083A30 0%, #05241E 100%); }
.sz-in { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.sz-top { display: grid; grid-template-columns: 7fr 5fr; gap: 56px; align-items: end; }
.sz-over { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-lt); font-weight: 700; }
.sz-over::before { content: ""; width: 34px; height: 1px; background: var(--gold-lt); }
.sz-top h2 { margin: 18px 0 0; font: 700 40px/1.18 "Shippori Mincho", serif; color: #fff; }
.sz-top p { margin: 0; font-size: 15.5px; line-height: 1.75; color: rgba(255,255,255,.7); }
.sz-card { margin-top: 40px; border-radius: 10px; border: 1px solid rgba(226,199,127,.26); background: linear-gradient(180deg, rgba(10,63,53,.7), rgba(4,31,26,.85)); box-shadow: 0 60px 100px -50px rgba(0,0,0,.8); overflow: hidden; }
.sz-scroll { overflow-x: auto; }
.sz-grid { position: relative; min-width: 980px; padding: 18px 24px 26px; }
.sz-row, .sz-months { display: grid; grid-template-columns: 110px 1fr; align-items: center; }
.sz-row { height: 50px; border-top: 1px solid rgba(255,255,255,.06); }
.sz-g { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.55); font-weight: 700; }
.sz-lane { position: relative; height: 100%; }
.sz-months { height: 30px; }
.sz-months span:not(.sz-g) { position: absolute; top: 6px; font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.4); padding-left: 6px; border-left: 1px solid rgba(255,255,255,.12); height: 1000px; }
.pill { all: unset; box-sizing: border-box; position: absolute; top: 13px; height: 24px; border-radius: 10px; cursor: pointer; transition: transform .2s, box-shadow .2s; display: flex; align-items: center; justify-content: center; }
.pill:hover { transform: translateY(-2px); }
.pill:focus-visible { outline: 2px solid var(--gold-lt); outline-offset: 2px; }
.g-major { background: linear-gradient(90deg, #E2C77F, #C8A24A); }
.g-s1000 { background: #E7DCC0; }
.g-s750 { background: #9FD9C8; }
.g-s500 { background: #5CB594; }
.g-s300 { background: #2F8F72; }
.pill.st-done { opacity: .5; }
.pill.st-next { background: transparent; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.4); }
.pill.st-next.g-major { box-shadow: inset 0 0 0 1.5px #E2C77F; }
.pill.st-next.g-s1000 { box-shadow: inset 0 0 0 1.5px #E7DCC0; }
.pill.st-live { background: #FF7A4D; box-shadow: 0 0 0 4px rgba(255,122,77,.22); }
.pill.st-live i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: pulse 1.6s ease-in-out infinite; }
.pill.on { box-shadow: 0 0 0 2px #fff, 0 0 0 5px rgba(255,255,255,.18); opacity: 1; }
.sz-today { position: absolute; top: 44px; bottom: 16px; left: calc(24px + 110px + (100% - 48px - 110px) * var(--x) / 100); width: 1px; background: var(--gold-lt); pointer-events: none; }
.sz-today span { position: absolute; bottom: -4px; left: 8px; white-space: nowrap; font: 700 10.5px "Zen Kaku Gothic New", sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #072E27; background: var(--gold-lt); padding: 3px 7px; border-radius: 4px; }
.sz-detail { display: grid; grid-template-columns: 1.3fr 1fr 1.5fr; gap: 0; border-top: 1px solid rgba(226,199,127,.2); background: rgba(2,20,16,.45); height: 132px; }
.sz-detail > div { padding: 22px 24px; min-width: 0; }
.sz-detail > div + div { border-left: 1px solid rgba(255,255,255,.07); }
.sd-tag { display: inline-block; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; color: var(--gold-lt); border: 1px solid rgba(226,199,127,.5); border-radius: 4px; padding: 3px 7px; }
.sd-l h3 { margin: 10px 0 0; font: 700 24px/1.15 "Shippori Mincho", serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sd-l p { margin: 6px 0 0; font-size: 13.5px; color: rgba(255,255,255,.6); }
.sz-detail small { display: block; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; color: rgba(255,255,255,.45); }
.sd-m b { display: block; margin-top: 10px; font: 700 20px/1.2 "Shippori Mincho", serif; }
.sd-m b.s-live { color: #FF9A73; }
.sd-m b.s-done { color: #9FD9C8; }
.sd-m b.s-next { color: var(--gold-lt); }
.sd-m span { display: block; margin-top: 4px; font-size: 13px; color: rgba(255,255,255,.6); }
.sd-r code { display: block; margin-top: 8px; font: 500 12px "IBM Plex Mono", monospace; color: #D8E4DF; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; padding: 6px 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sz-key { display: flex; gap: 18px; align-items: center; padding: 12px 24px; border-top: 1px solid rgba(255,255,255,.07); font-size: 12px; color: rgba(255,255,255,.6); }
.sz-key span { display: inline-flex; align-items: center; gap: 7px; }
.sz-key i { width: 18px; height: 8px; border-radius: 3px; }
.k-done { background: #5CB594; opacity: .5; }
.k-live { background: #FF7A4D; }
.k-next { box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.5); }
.sz-key em { margin-left: auto; font-style: normal; color: rgba(255,255,255,.35); }
@media (max-width: 960px) {
.sz { padding: 72px 0 70px; }
.sz-top { grid-template-columns: 1fr; gap: 16px; }
.sz-top h2 { font-size: 30px; }
.sz-detail { grid-template-columns: 1fr 1fr; height: 236px; }
.sd-r { grid-column: span 2; border-left: 0 !important; border-top: 1px solid rgba(255,255,255,.07); }
}
@media (max-width: 560px) {
.sz-detail { grid-template-columns: 1fr; height: 372px; }
.sd-r { grid-column: auto; }
.sz-detail > div + div { border-left: 0; border-top: 1px solid rgba(255,255,255,.07); }
.sz-detail > div { padding: 16px; }
.sz-key { flex-wrap: wrap; }
.sz-key em { width: 100%; margin-left: 0; }
}
.rec { background: #fff; padding: 112px 0 96px; position: relative; }
.rec::before { content: ""; position: absolute; left: 50%; top: 0; width: 1px; height: 64px; background: linear-gradient(var(--gold), rgba(200,162,74,0)); }
.rec-in { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.rec-in + .rec-in { margin-top: 72px; }
.rec-in:first-child { display: grid; grid-template-columns: 5fr 7fr; gap: 72px; align-items: start; }
.rec-over { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.rec-over::before { content: ""; width: 34px; height: 1px; background: var(--gold); }
.rec-hd h2 { margin: 22px 0 0; font: 700 40px/1.22 "Shippori Mincho", serif; color: var(--deep); letter-spacing: -.005em; }
.rec-copy { padding-top: 38px; border-top: 1px solid var(--line); }
.rec-copy p { margin: 0; font-size: 17px; line-height: 1.85; color: #3B4641; max-width: 640px; }
.rec-copy p + p { margin-top: 18px; }
.rec-copy .rec-lead { font-size: 19.5px; line-height: 1.75; color: var(--ink); }
.rec-cap { float: left; font: 700 76px/.82 "Shippori Mincho", serif; color: var(--jade); margin: 8px 14px 0 0; }
.rec-sign { font-size: 15px !important; color: var(--muted) !important; padding-top: 6px; }
.rec-sign a { color: var(--jade); font-weight: 700; margin-left: 6px; box-shadow: inset 0 -1px 0 rgba(200,162,74,.7); padding-bottom: 2px; }
.rec-sign a::after { content: " \203A"; }
.rec-figs { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; border-top: 1px solid var(--deep); border-bottom: 1px solid var(--line); }
.rec-figs div { padding: 28px 26px 26px 0; }
.rec-figs div + div { padding-left: 26px; border-left: 1px solid var(--hair); }
.rec-figs dt { font: 700 30px/1.1 "Shippori Mincho", serif; color: var(--deep); }
.rec-figs dd { margin: 10px 0 0; font-size: 14px; line-height: 1.55; color: var(--muted); max-width: 230px; }
.rec-uses { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 0; margin-top: 26px; font-size: 13.5px; }
.rec-uses span { font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); font-weight: 700; margin-right: 18px; }
.rec-uses a { color: var(--deep); padding: 0 16px; border-left: 1px solid var(--line); }
.rec-uses span + a { border-left: 0; padding-left: 0; }
.rec-uses a:hover { color: var(--jade); }
@media (max-width: 960px) {
.rec { padding: 80px 0 72px; }
.rec-in:first-child { grid-template-columns: 1fr; gap: 28px; }
.rec-hd h2 { font-size: 31px; }
.rec-copy { padding-top: 28px; }
.rec-figs { grid-template-columns: 1fr 1fr; }
.rec-figs div:nth-child(3) { padding-left: 0; border-left: 0; }
.rec-figs div:nth-child(n+3) { border-top: 1px solid var(--hair); }
}
@media (max-width: 560px) {
.rec-copy .rec-lead { font-size: 17.5px; }
.rec-copy p { font-size: 16px; }
.rec-cap { font-size: 62px; }
.rec-figs div { padding: 22px 14px 20px 0; }
.rec-figs div + div { padding-left: 14px; }
.rec-figs div:nth-child(3) { padding-left: 0; }
.rec-figs dt { font-size: 23px; }
.rec-uses { display: block; }
.rec-uses span { display: block; margin: 0 0 6px; }
.rec-uses a, .rec-uses span + a { display: block; padding: 11px 0; border-left: 0; border-top: 1px solid var(--hair); }
.rec-uses a::after { content: "\203A"; float: right; color: var(--gold); }
}
.cv { color: #fff; padding: 104px 0 96px; border-top: 1px solid var(--gold); border-bottom: 1px solid var(--gold); background: radial-gradient(50% 70% at 90% 0%, rgba(34,150,112,.25) 0%, rgba(34,150,112,0) 70%), linear-gradient(180deg, #072E27 0%, #041F1A 100%); }
.cv-in { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.cv-top { display: grid; grid-template-columns: 7fr 5fr; gap: 56px; align-items: end; }
.cv-over { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-lt); font-weight: 700; }
.cv-over::before { content: ""; width: 34px; height: 1px; background: var(--gold-lt); }
.cv-top h2 { margin: 18px 0 0; font: 700 40px/1.18 "Shippori Mincho", serif; }
.cv-top p { margin: 0; font-size: 15.5px; line-height: 1.75; color: rgba(255,255,255,.7); }
.cv-card { margin-top: 40px; border-radius: 10px; border: 1px solid rgba(226,199,127,.26); background: linear-gradient(180deg, rgba(10,63,53,.6), rgba(4,31,26,.9)); overflow: hidden; box-shadow: 0 60px 100px -50px rgba(0,0,0,.8); }
.cv-map { padding: 26px 26px 12px; overflow-x: auto; }
.cv-row, .cv-axis { display: grid; grid-template-columns: 200px 1fr; align-items: center; gap: 16px; min-width: 880px; }
.cv-row { height: 58px; border-bottom: 1px solid rgba(255,255,255,.06); }
.cv-lab b { display: block; font-size: 14px; font-weight: 700; }
.cv-lab span { display: block; margin-top: 3px; font-size: 11.5px; color: rgba(255,255,255,.5); }
.cv-cells { display: grid; grid-template-columns: repeat(var(--years, 128), minmax(0, 1fr)); gap: 2px; height: 30px; }
.cv-cells i { display: block; border-radius: 2px; background: #6FD3AE; cursor: crosshair; transition: transform .15s; }
.cv-cells i.gap { background: rgba(255,255,255,.05); }
.cv-cells i:hover, .cv-cells i.hl { outline: 1.5px solid #fff; outline-offset: 1px; }
.cv-cells i.cvv { animation: cvIn .5s ease both; }
@keyframes cvIn { from { transform: scaleY(.2); opacity: 0; } }
.cv-axis { height: 30px; }
.cv-ticks { position: relative; height: 100%; }
.cv-ticks span { position: absolute; top: 8px; font: 500 11px "IBM Plex Mono", monospace; color: rgba(255,255,255,.45); padding-left: 5px; border-left: 1px solid rgba(255,255,255,.18); }
.cv-foot { display: flex; align-items: center; gap: 20px; padding: 14px 26px; border-top: 1px solid rgba(226,199,127,.18); background: rgba(2,20,16,.45); height: 64px; }
.cv-read { font-size: 13.5px; color: rgba(255,255,255,.6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.cv-read b { color: #fff; margin-right: 8px; font-family: "Shippori Mincho", serif; font-size: 18px; }
.cv-scale { margin-left: auto; display: flex; align-items: center; gap: 4px; font-size: 11px; color: rgba(255,255,255,.45); flex: none; }
.cv-scale i { width: 14px; height: 14px; border-radius: 2px; background: #6FD3AE; }
.cv-scale span:first-child { margin-right: 4px; }
.cv-scale span:last-child { margin-left: 4px; }
.cv-figs { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 34px; border-top: 1px solid rgba(226,199,127,.25); }
.cv-figs div { padding: 20px 20px 0 0; }
.cv-figs div + div { padding-left: 20px; border-left: 1px solid rgba(255,255,255,.08); }
.cv-figs b { display: block; font: 700 26px/1.15 "Shippori Mincho", serif; }
.cv-figs code { display: inline-block; font: 500 13px "IBM Plex Mono", monospace; color: var(--gold-lt); background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); border-radius: 10px; padding: 5px 8px; }
.cv-figs span { display: block; margin-top: 6px; font-size: 13px; color: rgba(255,255,255,.55); }
@media (max-width: 960px) {
.cv { padding: 72px 0 70px; }
.cv-top { grid-template-columns: 1fr; gap: 16px; }
.cv-top h2 { font-size: 30px; }
.cv-figs { grid-template-columns: 1fr 1fr; row-gap: 18px; }
.cv-figs div:nth-child(3) { padding-left: 0; border-left: 0; }
}
@media (max-width: 560px) {
.cv-foot { height: auto; min-height: 88px; flex-wrap: wrap; gap: 10px; padding: 14px 16px; }
.cv-read { white-space: normal; width: 100%; }
.cv-scale { margin-left: 0; }
.cv-map { padding: 18px 16px 10px; overflow: visible; }
.cv-row, .cv-axis { grid-template-columns: 1fr; gap: 8px; min-width: 0; }
.cv-row { height: auto; padding: 12px 0; }
.cv-cells { gap: 1px; height: 22px; }
.cv-axis .cv-sp { display: none; }
.cv-ticks span { font-size: 9.5px; }
}
@media (prefers-reduced-motion: reduce) {
.cv-cells i.cvv { animation: none; }
}
.pp { background: linear-gradient(180deg, #F7F4EC 0%, #F3EFE4 100%); padding: 104px 0 96px; border-bottom: 1px solid var(--line); }
.pp-in { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.pp-hd { text-align: center; max-width: 720px; margin: 0 auto; }
.pp-over { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.pp-over::before, .pp-over::after { content: ""; width: 34px; height: 1px; background: var(--gold); }
.pp-hd h2 { margin: 18px 0 0; font: 700 40px/1.18 "Shippori Mincho", serif; color: var(--deep); }
.pp-hd p { margin: 16px auto 0; font-size: 16px; line-height: 1.7; color: #4A544F; max-width: 560px; }
.pp-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-top: 48px; align-items: stretch; }
.pp-card { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 28px 24px 24px; box-shadow: 0 1px 0 rgba(10,63,53,.04), 0 30px 50px -40px rgba(10,63,53,.3); }
.pp-name { display: flex; align-items: center; justify-content: space-between; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; color: var(--gold); }
.pp-name em { font-style: normal; letter-spacing: .08em; text-transform: none; font-size: 11.5px; color: var(--gold-lt); border: 1px solid rgba(226,199,127,.45); border-radius: 999px; padding: 3px 9px; }
.pp-price { margin-top: 18px; font: 700 54px/1 "Shippori Mincho", serif; color: var(--deep); letter-spacing: -.01em; }
.pp-price .cur { font-size: 26px; vertical-align: 20px; margin-right: 2px; }
.pp-price small { font: 500 13.5px "Zen Kaku Gothic New", sans-serif; color: var(--muted); margin-left: 6px; letter-spacing: 0; }
.pp-blurb { margin: 14px 0 0; font-size: 14px; line-height: 1.6; color: #56605B; min-height: 68px; }
.pp-lim { display: grid; grid-template-columns: 1.3fr 1fr 1fr; margin-top: 18px; border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair); }
.pp-lim div { padding: 12px 0; }
.pp-lim div + div { padding-left: 12px; border-left: 1px solid var(--hair); }
.pp-lim b { display: block; font: 600 15px "IBM Plex Mono", monospace; color: var(--ink); }
.pp-lim span { font-size: 11px; color: var(--muted); }
.pp-card ul { list-style: none; margin: 18px 0 22px; padding: 0; font-size: 13.5px; line-height: 1.5; color: #34403A; }
.pp-card li { position: relative; padding: 5px 0 5px 24px; }
.pp-card li::before { content: ""; position: absolute; left: 3px; top: 11px; width: 9px; height: 5px; border: solid var(--jade); border-width: 0 0 1.6px 1.6px; transform: rotate(-45deg); }
.pp-btn { margin-top: auto; display: flex; align-items: center; justify-content: center; gap: 10px; height: 46px; border-radius: 10px; font-weight: 700; font-size: 14.5px; border: 1px solid transparent; }
.pp-btn svg { width: 18px; height: 18px; }
.pp-bg { background: #fff; color: #1F1F1F; border-color: #D6CFBD; }
.pp-bo { background: #fff; color: var(--deep); border-color: var(--deep); }
.pp-bs { background: var(--deep); color: #fff; }
.pp-bk { background: var(--gold); color: var(--deeper); }
.pp-odds { background: radial-gradient(120% 90% at 100% 0%, #11604F 0%, #0A3F35 45%, #072E27 100%); border-color: #0A3F35; transform: translateY(-12px); box-shadow: 0 50px 80px -40px rgba(7,46,39,.7); }
.pp-odds::before { content: ""; position: absolute; left: 24px; right: 24px; top: 0; height: 2px; background: var(--gold); border-radius: 0 0 2px 2px; }
.pp-odds .pp-name { color: var(--gold-lt); }
.pp-odds .pp-price { color: #fff; }
.pp-odds .pp-price small { color: rgba(255,255,255,.55); }
.pp-odds .pp-blurb { color: rgba(255,255,255,.75); }
.pp-odds .pp-lim { border-color: rgba(255,255,255,.12); }
.pp-odds .pp-lim div + div { border-color: rgba(255,255,255,.12); }
.pp-odds .pp-lim b { color: #fff; }
.pp-odds .pp-lim span { color: rgba(255,255,255,.5); }
.pp-odds ul { color: rgba(255,255,255,.85); }
.pp-odds li::before { border-color: var(--gold-lt); }
.pp-all { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 0; margin-top: 40px; font-size: 13px; color: var(--muted); }
.pp-all span { padding: 0 16px; border-left: 1px solid var(--line); }
.pp-all span:first-child { border-left: 0; }
.pp-all b { color: var(--deep); }
@media (max-width: 1060px) {
.pp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pp-odds { transform: none; }
}
@media (max-width: 760px) {
.pp { padding: 72px 0 70px; }
.pp-hd h2 { font-size: 30px; }
.pp-grid { grid-template-columns: 1fr; margin-top: 32px; }
.pp-blurb { min-height: 0; }
.pp-all { display: block; text-align: center; }
.pp-all span { display: block; border-left: 0; padding: 4px 0; }
}
.mc .hdr .lv.fin { color: rgba(255,255,255,.55); }
.mc .nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.bt b.r { color: #B24A3A; }
.rk-tabs button:disabled { opacity: .35; cursor: default; }
.rk-row { transition-property: transform, opacity; }
.rk-empty { position: absolute; inset: 0; display: grid; place-items: center; font-size: 13.5px; color: rgba(255,255,255,.55); text-align: center; }