@font-face { font-family: "M PLUS Rounded 1c"; src: url("../assets/fonts/MPLUSRounded1c-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "M PLUS Rounded 1c"; src: url("../assets/fonts/MPLUSRounded1c-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
@font-face { font-family: "M PLUS Rounded 1c"; src: url("../assets/fonts/MPLUSRounded1c-ExtraBold.ttf") format("truetype"); font-weight: 800; font-display: swap; }

:root { --ink:#453454; --muted:#85728f; --pink:#f583ae; --cream:#fffaf1; --shadow:0 22px 55px rgba(77, 53, 94, .18); }
* { box-sizing:border-box; }
body { min-width:320px; margin:0; overflow-x:hidden; color:var(--ink); background:linear-gradient(180deg,#fffdf8 0%,#fff2f7 50%,#f5effe 100%); font-family:"M PLUS Rounded 1c",system-ui,sans-serif; font-weight:700; }
button,a { font:inherit; -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
a { color:inherit; text-decoration:none; }

.site-header { position:absolute; top:0; left:50%; z-index:4; display:flex; width:min(100% - 44px,1080px); height:88px; align-items:center; justify-content:space-between; transform:translateX(-50%); }
.brand { display:inline-flex; align-items:center; gap:9px; color:var(--ink); font-weight:800; }
.brand img { width:40px; height:40px; border-radius:13px; box-shadow:0 8px 20px rgba(90,63,111,.17); }
.header-title { margin:0 0 0 55px; font-size:.9rem; letter-spacing:.06em; }
.header-link { padding:9px 16px; border:1px solid rgba(71,54,88,.2); border-radius:999px; background:rgba(255,255,255,.68); font-size:.8rem; transition:transform .2s ease,background .2s ease; }
.header-link:hover,.header-link:focus-visible { outline:0; background:#fff; transform:translateY(-2px); }

.hero { position:relative; min-height:430px; padding:155px max(22px,calc((100% - 900px)/2)) 75px; overflow:hidden; text-align:center; }
.hero::after { position:absolute; right:50%; bottom:-190px; width:680px; height:340px; border:1px solid rgba(255,255,255,.8); border-radius:50%; background:radial-gradient(ellipse,rgba(255,255,255,.6),transparent 70%); content:""; transform:translateX(50%); }
.orb { position:absolute; border-radius:50%; }
.orb-one { top:100px; left:8%; width:158px; height:158px; background:#cfeeff; opacity:.64; }
.orb-two { top:85px; right:9%; width:126px; height:126px; background:#ffe2a7; opacity:.55; }
.eyebrow { position:relative; z-index:1; margin:0 0 11px; color:var(--pink); font-size:.77rem; letter-spacing:.12em; }
h1 { position:relative; z-index:1; margin:0; font-size:clamp(2.85rem,6vw,4.8rem); font-weight:800; line-height:1.1; letter-spacing:-.05em; }
h1 span { color:var(--pink); }
.hero > p:not(.eyebrow) { position:relative; z-index:1; max-width:630px; margin:20px auto 0; color:var(--muted); font-size:1rem; line-height:1.8; }

.slot-section { position:relative; z-index:2; width:min(100% - 32px,820px); margin:-42px auto 0; padding:0 0 105px; scroll-margin-top:24px; text-align:center; }
.pair-celebration { position:absolute; top:-20px; left:50%; z-index:5; width:min(360px,82vw); pointer-events:none; transform:translateX(-50%); }
.pair-card { display:inline-flex; min-height:52px; gap:9px; align-items:center; justify-content:center; padding:9px 19px; border:1px solid rgba(255,255,255,.92); border-radius:999px; color:#8d587b; background:linear-gradient(135deg,#fff 0%,#ffe5f0 52%,#f2e5ff 100%); box-shadow:0 10px 24px rgba(179,102,150,.24); opacity:0; font-size:.88rem; letter-spacing:.08em; transform:translateY(7px) scale(.82); }
.pair-card p { margin:0; }
.pair-celebration.is-celebrating .pair-card { animation:pair-card .72s cubic-bezier(.2,1.35,.35,1) both; }
.pair-sparkles { position:absolute; inset:-48px -90px; z-index:-1; overflow:visible; }
.pair-sparkles span { position:absolute; top:50%; left:50%; width:7px; height:7px; border-radius:50%; opacity:0; transform:translate(-50%,-50%) scale(.2); }
.pair-celebration.is-celebrating .pair-sparkles span { animation:pair-sparkle .66s ease-out var(--delay) both; }
.jackpot-celebration { position:absolute; top:-31px; left:50%; z-index:4; width:min(580px,94vw); pointer-events:none; transform:translateX(-50%); }
.jackpot-card { position:relative; display:inline-flex; min-height:92px; align-items:center; justify-content:center; padding:13px 28px 12px; border:2px solid rgba(255,255,255,.95); border-radius:26px; color:#74495d; background:linear-gradient(135deg,#fff8c8 0%,#ffe37b 48%,#ffaf83 100%); box-shadow:0 15px 34px rgba(205,125,49,.3),inset 0 2px 0 rgba(255,255,255,.78); opacity:0; text-align:center; transform:translateY(12px) scale(.72) rotate(-3deg); }
.jackpot-celebration.is-celebrating .jackpot-card { animation:jackpot-card 1.35s cubic-bezier(.16,1.35,.34,1) both; }
.jackpot-crown { position:absolute; top:-27px; left:50%; font-size:2rem; filter:drop-shadow(0 4px 4px rgba(133,83,26,.22)); transform:translateX(-50%) rotate(-11deg); }
.jackpot-title { margin:0; color:#7b3f64; font-size:clamp(1.25rem,3vw,2rem); font-weight:800; letter-spacing:.05em; line-height:1; text-shadow:0 2px 0 rgba(255,255,255,.58); }
.jackpot-copy { margin:6px 0 0 15px; color:#8e5c45; font-size:.75rem; line-height:1.45; }
.jackpot-confetti { position:absolute; inset:-70px -155px; z-index:-1; overflow:visible; }
.jackpot-confetti span { position:absolute; top:50%; left:50%; width:var(--size,9px); height:calc(var(--size,9px) * 1.55); border-radius:3px; opacity:0; transform:translate(-50%,-50%) rotate(0); }
.jackpot-celebration.is-celebrating .jackpot-confetti span { animation:confetti-burst 1.05s cubic-bezier(.18,.7,.23,1) var(--delay) both; }
.jackpot-celebration.level-2 .jackpot-card { background:linear-gradient(135deg,#fff9d4 0%,#ffde69 42%,#ff9cbf 100%); box-shadow:0 0 0 5px rgba(255,231,115,.35),0 19px 43px rgba(218,103,78,.4),inset 0 2px 0 rgba(255,255,255,.85); }
.jackpot-celebration.level-2 .jackpot-crown { font-size:2.35rem; }
.jackpot-celebration.level-3 .jackpot-card { border-color:#fff9cf; background:linear-gradient(135deg,#fffad2 0%,#ffe063 35%,#ff90bb 72%,#a993f1 100%); box-shadow:0 0 0 8px rgba(255,232,108,.4),0 0 60px rgba(255,148,174,.7),0 23px 55px rgba(216,100,80,.5),inset 0 2px 0 rgba(255,255,255,.9); }
.jackpot-celebration.level-3 .jackpot-crown { font-size:2.7rem; animation:jackpot-crown .9s ease-in-out infinite alternate; }
.jackpot-celebration.is-complete .jackpot-card { min-height:112px; border-color:#fffbd9; background:linear-gradient(135deg,#fffbd5 0%,#ffe061 29%,#ff9abf 61%,#93c9f2 100%); box-shadow:0 0 0 10px rgba(255,237,119,.58),0 0 82px rgba(255,139,184,.78),0 25px 61px rgba(109,82,181,.48),inset 0 2px 0 rgba(255,255,255,.95); }
.jackpot-celebration.is-complete .jackpot-title { color:#714c9e; font-size:clamp(1.42rem,3.4vw,2.28rem); }
.jackpot-celebration.is-complete .jackpot-copy { color:#6c5279; font-size:.82rem; }
.jackpot-celebration.is-complete .jackpot-crown { font-size:3rem; animation:jackpot-crown .7s ease-in-out infinite alternate; }
.slot-machine { position:relative; padding:12px 13px 15px; border:8px solid #8565a3; border-radius:37px; background:linear-gradient(145deg,#bd9bd5,#7d6098); box-shadow:0 25px 48px rgba(69,47,86,.27),inset 0 0 0 3px rgba(255,255,255,.32); }
.slot-machine.is-pair { border-color:#f9b4d0; box-shadow:0 0 0 4px rgba(255,192,216,.4),0 20px 46px rgba(181,97,146,.35),inset 0 0 0 3px rgba(255,255,255,.48); animation:pair-machine .62s ease-out both; }
.slot-machine.is-jackpot { border-color:#ffe16a; background:linear-gradient(145deg,#e5b463,#ba6d9d 54%,#76549d); box-shadow:0 0 0 6px rgba(255,239,145,.48),0 0 48px rgba(255,190,73,.86),0 26px 52px rgba(103,56,126,.38),inset 0 0 0 3px rgba(255,255,255,.58); animation:jackpot-machine 1.15s ease-out both; }
.slot-machine.is-jackpot.jackpot-level-2 { box-shadow:0 0 0 7px rgba(255,239,145,.58),0 0 63px rgba(255,177,73,.98),0 28px 58px rgba(146,66,126,.45),inset 0 0 0 3px rgba(255,255,255,.66); }
.slot-machine.is-jackpot.jackpot-level-3 { border-color:#fff19a; background:linear-gradient(145deg,#f7d16b,#ef94b1 44%,#987bdb); box-shadow:0 0 0 9px rgba(255,237,128,.64),0 0 82px rgba(255,143,181,.92),0 0 38px rgba(136,193,255,.7),0 30px 66px rgba(113,53,133,.52),inset 0 0 0 3px rgba(255,255,255,.72); animation:jackpot-machine 1.3s ease-out both; }
.slot-machine.is-jackpot .machine-top i { background:#fff9af; box-shadow:0 0 16px #fff9af; animation:jackpot-lamp .33s ease-in-out 4 alternate; }
.machine-top { display:flex; height:49px; align-items:center; gap:11px; padding:0 13px; color:#fff6d0; font-size:.88rem; letter-spacing:.12em; text-align:left; }
.machine-top span { margin-right:auto; }
.machine-top i { display:block; width:9px; height:9px; border-radius:50%; background:#ffdf69; box-shadow:0 0 10px #ffdf69; }
.reels { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:13px; border-radius:25px; background:#543e68; }
.reel { min-width:0; padding:12px 9px; border-radius:17px; background:rgba(255,255,255,.12); }
.reel p { min-height:28px; margin:0 0 7px; color:#fff; font-size:.73rem; line-height:1.35; }
.reel-window { display:grid; min-height:165px; overflow:hidden; place-items:center; border:4px solid rgba(255,255,255,.8); border-radius:17px; background:#fffdf7; box-shadow:inset 0 0 20px rgba(70,48,85,.1); }
.reel-emoji { display:grid; width:112px; height:112px; place-items:center; border-radius:50%; font-size:5.1rem; transition:transform .13s ease,filter .13s ease; }
.tone-blue .reel-emoji { background:linear-gradient(135deg,#effbff,#65aee9); }
.tone-purple .reel-emoji { background:linear-gradient(135deg,#faf3ff,#a58ae0); }
.tone-yellow .reel-emoji { background:linear-gradient(135deg,#fffde2,#f7bb3a); }
.reel-stop { width:100%; min-height:34px; margin-top:9px; border:1px solid rgba(255,255,255,.74); border-radius:999px; color:#fff; background:rgba(255,255,255,.17); box-shadow:0 4px 0 rgba(53,36,68,.28); font-size:.73rem; font-weight:800; letter-spacing:.08em; transition:transform .12s ease,background .12s ease,opacity .12s ease; }
.reel-stop:not(:disabled):hover,.reel-stop:not(:disabled):focus-visible { outline:0; background:#f685af; transform:translateY(-2px); }
.reel-stop:not(:disabled):active { transform:translateY(3px); box-shadow:0 1px 0 rgba(53,36,68,.28); }
.reel-stop:disabled { cursor:not-allowed; opacity:.38; }
.is-spinning .reel:not(.is-stopped) .reel-emoji { filter:blur(1px); transform:translateY(-12px) scale(.94); }
.reel.is-stopped .reel-emoji { animation:land .38s cubic-bezier(.2,1.5,.3,1) both; }
.reel.is-pair { background:rgba(255,211,233,.26); box-shadow:inset 0 0 0 1px rgba(255,237,247,.54); }
.reel.is-pair .reel-window { border-color:#ffd0e3; box-shadow:0 0 0 3px rgba(255,147,190,.24),inset 0 0 20px rgba(70,48,85,.1); }
.reel.is-pair .reel-emoji { animation:pair-emoji .65s cubic-bezier(.2,1.35,.35,1) both; }
.reel.is-jackpot { background:rgba(255,244,176,.27); box-shadow:inset 0 0 0 1px rgba(255,252,196,.48); }
.reel.is-jackpot .reel-window { border-color:#fff5a5; box-shadow:0 0 0 3px rgba(255,218,94,.32),inset 0 0 20px rgba(70,48,85,.1); }
.reel.is-jackpot .reel-emoji { filter:drop-shadow(0 7px 8px rgba(138,81,28,.23)); animation:jackpot-emoji .92s cubic-bezier(.2,1.2,.3,1) both; }
@keyframes land { 0% { transform:translateY(-28px) scale(.74); } 70% { transform:translateY(7px) scale(1.08); } 100% { transform:translateY(0) scale(1); } }
@keyframes pair-machine { 0% { transform:scale(1); } 36% { transform:scale(1.012) rotate(-.2deg); } 68% { transform:scale(.996) rotate(.16deg); } 100% { transform:scale(1); } }
@keyframes pair-emoji { 0% { transform:translateY(0) scale(1); } 40% { transform:translateY(-14px) scale(1.12); } 70% { transform:translateY(3px) scale(.98); } 100% { transform:translateY(0) scale(1); } }
@keyframes jackpot-machine { 0% { transform:scale(1); } 15% { transform:scale(1.018) rotate(-.35deg); } 31% { transform:scale(.988) rotate(.3deg); } 50% { transform:scale(1.014) rotate(-.18deg); } 72% { transform:scale(.998); } 100% { transform:scale(1); } }
@keyframes jackpot-lamp { to { opacity:.28; transform:scale(.72); } }
@keyframes jackpot-crown { to { transform:translateX(-50%) rotate(11deg) translateY(-5px) scale(1.14); } }
@keyframes jackpot-emoji { 0% { transform:translateY(0) scale(1); } 24% { transform:translateY(-22px) scale(1.18) rotate(-7deg); } 48% { transform:translateY(0) scale(.95) rotate(5deg); } 70% { transform:translateY(-9px) scale(1.08) rotate(-3deg); } 100% { transform:translateY(0) scale(1) rotate(0); } }
@keyframes jackpot-card { 0% { opacity:0; transform:translateY(12px) scale(.72) rotate(-3deg); } 35% { opacity:1; transform:translateY(-7px) scale(1.08) rotate(1.5deg); } 58% { transform:translateY(2px) scale(.97) rotate(-.7deg); } 78% { transform:translateY(-2px) scale(1.02); } 100% { opacity:1; transform:translateY(0) scale(1); } }
@keyframes pair-card { 0% { opacity:0; transform:translateY(7px) scale(.82); } 48% { opacity:1; transform:translateY(-4px) scale(1.06); } 72% { transform:translateY(1px) scale(.98); } 100% { opacity:1; transform:translateY(0) scale(1); } }
@keyframes pair-sparkle { 0% { opacity:0; transform:translate(-50%,-50%) scale(.2); } 24% { opacity:1; } 100% { opacity:0; transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1.25); } }
@keyframes confetti-burst { 0% { opacity:0; transform:translate(-50%,-50%) rotate(0); } 14% { opacity:1; } 100% { opacity:0; transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) rotate(var(--r)); } }
.machine-bottom { display:flex; justify-content:space-between; padding:13px 26px 0; }
.machine-bottom span { width:17px; height:17px; border:2px solid rgba(255,255,255,.7); border-radius:50%; background:#f589b2; box-shadow:inset 0 2px 4px rgba(92,55,90,.22); }

.game-status { display:flex; max-width:510px; margin:16px auto 0; gap:9px; justify-content:center; }
.game-status p { display:inline-flex; min-height:42px; margin:0; gap:6px; align-items:center; justify-content:center; padding:7px 15px; border:1px solid rgba(104,76,124,.13); border-radius:999px; background:rgba(255,255,255,.78); box-shadow:0 8px 19px rgba(69,47,86,.08); font-size:.75rem; }
.turn-status { color:#776184; }
.turn-status strong { color:var(--ink); font-size:1.15rem; line-height:1; }
.score-status { color:#9b78b5; }
.score-status > span:first-child { color:#f3a842; font-size:1rem; }
.score-status strong { min-width:2ch; color:var(--ink); font-size:1.08rem; line-height:1; }
.record-board { display:grid; width:min(100% - 20px,510px); min-height:48px; margin:9px auto 0; grid-template-columns:auto 1fr auto; gap:6px 10px; align-items:center; padding:7px 11px; border:1px solid rgba(104,76,124,.11); border-radius:17px; background:rgba(255,255,255,.57); color:var(--muted); }
.record-kicker { margin:0; color:#a783c1; font-size:.61rem; font-weight:800; letter-spacing:.08em; }
.record-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.record-stats p { display:flex; min-width:0; margin:0; gap:3px; align-items:baseline; justify-content:center; font-size:.62rem; white-space:nowrap; }
.record-stats strong { color:var(--ink); font-size:.86rem; }
.record-reset { padding:3px 0; border:0; color:#a783c1; background:transparent; font-size:.6rem; font-weight:800; text-decoration:underline; text-underline-offset:3px; }
.record-reset:hover,.record-reset:focus-visible { outline:0; color:#f07faa; }
.completed-collection { display:grid; grid-column:1 / -1; gap:4px; }
.completed-collection[hidden] { display:none; }
.completed-page { display:grid; grid-template-columns:auto 1fr; gap:5px; align-items:center; }
.completed-page-label { margin:0; color:#b77a28; font-size:.53rem; font-weight:800; letter-spacing:.06em; white-space:nowrap; }
.completed-stamps { display:grid; grid-template-columns:repeat(6,1fr); gap:4px; }
.completed-stamps .record-emo { min-height:23px; font-size:.92rem; }
.record-collection { display:grid; grid-column:1 / -1; grid-template-columns:repeat(6,1fr); gap:5px; }
.collection-stage { grid-column:1 / -1; margin:0; color:#f183ae; font-size:.61rem; font-weight:800; letter-spacing:.08em; text-align:center; }
.collection-note { grid-column:1 / -1; margin:0; color:#877092; font-size:.59rem; line-height:1.35; text-align:center; }
.record-emo { display:grid; min-height:29px; place-items:center; border-radius:10px; filter:grayscale(1); opacity:.22; font-size:1.18rem; transform:scale(.9); transition:filter .2s ease,opacity .2s ease,transform .2s ease; }
.record-emo.is-found { filter:none; opacity:1; background:linear-gradient(135deg,#fff8c6,#ffe0a6); box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 3px 8px rgba(185,124,47,.16); transform:scale(1); }
.collection-progress { grid-column:1 / -1; margin:0; color:#a783c1; font-size:.61rem; line-height:1.35; text-align:center; }
.record-board.is-complete { border-color:rgba(255,210,91,.72); background:linear-gradient(135deg,rgba(255,251,215,.88),rgba(255,233,246,.82)); box-shadow:0 7px 17px rgba(219,160,55,.14); }
.record-board.is-complete .record-kicker { color:#b77a28; }

.spin-button { display:inline-flex; min-height:61px; margin-top:17px; gap:11px; align-items:center; justify-content:center; padding:13px 31px; border:0; border-radius:999px; color:#fff; background:linear-gradient(135deg,#f37fab,#ffaf76); box-shadow:0 17px 31px rgba(226,111,154,.3); font-size:1.03rem; transition:transform .2s ease,box-shadow .2s ease; }
.spin-button:hover,.spin-button:focus-visible { outline:0; transform:translateY(-3px); box-shadow:0 21px 38px rgba(226,111,154,.37); }
.spin-button:disabled { cursor:wait; opacity:.72; transform:none; }
.hint { max-width:620px; margin:17px auto 0; color:var(--muted); font-size:.78rem; line-height:1.75; }

.result { margin-top:28px; padding:33px; border:1px solid rgba(255,255,255,.9); border-radius:30px; background:rgba(255,255,255,.88); box-shadow:var(--shadow); text-align:left; }
.result[hidden] { display:none; }
.result-kicker { margin:0; color:var(--pink); font-size:.72rem; letter-spacing:.12em; text-align:center; }
.result-message { max-width:600px; margin:12px auto 27px; color:var(--muted); font-size:.93rem; line-height:1.75; text-align:center; }
.earned-points { display:table; margin:-16px auto 24px; padding:5px 12px; border-radius:999px; color:#9867b8; background:#f4eaff; font-size:.78rem; letter-spacing:.04em; }
.lead-emo { display:flex; gap:21px; align-items:center; justify-content:center; padding:20px; border-radius:21px; background:linear-gradient(135deg,#fff5f8,#f6efff); }
.lead-ball { display:grid; width:94px; height:94px; flex:0 0 auto; place-items:center; border-radius:50%; background:linear-gradient(135deg,#e8fff7,#62c5d0); box-shadow:inset 0 0 22px rgba(255,255,255,.62),0 10px 18px rgba(82,59,97,.14); font-size:4rem; }
.lead-label { margin:0 0 4px; color:#aa89bd; font-size:.71rem; letter-spacing:.08em; }
.lead-emo h2 { margin:0; font-size:1.48rem; line-height:1.3; }
.result-details { display:grid; margin-top:16px; grid-template-columns:1fr 1fr; gap:12px; }
.result-details article { padding:17px; border-radius:17px; background:#faf6fc; }
.result-details h3 { margin:0 0 8px; color:#a783c1; font-size:.73rem; letter-spacing:.05em; }
.result-details p { margin:0; color:var(--muted); font-size:.84rem; line-height:1.8; }
.result-actions { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:24px; }
.zukan-button { display:inline-flex; min-height:47px; gap:8px; align-items:center; justify-content:center; padding:10px 17px; border:1px solid transparent; border-radius:999px; font-size:.82rem; transition:transform .2s ease,box-shadow .2s ease; }
.zukan-button { color:#fff; background:var(--ink); box-shadow:0 10px 19px rgba(62,44,77,.17); }
.zukan-button:hover,.zukan-button:focus-visible { outline:0; transform:translateY(-2px); }
.result.is-game-over { border-color:rgba(247,187,58,.62); box-shadow:0 22px 55px rgba(198,135,55,.2); }
.result.is-pair { border-color:rgba(244,166,205,.82); background:linear-gradient(145deg,rgba(255,250,254,.98),rgba(253,236,248,.9)); box-shadow:0 20px 50px rgba(193,112,160,.2); }
.result.is-pair .result-kicker { color:#d783a7; }
.result.is-pair .earned-points { color:#a66788; background:#ffe4f0; }
.result.is-jackpot { border-color:rgba(255,209,80,.85); background:radial-gradient(circle at 50% 0,#fff7c9 0,rgba(255,255,255,.94) 45%,rgba(255,238,245,.94) 100%); box-shadow:0 0 0 4px rgba(255,236,139,.35),0 25px 60px rgba(204,143,48,.24); }
.result.is-jackpot.jackpot-level-2 { box-shadow:0 0 0 6px rgba(255,232,123,.42),0 28px 70px rgba(220,132,54,.32); }
.result.is-jackpot.jackpot-level-3 { border-color:#ffe878; background:radial-gradient(circle at 50% 0,#fffad2 0,rgba(255,237,245,.96) 53%,rgba(232,225,255,.92) 100%); box-shadow:0 0 0 8px rgba(255,232,109,.48),0 0 48px rgba(255,141,183,.35),0 30px 78px rgba(157,99,201,.34); }
.result.is-jackpot .result-kicker { color:#c87e2e; }
.result.is-jackpot .earned-points { color:#9a6230; background:#fff2a5; box-shadow:0 4px 10px rgba(230,174,60,.18); }
.result.is-fresh { animation:result-pop .35s cubic-bezier(.2,1.35,.35,1) both; }
@keyframes result-pop { from { opacity:.5; transform:translateY(9px) scale(.985); } to { opacity:1; transform:translateY(0) scale(1); } }

@media (prefers-reduced-motion:reduce) { .slot-machine.is-pair,.slot-machine.is-jackpot,.slot-machine.is-jackpot .machine-top i,.reel.is-pair .reel-emoji,.reel.is-jackpot .reel-emoji,.pair-celebration.is-celebrating .pair-card,.pair-celebration.is-celebrating .pair-sparkles span,.jackpot-celebration.is-celebrating .jackpot-card,.jackpot-celebration.is-celebrating .jackpot-confetti span,.jackpot-celebration.level-3 .jackpot-crown,.jackpot-celebration.is-complete .jackpot-crown { animation:none; } .pair-card,.jackpot-card { opacity:1; transform:none; } .pair-sparkles,.jackpot-confetti { display:none; } }

@media (max-width:600px) { .record-board { grid-template-columns:1fr auto; gap:4px 9px; padding:7px 10px; } .record-stats { grid-column:1 / -1; grid-row:2; gap:4px; } .record-stats p { font-size:.58rem; } .record-stats strong { font-size:.79rem; } .record-reset { grid-column:2; grid-row:1; font-size:.56rem; } .collection-stage { grid-row:3; font-size:.56rem; } .collection-note { grid-row:4; font-size:.56rem; } .completed-collection { grid-row:5; } .completed-page-label { font-size:.48rem; } .completed-stamps .record-emo { min-height:21px; font-size:.84rem; } .record-collection { grid-row:6; gap:4px; } .record-emo { min-height:27px; font-size:1.08rem; } .collection-progress { grid-row:7; font-size:.58rem; } }

.site-footer { display:flex; width:min(100% - 44px,1080px); min-height:118px; margin:0 auto; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px; color:var(--muted); font-size:.75rem; }
.language-switcher { display:flex; flex-wrap:wrap; gap:4px; }
.language-switcher button { min-height:30px; padding:5px 8px; border:1px solid transparent; border-radius:999px; color:var(--muted); background:transparent; font-size:.68rem; font-weight:700; }
.language-switcher button:hover,.language-switcher button:focus-visible { outline:0; border-color:rgba(88,65,105,.2); background:#fff; }
.language-switcher button.is-current { color:#fff; background:var(--ink); }

@media (max-width:600px) { .site-header { width:calc(100% - 28px); height:70px; } .brand span,.header-title { display:none; } .brand img { width:35px; height:35px; } .header-link { padding:7px 12px; font-size:.73rem; } .hero { min-height:370px; padding:121px 20px 70px; } .hero h1 { font-size:clamp(2.6rem,12vw,3.6rem); } html[lang="ja"] .hero h1 { font-size:clamp(1.8rem,9vw,2.25rem); line-height:1.18; white-space:nowrap; } .hero > p:not(.eyebrow) { font-size:.88rem; } .orb-one { top:78px; left:-48px; width:120px; height:120px; } .orb-two { top:80px; right:-28px; width:100px; height:100px; } .slot-section { width:min(100% - 20px,520px); margin-top:-28px; padding-bottom:70px; } .slot-machine { padding:8px; border-width:6px; border-radius:27px; } .machine-top { height:39px; padding:0 8px; font-size:.71rem; } .machine-top i { width:6px; height:6px; } .reels { gap:5px; padding:7px; border-radius:19px; } .reel { padding:8px 4px; border-radius:12px; } .reel p { min-height:34px; margin-bottom:4px; font-size:.62rem; } .reel-window { min-height:107px; border-width:3px; border-radius:12px; } .reel-emoji { width:75px; height:75px; font-size:3.45rem; } .reel-stop { min-height:29px; margin-top:6px; font-size:.62rem; } .machine-bottom { padding:9px 18px 0; } .machine-bottom span { width:12px; height:12px; } .game-status { margin-top:12px; gap:6px; } .game-status p { min-height:37px; padding:6px 10px; font-size:.68rem; } .spin-button { min-height:56px; margin-top:15px; font-size:.88rem; } .hint { padding:0 7px; font-size:.72rem; } .result { margin-top:24px; padding:23px 16px; border-radius:24px; } .earned-points { margin-top:-14px; } .lead-emo { gap:14px; padding:15px; } .lead-ball { width:75px; height:75px; font-size:3.25rem; } .lead-emo h2 { font-size:1.15rem; } .result-details { grid-template-columns:1fr; } .site-footer { min-height:150px; padding:22px 0; flex-direction:column; align-items:flex-start; justify-content:center; } }
