*{box-sizing:border-box}
:root{
  --bg:#f3f4f6;--panel:#fff;--line:#bcc4cd;--line2:#d5dae0;
  --text:#111827;--muted:#6b7280;--blue:#123b66;
  --green:#0f7a3b;--greenbg:#dff4e7;
  --amber:#8a5a00;--amberbg:#fff3cd;
  --red:#d32f2f;--graybg:#eceff1;
}
body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP","Yu Gothic UI",sans-serif}
.topbar{height:46px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 16px;position:sticky;top:0;z-index:20}
.brand{font-size:18px;font-weight:900}.topright{display:flex;align-items:center;gap:10px;font-size:11px}
.topright input{height:28px;border:0;border-radius:3px;padding:0 6px}
.legacy-link{color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.45);padding:4px 7px;border-radius:3px}
.wrap{max-width:1220px;margin:auto;padding:8px 12px 28px}
.hidden{display:none!important}.api-warning{background:#ffe8e8;color:#991b1b;border:1px solid #efb0b0;padding:6px 9px;margin-bottom:6px;font-size:11px;font-weight:700}
.summary{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:8px}
.sum{background:#fff;border:1px solid #cfd4da;padding:6px 9px;min-height:52px}.sum .k{font-size:10px;color:var(--muted)}.sum .v{font-size:18px;font-weight:900;margin-top:1px}.plus{color:#0f8a45}.minus{color:#c62828}
.section-title{display:flex;justify-content:space-between;align-items:end;margin:8px 0 5px}.section-title h2{font-size:15px;margin:0}.section-title span{font-size:10px;color:var(--muted)}
.race{background:#fff;border:1.5px solid var(--line);margin-bottom:6px}.race.urgent{border-color:var(--red)}.race.finished{background:#fbfcfe}
.race-head{display:grid;grid-template-columns:86px 54px 92px 86px 116px 1fr 110px;align-items:center;gap:6px;min-height:44px;padding:4px 8px;border-bottom:1px solid #d7dce2}
.venue{font-size:17px;font-weight:900}.rno{font-size:20px;font-weight:900}.deadline small,.remain small{display:block;color:var(--muted);font-size:9px;line-height:1}.deadline strong{font-size:17px}.remain strong{font-size:20px;font-variant-numeric:tabular-nums}.urgent .remain strong{color:var(--red)}
.status{padding:5px 6px;border-radius:4px;text-align:center;font-size:15px;font-weight:900;white-space:nowrap}.status.buy{background:var(--greenbg);color:var(--green)}.status.candidate{background:var(--amberbg);color:var(--amber)}.status.skip{background:var(--graybg);color:#4b5563}.status.waiting{background:#edf2f7;color:#4a5568}.status.started{background:#fee2e2;color:#991b1b}.status.finished{background:#eaf4ff;color:#0b67c2}.status.settling{background:#fff3cd;color:#8a5a00}.status.error{background:#ffe5e5;color:#b91c1c}
.quick{font-size:10px;color:var(--muted);line-height:1.25}.total{text-align:right;font-weight:900;font-size:13px;white-space:nowrap}
.formations-wrap{padding:4px 8px 1px}.formations-wrap.hidden{display:none}.formation-header{display:grid;grid-template-columns:82px 1fr 72px;align-items:center;min-height:24px;border:1px solid #c9cfd6;border-bottom:none;background:#eef1f4;font-size:10px;font-weight:900}.formation-header .blank{padding-left:6px;color:var(--muted)}.header-cols{display:grid;grid-template-columns:repeat(3,1fr);text-align:center}.header-cols div{padding:4px 0;border-right:1px solid var(--line2)}.header-cols div:last-child{border-right:none}.points-head{text-align:center}
.formation{display:grid;grid-template-columns:82px 1fr 72px;align-items:center;border:1px solid #c9cfd6;background:#fafafa;margin-bottom:3px;min-height:34px}.fname{padding:3px 6px;border-right:1px solid var(--line2);font-size:11px;font-weight:900;line-height:1.15}.fname .meta{display:block;color:var(--muted);font-size:8px;font-weight:600;margin-top:2px;overflow:hidden;text-overflow:ellipsis}.fcols{display:grid;grid-template-columns:repeat(3,1fr);min-height:32px}.fcol{border-right:1px solid var(--line2);display:flex;align-items:center;justify-content:center;padding:2px 5px}.fcol:last-child{border-right:none}.nums{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0}
.boat{width:21px;height:21px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:900;line-height:1;border:1px solid #777;margin:1px 0}.boat.b1{background:#fff;color:#111;border-color:#aeb4bb}.boat.b2{background:#111;color:#fff;border-color:#111}.boat.b3{background:#e32636;color:#fff;border-color:#c51f2e}.boat.b4{background:#1673d1;color:#fff;border-color:#0e62b9}.boat.b5{background:#f2d21b;color:#111;border-color:#c6aa00}.boat.b6{background:#168a43;color:#fff;border-color:#0e7436}
.famount{border-left:1px solid var(--line2);text-align:center;font-weight:900;font-size:12px;line-height:1.25}.famount .yen{display:block;color:#4b5563;font-size:10px;margin-top:1px}
.history{border-top:1px solid #eceff2;padding:0 8px 4px}.history.hidden{display:none}.history summary{cursor:pointer;font-size:9px;color:#626d79;padding:3px 0 0}.timeline{display:grid;grid-template-columns:78px 1fr;gap:2px 8px;margin-top:4px;font-size:10px}.timeline .time{color:var(--muted)}.timeline .lock{color:var(--green);font-weight:900}.timeline .blocked{color:#b91c1c;font-weight:900}.timeline .loading{grid-column:1/-1;color:var(--muted)}
.empty{background:#fff;border:1px solid #d7dce2;padding:10px;color:var(--muted);font-size:12px}
@media(max-width:850px){.summary{grid-template-columns:repeat(3,1fr)}.race-head{grid-template-columns:72px 46px 82px 72px 102px 1fr}.total{display:none}.formation,.formation-header{grid-template-columns:70px 1fr 62px}.boat{width:22px;height:22px;font-size:15px}}

.famount .multi{display:block;font-size:9px;color:#0f7a3b;font-weight:900}
.famount .unit{display:block;font-size:9px;color:#111827;font-weight:800;margin-top:1px}
.formation{margin-bottom:2px}
.formations-wrap{padding-top:3px}

.status.provisional{background:#fff3cd;color:#7a4b00;border:1px solid #e0b94f}
.provisional-row{background:#fffdf4}
.provisional-row .meta{color:#8a5b00}
.diff-badge{display:inline-block;margin-left:8px;padding:2px 6px;border-radius:4px;font-size:10px;font-weight:900}
.diff-badge.same{background:#e5f6ea;color:#0b7130}
.diff-badge.changed{background:#fff0df;color:#a14a00;border:1px solid #efb36e}

/* 2026-09-11 UI refresh: larger operational text + LIVE/analysis navigation */
.main-nav{display:flex;gap:4px;align-items:center}
.nav-link{color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.45);padding:5px 10px;border-radius:4px;font-size:12px;font-weight:800}
.nav-link.active{background:#fff;color:var(--blue);border-color:#fff}
.summary{grid-template-columns:repeat(6,1fr)}
.sum{min-height:64px;padding:8px 10px}.sum .k{font-size:11px}.sum .v{font-size:19px}.sum-sub{font-size:10px;color:var(--muted);font-weight:800;margin-top:2px}
.race-head{grid-template-columns:86px 54px 92px 86px 116px minmax(160px,1fr) 205px;min-height:52px}
.quick{font-size:11px;line-height:1.35}.total{font-size:15px}
.formation-header{grid-template-columns:90px 1fr 96px;font-size:12px;min-height:29px}
.formation{grid-template-columns:90px 1fr 96px;min-height:42px}
.fname{font-size:13px}.fname .meta{font-size:9px}
.famount{font-size:16px;line-height:1.2;padding:4px 2px}
.famount .multi{font-size:14px;margin-top:2px}
.famount .unit{font-size:15px;margin-top:3px}
.famount .yen{font-size:14px;margin-top:3px}
.result-combo{font-size:15px;font-weight:900;margin-bottom:3px;color:var(--text)}
.result-line{display:flex;justify-content:space-between;gap:8px;font-size:11px;line-height:1.35;color:var(--muted)}
.result-line strong{font-size:12px;color:var(--text);white-space:nowrap}
.result-profit{border-top:1px solid #e2e7ec;margin-top:2px;padding-top:2px}.result-profit strong{font-size:15px}
@media(max-width:1050px){.summary{grid-template-columns:repeat(3,1fr)}.race-head{grid-template-columns:78px 50px 86px 76px 108px minmax(120px,1fr) 180px}}
@media(max-width:850px){
  .topbar{height:auto;min-height:50px;padding:6px 10px;gap:8px}.brand{font-size:16px}.topright{gap:6px;flex-wrap:wrap;justify-content:flex-end}.nav-link{padding:5px 8px}
  .summary{grid-template-columns:repeat(2,1fr)}
  .race-head{grid-template-columns:72px 46px 82px 72px 102px 1fr;padding:5px 7px}
  .total{display:block;grid-column:1/-1;text-align:left;border-top:1px solid #e3e7eb;padding-top:5px}
  .result-line{max-width:300px;font-size:12px}.result-line strong{font-size:13px}.result-profit strong{font-size:16px}
  .formation,.formation-header{grid-template-columns:72px 1fr 88px}.famount{font-size:14px}.famount .multi{font-size:12px}.famount .unit{font-size:14px}.famount .yen{font-size:13px}
}

/* 2026-09-11 v2: point/stake summary on one horizontal line */
.formation-header{grid-template-columns:90px 1fr 220px}
.formation{grid-template-columns:90px 1fr 220px}
.famount{display:flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap;padding:4px 8px}
.famount .points{font-size:16px;font-weight:900}
.famount .multi,.famount .unit,.famount .yen{display:inline;margin:0;font-size:15px;line-height:1.2}
.famount .multi{color:#0f7a3b}
.famount .yen{color:#374151;font-weight:900}
@media(max-width:1050px){.formation-header,.formation{grid-template-columns:78px 1fr 190px}.famount{gap:7px}.famount .points,.famount .multi,.famount .unit,.famount .yen{font-size:13px}}
@media(max-width:850px){.formation-header,.formation{grid-template-columns:72px 1fr 170px}.famount{gap:5px;flex-wrap:wrap}.famount .points,.famount .multi,.famount .unit,.famount .yen{font-size:12px}}


/* 2026-09-11 v4: keep point/stake information on a single horizontal line */
.formations-wrap{overflow-x:auto}
.formation-header{grid-template-columns:90px minmax(420px,1fr) 270px}
.formation{grid-template-columns:90px minmax(420px,1fr) 270px}
.famount{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;align-items:center;justify-content:center;column-gap:12px;white-space:nowrap;flex-wrap:nowrap!important;padding:5px 10px}
.famount .points,.famount .multi,.famount .unit,.famount .yen{display:inline!important;margin:0!important;font-size:15px;line-height:1.2;white-space:nowrap}
.famount .points{font-size:16px}
.famount .yen{font-weight:900}
@media(max-width:1050px){
  .formation-header,.formation{grid-template-columns:78px minmax(390px,1fr) 245px}
  .famount{column-gap:8px}
  .famount .points,.famount .multi,.famount .unit,.famount .yen{font-size:13px}
}
@media(max-width:850px){
  .formation-header,.formation{min-width:740px;grid-template-columns:72px minmax(380px,1fr) 245px}
  .famount{column-gap:7px;flex-wrap:nowrap!important}
  .famount .points,.famount .multi,.famount .unit,.famount .yen{font-size:13px}
}

/* 2026-09-11 v5: show boat candidates horizontally inside 1st/2nd/3rd columns */
.nums{
  flex-direction:row!important;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:6px;
}


/* 2026-09-11 v6: candidate boats horizontal; restore point/stake column to stacked layout */
.nums-horizontal{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
}
.nums-horizontal .boat{margin:0!important;flex:0 0 auto}

/* Restore the right-side point/stake summary to its earlier stacked layout. */
.formation-header{grid-template-columns:90px 1fr 96px}
.formation{grid-template-columns:90px 1fr 96px}
.famount{
  display:block!important;
  text-align:center;
  white-space:normal!important;
  padding:4px 2px;
  font-weight:900;
  line-height:1.2;
}
.famount .points{display:block!important;font-size:16px;margin:0!important}
.famount .multi{display:block!important;font-size:14px;margin-top:2px!important;color:#0f7a3b}
.famount .unit{display:block!important;font-size:15px;margin-top:3px!important}
.famount .yen{display:block!important;font-size:14px;margin-top:3px!important;color:#374151;font-weight:900}

@media(max-width:1050px){
  .formation-header,.formation{grid-template-columns:78px 1fr 90px}
  .famount .points{font-size:14px}
  .famount .multi{font-size:12px}
  .famount .unit{font-size:13px}
  .famount .yen{font-size:12px}
}
@media(max-width:850px){
  .formation-header,.formation{min-width:0;grid-template-columns:72px 1fr 88px}
  .famount .points{font-size:14px}
  .famount .multi{font-size:12px}
  .famount .unit{font-size:13px}
  .famount .yen{font-size:12px}
}

/* 2026-09-11 v7: compact strategy label, responsive mobile typography, larger desktop typography */
/* Display only: keep strategy metadata in DOM/data, but show only the circled row number. */
.fname .meta{display:none!important}

/* Make candidate numbers unequivocally horizontal. */
.nums-horizontal{
  display:grid!important;
  grid-auto-flow:column!important;
  grid-auto-columns:max-content!important;
  grid-template-rows:1fr!important;
  align-items:center!important;
  justify-content:center!important;
  column-gap:8px!important;
  row-gap:0!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0 auto!important;
}
.nums-horizontal .boat{margin:0!important;flex:none!important}

/* Desktop: intentionally larger than v6 for easier monitoring. */
@media(min-width:1200px){
  .wrap{max-width:none;padding:6px 12px}
  .brand{font-size:20px}
  .nav-link{font-size:14px;padding:6px 12px}
  #raceDate{font-size:14px}
  #updatedAt{font-size:12px}
  .section-title h2{font-size:19px}
  .section-title span{font-size:11px}
  .sum{min-height:72px;padding:9px 12px}
  .sum .k{font-size:12px}
  .sum .v{font-size:22px}
  .sum-sub{font-size:11px}
  .race-head{grid-template-columns:100px 64px 104px 98px 132px minmax(180px,1fr) 230px;min-height:64px;padding:7px 10px}
  .venue{font-size:21px}.rno{font-size:21px}
  .deadline small,.remain small{font-size:10px}
  .deadline strong,.remain strong{font-size:20px}
  .status{font-size:15px;padding:7px 12px}
  .quick{font-size:12px}
  .total{font-size:16px}
  .formation-header{grid-template-columns:72px 1fr 104px;font-size:14px;min-height:34px}
  .formation{grid-template-columns:72px 1fr 104px;min-height:54px}
  .fname{font-size:17px;padding:5px 8px}
  .boat{width:27px;height:27px;font-size:20px}
  .nums-horizontal{column-gap:10px!important}
  .famount .points{font-size:17px}
  .famount .multi{font-size:14px}
  .famount .unit{font-size:15px}
  .famount .yen{font-size:14px}
  .history summary{font-size:11px}
}

/* Mobile/tablet: scale text and spacing from viewport width instead of fixed desktop sizes. */
@media(max-width:850px){
  body{font-size:clamp(10px,2.7vw,13px)}
  .wrap{padding:clamp(4px,1.8vw,8px)}
  .topbar{padding:clamp(5px,1.8vw,8px);gap:clamp(4px,1.4vw,8px)}
  .brand{font-size:clamp(13px,4.1vw,17px);white-space:nowrap}
  .topright{gap:clamp(3px,1.2vw,6px)}
  .nav-link{font-size:clamp(10px,2.8vw,12px);padding:clamp(4px,1.2vw,6px) clamp(6px,2vw,9px)}
  #raceDate{font-size:clamp(10px,2.8vw,12px);max-width:132px}
  #updatedAt{font-size:clamp(9px,2.4vw,11px)}
  .summary{gap:4px}
  .sum{min-height:clamp(54px,15vw,66px);padding:clamp(5px,1.8vw,8px)}
  .sum .k{font-size:clamp(9px,2.5vw,11px)}
  .sum .v{font-size:clamp(15px,4.5vw,20px)}
  .sum-sub{font-size:clamp(8px,2.2vw,10px)}
  .section-title{gap:4px}
  .section-title h2{font-size:clamp(14px,4vw,18px)}
  .section-title span{font-size:clamp(8px,2.2vw,10px)}
  .race-head{grid-template-columns:minmax(54px,1fr) 40px 68px 62px minmax(76px,1fr) minmax(70px,1.4fr);gap:2px;padding:5px 6px}
  .venue,.rno{font-size:clamp(15px,4.4vw,19px)}
  .deadline small,.remain small{font-size:clamp(7px,2vw,9px)}
  .deadline strong,.remain strong{font-size:clamp(14px,4vw,18px)}
  .status{font-size:clamp(11px,3.1vw,14px);padding:5px 6px}
  .quick{font-size:clamp(8px,2.2vw,10px)}
  .total{font-size:clamp(11px,3vw,14px)}
  .formation-header,.formation{grid-template-columns:clamp(44px,13vw,60px) minmax(0,1fr) clamp(66px,20vw,86px)}
  .formation-header{font-size:clamp(9px,2.5vw,11px)}
  .fname{font-size:clamp(12px,3.5vw,16px);padding:3px 4px;text-align:center}
  .fcol{padding:2px clamp(1px,.8vw,4px);min-width:0;overflow:visible}
  .nums-horizontal{column-gap:clamp(2px,1.2vw,6px)!important}
  .boat{width:clamp(18px,5.3vw,23px);height:clamp(18px,5.3vw,23px);font-size:clamp(13px,4vw,17px)}
  .famount{padding:3px 1px}
  .famount .points{font-size:clamp(11px,3.1vw,14px)}
  .famount .multi{font-size:clamp(9px,2.6vw,12px)}
  .famount .unit{font-size:clamp(10px,2.8vw,13px)}
  .famount .yen{font-size:clamp(9px,2.6vw,12px)}
  .result-combo{font-size:clamp(13px,3.6vw,16px)}
  .result-line{font-size:clamp(9px,2.5vw,12px);max-width:none}
  .result-line strong{font-size:clamp(10px,2.8vw,13px)}
  .result-profit strong{font-size:clamp(12px,3.4vw,15px)}
}

@media(max-width:520px){
  .summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .topbar{align-items:flex-start}
  .topright{width:100%;justify-content:flex-end}
  .main-nav{order:1}
  .formation-header,.formation{grid-template-columns:42px minmax(0,1fr) 72px}
  .boat{width:clamp(17px,5vw,20px);height:clamp(17px,5vw,20px);font-size:clamp(12px,3.6vw,15px)}
  .nums-horizontal{column-gap:clamp(1px,.9vw,4px)!important}
}

/* 2026-09-11 v9: finished SKIP detection + stronger grey compact rows */
@media(min-width:1100px){
  .topbar{min-height:58px;padding:0 20px}
  .brand{font-size:24px}
  .topright{font-size:14px;gap:12px}
  .nav-link{font-size:16px;padding:8px 14px}
  #raceDate{font-size:16px;height:34px}
  #updatedAt{font-size:14px}
  .wrap{max-width:none;padding:10px 18px 34px}
  .section-title{margin:14px 0 8px}
  .section-title h2{font-size:23px}
  .section-title span{font-size:13px}
  .summary{gap:8px;margin-bottom:12px}
  .sum{min-height:84px;padding:11px 14px}
  .sum .k{font-size:14px}
  .sum .v{font-size:27px}
  .sum-sub{font-size:12px}
  .race{margin-bottom:9px}
  .race-head{grid-template-columns:122px 76px 118px 112px 148px minmax(220px,1fr) 245px;min-height:76px;padding:9px 12px;gap:9px}
  .venue{font-size:25px}
  .rno{font-size:25px}
  .deadline small,.remain small{font-size:12px}
  .deadline strong,.remain strong{font-size:24px}
  .status{font-size:18px;padding:9px 12px}
  .quick{font-size:14px;line-height:1.45}
  .total{font-size:18px}
  .formation-header{grid-template-columns:78px 1fr 116px;font-size:16px;min-height:40px}
  .formation{grid-template-columns:78px 1fr 116px;min-height:64px}
  .fname{font-size:20px;padding:6px 8px}
  .boat{width:32px;height:32px;font-size:23px;border-width:1.5px}
  .nums-horizontal{column-gap:12px!important}
  .famount .points{font-size:20px}
  .famount .multi{font-size:16px}
  .famount .unit{font-size:17px}
  .famount .yen{font-size:16px}
  .result-combo{font-size:18px}
  .result-line{font-size:13px}
  .result-line strong{font-size:15px}
  .result-profit strong{font-size:19px}
  .history summary{font-size:13px}
}

/* SKIP = display-only compact row. Data/status are unchanged. */
.race.skip-race{
  background:#dfe3e8!important;
  border-color:#bcc3cb!important;
  opacity:.58;
  filter:grayscale(1) saturate(0);
  margin-bottom:4px;
}
.race.skip-race .race-head{
  background:#dfe3e8!important;
  color:#69707a!important;
  min-height:38px;
  grid-template-columns:110px 62px 110px 120px;
  justify-content:start;
  border-bottom:0;
  padding:4px 10px;
  gap:8px;
}
.race.skip-race .remain,
.race.skip-race .quick,
.race.skip-race .total{display:none!important}
.race.skip-race .venue,
.race.skip-race .rno,
.race.skip-race .deadline strong{color:#6b7280}
.race.skip-race .status.skip{
  background:#d7dbe0;
  color:#5f6670;
  border:1px solid #c6cbd1;
  padding:4px 8px;
}
@media(min-width:1100px){
  .race.skip-race .race-head{min-height:46px;grid-template-columns:140px 72px 128px 140px;padding:5px 12px}
  .race.skip-race .venue{font-size:20px}
  .race.skip-race .rno{font-size:20px}
  .race.skip-race .deadline strong{font-size:19px}
  .race.skip-race .status{font-size:15px}
}
@media(max-width:850px){
  .race.skip-race{opacity:.55}
  .race.skip-race .race-head{grid-template-columns:minmax(70px,1fr) 42px 72px 86px;min-height:34px;padding:3px 6px;gap:3px}
  .race.skip-race .venue,.race.skip-race .rno{font-size:clamp(12px,3.7vw,16px)}
  .race.skip-race .deadline small{font-size:clamp(7px,1.9vw,9px)}
  .race.skip-race .deadline strong{font-size:clamp(11px,3.2vw,14px)}
  .race.skip-race .status{font-size:clamp(9px,2.6vw,12px);padding:3px 4px}
}


/* 2026-09-12 v10: LIVE attention alerts */
.notify-toggle{
  appearance:none;border:1px solid #c7cdd4;background:#fff;color:#374151;
  border-radius:7px;padding:6px 10px;font-weight:800;font-size:12px;cursor:pointer;
  white-space:nowrap;line-height:1.2;
}
.notify-toggle:hover{background:#f3f4f6}
.notify-toggle.active{background:#e8f7ee;border-color:#78b990;color:#126b37}
@media(max-width:850px){
  .notify-toggle{font-size:clamp(9px,2.5vw,11px);padding:clamp(4px,1.1vw,6px) clamp(5px,1.7vw,8px)}
}


/* 2026-09-12 v14: visible notification diagnostics; display-only, no API/DB changes */
.notification-diag{
  margin:0 0 12px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#f8fafc;
  padding:10px 12px;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.notification-diag-head{
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-bottom:8px;
}
.notification-diag-head strong{font-size:14px;color:#0f172a}
.notification-diag-head span{font-size:11px;color:#64748b}
.notification-diag-state{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  margin-bottom:8px;
}
.notification-diag-state>div{
  display:flex;
  flex-direction:column;
  gap:2px;
  border:1px solid #e2e8f0;
  border-radius:7px;
  background:#fff;
  padding:6px 8px;
  min-width:0;
}
.notification-diag-state span{font-size:10px;color:#64748b}
.notification-diag-state strong{font-size:12px;color:#111827;overflow-wrap:anywhere}
.notification-diag-actions{display:flex;flex-wrap:wrap;gap:6px}
.notification-diag-actions button{
  appearance:none;
  border:1px solid #94a3b8;
  background:#fff;
  color:#0f172a;
  border-radius:7px;
  padding:6px 9px;
  font-weight:800;
  font-size:11px;
  cursor:pointer;
}
.notification-diag-actions button:hover{background:#eef2f7}
.notification-diag-actions button:active{transform:translateY(1px)}
.notification-diag-result{
  margin-top:7px;
  padding:6px 8px;
  border-radius:7px;
  background:#eef2ff;
  color:#3730a3;
  font-size:11px;
  font-weight:800;
  overflow-wrap:anywhere;
}
.notification-diag-result.ok{background:#ecfdf5;color:#166534}
.notification-diag-result.fail{background:#fef2f2;color:#991b1b}
@media(min-width:1100px){
  .notification-diag{padding:12px 14px}
  .notification-diag-head strong{font-size:16px}
  .notification-diag-head span{font-size:12px}
  .notification-diag-state span{font-size:11px}
  .notification-diag-state strong{font-size:14px}
  .notification-diag-actions button{font-size:13px;padding:7px 11px}
  .notification-diag-result{font-size:13px}
}
@media(max-width:700px){
  .notification-diag{padding:8px}
  .notification-diag-head{display:block}
  .notification-diag-head span{display:block;margin-top:2px}
  .notification-diag-state{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
  .notification-diag-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
  .notification-diag-actions button{font-size:clamp(9px,2.5vw,11px);padding:6px 5px}
  #diagSimBuy{grid-column:1/-1}
}


/* MOBILE_LAYOUT_V22 */

/*
  Mobile header:
  keep everything on one blue row.
*/
@media (max-width:520px){

  .topbar{
    height:38px!important;
    min-height:38px!important;
    padding:3px 5px!important;
    gap:3px!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    overflow:hidden!important;
  }

  .brand{
    flex:0 0 auto!important;
    font-size:clamp(10px,2.7vw,12px)!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  .topright{
    width:auto!important;
    min-width:0!important;
    flex:1 1 auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    flex-wrap:nowrap!important;
    gap:2px!important;
    overflow:hidden!important;
  }

  .main-nav{
    order:0!important;
    display:flex!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    gap:2px!important;
    min-width:0!important;
  }

  #notificationMasterToggle{
    position:static!important;
    flex:0 0 auto!important;
    margin:0 2px 0 0!important;
    padding:3px 4px!important;
    font-size:clamp(7px,1.9vw,9px)!important;
    line-height:1!important;
    border-radius:4px!important;
    white-space:nowrap!important;
    box-shadow:none!important;
  }

  .nav-link{
    flex:0 0 auto!important;
    padding:3px 4px!important;
    font-size:clamp(8px,2.1vw,10px)!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  #raceDate{
    flex:0 1 88px!important;
    width:88px!important;
    min-width:0!important;
    max-width:88px!important;
    height:24px!important;
    padding:0 2px!important;
    font-size:9px!important;
  }

  #updatedAt{
    display:none!important;
  }


  /*
    Six KPI cards.
    Try one row first.
  */
  .summary{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:2px!important;
    margin-bottom:5px!important;
  }

  .sum{
    min-width:0!important;
    min-height:40px!important;
    padding:3px 2px!important;
  }

  .sum .k{
    font-size:clamp(7px,1.8vw,8px)!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }

  .sum .v{
    font-size:clamp(10px,2.7vw,12px)!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }

  .sum-sub{
    font-size:6.5px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }


  /*
    Formation:
    do NOT shrink boat-number text.
    Move label/1st-place left and give 2nd/3rd more width.
  */
  .formation-header,
  .formation{
    grid-template-columns:26px minmax(0,1fr) 60px!important;
  }

  .formation-header .blank{
    padding-left:0!important;
    text-align:left!important;
  }

  .fname{
    padding-left:0!important;
    padding-right:1px!important;
    text-align:left!important;
  }

  .header-cols,
  .fcols{
    grid-template-columns:18% 41% 41%!important;
  }

  .header-cols > div:first-child{
    text-align:left!important;
    padding-left:0!important;
  }

  .fcol:first-child{
    justify-content:flex-start!important;
    padding-left:0!important;
    padding-right:1px!important;
  }

  .fcol:first-child .nums-horizontal{
    justify-content:start!important;
  }

  .fcol:nth-child(2),
  .fcol:nth-child(3){
    padding-left:1px!important;
    padding-right:1px!important;
  }

  .nums-horizontal{
    column-gap:clamp(1px,.7vw,3px)!important;
  }

}


/*
  Narrow phones:
  six cards would become too small,
  so use two rows of three.
*/
@media (max-width:409px){

  .summary{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  .sum{
    min-height:38px!important;
  }

}


/* MOBILE_KPI_3X2_V23 */
@media (max-width:520px){

  .summary{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:4px!important;
    margin-bottom:6px!important;
  }

  .sum{
    min-width:0!important;
    min-height:46px!important;
    padding:5px 3px!important;
  }

  .sum .k{
    font-size:9px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }

  .sum .v{
    font-size:13px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }

  .sum-sub{
    font-size:8px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }

}

/* ==========================================================
   2026-09-13 v24
   compact result / hit attention / horizontal amount
   ========================================================== */

/* 的中した①②③部分 */
.fname.hit-label{
  outline:2px solid #d71920;
  outline-offset:-2px;
  background:#fff0f0;
  color:#b00000;
}

/* 終了結果は横並びで全幅を使用 */
.race.finished .total{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:nowrap;
  gap:14px;
  width:100%;
  overflow-x:auto;
  padding-top:5px;
  border-top:1px solid #e3e7eb;
  text-align:left;
  white-space:nowrap;
}

.race.finished .result-combo{
  margin:0;
  flex:0 0 auto;
}

.race.finished .result-line{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:5px;
  margin:0;
  padding:0;
  border:0;
  flex:0 0 auto;
  max-width:none;
}

.race.finished .result-profit{
  border-top:0;
  margin-top:0;
  padding-top:0;
}

/* 点数 ×条件 各金額 計金額 を必ず横並び */
.famount{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  white-space:nowrap!important;
}

.famount .points,
.famount .multi,
.famount .unit,
.famount .yen{
  display:inline!important;
  margin:0!important;
  white-space:nowrap!important;
}

/* スマホ */
@media(max-width:850px){

  /* これからのレースの 0点 / ¥0 を消す */
  .total.zero-total{
    display:none!important;
  }

  .race.finished .total{
    display:flex!important;
    grid-column:1/-1;
    gap:10px;
    font-size:11px;
    overflow-x:auto;
    white-space:nowrap;
  }

  .race.finished .result-combo{
    font-size:12px;
  }

  .race.finished .result-line,
  .race.finished .result-line strong,
  .race.finished .result-profit strong{
    font-size:11px;
  }

  .formation,
  .formation-header{
    grid-template-columns:
      72px minmax(0,1fr) 220px!important;
  }

  .famount{
    gap:5px!important;
    padding:3px 3px!important;
  }

  .famount .points,
  .famount .multi,
  .famount .unit,
  .famount .yen{
    font-size:11px!important;
  }
}

@media(max-width:520px){

  .formation,
  .formation-header{
    grid-template-columns:
      42px minmax(0,1fr) 180px!important;
  }

  .famount{
    gap:3px!important;
    padding:2px 1px!important;
  }

  .famount .points,
  .famount .multi,
  .famount .unit,
  .famount .yen{
    font-size:10px!important;
  }

  .race.finished .total{
    gap:8px;
    font-size:10px;
  }

  .race.finished .result-combo,
  .race.finished .result-line,
  .race.finished .result-line strong,
  .race.finished .result-profit strong{
    font-size:10px;
  }
}
/* ==========================================================
   2026-09-13 v25
   safe amount / result header / full-row hit
   ========================================================== */

/* v24の①だけ赤枠は無効 */
.fname.hit-label{
  outline:none!important;
  background:inherit!important;
  color:inherit!important;
}

/* 的中formationは列全部を赤枠 */
.formation.hit-row{
  border:2px solid #d71920!important;
  box-shadow:0 0 0 1px rgba(215,25,32,.12);
  background:#fff5f5!important;
}

/* 点数欄が右へ突き抜けないための基本設定 */
.formation,
.formation-header,
.fcols,
.fcol,
.nums,
.nums-horizontal,
.famount{
  min-width:0!important;
  box-sizing:border-box!important;
}

.formations-wrap{
  max-width:100%!important;
  overflow-x:hidden!important;
}

/* 点数は横並び維持 */
.famount{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  white-space:nowrap!important;
  overflow:hidden!important;
}

.famount .points,
.famount .multi,
.famount .unit,
.famount .yen{
  display:inline!important;
  flex:0 0 auto!important;
  margin:0!important;
  white-space:nowrap!important;
}

/* 終了結果の文字サイズを全部統一 */
.race.finished .total,
.race.finished .total *,
.race.finished .result-combo,
.race.finished .result-line,
.race.finished .result-line strong,
.race.finished .result-profit,
.race.finished .result-profit strong{
  font-size:10px!important;
  line-height:1.25!important;
  font-weight:800!important;
}

/*
  PC:
  結果を元のrace-head右端列へ戻す。
  びわこ / 1R / 締切 / 残り / 終了 / 購入なし
  と同じ行。
*/
@media(min-width:851px){

  .race.finished .race-head{
    grid-template-columns:
      78px
      50px
      86px
      76px
      108px
      minmax(80px,1fr)
      330px!important;
  }

  .race.finished .total{
    grid-column:auto!important;
    width:auto!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:6px!important;

    margin:0!important;
    padding:0!important;
    border:0!important;

    text-align:left!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }

  .race.finished .result-combo,
  .race.finished .result-line,
  .race.finished .result-profit{
    display:inline-flex!important;
    align-items:center!important;
    gap:3px!important;
    flex:0 0 auto!important;

    margin:0!important;
    padding:0!important;
    border:0!important;
    max-width:none!important;
  }
}


/* ==========================================
   スマホ
   ========================================== */

@media(max-width:850px){

  /*
    v24の220px固定を廃止。
    画面幅に合わせて右列を縮める。
  */
  .formation,
  .formation-header{
    grid-template-columns:
      42px
      minmax(0,1fr)
      clamp(145px,42vw,175px)!important;
    width:100%!important;
    max-width:100%!important;
  }

  .fcols{
    min-width:0!important;
    overflow:hidden!important;
  }

  .fcol{
    min-width:0!important;
    padding:2px 1px!important;
    overflow:hidden!important;
  }

  .nums-horizontal{
    min-width:0!important;
    gap:1px!important;
    overflow:hidden!important;
  }

  .boat{
    width:clamp(17px,4.8vw,20px)!important;
    height:clamp(17px,4.8vw,20px)!important;
    font-size:clamp(12px,3.5vw,14px)!important;
    flex:0 0 auto!important;
  }

  .famount{
    width:100%!important;
    max-width:100%!important;
    gap:3px!important;
    padding:2px!important;
  }

  .famount .points,
  .famount .multi,
  .famount .unit,
  .famount .yen{
    font-size:9px!important;
  }

  /*
    スマホの終了結果はrace-head内部。
    横幅不足時も画面外へ出さない。
  */
  .race.finished .total{
    width:100%!important;
    max-width:100%!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    gap:7px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    box-sizing:border-box!important;
  }

  .race.finished .result-combo,
  .race.finished .result-line,
  .race.finished .result-line strong,
  .race.finished .result-profit,
  .race.finished .result-profit strong{
    font-size:10px!important;
  }
}


@media(max-width:430px){

  .formation,
  .formation-header{
    grid-template-columns:
      38px
      minmax(0,1fr)
      clamp(138px,41vw,160px)!important;
  }

  .famount{
    gap:2px!important;
  }

  .famount .points,
  .famount .multi,
  .famount .unit,
  .famount .yen{
    font-size:8px!important;
  }
}
/* 2026-09-14 STATIC PC FONT 130 START */
@media (min-width:851px){.brand{font-size:23.4px!important;}}
@media (min-width:851px){.topright{font-size:14.3px!important;}}
@media (min-width:851px){.api-warning{font-size:14.3px!important;}}
@media (min-width:851px){.sum .k{font-size:13px!important;}}
@media (min-width:851px){.sum .v{font-size:23.4px!important;}}
@media (min-width:851px){.section-title h2{font-size:19.5px!important;}}
@media (min-width:851px){.section-title span{font-size:13px!important;}}
@media (min-width:851px){.venue{font-size:22.1px!important;}}
@media (min-width:851px){.rno{font-size:26px!important;}}
@media (min-width:851px){.deadline small,.remain small{font-size:11.7px!important;}}
@media (min-width:851px){.deadline strong{font-size:22.1px!important;}}
@media (min-width:851px){.remain strong{font-size:26px!important;}}
@media (min-width:851px){.status{font-size:19.5px!important;}}
@media (min-width:851px){.quick{font-size:13px!important;}}
@media (min-width:851px){.total{font-size:16.9px!important;}}
@media (min-width:851px){.formation-header{font-size:13px!important;}}
@media (min-width:851px){.fname{font-size:14.3px!important;}}
@media (min-width:851px){.fname .meta{font-size:10.4px!important;}}
@media (min-width:851px){.boat{font-size:20.8px!important;}}
@media (min-width:851px){.famount{font-size:15.6px!important;}}
@media (min-width:851px){.famount .yen{font-size:13px!important;}}
@media (min-width:851px){.history summary{font-size:11.7px!important;}}
@media (min-width:851px){.timeline{font-size:13px!important;}}
@media (min-width:851px){.empty{font-size:15.6px!important;}}
@media (min-width:851px){.famount .multi{font-size:11.7px!important;}}
@media (min-width:851px){.famount .unit{font-size:11.7px!important;}}
@media (min-width:851px){.diff-badge{font-size:13px!important;}}
@media (min-width:851px){.nav-link{font-size:15.6px!important;}}
@media (min-width:851px){.sum .k{font-size:14.3px!important;}}
@media (min-width:851px){.sum .v{font-size:24.7px!important;}}
@media (min-width:851px){.sum-sub{font-size:13px!important;}}
@media (min-width:851px){.quick{font-size:14.3px!important;}}
@media (min-width:851px){.total{font-size:19.5px!important;}}
@media (min-width:851px){.formation-header{font-size:15.6px!important;}}
@media (min-width:851px){.fname{font-size:16.9px!important;}}
@media (min-width:851px){.fname .meta{font-size:11.7px!important;}}
@media (min-width:851px){.famount{font-size:20.8px!important;}}
@media (min-width:851px){.famount .multi{font-size:18.2px!important;}}
@media (min-width:851px){.famount .unit{font-size:19.5px!important;}}
@media (min-width:851px){.famount .yen{font-size:18.2px!important;}}
@media (min-width:851px){.result-combo{font-size:19.5px!important;}}
@media (min-width:851px){.result-line{font-size:14.3px!important;}}
@media (min-width:851px){.result-line strong{font-size:15.6px!important;}}
@media (min-width:851px){.result-profit strong{font-size:19.5px!important;}}
@media (min-width:851px){.famount .points{font-size:20.8px!important;}}
@media (min-width:851px){.famount .multi,.famount .unit,.famount .yen{font-size:19.5px!important;}}
@media (min-width:851px) and (max-width:1050px){.famount .points,.famount .multi,.famount .unit,.famount .yen{font-size:16.9px!important;}}
@media (min-width:851px){.famount .points,.famount .multi,.famount .unit,.famount .yen{font-size:19.5px!important;}}
@media (min-width:851px){.famount .points{font-size:20.8px!important;}}
@media (min-width:851px) and (max-width:1050px){.famount .points,.famount .multi,.famount .unit,.famount .yen{font-size:16.9px!important;}}
@media (min-width:851px){.famount .points{font-size:20.8px!important;}}
@media (min-width:851px){.famount .multi{font-size:18.2px!important;}}
@media (min-width:851px){.famount .unit{font-size:19.5px!important;}}
@media (min-width:851px){.famount .yen{font-size:18.2px!important;}}
@media (min-width:851px) and (max-width:1050px){.famount .points{font-size:18.2px!important;}}
@media (min-width:851px) and (max-width:1050px){.famount .multi{font-size:15.6px!important;}}
@media (min-width:851px) and (max-width:1050px){.famount .unit{font-size:16.9px!important;}}
@media (min-width:851px) and (max-width:1050px){.famount .yen{font-size:15.6px!important;}}
@media (min-width:1200px){.brand{font-size:26px!important;}}
@media (min-width:1200px){.nav-link{font-size:18.2px!important;}}
@media (min-width:1200px){#raceDate{font-size:18.2px!important;}}
@media (min-width:1200px){#updatedAt{font-size:15.6px!important;}}
@media (min-width:1200px){.section-title h2{font-size:24.7px!important;}}
@media (min-width:1200px){.section-title span{font-size:14.3px!important;}}
@media (min-width:1200px){.sum .k{font-size:15.6px!important;}}
@media (min-width:1200px){.sum .v{font-size:28.6px!important;}}
@media (min-width:1200px){.sum-sub{font-size:14.3px!important;}}
@media (min-width:1200px){.venue{font-size:27.3px!important;}}
@media (min-width:1200px){.rno{font-size:27.3px!important;}}
@media (min-width:1200px){.deadline small,.remain small{font-size:13px!important;}}
@media (min-width:1200px){.deadline strong,.remain strong{font-size:26px!important;}}
@media (min-width:1200px){.status{font-size:19.5px!important;}}
@media (min-width:1200px){.quick{font-size:15.6px!important;}}
@media (min-width:1200px){.total{font-size:20.8px!important;}}
@media (min-width:1200px){.formation-header{font-size:18.2px!important;}}
@media (min-width:1200px){.fname{font-size:22.1px!important;}}
@media (min-width:1200px){.boat{font-size:26px!important;}}
@media (min-width:1200px){.famount .points{font-size:22.1px!important;}}
@media (min-width:1200px){.famount .multi{font-size:18.2px!important;}}
@media (min-width:1200px){.famount .unit{font-size:19.5px!important;}}
@media (min-width:1200px){.famount .yen{font-size:18.2px!important;}}
@media (min-width:1200px){.history summary{font-size:14.3px!important;}}
@media (min-width:1100px){.brand{font-size:31.2px!important;}}
@media (min-width:1100px){.topright{font-size:18.2px!important;}}
@media (min-width:1100px){.nav-link{font-size:20.8px!important;}}
@media (min-width:1100px){#raceDate{font-size:20.8px!important;}}
@media (min-width:1100px){#updatedAt{font-size:18.2px!important;}}
@media (min-width:1100px){.section-title h2{font-size:29.9px!important;}}
@media (min-width:1100px){.section-title span{font-size:16.9px!important;}}
@media (min-width:1100px){.sum .k{font-size:18.2px!important;}}
@media (min-width:1100px){.sum .v{font-size:35.1px!important;}}
@media (min-width:1100px){.sum-sub{font-size:15.6px!important;}}
@media (min-width:1100px){.venue{font-size:32.5px!important;}}
@media (min-width:1100px){.rno{font-size:32.5px!important;}}
@media (min-width:1100px){.deadline small,.remain small{font-size:15.6px!important;}}
@media (min-width:1100px){.deadline strong,.remain strong{font-size:31.2px!important;}}
@media (min-width:1100px){.status{font-size:23.4px!important;}}
@media (min-width:1100px){.quick{font-size:18.2px!important;}}
@media (min-width:1100px){.total{font-size:23.4px!important;}}
@media (min-width:1100px){.formation-header{font-size:20.8px!important;}}
@media (min-width:1100px){.fname{font-size:26px!important;}}
@media (min-width:1100px){.boat{font-size:29.9px!important;}}
@media (min-width:1100px){.famount .points{font-size:26px!important;}}
@media (min-width:1100px){.famount .multi{font-size:20.8px!important;}}
@media (min-width:1100px){.famount .unit{font-size:22.1px!important;}}
@media (min-width:1100px){.famount .yen{font-size:20.8px!important;}}
@media (min-width:1100px){.result-combo{font-size:23.4px!important;}}
@media (min-width:1100px){.result-line{font-size:16.9px!important;}}
@media (min-width:1100px){.result-line strong{font-size:19.5px!important;}}
@media (min-width:1100px){.result-profit strong{font-size:24.7px!important;}}
@media (min-width:1100px){.history summary{font-size:16.9px!important;}}
@media (min-width:1100px){.race.skip-race .venue{font-size:26px!important;}}
@media (min-width:1100px){.race.skip-race .rno{font-size:26px!important;}}
@media (min-width:1100px){.race.skip-race .deadline strong{font-size:24.7px!important;}}
@media (min-width:1100px){.race.skip-race .status{font-size:19.5px!important;}}
@media (min-width:851px){.notify-toggle{font-size:15.6px!important;}}
@media (min-width:851px){.notification-diag-head strong{font-size:18.2px!important;}}
@media (min-width:851px){.notification-diag-head span{font-size:14.3px!important;}}
@media (min-width:851px){.notification-diag-state span{font-size:13px!important;}}
@media (min-width:851px){.notification-diag-state strong{font-size:15.6px!important;}}
@media (min-width:851px){.notification-diag-actions button{font-size:14.3px!important;}}
@media (min-width:851px){.notification-diag-result{font-size:14.3px!important;}}
@media (min-width:1100px){.notification-diag-head strong{font-size:20.8px!important;}}
@media (min-width:1100px){.notification-diag-head span{font-size:15.6px!important;}}
@media (min-width:1100px){.notification-diag-state span{font-size:14.3px!important;}}
@media (min-width:1100px){.notification-diag-state strong{font-size:18.2px!important;}}
@media (min-width:1100px){.notification-diag-actions button{font-size:16.9px!important;}}
@media (min-width:1100px){.notification-diag-result{font-size:16.9px!important;}}
@media (min-width:851px){.race.finished .total,
.race.finished .total *,
.race.finished .result-combo,
.race.finished .result-line,
.race.finished .result-line strong,
.race.finished .result-profit,
.race.finished .result-profit strong{font-size:13px!important;}}
@media (min-width:851px){.famount .points,
  .famount .multi,
  .famount .unit,
  .famount .yen{font-size:22.1px!important;}}
@media (min-width:851px){.fname{font-size:22.1px!important;}}
@media (min-width:851px){.formation-header .blank,
  .points-head{font-size:22.1px!important;}}
@media (min-width:851px){.header-cols > div{font-size:19.5px!important;}}
@media (min-width:851px){.quick{font-size:18.2px!important;}}
@media (min-width:851px){.diff-badge{font-size:16.9px!important;}}
/* 2026-09-14 STATIC PC FONT 130 END */

/* 2026-09-14 FINAL STATIC FIVE COLUMN GRID */
@media (min-width:851px){

  /*
    All header/data cells participate in ONE shared grid.

    Therefore each column width is calculated from
    the widest content anywhere in that column.

    Structure remains exactly:
      buying | first | second | third | amount
  */
  .formations-wrap{
    display:grid!important;

    grid-template-columns:
      max-content
      minmax(max-content,2fr)
      minmax(max-content,3fr)
      minmax(max-content,3fr)
      max-content
      !important;

    grid-auto-flow:row!important;

    width:100%!important;
    max-width:100%!important;

    box-sizing:border-box!important;

    padding-left:4px!important;
    padding-right:4px!important;

    column-gap:0!important;
    row-gap:2px!important;

    /*
      If the actual browser becomes narrower than
      the true minimum content width, never overlap
      or cut text.
    */
    overflow-x:auto!important;
  }


  /*
    Flatten ONLY the existing layout wrappers.
    DOM/data structure is unchanged.
  */
  .formation-header,
  .formations,
  .formation,
  .header-cols,
  .fcols{
    display:contents!important;
  }


  /*
    Header cells.
  */
  .formation-header > .blank,
  .header-cols > div,
  .points-head{
    min-width:0!important;

    box-sizing:border-box!important;

    display:flex!important;

    align-items:center!important;
    justify-content:center!important;

    padding:
      6px 12px
      !important;

    text-align:center!important;

    white-space:nowrap!important;

    background:#eef1f4!important;

    border-top:
      1px solid #c9cfd6
      !important;

    border-bottom:
      1px solid #c9cfd6
      !important;

    border-right:
      1px solid var(--line2)
      !important;
  }


  .formation-header > .blank{
    border-left:
      1px solid #c9cfd6
      !important;
  }


  /*
    Data cells.
  */
  .formation > .fname,
  .fcols > .fcol,
  .formation > .famount{
    min-width:0!important;

    box-sizing:border-box!important;

    min-height:48px!important;

    padding-left:12px!important;
    padding-right:12px!important;

    background:#fafafa!important;

    border-top:
      1px solid #c9cfd6
      !important;

    border-bottom:
      1px solid #c9cfd6
      !important;

    border-right:
      1px solid var(--line2)
      !important;
  }


  .formation > .fname{
    display:flex!important;

    flex-direction:column!important;

    align-items:center!important;
    justify-content:center!important;

    text-align:center!important;

    white-space:nowrap!important;

    border-left:
      1px solid #c9cfd6
      !important;
  }


  /*
    1st / 2nd / 3rd.
  */
  .fcols > .fcol{
    display:flex!important;

    align-items:center!important;
    justify-content:center!important;

    text-align:center!important;
  }


  .nums-horizontal{
    display:flex!important;

    flex-direction:row!important;
    flex-wrap:nowrap!important;

    align-items:center!important;
    justify-content:center!important;

    width:max-content!important;
    min-width:max-content!important;
    max-width:none!important;

    margin:0 auto!important;

    column-gap:6px!important;
    row-gap:0!important;
  }


  .nums-horizontal .boat{
    flex:0 0 auto!important;
    margin:0!important;
  }


  /*
    Right side stays one horizontal line.
  */
  .formation > .famount{
    display:flex!important;

    flex-direction:row!important;
    flex-wrap:nowrap!important;

    align-items:center!important;
    justify-content:center!important;

    column-gap:10px!important;

    white-space:nowrap!important;

    overflow:visible!important;
  }


  .famount .points,
  .famount .multi,
  .famount .unit,
  .famount .yen{
    display:inline-block!important;

    width:auto!important;

    margin:0!important;

    white-space:nowrap!important;

    text-align:center!important;
  }
}

/* MOBILE_FINAL_WRAP_START */
@media (max-width:850px){

  /*
    ?: ???
    ??: 1? / 2? / 3?
    ?: ?????

    ????118px?
  */
  .formation-header,
  .formation{
    display:grid!important;

    grid-template-columns:
      58px
      minmax(0,1fr)
      118px
      !important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    box-sizing:border-box!important;
  }


  /*
    ??3???????????
  */
  .header-cols,
  .fcols{
    display:grid!important;

    grid-template-columns:
      repeat(3,minmax(0,1fr))
      !important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

    box-sizing:border-box!important;
  }


  .fname,
  .fcol,
  .famount{
    min-width:0!important;
    box-sizing:border-box!important;
  }


  .fcol{
    display:flex!important;

    align-items:center!important;
    justify-content:center!important;

    padding-left:2px!important;
    padding-right:2px!important;

    overflow:hidden!important;
  }


  /*
    1?3???????????
  */
  .fcol .nums-horizontal:not(.mobile-many-boats){
    display:flex!important;

    flex-direction:row!important;
    flex-wrap:nowrap!important;

    align-items:center!important;
    justify-content:center!important;

    width:max-content!important;
    max-width:100%!important;

    gap:4px!important;

    margin-left:auto!important;
    margin-right:auto!important;
  }


  /*
    4??????2??

    4?:
       1 2
       3 4

    5?:
       1 2
       3 4
       5
  */
  .fcol .nums-horizontal.mobile-many-boats{
    display:grid!important;

    grid-template-columns:
      repeat(2,max-content)
      !important;

    grid-auto-flow:row!important;
    grid-auto-rows:max-content!important;

    justify-content:center!important;
    align-content:center!important;

    justify-items:center!important;
    align-items:center!important;

    column-gap:4px!important;
    row-gap:5px!important;

    width:max-content!important;
    min-width:0!important;
    max-width:100%!important;

    margin:5px auto!important;
  }


  .fcol .nums-horizontal.mobile-many-boats .boat{
    margin:0!important;
    flex:none!important;
  }


  /*
    ????118px?
  */
  .points-head,
  .formation > .famount{
    width:118px!important;
    min-width:118px!important;
    max-width:118px!important;

    box-sizing:border-box!important;
  }


  /*
    ?????2??

       12?   ?6??
       ??600 ??7,200
  */
  .formation > .famount{
    display:grid!important;

    grid-template-columns:
      minmax(0,1fr)
      minmax(0,1fr)
      !important;

    grid-template-rows:
      auto auto
      !important;

    align-content:center!important;
    align-items:center!important;

    justify-content:stretch!important;
    justify-items:center!important;

    column-gap:2px!important;
    row-gap:3px!important;

    padding:
      5px 2px
      !important;

    white-space:normal!important;

    overflow:hidden!important;
  }


  .formation > .famount .points{
    grid-column:1!important;
    grid-row:1!important;
  }

  .formation > .famount .multi{
    grid-column:2!important;
    grid-row:1!important;
  }

  .formation > .famount .unit{
    grid-column:1!important;
    grid-row:2!important;
  }

  .formation > .famount .yen{
    grid-column:2!important;
    grid-row:2!important;
  }


  .formation > .famount .points,
  .formation > .famount .multi,
  .formation > .famount .unit,
  .formation > .famount .yen{
    display:block!important;

    width:auto!important;
    max-width:100%!important;

    margin:0!important;

    white-space:nowrap!important;

    text-align:center!important;
  }
}
/* MOBILE_FINAL_WRAP_END */



/* EXECUTION_544_CAP5_V1 -----------------------------------------------------
   運用基準 (条件セット / リスク制御ルール / 日別・総累計) の表示帯。
   金額はすべて executed (実行) 側。original は補助表示。 */
.execution-bar{
  margin:8px 0 10px;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(255,255,255,.03);
  font-size:12px;
  line-height:1.5;
}
.execution-bar.hidden{display:none;}
.execution-bar .exec-head{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
}
.execution-bar .exec-tag{
  padding:1px 8px;border-radius:999px;font-weight:700;letter-spacing:.02em;
}
.execution-bar .exec-tag.live{background:#1d5e35;color:#d9ffe8;}
.execution-bar .exec-tag.backfill{background:#294b7a;color:#dbe9ff;}
.execution-bar .exec-tag.legacy{background:#5a4a1e;color:#ffeec2;}
.execution-bar .exec-rule{opacity:.85;}
.execution-bar .exec-note{opacity:.7;}
.execution-bar .exec-daily{
  display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;
}
.execution-bar .exec-day{
  display:flex;flex-direction:column;align-items:flex-start;
  min-width:78px;padding:4px 6px;border-radius:6px;
  background:rgba(255,255,255,.05);
}
.execution-bar .exec-day em{font-style:normal;opacity:.7;font-size:11px;}
.execution-bar .exec-day b{font-size:13px;}
.execution-bar .exec-day i{font-style:normal;opacity:.65;font-size:11px;}
.execution-bar .exec-day u{
  text-decoration:none;opacity:.5;font-size:10px;letter-spacing:.08em;
}
.execution-bar .exec-day.plus b{color:#7ee2a8;}
.execution-bar .exec-day.minus b{color:#ff9b9b;}
.result-line.result-orig{opacity:.65;}
@media (max-width:520px){
  .execution-bar .exec-day{min-width:64px;}
  .execution-bar{font-size:11px;}
}

/* ==========================================================
   UI_RESTORE_PC_20260915
   PC (>=851px) のみ。スマホ (<=850px) の指定は一切変えない。
   ========================================================== */

/* --- 1. 的中買い目の囲いを PC でも出す ------------------- */
@media (min-width:851px){

  /* .formation は display:contents なので行自身に枠は描けない。
     子セル側で上下左右を閉じて 1 行を囲う。 */
  .formation.hit-row > .fname,
  .formation.hit-row > .fcols > .fcol,
  .formation.hit-row > .famount{
    background:#fff5f5!important;
    border-top:2px solid #d71920!important;
    border-bottom:2px solid #d71920!important;
  }

  .formation.hit-row > .fname{
    border-left:2px solid #d71920!important;
  }

  .formation.hit-row > .famount{
    border-right:2px solid #d71920!important;
  }
}

/* --- 2. 確定 / 払戻 等の文字サイズを戻す ----------------- */
@media (min-width:851px){

  .race.finished .total{
    font-size:18px!important;
  }

  .race.finished .result-combo{
    font-size:18px!important;
  }

  .race.finished .result-line,
  .race.finished .result-profit{
    font-size:13px!important;
  }

  .race.finished .result-line span,
  .race.finished .result-profit span{
    font-size:13px!important;
  }

  .race.finished .result-line strong{
    font-size:15px!important;
  }

  .race.finished .result-profit strong{
    font-size:19px!important;
  }
}

/* --- 3. 確定行の値が列幅で切れないようにする -------------
   文字サイズを元へ戻すと
   確定 / 100円払戻 / 実行口数 / 実投資 / 払戻 / 総回収 /
   収支 / ROI / 制限前 の一行に 840px 必要になるが、
   右端列は 330px 固定で overflow:hidden だった。
   (この切れは以前からで、13px へ潰した版でも
    "実投資 ¥1,..." の位置で切れていた。)
   列幅は動かさず、確定行だけ折り返せるようにする。
   1100〜1920px で全項目が表示され、行の高さも変わらない。
   表示する値・意味は一切変えていない。 */
@media (min-width:851px){

  .race.finished .race-head{
    grid-template-columns:
      78px
      50px
      86px
      76px
      108px
      minmax(80px,1fr)
      330px!important;
  }

  .race.finished .total{
    flex-wrap:wrap!important;
    overflow:visible!important;
    row-gap:2px!important;
  }
}

/* ==========================================================
   FORMATIONS_WRAP_HIDDEN_FIX_20260915

   live.js は買い目が 0 件のレース (暫定で 544 条件が 1 つも成立
   しなかったレース / 見送りレース) で
       wrap.classList.add('hidden')
   を付けて買い方ブロックごと非表示にしている。

   ところが PC 帯 (min-width:851px) の 5 列レイアウト
   (UI_PC_FORMATION_SHARED_GRID: .formations-wrap{display:grid!important})
   は
       .hidden{display:none!important}            (specificity 0,1,0)
   と同じ specificity 0,1,0 の !important なので、
   後勝ちで display:grid が採用されてしまい、
   「買い方 / 1着 / 2着 / 3着 / 点数」のヘッダ行だけが
   中身 0 行のまま描画されていた。
   (スマホ帯は media 外なので従来どおり完全非表示。)

   hidden が付いたときだけ specificity 0,2,0 + !important で
   確実に非表示へ戻す。display:contents の 5 列レイアウトや
   列幅・文字サイズ・的中囲いには触れていない。
   ========================================================== */
.formations-wrap.hidden{display:none!important}

/* 買い方の戦略タグ */
.sab-tag{display:inline-block;font-size:10px;font-weight:800;border-radius:4px;padding:0 4px;
  margin-right:4px;color:#fff;background:#475569;vertical-align:middle;}
.sab-tag.only-A{background:#2563eb;}
.sab-tag.only-B{background:#d97706;}
.sab-tag.both{background:#7c3aed;}
.formation.sab-row-b{background:#fffbeb;}

/* UI_LIVE544_INTRADAY_ATTENTION_20261001 — 544 日内傾向（v3: 1 行表示・表示専用） ------------- */
.intraday{background:#fff;border:1px solid #cfd4da;border-left:5px solid #9ca3af;padding:5px 8px;margin-bottom:8px}
.intraday.hidden{display:none}
.intraday.lv-strong{border-left-color:#c62828}
.intraday.lv-attention{border-left-color:#b7791f}
.intraday.lv-positive{border-left-color:#0f7a3b}
/* 11:00 以降（過去日は常に）は背景色で強調 */
.intraday.emph.lv-strong{background:#fde2e2}
.intraday.emph.lv-attention{background:#fff3cd}
.intraday.emph.lv-positive{background:#dff4e7}
.it-line{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;line-height:1.35}
.it-name{font-size:12px;font-weight:800;color:var(--muted);white-space:nowrap}
.it-state{font-size:15px;font-weight:900;white-space:nowrap}
.it-sep{color:#9ca3af}
.it-stat{font-size:13px;font-weight:800;color:#374151;white-space:nowrap}
.it-btn{margin-left:auto;font-size:11px;padding:1px 8px;border:1px solid #c9cfd6;background:#fff;border-radius:10px;color:#4b5563;cursor:pointer}
.it-hist{display:flex;flex-wrap:wrap;gap:2px 14px;font-size:11px;color:#4b5563;margin-top:3px;font-variant-numeric:tabular-nums}
.it-hist span{white-space:nowrap}
@media(max-width:480px){.it-sep{display:none}.it-state{font-size:14px}}
