/* Created by Seg */



/*---基盤---*/

@charset "utf-8";
body    {
                background:#000000;
                color:#DDDDDD;
        }

.text { font-size: 100%; }
.title { font-size: 120%; }
.index { font-size: 150%; text-align: center; }
.indent { text-indent: 2em; }

img { border:0; }
a:link    { color: #808080; text-decoration: none;}
a:visited { color: #444444; cursor: crosshair;}
a:hover   { color: #600000; text-decoration: underline overline; cursor: crosshair;}
a:active  { color: #cccccc; }

.guide-table table {
    width: 100%;
    border-collapse: collapse;
}

.guide-table th,
.guide-table td {
    border: 1px solid #999;
    padding: 6px 8px;
    vertical-align: top;
}


/*---補助---*/

#menu{
	width : 200px;
	height : 100%;
	left : 0px;
	position : fixed;
	overflow: auto;
	background-color : #000000;
        text-align: left;
}
#bar{
	width : 80%;
	height : 25%;
	left : 200px;
	top : 0px;
	position : fixed;
	overflow: auto;
	background-color : #000000;
}
#main{
	width : 80%;
	height : 75%;
	top : 100px;
	left : 200px;
	position : fixed;
	overflow: auto;
	background-color : #000000;
        text-align: left;
}


hr {
    padding: 0;
    border: none;
    border-top: medium double #500000;
	font-family: cursive;
    color: #600000;
    text-align: center;
}

hr:after {
    content: "Seg";
    display: inline-block;
    position: relative; 
    top: -0.7em;  
    font-size: 0.5em;
    padding: 0 0.25em;
    background: black;
}


.box {
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #000000;
    background: #808080;
    border-bottom: solid 6px #444444;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.25);
    border-radius: 9px;
}
.box p {
    margin: 0; 
    padding: 0;
}

dd {
        background-color: #070707;
        border: solid 1px #600000;
        padding: 2em;
        margin-left: 5%;
        margin-right: 5%;
        margin-top: 0.5em;
        margin-bottom: 80px;
}

dd img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


textarea {
    resize: none;
    width:100%;
    height:80px;
}

/* =========================
   Sloneet GAME
   ========================= */

#game {
    max-width: 1000px;
    margin: 0 auto;
    padding: 20px;
}


/* Header */

.game-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;

    margin-bottom: 30px;
    padding-bottom: 15px;

    border-bottom: 1px solid #444;
}

.game-header h1 {
    margin: 0;
}

.player-status {
    display: flex;
    gap: 20px;
}


/* Screen */

.game-screen {
    width: 100%;
}

.game-screen h2 {
    margin-bottom: 30px;
}


/* Home */

.home-status {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px 28px;

    margin: 24px 0;
    padding: 14px 18px;

    border: 1px solid #444;
    background: #151515;
    color: #aaa;
}

.home-status strong {
    color: #fff;
}

.meter-stat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.mental-meter {
    width: 110px;
    height: 10px;
    overflow: hidden;
    border: 1px solid #666;
    background: #050505;
}

.mental-meter i {
    display: block;
    width: 0;
    height: 100%;
    background: #b9a76a;
    transition: width 180ms ease;
}

.home-room {
    display: grid;

    grid-template-columns:
        minmax(120px, 1fr)
        minmax(250px, 2fr)
        minmax(120px, 1fr);

    gap: 30px;

    min-height: 350px;

    align-items: end;
}


/* Room objects */

.room-item {
    border: 1px solid #444;

    padding: 30px 15px;

    text-align: center;

    background: #151515;
}

.item-name {
    font-weight: bold;
}

.item-description {
    margin-top: 8px;

    font-size: 0.85em;

    color: #999;
}


/* Slot */

.slot-area {
    display: flex;
    justify-content: center;
}

.slot-machine {
    width: 260px;

    padding: 20px;

    border: 2px solid #555;

    background: #111;

    text-align: center;
}

.slot-title {
    margin-bottom: 20px;

    font-weight: bold;

    letter-spacing: 0.15em;
}

.slot-display {
    display: flex;

    justify-content: center;

    gap: 10px;

    margin-bottom: 20px;
}

.slot-display span {
    display: flex;

    justify-content: center;
    align-items: center;

    width: 55px;
    height: 65px;

    border: 1px solid #555;

    background: #050505;

    font-size: 2em;
}

.slot-display.large span {
    width: 75px;
    height: 90px;

    font-size: 3em;
}


/* Buttons */

.sleep-loading {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    place-content: center;
    gap: 10px;
    text-align: center;
    background: rgba(0, 0, 0, 0.82);
    color: #e8e8e8;
    letter-spacing: 0.12em;
}

.sleep-loading[hidden] { display: none; }

.sleep-loading p {
    margin: 0;
    font-size: 1.35rem;
}

.sleep-loading small { color: #aaa; letter-spacing: 0.05em; }

.game-actions {
    display: flex;

    justify-content: center;

    margin-top: 30px;
}

.street-parlor-district {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
}
.prize-exchange-button { margin-right: 32px; }
.street-parlor-list { display: flex; gap: 7px; }
.street-boundary {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 38px 0 0;
    color: #777;
    font-size: .78rem;
    letter-spacing: .14em;
}
.street-boundary::before, .street-boundary::after { content: ''; flex: 1; height: 1px; background: #3c3c3c; }
.street-facilities { margin-top: 18px; flex-wrap: wrap; }
.street-facilities > button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
#cafe-button[hidden] { display: none; }
.street-facilities > button small { color: #aaa; line-height: 1.3; }
.hunger-danger { color: #ff7777; animation: hunger-danger-pulse 1s ease-in-out infinite alternate; }
@keyframes hunger-danger-pulse { to { color: #ffb0b0; text-shadow: 0 0 8px #bd1616; } }
#counter-menu[hidden] { display: none; }
#counter-menu { flex-wrap: wrap; }

.machine-card {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "title seat" "status status" "current current" "counts counts" "combined combined";
    align-content: center;
    min-width: 142px;
    text-align: left;
}
.machine-card-title { grid-area: title; color: #f2f6ff; font-weight: 700; font-size: 0.95rem; }
.machine-card-seat { grid-area: seat; font-size: 0.72rem; white-space: nowrap; }
.machine-card.vacant .machine-card-seat { color: #74c7a0; }
.machine-card.occupied .machine-card-seat { color: #d9a467; }
.machine-card-status { grid-area: status; min-height: 0; margin-top: 3px; color: #ff5a5a; font-size: .78rem; font-weight: 800; letter-spacing: .08em; }
.machine-card-at { border-color: #9f3636; box-shadow: inset 0 0 16px #7a151533; }
.machine-card-current { grid-area: current; margin-top: 7px; color: #d8e9ff; font-size: 0.9rem; font-weight: 700; }
.machine-card-counts { grid-area: counts; margin-top: 3px; color: #aab3c0; font-size: 0.72rem; }
.machine-card-combined { grid-area: combined; margin-top: 3px; color: #d8e9ff; font-size: 0.72rem; }
.machine-model-groups { display: flex; flex-direction: column; align-items: stretch; gap: 20px; width: 100%; }
.machine-model-group { min-width: 0; }
.machine-model-group h3 { margin: 0 0 7px; font-size: .92rem; color: #d8e9ff; letter-spacing: .08em; }
.machine-model-group.hades h3 { color: #ffd56a; }
.machine-model-list { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.machine-model-list .machine-card { min-width: 0; width: 100%; }

#game button {
    min-height: 44px;

    padding: 10px 20px;

    border: 1px solid #555;

    background: #191919;

    color: inherit;

    cursor: pointer;
}

#game button:hover {
    border-color: #aaa;
}


/* Message */

.game-message {
    margin-top: 20px;

    text-align: center;

    color: #999;
}


/* Mobile */

@media (max-width: 600px) {

    #game {
        padding: 15px;
    }


    .game-header {
        align-items: flex-start;

        flex-direction: column;
    }


    .player-status {
        flex-direction: column;

        gap: 5px;
    }


    .home-room {
        grid-template-columns: 1fr;

        min-height: auto;
    }


    .room-item {
        display: none;
    }


    .slot-area {
        margin-top: 20px;
    }

    .game-screen h2 {
        margin-bottom: 18px;
        font-size: 1.25rem;
    }

    .game-actions {
        flex-wrap: wrap;
        margin-top: 18px;
    }

    .street-parlor-district { align-items: stretch; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
    .prize-exchange-button { margin-right: 0; }
    .street-parlor-list { justify-content: center; flex-wrap: wrap; }
    .street-boundary { margin-top: 27px; }

    /* 台選択は横6台を維持せず、親指で押せる2列の盤面にする。 */
    #machine-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        gap: 6px;
    }

    #machine-list button {
        min-width: 0;
        min-height: 70px;
        padding: 9px 10px;
        line-height: 1.35;
        overflow-wrap: anywhere;
    }

    #machine-list.machine-model-groups { display: flex; flex-direction: column; gap: 18px; }
    .machine-model-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .machine-card-title { font-size: 1rem; }
    .machine-card-current { margin-top: 6px; font-size: 0.95rem; }
    .machine-card-counts { font-size: 0.72rem; }

}

.beg-reason {
    display: block;
    margin-top: -8px;
    color: #ffb1b1;
    text-align: center;
}
.beg-reason[hidden] { display: none; }

/* =========================
   Sloneet Slot Machine
   ========================= */

.slot-header {
    display: flex;
    justify-content: space-between;
    align-items: center;

    margin-bottom: 30px;
}

.slot-header h2 {
    margin: 0;
}

.slot-header p {
    margin: 5px 0 0;
    color: #888;
}

.hyena-watcher-status {
    margin-top: 10px !important;
    padding: 7px 10px;
    border: 1px solid #784747;
    background: #241313;
    color: #ffb1b1 !important;
    font-weight: 700;
}


.slot-money {
    text-align: right;
}

.slot-money span {
    display: block;

    font-size: 0.8rem;
    color: #888;
}

.slot-money strong {
    display: block;

    margin-top: 4px;

    font-size: 1.3rem;
}


/* Machine */

.slot-machine {
    max-width: 600px;

    position: relative;

    margin: 0 auto;
    padding: 35px 30px;

    border: 2px solid #444;

    background: #111;

    text-align: center;
}


.slot-machine-title {
    margin-bottom: 30px;

    font-size: 1.4rem;

    font-weight: bold;

    letter-spacing: 0.3em;
}


/* Reels */

.slot-reels {
    display: flex;

    justify-content: center;

    gap: 12px;

    margin-bottom: 30px;
}


.reel {
    display: flex;

    justify-content: center;
    align-items: center;

    width: 100px;
    height: 120px;

    border: 2px solid #555;

    background: #050505;

    overflow: hidden;
}


.reel span {
    font-size: 4rem;

    font-weight: bold;
}


/* Result */

.slot-result {
    min-height: 25px;

    margin-bottom: 25px;

    font-size: 1rem;

    letter-spacing: 0.15em;
}


/* Controls */

.slot-controls {
    display: flex;
    flex-direction: column;
    margin-top: 38px;
}
.reel-secondary { display: none; }
.slot-machine.hades-reels { border-color: #8a6a13; box-shadow: 0 0 20px rgba(207,155,19,.22); background: #100e08; }
.slot-machine.hades-hz-blue { border-color:#3686d6; box-shadow:0 0 36px #287ddc80; }.slot-machine.hades-hz-yellow { border-color:#dbbd39; box-shadow:0 0 38px #e4c7398c; }.slot-machine.hades-hz-red { border-color:#d54646; box-shadow:0 0 42px #e1373795; }
.slot-machine.hades-judgment-dog { border-color:#3c94e8; box-shadow:0 0 28px #287ddc99; }.slot-machine.hades-judgment-dog .hades-stage { min-height:112px; color:#d9f4ff; background:radial-gradient(ellipse at 50% 110%,#103c83 0 35%,transparent 65%),linear-gradient(135deg,#02060f,#092758 48%,#01050c); border-color:#5bb8ff; box-shadow:inset 0 0 28px #277dd099,0 0 14px #277dd099; }
.slot-machine.hades-judgment-dog .hades-stage::before { content:"KERBEROS"; position:absolute; z-index:1; inset:16px 0 auto; color:#a6e2ff22; font-family:Georgia,serif; font-size:clamp(2.2rem,10vw,4.4rem); font-weight:900; letter-spacing:.08em; line-height:1; transform:scaleX(1.12); }.slot-machine.hades-judgment-dog .hades-stage::after { content:"●  ●  ●"; position:absolute; z-index:1; left:0; right:0; bottom:12px; color:#84d8ff; font-size:1.45rem; letter-spacing:1.15em; text-shadow:0 0 8px #fff,0 0 18px #1d8cff; animation:judgment-eyes 1.05s ease-in-out infinite alternate; }
.slot-machine.hades-judgment-goddess { border-color:#b067df; box-shadow:0 0 28px #9a49c799; }.slot-machine.hades-judgment-goddess .hades-stage { min-height:112px; color:#fff0ff; background:radial-gradient(ellipse at 50% 20%,#f8d8ff88 0 8%,transparent 34%),radial-gradient(ellipse at 50% 120%,#7e2e9e 0 36%,transparent 68%),linear-gradient(135deg,#200b31,#7a3c8d 52%,#18071f); border-color:#df9dff; box-shadow:inset 0 0 30px #db8cff77,0 0 14px #be5af088; }.slot-machine.hades-judgment-goddess .hades-stage::before { content:"PERSEPHONE"; position:absolute; z-index:1; inset:18px 0 auto; color:#ffe2ff24; font-family:Georgia,serif; font-size:clamp(1.8rem,8vw,3.5rem); font-weight:900; letter-spacing:.1em; line-height:1; }.slot-machine.hades-judgment-goddess .hades-stage::after { content:"✦"; position:absolute; z-index:1; left:50%; bottom:-22px; width:94px; height:94px; transform:translateX(-50%) rotate(45deg); border:1px solid #ffe4ff99; color:#fff1ff; font-size:4rem; line-height:94px; text-align:center; text-shadow:0 0 9px #fff,0 0 24px #da76ff; box-shadow:0 0 20px #d96aff88,inset 0 0 18px #f9cbff66; animation:judgment-goddess 2.2s linear infinite; }
.slot-machine.hades-judgment-hades { border-color:#df4a4a; box-shadow:0 0 30px #d52b2b99; }.slot-machine.hades-judgment-hades .hades-stage { min-height:112px; color:#fff0e4; background:radial-gradient(ellipse at 50% 120%,#a3151d 0 36%,transparent 66%),linear-gradient(135deg,#160205,#5c1017 50%,#080103); border-color:#ff7070; box-shadow:inset 0 0 32px #ba122088,0 0 16px #d8213588; }.slot-machine.hades-judgment-hades .hades-stage::before { content:"HADES"; position:absolute; z-index:1; inset:15px 0 auto; color:#ffb0ad28; font-family:"Yu Mincho",Georgia,serif; font-size:clamp(2.6rem,11vw,4.8rem); font-weight:900; letter-spacing:.15em; line-height:1; text-shadow:0 0 18px #e31515; }.slot-machine.hades-judgment-hades .hades-stage::after { content:"♛"; position:absolute; z-index:1; left:50%; bottom:-29px; width:102px; height:102px; transform:translateX(-50%); color:#ffb1a8; font-size:5.2rem; line-height:102px; text-align:center; text-shadow:0 0 8px #fff,0 0 24px #e21b28; border:1px solid #ee666699; border-radius:50%; box-shadow:0 0 22px #bd172488,inset 0 0 20px #b8111b77; animation:judgment-hades 1.8s ease-in-out infinite alternate; }
@keyframes judgment-eyes { to { filter:brightness(1.75); transform:translateY(-3px); } }
@keyframes judgment-goddess { to { transform:translateX(-50%) rotate(405deg); } }
@keyframes judgment-hades { to { filter:brightness(1.55); transform:translateX(-50%) scale(1.08); } }
.slot-machine.hades-reels .slot-machine-title { color: #ffd66c; }
.slot-machine.hades-reels .slot-machine-title { white-space: nowrap; overflow: visible; font-size: clamp(.72rem, 3.5vw, 1.15rem); letter-spacing: .06em; }
.slot-machine.hades-reels .reel { height: 192px; flex-direction: column; justify-content: stretch; }
.slot-machine.hades-reels .reel span { display: flex; flex: 1; align-items: center; justify-content: center; width: 100%; min-width: 0; overflow: hidden; white-space: nowrap; font-size: clamp(1.1rem, 6vw, 2rem); border-bottom: 1px solid #333; }
.slot-machine.hades-reels .reel span:last-child { border-bottom: 0; }
.slot-machine.hades-reels .reel span:nth-child(2) { color: #ffd84a; text-shadow: 0 0 8px currentColor; }
.slot-machine.hades-reels .reel span:nth-child(1),.slot-machine.hades-reels .reel span:nth-child(3) { color: #a9b6c8; font-size: 1.8rem; }
.slot-machine.hades-reels .reel span.gold { color: #ffe050 !important; text-shadow: 0 0 12px #bd8700; }
.slot-machine.hades-reels .reel span.blue { color: #57b9ff !important; text-shadow: 0 0 12px #1766e0; }
.slot-machine.hades-reels .reel span.purple { color: #d77dff !important; text-shadow: 0 0 12px #8016be; }
.slot-machine.hades-reels .reel span.hades { color: #f45454 !important; text-shadow: 0 0 12px #b00000; }
.slot-machine.hades-reels .reel span.god { color: #ffd954 !important; text-shadow: 0 0 12px #c98e00; font-size: 1.25rem; }
.hades-lcd { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; width: 60%; margin: 14px auto; padding: 8px; border: 2px solid #5c4b1a; background: #080704; }
.hades-stage { position:relative; isolation:isolate; display:grid; place-items:center; min-height:74px; margin:0 auto 10px; overflow:hidden; border:1px solid #565656; background:#25465a; color:#fff; font-weight:900; letter-spacing:.1em; text-shadow:0 2px 3px #000,0 0 8px #000; transition:background .35s ease; }
.hades-stage-name { position:relative; z-index:2; padding:5px 12px; border:1px solid #ffffff66; background:#00000055; }
.hades-stage-addition { position:absolute; z-index:3; display:grid; place-items:center; color:#fff6a1; font-family:Georgia,"Yu Mincho",serif; font-size:clamp(2rem,9vw,3.3rem); line-height:1; letter-spacing:.04em; text-shadow:0 0 4px #fff,0 0 12px #ff9c00,0 0 26px #f04a00,3px 3px 0 #3d0900; pointer-events:none; }
.hades-stage-addition.show { animation:hades-stage-addition 1.4s ease-out both; }
@keyframes hades-stage-addition { 0% { transform:scale(.45); opacity:0; } 14% { transform:scale(1.22); opacity:1; } 72% { transform:scale(1); opacity:1; } 100% { transform:scale(1.42); opacity:0; } }
.hades-stage-scenery { position:absolute; z-index:1; inset:auto 0 0; height:40%; opacity:.75; background:linear-gradient(150deg,transparent 0 30%,#102517 31% 45%,transparent 46% 58%,#102517 59% 76%,transparent 77%); }
.hades-stage-minos { background:radial-gradient(ellipse at 50% 115%,#bd3a1d 0 20%,transparent 43%),linear-gradient(#21080a 0 45%,#671512 46% 67%,#170507 68%); border-color:#9d271d; box-shadow:inset 0 0 26px #630700aa,0 0 13px #8a1b12aa; }.hades-stage-minos .hades-stage-scenery { height:60%; opacity:.95; background:linear-gradient(158deg,transparent 0 15%,#1a0203 16% 29%,transparent 30% 42%,#1a0203 43% 60%,transparent 61%),linear-gradient(23deg,transparent 0 38%,#e45922aa 39% 42%,transparent 43% 100%); }
.hades-stage-acheron { background:radial-gradient(ellipse at 50% -25%,#f8f6cf 0 24%,transparent 45%),linear-gradient(#99d9f2 0 36%,#4fa6c9 37% 54%,#16729f 55% 100%); border-color:#78cce8; box-shadow:inset 0 0 22px #d7f8ff66,0 0 13px #4daed388; }.hades-stage-acheron .hades-stage-scenery { height:58%; opacity:.90; background:repeating-linear-gradient(174deg,transparent 0 7px,#e0fbffbb 8px 10px,transparent 11px 17px),linear-gradient(145deg,transparent 0 22%,#2b745566 23% 36%,transparent 37% 58%,#2b745566 59% 75%,transparent 76%); }
.hades-stage-pluto { background:radial-gradient(circle at 50% 38%,#fff2a2 0 4%,transparent 5%),linear-gradient(90deg,#160e05 0 29%,#d69a25 30% 47%,#ffe27a 48% 52%,#d69a25 53% 70%,#160e05 71%); }.hades-stage-pluto .hades-stage-scenery { inset:11% 28%; height:78%; border:2px solid #fff0a2; background:linear-gradient(90deg,transparent 49%,#664000 50% 52%,transparent 53%); box-shadow:0 0 14px #ffcf3b; }
.hades-stage-god { background:radial-gradient(ellipse at 50% 15%,#fff7b9 0 5%,transparent 30%),linear-gradient(#150f03 0,#5b3504 48%,#110a02 100%); border-color:#f7cf51; box-shadow:inset 0 0 25px #e3a61688,0 0 16px #d99d1988; }.hades-stage-god .hades-stage-scenery { inset:0; height:100%; opacity:1; background:linear-gradient(105deg,transparent 0 38%,#ffec9577 39% 40%,transparent 41% 100%),linear-gradient(75deg,transparent 0 60%,#ffe8a066 61% 62%,transparent 63% 100%),radial-gradient(ellipse at 50% 110%,#d58b16aa 0 16%,transparent 55%); animation:hades-god-shine 2.2s ease-in-out infinite; }.hades-stage-god .hades-stage-name { color:#fff0a1; border-color:#ffe79b; text-shadow:0 0 5px #ffca34,0 0 15px #d37b00; }
@keyframes hades-god-shine { 50% { filter:brightness(1.5); } }
.hades-stage-night::before { content:""; position:absolute; z-index:1; inset:0; pointer-events:none; background:radial-gradient(circle at 12% 22%,#fff 0 1px,transparent 2px),radial-gradient(circle at 28% 10%,#bcd7ff 0 1px,transparent 2px),radial-gradient(circle at 43% 30%,#fff 0 1px,transparent 2px),radial-gradient(circle at 67% 15%,#d7e8ff 0 1px,transparent 2px),radial-gradient(circle at 83% 32%,#fff 0 1px,transparent 2px),linear-gradient(#061027b8,#10122688); background-size:100% 100%; animation:hades-night-stars 2.8s ease-in-out infinite alternate; }
.hades-stage-night .hades-stage-scenery { filter:brightness(.60) saturate(.8); }
.hades-stage-night .hades-stage-name { border-color:#a9c8ff; color:#e6efff; text-shadow:0 0 5px #84b4ff,0 0 15px #173b9e; }
@keyframes hades-night-stars { to { filter:brightness(1.35); } }
.hades-stage-oceanus { background:linear-gradient(165deg,#05070a 0 38%,#1a2028 39% 66%,#08090b 67%); border-color:#53616e; box-shadow:inset 0 0 24px #020305,0 0 12px #29364288; }.hades-stage-oceanus .hades-stage-scenery { inset:0; height:100%; opacity:1; background:linear-gradient(128deg,transparent 0 28%,#6c778155 29% 31%,transparent 32% 47%,#6c778144 48% 50%,transparent 51%),linear-gradient(52deg,transparent 0 41%,#a3211f77 42% 43%,transparent 44% 62%,#a3211f55 63% 64%,transparent 65%),repeating-linear-gradient(90deg,transparent 0 19%,#000000aa 20% 22%,transparent 23% 39%); }.hades-stage-oceanus .hades-stage-name { border-color:#93a0ac; color:#edf4fa; text-shadow:0 0 5px #93a0ac,0 0 14px #101820; }
.hades-stage-erinyes { background:radial-gradient(circle at 50% 15%,#fff3ce 0 7%,transparent 8%),linear-gradient(#8b5da4,#d6a7c5 58%,#63518a); }.hades-stage-hades { background:radial-gradient(circle at 50% 100%,#d42929 0 25%,transparent 26%),linear-gradient(#090506,#481014 58%,#160609); }
.hades-stage-g-zone, .hades-stage-hell-zone { background:#05070d; border-color:#609dca; box-shadow:inset 0 0 24px #1e6bac88,0 0 16px #276ea766; }
.hades-stage-g-zone .hades-stage-name, .hades-stage-hell-zone .hades-stage-name { border-color:#a9dcff; background:#020611bb; color:#d8f3ff; font-size:1.15rem; text-shadow:0 0 5px #2b9bff,0 0 14px #76caff; }
.hades-stage-g-zone .hades-stage-scenery, .hades-stage-hell-zone .hades-stage-scenery { inset:0; height:100%; opacity:1; background:linear-gradient(116deg,transparent 0 35%,#c4eaff00 36% 42%,#e5f7ff 43% 44%,#75c6ff 45% 48%,transparent 49% 100%),linear-gradient(72deg,transparent 0 58%,#78c9ff00 59% 64%,#edfaff 65% 66%,#5bb5ff 67% 70%,transparent 71% 100%),radial-gradient(ellipse at 50% 120%,#0b3d6c 0 18%,transparent 58%),linear-gradient(#101a31,#02040a 68%); animation:hades-storm-flash 2.4s steps(1,end) infinite; }
.hades-stage-hell-zone { border-color:#bf405a; box-shadow:inset 0 0 26px #8d153d99,0 0 17px #8c173b88; }
.hades-stage-hell-zone .hades-stage-name { border-color:#ff9494; color:#ffe0e0; text-shadow:0 0 5px #ff3131,0 0 15px #bc001c; }
.hades-stage-hell-zone .hades-stage-scenery { background:linear-gradient(116deg,transparent 0 35%,#ffb0b000 36% 42%,#fff0f0 43% 44%,#ff4f62 45% 48%,transparent 49% 100%),linear-gradient(72deg,transparent 0 58%,#ff8d9900 59% 64%,#ffe9eb 65% 66%,#f33156 67% 70%,transparent 71% 100%),radial-gradient(ellipse at 50% 120%,#5a071d 0 18%,transparent 58%),linear-gradient(#250713,#030205 68%); }
.hades-stage-hell-blue { border-color:#3686d6; box-shadow:inset 0 0 26px #176cb499,0 0 18px #287ddc88; }.hades-stage-hell-blue .hades-stage-name { border-color:#a9dcff; color:#d8f3ff; text-shadow:0 0 5px #2b9bff,0 0 15px #76caff; }.hades-stage-hell-blue .hades-stage-scenery { background:linear-gradient(116deg,transparent 0 35%,#c4eaff00 36% 42%,#e5f7ff 43% 44%,#75c6ff 45% 48%,transparent 49% 100%),linear-gradient(72deg,transparent 0 58%,#78c9ff00 59% 64%,#edfaff 65% 66%,#5bb5ff 67% 70%,transparent 71% 100%),radial-gradient(ellipse at 50% 120%,#0b3d6c 0 18%,transparent 58%),linear-gradient(#101a31,#02040a 68%); }
.hades-stage-hell-yellow { border-color:#dbbd39; box-shadow:inset 0 0 27px #c88c1799,0 0 18px #e4c73988; }.hades-stage-hell-yellow .hades-stage-name { border-color:#ffed98; color:#fff4c8; text-shadow:0 0 5px #f5bf20,0 0 15px #d98200; }.hades-stage-hell-yellow .hades-stage-scenery { background:linear-gradient(116deg,transparent 0 35%,#fff0a000 36% 42%,#fff8db 43% 44%,#f7c630 45% 48%,transparent 49% 100%),linear-gradient(72deg,transparent 0 58%,#ffe28600 59% 64%,#fff8ce 65% 66%,#e9aa16 67% 70%,transparent 71% 100%),radial-gradient(ellipse at 50% 120%,#684209 0 18%,transparent 58%),linear-gradient(#302205,#060504 68%); }
.hades-stage-hell-red { border-color:#d54646; box-shadow:inset 0 0 26px #8d153d99,0 0 18px #e1373795; }
@keyframes hades-storm-flash { 0%,75%,100% { filter:brightness(.72); } 77%,79% { filter:brightness(1.55); } 81% { filter:brightness(.86); } }
.hades-lcd[hidden] { display: none; }
.hades-lcd span { display: grid; place-items: center; min-height: 52px; border: 1px solid #4e4e4e; font-family: Georgia, serif; font-size: 2rem; font-weight: 700; }
.hades-lcd .odd-digit { color: #ff5d5d; text-shadow: 0 0 8px #9a1717; }.hades-lcd .even-digit { color: #ffe15a; text-shadow: 0 0 8px #a77700; }
.hades-lcd .rainbow-seven { color: #fff; text-shadow: -2px 0 #ff4444, 2px 0 #4db2ff, 0 2px #e66cff, 0 -2px #ffe950; }
.hades-lcd .lcd-odd, .hades-lcd .lcd-v { color: #f05a5a; text-shadow: 0 0 10px #a60000; }
.hades-lcd .lcd-even { color: #ffe34d; text-shadow: 0 0 10px #bd8500; }
.hades-lcd .lcd-rainbow-seven { background: linear-gradient(135deg,#ff4545 0%,#ffd83e 22%,#64ed72 42%,#4abaff 61%,#9b68ff 80%,#ff64c7 100%); background-size:220% 220%; color: transparent; -webkit-text-fill-color: transparent; -webkit-background-clip: text; background-clip: text; text-shadow: 0 0 11px #ffffff88; animation:hades-lcd-rainbow-glitter 1.05s linear infinite; }
@keyframes hades-lcd-rainbow-glitter { 0% { background-position:0% 50%; filter:brightness(.95); text-shadow:0 0 6px #fff,0 0 13px #ffda43,0 0 23px #ca52ff; } 50% { filter:brightness(1.55); text-shadow:0 0 5px #fff,0 0 18px #ffec72,0 0 31px #55baff; } 100% { background-position:100% 50%; filter:brightness(1.06); text-shadow:0 0 7px #fff,0 0 15px #ff6bc4,0 0 26px #7665ff; } }
.hades-stage.stock-announcement { border-color:#fff; background:radial-gradient(circle at 50% 50%,#31156b 0,#09010f 52%,#000 100%); box-shadow:inset 0 0 42px #d77cff99,0 0 11px #fff,0 0 27px #4bbcff,0 0 45px #d658ff; animation:hades-stock-screen .16s steps(2,end) 3,hades-stock-screen-glow .75s linear infinite; }
.hades-stage.stock-announcement .hades-stage-name,.hades-stage.stock-announcement .hades-stage-scenery { opacity:0; }
.hades-stage-addition.stock { z-index:5; background:linear-gradient(135deg,#ff5353 0%,#ffe955 19%,#63f08b 38%,#55bfff 57%,#b776ff 78%,#ff67cb 100%); background-size:240% 240%; color:transparent; -webkit-text-fill-color:transparent; -webkit-background-clip:text; background-clip:text; font-size:clamp(2.55rem,12vw,4.75rem); letter-spacing:.06em; text-shadow:0 0 7px #fff,0 0 19px #ffdc55,0 0 34px #bb67ff; animation:hades-stage-addition 1.45s ease-out both,hades-stock-rainbow .55s linear infinite; }
@keyframes hades-stock-rainbow { to { background-position:240% 50%; filter:brightness(1.35); } }
@keyframes hades-stock-screen { 0%,100% { filter:brightness(.25); } 50% { filter:brightness(1.75); } }
@keyframes hades-stock-screen-glow { to { box-shadow:inset 0 0 42px #65d8ff99,0 0 12px #fff,0 0 30px #ffdc52,0 0 48px #e35cff; } }
.hades-lcd.lcd-rolling > span { color: #666; text-shadow: 0 0 7px #e4d7a666; animation: hades-lcd-roll .08s steps(2,end) infinite; }
@keyframes hades-lcd-roll { 50% { transform: translateY(-3px); opacity: .42; } }
.hades-zone-gems { display:flex; flex-wrap:wrap; justify-content:center; gap:3px; min-height:22px; margin:-7px auto 8px; padding:4px 8px; width:60%; border:1px solid #22673a; background:#06110a; box-shadow:inset 0 0 12px #1d7d3a44,0 0 9px #1d7d3a33; }
.hades-zone-gems span { color:#65ef88; font-size:1.18rem; line-height:1; text-shadow:0 0 4px #0c7c35,0 0 10px #56d97a; animation:hades-zone-gem-in .16s ease-out; }
.hades-judgment-total { color:#7dff9d; font-size:.92rem; line-height:1.2; letter-spacing:.08em; text-shadow:0 0 5px #0c7c35,0 0 12px #56d97a; }
.hades-judgment-stock { color:#7dff9d; font-size:.92rem; line-height:1.2; letter-spacing:.12em; text-shadow:0 0 5px #0c7c35,0 0 12px #56d97a; }
@keyframes hades-zone-gem-in { from { transform:scale(.55); opacity:.2; } to { transform:scale(1); opacity:1; } }
.hades-chain-overlay { position: absolute; inset: 8px; display: grid; grid-template-columns: repeat(3,1fr); gap:7px; pointer-events:none; }
.hades-chain-overlay span { display:block; min-height:0; border:0; color:transparent; background:transparent; font-family:Arial,sans-serif; font-size:clamp(2.6rem,11vw,4.2rem); font-weight:300; line-height:1; transform:scaleX(1.25); }
.hades-chain-overlay span.locked { color:#a8a8a8; background:#202020a8; text-shadow:0 0 3px #000; }
.slot-machine.hades-reels .reel span.symbol-yellow { color:#ffe34d !important; text-shadow:0 0 11px #d69b00; }
.slot-machine.hades-reels .reel span.symbol-blue,.slot-machine.hades-reels .reel span.symbol-replay { color:#55a9ff !important; text-shadow:0 0 11px #1260bd; }
.slot-machine.hades-reels .reel span.symbol-purple { color:#df91ff !important; text-shadow:0 0 11px #8d2bc1; }
.slot-machine.hades-reels .reel span.symbol-hazure { color:#777 !important; font-size:1.15rem; text-shadow:none; }
.slot-machine.hades-reels .reel span.symbol-hades { color:#f04d4d !important; font-family:"Yu Mincho","Hiragino Mincho ProN",Georgia,serif; font-size:clamp(1.05rem,5.2vw,1.7rem); font-weight:900; letter-spacing:0; text-shadow:0 0 4px #ffb0b0,0 0 14px #9d0000,2px 2px 0 #300000; }
.slot-machine.hades-reels .reel span.symbol-hades { animation:hades-emblem-glow 1.7s ease-in-out infinite alternate; }
@keyframes hades-emblem-glow { from { filter:brightness(.95); text-shadow:0 0 4px #ffb0b0,0 0 14px #9d0000,2px 2px 0 #300000; } to { filter:brightness(1.28); text-shadow:0 0 5px #fff0e8,0 0 15px #ff7c7c,0 0 25px #bf0011,2px 2px 0 #300000; } }
.slot-machine.hades-reels .reel span.symbol-god { color:#e6bd43 !important; font-family:"Yu Mincho","Hiragino Mincho ProN",Georgia,serif; font-size:clamp(.86rem,4.4vw,1.3rem); letter-spacing:0; text-shadow:0 0 4px #fff1a0,0 0 16px #9b5c00,2px 2px 0 #352000; }
.hades-koyaku { margin-top:14px; padding-top:12px; border-top:1px solid #454545; }.hades-koyaku h3 { margin:0 0 8px; color:#bbb; font-size:.85rem; }.hades-koyaku-list { display:grid; grid-template-columns:repeat(5,1fr); gap:4px; }.hades-koyaku-slot { min-height:31px; display:grid; place-items:center; border:1px solid #3e3e3e; background:#080808; color:#777; font-size:.78rem; }.hades-koyaku-slot.green { color:#77dc7b; border-color:#278b40; box-shadow:inset 0 0 9px #278b4044; }.hades-koyaku-slot.yellow { color:#ffe34d; border-color:#bd8500; box-shadow:inset 0 0 9px #bd850044; }
.hades-lcd-stage .hades-koyaku { margin:0 auto 10px; padding:8px; border:1px solid #454545; background:#090909; width:min(100%,360px); }
.slot-machine.hades-at-active .slot-machine-title { background:linear-gradient(90deg,#ff5c5c,#ffe25a,#61e987,#4abaff,#b66cff,#ff70be); color:#fff; border-color:#fff; text-shadow:0 0 8px #000; animation:hades-at-rainbow 1.4s linear infinite; }
@keyframes hades-at-rainbow { 0% { box-shadow:0 0 12px #ff5b5b,0 0 28px #ff5b5b; } 20% { box-shadow:0 0 12px #ffe45b,0 0 28px #ffe45b; } 40% { box-shadow:0 0 12px #65e98b,0 0 28px #65e98b; } 60% { box-shadow:0 0 12px #56b8ff,0 0 28px #56b8ff; } 80% { box-shadow:0 0 12px #bb75ff,0 0 28px #bb75ff; } 100% { box-shadow:0 0 12px #ff5b5b,0 0 28px #ff5b5b; } }
.hades-gg-summary { position:absolute; z-index:8; inset:12px; display:grid; place-content:center; gap:12px; padding:22px; border:2px solid #d6b33c; background:linear-gradient(#080808ee,#281904f5); box-shadow:inset 0 0 42px #d9a81645,0 0 28px #e3b92a8a; text-align:center; }
.hades-gg-summary[hidden] { display:none; }.hades-gg-summary h2 { margin:0; color:#ffe479; font-size:clamp(1.45rem,6vw,2.2rem); letter-spacing:.08em; }.hades-gg-summary p { margin:0; color:#eee; font-weight:700; }.hades-gg-summary strong { color:#ffdb54; font-size:1.45rem; }
.hades-chance-effect { position:fixed; inset:0; z-index:10002; display:grid; place-items:center; background:rgba(0,0,0,.72); }.hades-chance-effect[hidden] { display:none; }.hades-chance-stage { display:grid; justify-items:center; gap:12px; }.hades-chance-copy { margin:0; color:#ffdf3e; font-size:clamp(2.5rem,11vw,5.8rem); font-weight:900; font-style:italic; letter-spacing:.12em; text-shadow:0 0 5px #fff,0 0 16px #ff7600,0 0 34px #db1800; animation:hades-chance-copy .48s ease-in-out infinite alternate; }.hades-chance-effect button { min-height:0; padding:0; border:0; background:transparent; box-shadow:none; animation:hades-chance-pulse .55s ease-in-out infinite alternate; }.hades-chance-effect button:disabled { cursor:wait; opacity:.82; }.hades-chance-effect button.pressed { animation:none; transform:translateY(18px) scale(.96); filter:brightness(.72); transition:transform .18s ease-in,filter .18s ease-in; }.hades-chance-effect img { display:block; width:min(76vw,420px); height:auto; filter:drop-shadow(0 0 12px #f7d928) drop-shadow(0 0 30px #e13b11); }.hades-chance-effect.no-gekia .hades-chance-copy { display:none; }@keyframes hades-chance-pulse { from{transform:translateY(0) scale(1)} to{transform:translateY(-7px) scale(1.035)} }@keyframes hades-chance-copy { from{transform:scale(.96);filter:brightness(.9)} to{transform:scale(1.04);filter:brightness(1.25)} }
.hades-crack-effect { position:fixed; z-index:10003; inset:0; overflow:hidden; pointer-events:none; background:rgba(0,0,0,0); }.hades-crack-effect[hidden] { display:none; }.hades-crack-effect::before { content:''; position:absolute; inset:0; opacity:0; background:radial-gradient(circle at 52% 46%,rgba(255,255,255,.24) 0 2px,transparent 4px),radial-gradient(circle at 52% 46%,rgba(184,222,255,.11),rgba(0,0,0,.52) 70%); }.hades-crack-line { position:absolute; left:52%; top:46%; width:2px; height:0; transform-origin:50% 0; background:linear-gradient(to bottom,rgba(255,255,255,.96),rgba(138,203,255,.74) 32%,rgba(0,0,0,.22)); box-shadow:0 0 3px #fff,0 0 8px #70baff; opacity:0; }.hades-crack-line::after { content:''; position:absolute; left:0; top:52%; width:1px; height:45%; transform-origin:top; background:rgba(201,231,255,.84); box-shadow:0 0 3px #bde5ff; }.hades-crack-line.crack-a { transform:rotate(13deg); }.hades-crack-line.crack-a::after { transform:rotate(-43deg); }.hades-crack-line.crack-b { transform:rotate(67deg); }.hades-crack-line.crack-b::after { transform:rotate(38deg); }.hades-crack-line.crack-c { transform:rotate(122deg); }.hades-crack-line.crack-c::after { transform:rotate(-34deg); }.hades-crack-line.crack-d { transform:rotate(188deg); }.hades-crack-line.crack-d::after { transform:rotate(31deg); }.hades-crack-line.crack-e { transform:rotate(238deg); }.hades-crack-line.crack-e::after { transform:rotate(-38deg); }.hades-crack-line.crack-f { transform:rotate(301deg); }.hades-crack-line.crack-f::after { transform:rotate(43deg); }.hades-crack-effect.cracking { background:rgba(0,0,0,.24); }.hades-crack-effect.cracking::before { opacity:1; transition:opacity .18s ease-out; }.hades-crack-effect.cracking .hades-crack-line { height:74%; opacity:1; transition:height .42s cubic-bezier(.15,.7,.2,1),opacity .1s; }.hades-crack-effect.shattering { background:rgba(0,0,0,.88); animation:hades-crack-blackout .3s ease-out both; }.hades-crack-effect.shattering::before { opacity:.2; animation:hades-crack-flash .22s ease-out both; }.hades-crack-effect.shattering .hades-crack-line { height:128%; opacity:0; transition:height .16s ease-out,opacity .24s .1s ease-in; }.hades-crack-shard { position:absolute; inset:-12%; opacity:0; background:linear-gradient(135deg,rgba(202,225,255,.4),rgba(0,0,0,.86) 58%); transform-origin:52% 46%; }.hades-crack-shard.shard-a { clip-path:polygon(52% 46%,0 0,44% 0); }.hades-crack-shard.shard-b { clip-path:polygon(52% 46%,44% 0,100% 0,100% 17%); }.hades-crack-shard.shard-c { clip-path:polygon(52% 46%,100% 17%,100% 100%,58% 100%); }.hades-crack-shard.shard-d { clip-path:polygon(52% 46%,58% 100%,0 100%,0 73%); }.hades-crack-shard.shard-e { clip-path:polygon(52% 46%,0 73%,0 0); }.hades-crack-shard.shard-f { clip-path:polygon(52% 46%,100% 17%,100% 0,44% 0); }.hades-crack-effect.shattering .hades-crack-shard { opacity:.58; transition:opacity .08s; animation:hades-shard-break .72s cubic-bezier(.12,.72,.27,1) forwards; }.hades-crack-effect.shattering .shard-a { --x:-35%;--y:-28%;--r:-12deg; }.hades-crack-effect.shattering .shard-b { --x:36%;--y:-30%;--r:15deg; }.hades-crack-effect.shattering .shard-c { --x:37%;--y:34%;--r:18deg; }.hades-crack-effect.shattering .shard-d { --x:-34%;--y:37%;--r:-18deg; }.hades-crack-effect.shattering .shard-e { --x:-43%;--y:6%;--r:-25deg; }.hades-crack-effect.shattering .shard-f { --x:44%;--y:-4%;--r:22deg; }@keyframes hades-crack-blackout { 0% { background:rgba(255,255,255,.8); } 100% { background:rgba(0,0,0,.88); } }@keyframes hades-crack-flash { 0% { opacity:1; } 100% { opacity:.2; } }@keyframes hades-shard-break { to { opacity:0; transform:translate(var(--x),var(--y)) rotate(var(--r)); } }
.hades-crack-effect.shattering { background:transparent; animation:none; }.hades-crack-effect.shattering::before { opacity:0; animation:none; }
.hades-god-touch { position:fixed; inset:0; z-index:10003; display:grid; place-items:center; overflow:hidden; background:#000; cursor:pointer; }.hades-god-touch[hidden] { display:none; }.hades-god-touch p { position:relative; z-index:1; margin:0; color:#d8d8d8; font-size:clamp(1.2rem,5vw,2rem); letter-spacing:.16em; opacity:0; }.hades-god-touch.ready p { animation:god-touch-in .42s ease-out forwards,god-touch-pulse 1.25s .42s ease-in-out infinite alternate; }.hades-god-touch.releasing { animation:god-touch-out .35s ease-out forwards; }.hades-god-flash { position:absolute; left:-8vw; right:-8vw; top:50%; height:3px; opacity:0; background:#d9c9ff; box-shadow:0 0 5px #fff,0 0 16px #8a5cff,0 0 36px #4826b8; }.hades-god-flash::after { content:''; position:absolute; left:50%; top:50%; width:18px; height:100px; transform:translate(-50%,-50%); background:#fff; clip-path:polygon(50% 0,61% 41%,100% 50%,61% 59%,50% 100%,39% 59%,0 50%,39% 41%); filter:drop-shadow(0 0 12px #b67cff); }.hades-god-touch.pachun .hades-god-flash { animation:hades-pachun-flash .32s ease-out forwards; }@keyframes hades-pachun-flash { 0%{opacity:0;transform:scaleX(.05)} 28%{opacity:1;transform:scaleX(1)} 68%{opacity:.8;transform:scaleX(1.15)} 100%{opacity:0;transform:scaleX(1.28)} }@keyframes god-touch-in { to{opacity:1} }@keyframes god-touch-pulse { from{opacity:.35} to{opacity:1;text-shadow:0 0 12px #fff} }@keyframes god-touch-out { from{opacity:1} to{opacity:0} }

.slot-primary-controls, .auto-play-row { display: flex; justify-content: center; gap: 15px; }
.auto-play-controls { margin-top: 28px; padding-top: 18px; border-top: 1px solid #414141; text-align: center; }
.auto-play-controls p { margin: 0 0 12px; color: #d4b86c; font-weight: 700; }
.auto-play-controls p small { margin-left: 8px; color: #999; font-weight: 400; }
.auto-play-controls > #away-machine { margin-top: 14px; }


.slot-controls button {
    min-width: 120px;
    min-height: 48px;

    padding: 10px 20px;

    border: 1px solid #555;

    background: #191919;

    color: inherit;

    cursor: pointer;
}


.slot-controls button:hover {
    border-color: #aaa;
}


#spin-slot {
    font-weight: bold;
}


/* Information */

.slot-info {
    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    gap: 20px 48px;

    margin-top: 25px;

    text-align: center;

    color: #888;
}


.slot-info strong {
    display: block;

    margin-top: 5px;

    color: inherit;
}


/* Mobile */

@media (max-width: 600px) {

    .slot-header {
        align-items: flex-start;

        gap: 15px;
    }


    .slot-machine {
        padding: 25px 15px;
    }


    .slot-reels {
        gap: 7px;
    }


    .reel {
        width: 80px;
        height: 100px;
    }


    .reel span {
        font-size: 3rem;
    }


    .slot-controls {
        gap: 0;
    }

    .slot-primary-controls, .auto-play-row {
        flex-direction: column;
        gap: 8px;
    }
    .slot-controls button {
        width: 100%;
    }
    .auto-play-controls { margin-top: 24px; }
    .auto-play-controls p small { display: block; margin: 5px 0 0; }
    #mobile-stop-auto:not([hidden]) { display: inline-block; }


    .slot-info {
        gap: 14px 28px;
    }

}


.gogo-lamp {
    width: 180px;
    margin-bottom: 12px;
}

.gogo-lamp img {
    display: block;
    width: 100%;
    height: auto;
}

.slot-machine-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}
.slot-machine-layout {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}
.slot-machine-column { display: flex; flex-direction: column; align-items: center; }

.machine-data-switcher {
    width: min(640px, 100%);
    margin: 0 auto 20px;
    text-align: center;
}
.machine-data-buttons { display: flex; justify-content: center; gap: 8px; margin-bottom: 8px; }
.machine-data-buttons > button {
    padding: 6px 16px;
    border: 1px solid #555;
    background: #191919;
    color: #d8e9ff;
    cursor: pointer;
}
#mobile-stop-auto { display: none; border-color: #9d5d5d; color: #ffd1d1; }
.machine-data-panel {
    border: 1px solid #414141;
    background: #101010;
    text-align: left;
}
.machine-data-summary { padding: 12px 16px; }
.machine-data-summary .slot-info { margin-top: 0; }
.machine-data-panel .machine-record { margin-bottom: 0; }
.machine-data-panel .bonus-indicator-wrap,
.machine-data-panel .slump-graph-wrap { max-width: none; margin: 0; padding: 14px; }

/* PCでは台とランプを左、自動遊技をすぐ右に置く。 */
@media (min-width: 900px) {
    .slot-machine-layout {
        display: grid;
        grid-template-columns: 320px 245px;
        align-items: start;
        justify-content: center;
        column-gap: 42px;
    }
    .auto-play-controls {
        display: block;
        width: 245px;
        margin: 130px 0 0;
        padding: 0 0 0 20px;
        border-top: 0;
        border-left: 1px solid #414141;
    }
    .auto-play-row { flex-direction: column; gap: 8px; }
    .auto-play-controls button { width: 100%; }
    .auto-play-controls > #away-machine { width: 100%; margin-top: 54px; }
    .auto-play-controls p small { display: block; margin: 5px 0 0; }
}

/* 遊技画面: 履歴は台の上、台データと自動遊技は右側に常設する。 */
.machine-history-panel {
    width: min(640px, 100%);
    margin: 0 auto 24px;
}
.machine-history-panel .bonus-indicator-wrap,
.machine-history-panel .slump-graph-wrap {
    max-width: none;
}
.machine-history-panel .bonus-indicator-wrap { margin: 0; }
.machine-side-panel {
    display: grid;
    gap: 16px;
    width: min(100%, 320px);
}
.machine-side-panel > #away-machine { width: 100%; margin: 0; }
.machine-side-panel .machine-data-panel { width: 100%; }
.machine-side-panel .machine-data-summary { padding: 12px; }
.machine-side-panel .machine-data-summary .slot-info {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    margin: 0;
    text-align: left;
}
.machine-side-panel .machine-data-summary .slot-info strong { color: #d8e9ff; }

/* ハーデス絵コンテの「筐体＋右パネル」構成をモグラーにも共通適用する。 */
.slot-machine:not(.hades-reels) {
    width: min(100%, 560px);
    padding: 22px;
    border-color: #496073;
    background: linear-gradient(160deg, #121920, #080a0d 40%, #121920);
    box-shadow: 0 0 24px rgba(68, 129, 181, .16);
}
.slot-machine:not(.hades-reels) .slot-machine-title {
    margin-bottom: 18px;
    padding: 12px;
    border: 1px solid #3d637d;
    color: #d7ebff;
}
.slot-machine:not(.hades-reels) .slot-reels { margin-bottom: 14px; }
.slot-machine:not(.hades-reels) .reel { height: 150px; border-color: #617080; }
.slot-machine:not(.hades-reels) .slot-result { min-height: 52px; display: grid; place-items: center; margin: 0 0 14px; border: 1px solid #38536a; color: #d5e9ff; }
.machine-side-panel .auto-play-controls,
.machine-side-panel .machine-data-panel {
    border: 1px solid #505b63;
    background: #11161a;
}
.machine-side-panel .auto-play-controls { padding: 14px; }
.machine-side-panel .auto-play-controls p { color: #d7ebff; }
.machine-side-panel .machine-data-summary .slot-info > div {
    padding: 8px;
    border: 1px solid #313b42;
    background: #090c0e;
}

@media (min-width: 900px) {
    .slot-machine-layout {
        grid-template-columns: minmax(320px, 600px) 245px;
        column-gap: 42px;
    }
    .machine-side-panel {
        width: 245px;
        margin-top: 130px;
    }
    .machine-side-panel .auto-play-controls {
        width: auto;
        margin: 0;
        padding: 14px;
        border: 1px solid #505b63;
    }
    .machine-side-panel .auto-play-row { flex-direction: column; gap: 8px; }
    .machine-side-panel .auto-play-controls button { width: 100%; }
    .machine-side-panel > #away-machine { margin-left: 20px; width: calc(100% - 20px); }
    .machine-side-panel .machine-data-panel { margin-left: 20px; width: calc(100% - 20px); }
}

@media (min-width: 900px) {
    /* 自動遊技、離席札、台データの外枠は同じ左端に揃える。 */
    .machine-side-panel > #away-machine,
    .machine-side-panel .machine-data-panel { margin-left: 0; width: 100%; }
}


/* ========================================
   FREEZE EFFECT
   ======================================== */

.freeze-effect {
    position: fixed;
    inset: 0;
    z-index: 9999;

    display: flex;
    align-items: center;
    justify-content: center;

    background:
        radial-gradient(
            circle at center,
            rgba(255, 255, 255, 0.95) 0%,
            rgba(255, 255, 255, 0.35) 18%,
            rgba(255, 255, 255, 0.08) 40%,
            rgba(0, 0, 0, 0.95) 100%
        );

    animation: freezeFlash 0.35s infinite alternate;
}

.freeze-effect[hidden] {
    display: none;
}

/* 放射状の光 */

.freeze-rays {
    position: absolute;
    inset: -50%;

    background:
        repeating-conic-gradient(
            from 0deg,
            rgba(255, 255, 255, 0.00) 0deg,
            rgba(255, 255, 255, 0.20) 4deg,
            rgba(255, 255, 255, 0.00) 8deg
        );

    animation: freezeRotate 3s linear infinite;
}


/* FREEZE文字 */

.freeze-text {
    position: relative;
    z-index: 2;

    font-size: clamp(64px, 15vw, 220px);
    font-weight: 900;
    letter-spacing: 0.08em;

    color: white;

    text-shadow:
        0 0 10px white,
        0 0 30px white,
        0 0 60px white,
        0 0 100px white;

    animation: freezeText 0.5s infinite alternate;
}


/* 黒 ⇔ 白のフラッシュ */

@keyframes freezeFlash {

    from {
        background-color: rgba(0, 0, 0, 0.95);
        filter: brightness(0.7);
    }

    to {
        background-color: rgba(255, 255, 255, 0.90);
        filter: brightness(1.5);
    }
}


/* 光を回転 */

@keyframes freezeRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


/* FREEZE文字を明滅 */

@keyframes freezeText {

    from {
        transform: scale(0.95);
        opacity: 0.65;
    }

    to {
        transform: scale(1.05);
        opacity: 1;
    }
}


/* ========================================
   WIN EFFECT
   ======================================== */

.win-effect {
    position: fixed;
    inset: 0;
    z-index: 9998;

    display: flex;
    align-items: center;
    justify-content: center;

    background:
        radial-gradient(
            circle at center,
            rgba(255, 255, 255, 0.65) 0%,
            rgba(255, 255, 255, 0.20) 30%,
            rgba(255, 255, 255, 0.00) 65%
        );

    animation: winFlash 0.25s alternate 3;
}

.win-effect[hidden] {
    display: none;
}

.chance-effect {
    position: fixed;
    inset: 0;
    z-index: 10002;
    display: grid;
    place-items: center;
    background: rgba(0, 0, 0, .68);
}
.chance-effect[hidden] { display: none; }
#game .chance-effect button {
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    animation: chance-button-pulse .55s ease-in-out infinite alternate;
}
#game .chance-effect button:hover { border: 0; background: transparent; }
#game .chance-effect button:disabled { cursor: wait; opacity: .82; }
.chance-effect img { display: block; width: min(76vw, 420px); height: auto; filter: drop-shadow(0 0 12px #f7d928) drop-shadow(0 0 30px #e13b11); }
#game .chance-effect button.pressed { animation: none; transform: translateY(18px) scale(.96); filter: brightness(.72); transition: transform .18s ease-in, filter .18s ease-in; }
@keyframes chance-button-pulse { from { transform: translateY(0) scale(1); } to { transform: translateY(-7px) scale(1.035); } }

.win-text {
    font-size: clamp(60px, 12vw, 160px);
    font-weight: 900;
    letter-spacing: 0.08em;

    color: white;

    text-shadow:
        0 0 10px white,
        0 0 30px white,
        0 0 50px white;

    animation: winText 0.5s alternate 2;
}

@keyframes winFlash {

    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }

}

@keyframes winText {

    from {
        transform: scale(0.9);
        opacity: 0.7;
    }

    to {
        transform: scale(1.05);
        opacity: 1;
    }

}
.gogo-lamp.premium-spotlight { position: relative; z-index: 10000; opacity: 0; filter: drop-shadow(0 0 12px #fff) drop-shadow(0 0 34px #5ffbff); animation: gogo-premium-fade 3s 1.05s ease-out forwards; }
.gogo-lamp.premium-center-spotlight { position: relative; z-index: 10000; filter: drop-shadow(0 0 12px #fff) drop-shadow(0 0 34px #5ffbff); transform: scale(1.18); }
@keyframes gogo-premium-fade { from { opacity: 0; transform: scale(.78); } to { opacity: 1; transform: scale(1.18); } }

/* プレミア: 横一閃（プチュン）→完全消灯→激熱。 */
.freeze-effect { overflow: hidden; background: #000; animation: none; }
.premium-flash { position: absolute; left: -8vw; right: -8vw; top: 50%; height: 3px; opacity: 0; background: #d9c9ff; box-shadow: 0 0 5px #fff, 0 0 16px #8a5cff, 0 0 36px #4826b8; }
.premium-flash::after { content: ''; position: absolute; left: 50%; top: 50%; width: 18px; height: 100px; transform: translate(-50%, -50%); background: #fff; clip-path: polygon(50% 0, 61% 41%, 100% 50%, 61% 59%, 50% 100%, 39% 59%, 0 50%, 39% 41%); filter: drop-shadow(0 0 12px #b67cff); }
.premium-cracks { position: absolute; inset: 0; opacity: 0; background: linear-gradient(18deg, transparent 47%, rgba(235,245,255,.9) 48%, transparent 48.6%) 11% 14%/61% 2px no-repeat, linear-gradient(132deg, transparent 48%, rgba(235,245,255,.9) 49%, transparent 49.7%) 83% 16%/58% 2px no-repeat, linear-gradient(68deg, transparent 48%, rgba(235,245,255,.85) 49%, transparent 49.6%) 18% 79%/68% 2px no-repeat, linear-gradient(154deg, transparent 48%, rgba(235,245,255,.85) 49%, transparent 49.6%) 78% 74%/70% 2px no-repeat; filter: drop-shadow(0 0 6px #c4edff); transform: scale(.5); }
.premium-copy { position: relative; z-index: 2; text-align: center; opacity: 0; }
.freeze-effect .freeze-text { margin: 0; opacity: 1; transform: scale(.65); color: #ffe262; font: 900 clamp(82px, 17vw, 240px)/.92 "Yu Mincho", "Hiragino Mincho ProN", serif; letter-spacing: .13em; text-shadow: 0 2px 0 #a90b00, 0 0 7px #fff5b2, 0 0 19px #ffcb22, 0 0 40px #f04400, 0 0 82px #a40000; -webkit-text-stroke: 1px #ff9b08; animation: none; }
.premium-sub { margin: 6px 0 0; color: #ffe8a2; font: 900 clamp(16px, 3.2vw, 42px)/1 Impact, sans-serif; letter-spacing: .12em; text-shadow: 0 0 14px #ff5b00; opacity: 0; transform: translateY(16px); }
.freeze-effect.pachun .premium-flash { animation: pachun-flash .32s ease-out forwards; }
.freeze-effect.center-cherry .premium-flash, .freeze-effect.center-cherry .premium-cracks, .freeze-effect.center-cherry .freeze-text { display: none; }
.freeze-effect.center-cherry.reveal { background: rgba(0, 0, 0, .94); }
.freeze-effect.center-cherry .premium-copy { position: absolute; inset: auto 0 14%; }
.freeze-effect.center-cherry .premium-sub { color: #d9fbff; font-size: clamp(22px, 5vw, 62px); text-shadow: 0 0 8px #fff, 0 0 22px #00d5ff, 0 0 52px #0879ff; }
.freeze-effect.reveal { background: #000; }
.freeze-effect.reveal .premium-copy { animation: premium-copy-in .28s ease-out forwards; }
.freeze-effect.reveal .freeze-text { animation: premium-hot .58s cubic-bezier(.18,.85,.22,1.25) forwards; }
.freeze-effect.reveal .premium-sub { animation: premium-sub-in .42s .48s ease-out forwards; }
@keyframes pachun-flash { 0% { opacity: 0; transform: scaleX(.05); } 28% { opacity: 1; transform: scaleX(1); } 68% { opacity: .8; transform: scaleX(1.15); } 100% { opacity: 0; transform: scaleX(1.28); } }
@keyframes premium-copy-in { to { opacity: 1; } }
@keyframes premium-hot { 0% { transform: scale(.65); filter: brightness(2.5); } 62% { transform: scale(1.15); filter: brightness(1.4); } 100% { transform: scale(1); filter: brightness(1); } }
@keyframes premium-sub-in { to { opacity: 1; transform: translateY(0); } }
@keyframes glass-break { 0% { opacity: 0; transform: scale(.42); filter: brightness(3); } 35% { opacity: 1; transform: scale(1.08); } 100% { opacity: .7; transform: scale(1); } }

.reel span.reel-spinning {
    display: inline-block;
    animation: reelSpinBlur 0.05s linear infinite;
    filter: blur(0.7px);
}

@keyframes reelSpinBlur {
    from { transform: translateY(-5px); }
    to { transform: translateY(5px); }
}

.bonus-indicator-wrap {
    max-width: 640px;
    margin: 28px auto 0;
    border: 1px solid #555;
    background: #111;
    padding: 10px;
}

.machine-record {
    margin: 12px auto 0;
    max-width: 640px;
    color: #d8e9ff;
    text-align: center;
    font-size: 0.9rem;
}

.bonus-indicator-wrap h3 { margin: 0 0 8px; font-size: 0.95rem; }
.bonus-indicator { display: grid; gap: 14px; }
.bonus-day h4, .slump-day h4 { margin: 0 0 5px; color: #aab3c0; font-size: 0.75rem; }
.bonus-history-track { position: relative; display: flex; min-height: 168px; align-items: end; border-top: 1px solid #444; }
.bonus-column { position: relative; z-index: 1; flex: 1; min-width: 0; display: grid; grid-template-rows: 20px 110px 20px 20px; text-align: center; border-left: 1px solid #444; }
.bonus-chain { color: #d8e9ff; font-size: 0.75rem; display: flex; min-width: 0; flex-direction: column; align-items: center; line-height: 1; }
.bonus-chain-arrow { position: absolute; z-index: 2; top: 18px; height: 4px; background: #4f8cff; box-shadow: 0 0 5px #2776d2; pointer-events: none; }
.bonus-chain-arrow::after { content: ''; position: absolute; top: -2px; left: -6px; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-right: 6px solid #4f8cff; }
.bonus-gauge { display: flex; flex-direction: column-reverse; justify-content: flex-start; gap: 1px; padding: 0 5px; }
.bonus-gauge i { display: block; height: 10px; background: #2776d2; }
.bonus-games { font-size: 0.72rem; border-top: 1px solid #444; padding-top: 3px; }
.bonus-type { font-size: 0.68rem; padding-top: 3px; color: #fff; }
.bonus-type.big { color: #ff4c4c; }.bonus-type.reg { color: #4f8cff; }.bonus-type.freeze { color: #ffe74f; }
.bonus-type.gg { color: #ff7b51; }.bonus-type.god { color: #ffd84a; }.bonus-type.hadessymbol { color: #ff6670; }.bonus-type.purple7 { color: #cf75ff; }
.machine-card.hades-card { border-color: #7c6220; background: linear-gradient(145deg,#16120a,#101010); }
.machine-card.hades-card .machine-card-title { color: #ffd56a; }
.bonus-column.current { background: #151d29; }
.bonus-column.current .bonus-gauge i { background: #5d9eff; }
.bonus-type.now { color: #d8e9ff; }
.bonus-column.day-end { background:#171717; }
.bonus-column.day-end .bonus-gauge i { background:#737373; }
.bonus-type.day-end, .bonus-column.day-end .bonus-chain { color:#a5a5a5; }

.slump-graph-wrap {
    max-width: 640px;
    margin: 18px auto 0;
    border: 1px solid #555;
    background: #111;
    padding: 10px;
}
.slump-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.slump-heading h3 { margin: 0 0 8px; font-size: 0.95rem; }
.slump-heading > div { display: flex; align-items: center; gap: 8px; }
#toggle-past-slump { padding: 4px 7px; border: 1px solid #555; background: #1b1b1b; color: #d8e9ff; font-size: 0.75rem; cursor: pointer; }
#toggle-past-slump[aria-pressed="true"] { background: #2869ae; border-color: #6baeff; color: #fff; }
.slump-day + .slump-day { margin-top: 18px; }
#slump-net { font-size: 0.85rem; }
#slump-net.positive { color: #75aaff; } #slump-net.negative { color: #ff7a7a; }
.slump-graph { display: block; width: 100%; height: auto; background: #090909; overflow: visible; }
.slump-bg { fill: #101010; }
.slump-grid { stroke: #333; stroke-width: 1; }
.slump-zero { stroke: #777; stroke-width: 1; }
.slump-label { fill: #bfc6d2; font-size: 11px; }
.slump-line { fill: none; stroke: #3285e6; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.slump-day-divider { stroke: #8a8f9b; stroke-width: 1; stroke-dasharray: 4 3; }
.slump-day-label { fill: #d8e9ff; font-size: 11px; }

#auto-spin.active, #auto-watch.active { background: #2869ae; border-color: #6baeff; color: #fff; }

.ranking-body { min-height: 100vh; background: #000; color: #d8e9ff; }
.ranking-page { width: min(92vw, 850px); margin: 0 auto; padding: 36px 0 60px; }
.ranking-header { border-bottom: 1px solid #555; margin-bottom: 22px; }
.ranking-header h1 { margin: 0; font-size: clamp(1.7rem, 5vw, 2.4rem); color: #f7f7f7; }
.ranking-header p { color: #aab3c0; }
.ranking-tabs { display: flex; flex-wrap: wrap; gap: 0; margin-bottom: 20px; }
.ranking-tabs button { min-width: 130px; border: 1px solid #555; background: #151515; color: #d8e9ff; padding: 10px 16px; cursor: pointer; }
.ranking-tabs button.active { background: #2869ae; color: #fff; border-color: #6baeff; }
.ranking-panel { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; }
.ranking-panel[hidden] { display: none; }
.rank-board, .cemetery-list { border: 1px solid #555; background: #111; padding: 14px; }
.rank-board h2, .cemetery-list h2 { margin: 0 0 12px; color: #ffe74f; font-size: 1rem; }
.machine-record-board { grid-column: 1 / -1; }
.rank-board ol { margin: 0; padding: 0; list-style: none; }
.cemetery-list ol { margin: 0; padding-left: 1.5em; }
.rank-board li, .cemetery-list li { position: relative; min-height: 29px; line-height: 1.6; }
.rank-board li:has(.rank-king) { padding-right: 0; }
.rank-king { display: inline-block; width: 25px; height: 25px; margin-left: 6px; vertical-align: middle; object-fit: contain; }
.rank-profile-link { color: #d8e9ff; text-decoration: underline; text-underline-offset: 2px; }
.rank-profile-link:hover { color: #8bbdff; }
.ranking-return { margin-top: 30px; text-align: center; }
.ranking-return a { color: #8bbdff; }

.game-link-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    box-sizing: border-box;
    border: 1px solid #555;
    background: #1b1b1b;
    color: #d8e9ff;
    padding: 8px 16px;
    text-decoration: none;
}
.game-link-button:hover { color: #fff; border-color: #8bbdff; text-decoration: none; }
.summary-page { width: min(92vw, 850px); }
.profile-title { margin: -16px 0 18px; color: #aab3c0; }
.profile-title strong { color: #ffe74f; }
.summary-machine-switch { display:flex; gap:8px; margin:-6px 0 14px; }
.summary-machine-switch button { min-width:112px; padding:8px 14px; border:1px solid #555; background:#151515; color:#aab3c0; cursor:pointer; }
.summary-machine-switch button.active { border-color:#ffe74f; color:#ffe74f; background:#29220b; }
.summary-block { border: 1px solid #555; background: #111; padding: 14px; margin-top: 14px; }
.summary-block h3 { margin: 0 0 12px; color: #ffe74f; font-size: 1rem; }
.summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.summary-grid > div { padding: 8px 10px; border-top: 1px solid #363636; }
.summary-grid dt { color: #aab3c0; font-size: 0.82rem; }
.summary-grid dd { margin: 3px 0 0; color: #eaf3ff; font-size: 1rem; }
.summary-grid .positive, #profit.positive { color: #75aaff; }
.summary-grid .negative, #profit.negative { color: #ff7a7a; }
.parlor-revenue-board ul { list-style:none; margin:0; padding:0; }
.parlor-revenue-board li { display:flex; justify-content:space-between; gap:16px; padding:8px 2px; border-top:1px solid #363636; }
.parlor-revenue-note { margin:-4px 0 8px; color:#9ba5b5; font-size:.78rem; }
.store-profit { color:#8ee59b; font-weight:700; }.store-loss { color:#ff8585; font-weight:700; }
.summary-return { margin: 24px 0 0; text-align: center; }
.inventory { margin: 34px 0 0; border-top: 1px solid #555; padding: 14px 0 0; }
.inventory h2 { margin: 0 0 10px; font-size: .88rem; color: #ffe74f; letter-spacing: .1em; }
#inventory-list { display: flex; flex-wrap: wrap; gap: 8px; }
.inventory-item { display: grid; gap: 3px; min-width: 175px; padding: 8px; border: 1px solid #444; background: #101010; }
.inventory-item strong { color: #eaf3ff; font-size: .88rem; }.inventory-item small { color: #aab3c0; font-size: .72rem; }.inventory-item button { margin-top: 3px; }
.online-players { margin: 28px auto 0; max-width: 640px; border-top: 1px solid #444; padding-top: 14px; }
.online-players h2 { margin: 0 0 10px; font-size: 1rem; color: #d8e9ff; }
#online-player-list { display: grid; gap: 5px; }
.online-player { display: flex; justify-content: space-between; gap: 16px; padding: 8px 10px; border: 1px solid #383838; background: #101010; }
.online-player strong { color: #eaf3ff; }
.online-rank { min-width: 2.2em; color: #d4b86c; font-weight: 700; }
@media (max-width: 520px) { .summary-grid { grid-template-columns: 1fr; } }