/* Steam to Snow 2027 · overview flip book v72 — styles live ONLY inside the v53 stats box (.o53-panel.fb72) */
#stOver.o53 .o53-panel.fb72>.o53-c{z-index:3}
/* stage + pages mirror the panel's own grid (inherit chain), so page 1 lays out the live ring + dials exactly like v53 */
#stOver.o53 .o53-panel.fb72 .fb-st,#stOver.o53 .o53-panel.fb72 .fb-pg,#stOver.o53 .o53-panel.fb72 .fb-p0>.fb-c{grid-template-columns:inherit;justify-items:inherit;align-content:inherit;align-items:inherit;row-gap:inherit;column-gap:inherit;padding:inherit}
#stOver.o53 .o53-panel.fb72 .fb-st{position:absolute;inset:0;z-index:1;border-radius:15px;overflow:hidden;touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;
 --fbk:var(--o53k,#ff8c46);--fbh:var(--o53h,#5aaaff)}
#stOver.o53 .o53-panel.fb72 .fb-st:focus-visible{box-shadow:inset 0 0 0 2px rgba(255,255,255,.55)}
#stOver.o53 .o53-panel.fb72 .fb-pg{position:absolute;inset:0;border-radius:15px;overflow:hidden}
#stOver.o53 .o53-panel.fb72 .fb-p0>.fb-c{position:absolute;inset:0;display:grid}
/* page 1 at rest is transparent (the panel's own background shows, like live); only while it is being turned it gets an opaque copy */
#stOver.o53 .o53-panel.fb72 .fb-clone.fb-p0{background:linear-gradient(135deg,rgba(255,140,70,.10),rgba(10,16,30,.55) 45%,rgba(90,170,255,.12)),rgb(7,11,22)}
#stOver.o53 .o53-panel.fb72 .fb-clone{inset:0 auto 0 auto;height:100%}
#stOver.o53 .o53-panel.fb72 .fb-ear{position:absolute;right:0;bottom:0;width:18px;height:18px;pointer-events:none;border-top-left-radius:6px;
 background:linear-gradient(135deg,rgba(255,236,220,.0) 0,rgba(255,236,220,.0) 48%,rgba(255,214,180,.55) 50%,rgba(255,170,110,.35) 72%,rgba(255,140,70,.18) 100%);
 box-shadow:-2px -2px 5px rgba(0,0,0,.35);opacity:.9}
#stOver.o53 .o53-panel.fb72 .fb-st:not([data-page="0"]) .fb-ear{display:none}
/* day pages */
#stOver.o53 .o53-panel.fb72 .fb-day{display:block;padding:0;cursor:pointer;background:#081120;color:#fff}
#stOver.o53 .o53-panel.fb72 .fb-day.ky{background:#140b06}
#stOver.o53 .o53-panel.fb72 .fb-day.hk{background:#06111d}
#stOver.o53 .o53-panel.fb72 .fb-ph{position:absolute;inset:0;background:center/cover no-repeat;opacity:1;filter:saturate(1.08) brightness(1.03)}
#stOver.o53 .o53-panel.fb72 .fb-day.ky .fb-tint{position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,7,2,.32),rgba(18,7,2,0) 26%)}
#stOver.o53 .o53-panel.fb72 .fb-day.hk .fb-tint{position:absolute;inset:0;background:linear-gradient(0deg,rgba(2,8,18,.32),rgba(2,8,18,0) 26%)}
#stOver.o53 .o53-panel.fb72 .fb-in{position:absolute;inset:0;padding:11px 14px 13px 14px;display:flex;flex-direction:column;justify-content:space-between;min-width:0}
#stOver.o53 .o53-panel.fb72 .fb-hd{display:flex;align-items:center;gap:6px;min-width:0;font:500 11px/1 Kanit}
#stOver.o53 .o53-panel.fb72 .fb-no{padding:4px 8px;border-radius:99px;font:600 10.5px/1 Kanit;letter-spacing:.08em;flex:none}
#stOver.o53 .o53-panel.fb72 .fb-day.ky .fb-no{color:#ffe3cc;background:rgba(255,140,70,.22);border:1px solid rgba(255,170,110,.6);box-shadow:0 0 10px rgba(255,140,70,.35)}
#stOver.o53 .o53-panel.fb72 .fb-day.hk .fb-no{color:#e6f5ff;background:rgba(90,170,255,.2);border:1px solid rgba(150,210,255,.6);box-shadow:0 0 10px rgba(90,170,255,.4)}
#stOver.o53 .o53-panel.fb72 .fb-dt{color:rgba(255,255,255,.82);white-space:nowrap;flex:none}
#stOver.o53 .o53-panel.fb72 .fb-red{display:inline-flex;align-items:center;gap:4px;color:#ffb3b3;white-space:nowrap;flex:none}
#stOver.o53 .o53-panel.fb72 .fb-red i{width:7px;height:7px;border-radius:50%;background:#ff4d4d;box-shadow:0 0 6px #ff4d4d}
#stOver.o53 .o53-panel.fb72 .fb-x{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;padding:3px 7px;border-radius:99px;font-size:10px;color:#e6f5ff;background:linear-gradient(90deg,rgba(255,140,70,.35),rgba(90,170,255,.35));border:1px solid rgba(255,255,255,.25)}
#stOver.o53 .o53-panel.fb72 .fb-ic{margin-left:auto;font-size:17px;line-height:1;flex:none}
#stOver.o53 .o53-panel.fb72 .fb-day.ky .fb-ic{filter:drop-shadow(0 0 6px rgba(255,140,70,.8))}
#stOver.o53 .o53-panel.fb72 .fb-day.hk .fb-ic{color:#cfeaff;filter:drop-shadow(0 0 6px rgba(120,200,255,.9))}
#stOver.o53 .o53-panel.fb72 .fb-bd{display:flex;flex-direction:column;gap:2px;min-width:0}
#stOver.o53 .o53-panel.fb72 .fb-ro{font:600 10px/1.1 Kanit;letter-spacing:.32em}
#stOver.o53 .o53-panel.fb72 .fb-day.ky .fb-ro{color:#ffb98a}
#stOver.o53 .o53-panel.fb72 .fb-day.hk .fb-ro{color:#9fd6ff}
#stOver.o53 .o53-panel.fb72 .fb-ct{font:700 27px/1.08 Kanit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#stOver.o53 .o53-panel.fb72 .fb-day.ky .fb-ct{text-shadow:0 0 16px rgba(255,140,70,.55),0 1px 2px rgba(0,0,0,.6)}
#stOver.o53 .o53-panel.fb72 .fb-day.hk .fb-ct{text-shadow:0 0 16px rgba(90,170,255,.6),0 1px 2px rgba(0,0,0,.6)}
#stOver.o53 .o53-panel.fb72 .fb-tt{font:400 12.5px/1.3 "IBM Plex Sans Thai",Kanit;color:rgba(255,255,255,.9);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-shadow:0 1px 2px rgba(0,0,0,.7)}
#stOver.o53 .o53-panel.fb72 .fb-ft{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:3px}
#stOver.o53 .o53-panel.fb72 .fb-go{font:500 11px/1 Kanit;padding:5px 10px;border-radius:99px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.28);color:#fff;white-space:nowrap}
#stOver.o53 .o53-panel.fb72 .fb-pn{font:500 10.5px/1 Kanit;color:rgba(255,255,255,.6)}
#stOver.o53 .o53-panel.fb72 .fb-sm .fb-in{padding:8px 12px 10px}
#stOver.o53 .o53-panel.fb72 .fb-sm .fb-ct{font-size:22px}
#stOver.o53 .o53-panel.fb72 .fb-sm .fb-tt{font-size:11.5px;-webkit-line-clamp:1}
#stOver.o53 .o53-panel.fb72 .fb-sm .fb-go{padding:4px 8px;font-size:10px}
#stOver.o53 .o53-panel.fb72 .fb-xs .fb-ro{display:none}
#stOver.o53 .o53-panel.fb72 .fb-xs .fb-ct{font-size:19px}
#stOver.o53 .o53-panel.fb72 .fb-lg .fb-in{padding:16px 18px 18px}
#stOver.o53 .o53-panel.fb72 .fb-lg .fb-ct{font-size:34px}
#stOver.o53 .o53-panel.fb72 .fb-lg .fb-ro{font-size:11.5px}
#stOver.o53 .o53-panel.fb72 .fb-lg .fb-tt{font-size:14px;-webkit-line-clamp:3}
#stOver.o53 .o53-panel.fb72 .fb-lg .fb-hd{font-size:12.5px}
#stOver.o53 .o53-panel.fb72 .fb-lg .fb-no{font-size:12px;padding:5px 10px}
#stOver.o53 .o53-panel.fb72 .fb-lg .fb-ic{font-size:22px}
#stOver.o53 .o53-panel.fb72 .fb-lg .fb-go{font-size:12.5px;padding:6px 12px}
/* 3D turn */
#stOver.o53 .o53-panel.fb72 .fb-turn{position:absolute;inset:0;z-index:4;pointer-events:none;perspective:900px;perspective-origin:50% 50%}
#stOver.o53 .o53-panel.fb72 .fb-s{position:absolute;top:0;height:100%;transform-origin:0 50%;transform-style:preserve-3d;will-change:transform}
#stOver.o53 .o53-panel.fb72 .fb-sf,#stOver.o53 .o53-panel.fb72 .fb-sb{position:absolute;inset:0;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden}
#stOver.o53 .o53-panel.fb72 .fb-sb{transform:rotateY(180deg)}
#stOver.o53 .o53-panel.fb72 .fb-sf .fb-clone{border-radius:0}
#stOver.o53 .o53-panel.fb72 .fb-s:first-child>.fb-sf .fb-clone{border-radius:15px 0 0 15px}
#stOver.o53 .o53-panel.fb72 .fb-shd{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.9),rgba(0,0,0,.55));opacity:0}
#stOver.o53 .o53-panel.fb72 .fb-sb .fb-shd{background:linear-gradient(270deg,rgba(0,0,0,.85),rgba(0,0,0,.45))}
#stOver.o53 .o53-panel.fb72 .fb-bkw{position:absolute;top:0;height:100%}
#stOver.o53 .o53-panel.fb72 .fb-bk{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;font:500 12px/1.2 Kanit;color:rgba(255,255,255,.75)}
#stOver.o53 .o53-panel.fb72 .fb-bk b{font-size:38px;opacity:.32}
#stOver.o53 .o53-panel.fb72 .fb-bk.ky{background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 7px),linear-gradient(90deg,#4a2a14,#6a3f20 60%,#7a4a26)}
#stOver.o53 .o53-panel.fb72 .fb-bk.hk{background:repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 7px),linear-gradient(90deg,#16334a,#22496a 60%,#2b5678)}
#stOver.o53 .o53-panel.fb72 .fb-bk.ov{background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 7px),linear-gradient(90deg,#1a1c2c,#2a2638 60%,#3a2e3a)}
#stOver.o53 .o53-panel.fb72 .fb-bk.x{background:linear-gradient(90deg,#7a4a26,#4a3040 45%,#2b5678);color:#fff}
#stOver.o53 .o53-panel.fb72 .fb-bk.x b{opacity:.8;font-size:30px}
#stOver.o53 .o53-panel.fb72 .fb-sh{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0}
/* page indicator: thin 17-step bar inside the box (stats · 6 Kyushu · 10 Hokkaido) */
#stOver.o53 .o53-panel.fb72 .fb-ind{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);z-index:5;display:flex;gap:2px;pointer-events:none;opacity:.9}
#stOver.o53 .o53-panel.fb72 .fb-ind i{width:6px;height:2.5px;border-radius:2px;background:rgba(255,255,255,.22);transition:width .2s,background .2s}
#stOver.o53 .o53-panel.fb72 .fb-ind i.ky{background:rgba(255,140,70,.38)}
#stOver.o53 .o53-panel.fb72 .fb-ind i.hk{background:rgba(90,170,255,.38)}
#stOver.o53 .o53-panel.fb72 .fb-ind i:nth-child(8){margin-left:3px}
#stOver.o53 .o53-panel.fb72 .fb-ind i.on{width:14px;background:#fff;box-shadow:0 0 6px rgba(255,255,255,.7)}
#stOver.o53 .o53-panel.fb72 .fb-ind i.ky.on{background:#ffb070;box-shadow:0 0 6px #ff7a3c}
#stOver.o53 .o53-panel.fb72 .fb-ind i.hk.on{background:#9fd6ff;box-shadow:0 0 6px #5aaaff}
#stOver.o53 .o53-panel.fb72 .fb-st[data-page="0"] .fb-ind{opacity:.7}
/* the day shown in the book is outlined in the app's own 16-day grid (look otherwise unchanged) */
#stOver.o53 .ribbon button.fb72-on{outline:1.5px solid rgba(255,255,255,.85);outline-offset:1px}
/* reduced motion: crossfade only */
#stOver.o53 .o53-panel.fb72 .fb-rm .fb-ind i{transition:none}


/* text shadows + lighter label colours on the photos */
#stOver.o53 .o53-panel.fb72 .fb-day .fb-in{text-shadow:0 1px 2px rgba(0,0,0,.85),0 0 10px rgba(0,0,0,.55)}
#stOver.o53 .o53-panel.fb72 .fb-day.ky .fb-ct{text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 12px rgba(0,0,0,.6),0 0 18px rgba(255,140,70,.45)}
#stOver.o53 .o53-panel.fb72 .fb-day.hk .fb-ct{text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 12px rgba(0,0,0,.6),0 0 18px rgba(90,170,255,.5)}
#stOver.o53 .o53-panel.fb72 .fb-pn{color:rgba(255,255,255,.78)}
#stOver.o53 .o53-panel.fb72 .fb-p0 .o53-d b,#stOver.o53 .o53-panel.fb72 .fb-p0 .o53-d small{text-shadow:0 1px 2px rgba(0,0,0,.85),0 0 8px rgba(0,0,0,.6)}
#stOver.o53 .o53-panel.fb72 .fb-p0 .o53-ring small{text-shadow:0 1px 2px rgba(0,0,0,.85)}
#stOver.o53 .o53-panel.fb72 .fb-day .fb-red{color:#ffd0d0}
#stOver.o53 .o53-panel.fb72 .fb-day.ky .fb-ro{color:#ffcaa6}
#stOver.o53 .o53-panel.fb72 .fb-day.hk .fb-ro{color:#bfe5ff}

/* photos at full strength (no blur, opacity 1); readability comes from small frosted chips behind each text group + text shadows */
/* page 1 (stats): Hokkaido winter photo (Mt Furano & Mt Maefurano, Commons; snowy peaks above the chips) */
#stOver.o53 .o53-panel.fb72 .fb-p0 .fb-ph{opacity:1}
#stOver.o53 .o53-panel.fb72 .fb-p0 .fb-tint{position:absolute;inset:0;pointer-events:none;background:radial-gradient(closest-side circle at 18.5% 50%,rgba(3,8,20,.22) 0,rgba(3,8,20,.14) 80%,rgba(3,8,20,0) 100%)}
/* stats page chips: one per stat, a frosted disc in the ring (pseudo-elements only: no layout change) */
#stOver.o53 .o53-panel.fb72 .fb-p0 .o53-d{position:relative;z-index:0;border-bottom-color:transparent}
#stOver.o53 .o53-panel.fb72 .fb-p0 .o53-d::before{content:"";position:absolute;inset:-1px -2px -1px -5px;z-index:-1;border-radius:11px;background:rgba(6,12,26,.62);-webkit-backdrop-filter:blur(5px) saturate(1.1);backdrop-filter:blur(5px) saturate(1.1);border:1px solid rgba(255,255,255,.14);box-shadow:0 2px 8px rgba(0,0,0,.22)}
#stOver.o53 .o53-panel.fb72 .fb-p0 .o53-ring::before{content:"";position:absolute;inset:9%;border-radius:50%;background:rgba(6,12,26,.60);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 2px 10px rgba(0,0,0,.25)}
#stOver.o53 .o53-panel.fb72 .fb-p0 .o53-ring>svg{position:relative}
/* day pages chips: header pills, a chip around city + highlight, the open button, the page number */
#stOver.o53 .o53-panel.fb72 .fb-day .fb-no{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
#stOver.o53 .o53-panel.fb72 .fb-day.ky .fb-no{background:rgba(60,24,8,.68)}
#stOver.o53 .o53-panel.fb72 .fb-day.hk .fb-no{background:rgba(8,26,54,.68)}
#stOver.o53 .o53-panel.fb72 .fb-day :is(.fb-dt,.fb-red,.fb-pn){padding:4px 8px;border-radius:99px;background:rgba(6,12,26,.66);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
#stOver.o53 .o53-panel.fb72 .fb-day .fb-ic{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:rgba(6,12,26,.42);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
#stOver.o53 .o53-panel.fb72 .fb-day .fb-bd{align-self:flex-start;max-width:calc(100% + 8px);margin:0 -10px;padding:6px 10px 7px;border-radius:13px;background:rgba(6,12,26,.62);-webkit-backdrop-filter:blur(6px) saturate(1.1);backdrop-filter:blur(6px) saturate(1.1);border:1px solid rgba(255,255,255,.12);box-sizing:border-box}
#stOver.o53 .o53-panel.fb72 .fb-day.ky .fb-bd{background:rgba(26,11,4,.72)}
#stOver.o53 .o53-panel.fb72 .fb-day .fb-go{background:rgba(6,12,26,.64);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
