html, body {margin: 0;padding: 0;height: 100%;background-color: #000;font-family: 'Noto Sans JP', sans-serif;color: #fff;touch-action: pan-y;-webkit-user-select: none;overscroll-behavior: none;}
body * {box-sizing: border-box;}
.swiper {width: 100%;height: 100vh;}
.swiper-slide {display: flex;justify-content: center;align-items: center;position: relative;background: #000;}
video {width: 100%;height: 100%;object-fit: cover;background: #000;}
.swiper-slide:not(.youtube) {height: 100svh !important;}
.video-info { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(to top, rgba(0,0,0,0.7) 5%, transparent); padding:25px 15px; border-radius:8px 8px 0 0; font-size:16px; line-height:1.3; z-index:10; }
.play-overlay { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:70px; color:white; text-shadow:0 0 8px rgba(0,0,0,0.7); cursor:pointer; pointer-events:auto; z-index:20; user-select:none; transition:opacity 0.5s ease; }
.play-overlay.ui-hidden { opacity:0; pointer-events:none; }
.back-button { position:absolute; top:15px; left:15px; font-size:32px; color:white; text-decoration:none; padding:5px 10px; border-radius:8px; z-index:999; }
.gift-button, .volume-button, .list-button, .prev-button, .next-button { position:absolute; bottom:130px; right:10px; z-index:30; padding:8px 12px; border-radius:8px; font-size:20px; cursor:pointer; }
.list-button { right:7px; bottom:205px; }
.volume-button { right:0; bottom:285px; }
.prev-button { right:7px; bottom:445px; font-size:40px; z-index:999; }
.next-button { right:6px; bottom:365px; font-size:40px; z-index:999; }
.gift-button i, .volume-button i { color:#fff; font-size:2rem; }
.list-button i { font-size:2.5rem; }
.volume-button i { font-size:2.8rem; }
.back-button, .volume-button, .gift-button, .play-overlay { outline:none; user-select:none; -webkit-tap-highlight-color:transparent; }
.back-button:focus, .back-button:active, .volume-button:focus, .volume-button:active, .gift-button:focus, .gift-button:active, .play-overlay:focus, .play-overlay:active { background-color:transparent !important; outline:none !important; box-shadow:none !important; }
.modal-slideup { position:fixed; bottom:-500px; left:0; right:0; height:500px; background:#000; padding:20px; border-top-left-radius:12px; border-top-right-radius:12px; transition:bottom .3s ease; z-index:50; box-sizing:border-box; }
.modal-slideup.show { bottom:0; }
.gift-modal { overflow:auto; }
.coins-held { padding:10px 0; color:#fff; text-align:center; border-bottom:1px solid #fff; }
.gift-items { display:flex; justify-content:flex-start; flex-wrap:wrap; gap:15px; padding-top:25px; }
.gift-item { width:calc((100% - 30px) / 3); padding:0 15px; text-align:center; cursor:pointer; }
.gift-item img { width:100%; height:auto; }
.gift-item div { font-size:0.8rem; }
.gift-item div span { font-size:0.6rem; margin-left:3px; }
.gift-to { display:flex; gap:20px; margin-top:25px; }
.gift-to a { display:block; width:calc((100% - 20px) / 2); padding:10px; color:#fff; text-align:center; text-decoration:none; background-color:#df2080; border:1px solid #df2080; border-radius:5px; }
.gift-to a.active { background-color:#fff; color:#000; font-weight:bold; }
.player-item.selected { background-color:rgba(255,255,255,0.2); }
.player-item-wrapper { padding:10px; margin-top:25px; background-color:rgba(255,255,255,0.1); }
.player-item-wrapper .player-item { padding:5px; }
.series-info { padding:0 0 20px; }
.series-info > div .series-description { margin-top:10px; }
.series-info > div:not(.series-description) { display:flex; align-items:center; gap:20px; margin-bottom:15px; }
.series-thumbnail { width:70px; }
.series-thumbnail img { width:100%; }
.episode-list-items { display:flex; flex-wrap:wrap; gap:10px; padding:15px 0; border-top:1px solid #fff; }
.episode-list-item { display:flex; justify-content:center; align-items:center; width:calc((100% - 40px) / 5); height:60px; font-size:1.2rem; background-color:#7d1247; border-radius:5px; }
.episode-list-item.active { background-color:#df2080; }
.gift-close, .episode-list-close { display:block; margin-left:auto; background-color:transparent; border:0; }
.gift-close i, .episode-list-close i { color:#fff; font-size:2rem; }
.gift-confirm-modal { width:100%; max-width:400px; padding:30px 20px; border-radius:5px; background-color:#000; }
.gift-confirm-modal .modal-header { text-align:center; }
.gift-confirm-modal .modal-header p:nth-child(1) { font-size:1.4rem; font-weight:bold; margin:0 0 5px; background:linear-gradient(90deg, #ff4d88, #ffb347); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; color:transparent; }
.gift-confirm-modal .modal-header p:nth-child(2) { font-size:0.8rem; margin:0; }
.gift-confirm-modal .neon-line { margin:20px 0; height:2px; background:linear-gradient(to right, transparent, #fcfdb3, transparent); }
.gift-confirm-modal .modal-content { background-color:transparent; padding:0; }
.gift-confirm-modal .modal-content div img { width:120px; }
.gift-confirm-modal .modal-footer .coin-math { display:flex; justify-content:space-between; }
.gift-confirm-modal .modal-footer .coin-math p { margin-top:0; font-size:0.9rem; padding:0 10px; }
.gift-confirm-modal .modal-footer .coin-math p span { font-weight:bold; background:linear-gradient(#ffb347, #fff); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; color:transparent; }
.gift-confirm-modal .modal-footer .btn-wrap { display:flex; gap:30px; margin-top:10px; padding:0 10px; }
.gift-confirm-modal .modal-footer .btn-wrap button { flex:1; padding:8px 5px; border-radius:999px; border:0; cursor:pointer; }
.gift-confirm-modal .modal-footer .btn-wrap button:nth-child(1) { background-color:#EB0268; color:#fff; }
.gift-confirm-modal .modal-footer .btn-wrap a { background-color:#EB0268; color:#fff; text-decoration:none; padding:8px; display:block; width:100%; border-radius:999px; text-align:center; }
.modal-musk { position:fixed; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,0.5); z-index:999; }
.success-modal { width:100%; max-width:400px; padding:30px 20px; border-radius:5px; background-color:#000; }
.success-modal button { width:100%; padding:8px 5px; border-radius:999px; border:0; cursor:pointer; }
.ui-elements { transition:opacity .5s ease; }
.ui-hidden { opacity:0 !important; pointer-events:none; }
.video-progress-container { position:absolute; bottom:0; left:0; height:4px; width:100%; background-color:rgba(255,255,255,0.2); z-index:10; }
.video-progress-bar { position:relative; height:100%; width:0%; background-color:#ff3366; transition:width .05s linear; }
.video-progress-handle { position:absolute; top:50%; padding:20px; transform:translate(-50%, -50%); z-index:11; cursor:pointer; }
.video-progress-handle .circle { width:12px; height:12px; border-radius:50%; background-color:#fff; }
.modal { position:fixed; top:50%; left:50%; width:80%; justify-content:center; z-index:1000; transform:translate(-50%, -50%); }
.modal-content { background-color:rgba(0,0,0,0.7); padding:20px 30px 35px; border-radius:8px; max-height:90%; box-shadow:0 0 10px rgba(0,0,0,0.25); text-align:center; }
.premium-overlay { position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.6); display:none; justify-content:center; align-items:center; text-align:center; color:white; font-size:1.2rem; z-index:600; }
.premium-message a { display:flex; flex-direction:column; align-items:center; font-size:1rem; color:#fff; text-decoration:none; }
.premium-overlay .premium-message img { width:50px; }
.premium-message i { font-size:1.5rem; margin-bottom:0.5rem; }
.premium-link { display:flex; flex-direction:column; justify-content:center; align-items:center; }
.premium-link span { font-size:1rem; }
.premium-link a { margin-top:20px; padding:15px 60px; background-color:#EB0268; border-radius:5px; }
.coin-link { display:flex; flex-direction:column; justify-content:center; align-items:center; }
.coin-link span { font-size:1rem; }
.coin-link button { margin-top:20px; padding:15px 60px; background-color:#EB0268; border-radius:5px; border:0; color:#fff; cursor:pointer; font-size:1rem; }
.episode-list-modal { overflow:auto; }
.players-list-items { padding:15px 0; border-top:1px solid #fff; }
.player-item { display:flex; align-items:center; gap:15px; padding:10px 0; }
.player-item > div:nth-child(2) { flex:1; }
.player-item .gift-list { display:flex; flex:auto !important; width:100px; }
.player-item .gift-list .gift-item { display:flex; align-items:center; }
.player-item .gift-list .gift-item img { width:50px; height:auto; }
.player-item .thumb-bg { width:50px; height:50px; border-radius:50%; background-size:cover; background-position:center; }
.player-item .thumb-bg.no-image { display:flex; justify-content:center; align-items:center; color:#000; font-size:0.6rem; background-color:#fff; }
.player-item > div:last-child { flex:1; }
.player-item > div img { width:100%; }
.youtube-iframe-wrapper { position:fixed; top:0; left:0; width:100vw; height:100vh; overflow:hidden; background:black; z-index:1; }
.youtube-iframe-wrapper iframe { position:absolute; top:50%; left:50%; width:100vw; height:100vh; transform:translate(-50%, -50%); object-fit:cover; border:none; }
.swiper, .swiper-slide { height:100dvh !important; }
body { display:flex; justify-content:center; align-items:center; }
.swiper-box { aspect-ratio:1080 / 1920; height:100%; }
.loading-overlay {position: fixed;inset: 0;background: rgba(0, 0, 0, 0.6);z-index: 9999;display: flex;align-items: center;justify-content: center;}
.spinner {width: 64px;height: 64px;border: 6px solid rgba(255, 255, 255, 0.2);border-top-color: #ff4ecd; /* おしパラっぽい色に */border-radius: 50%;animation: spin 1s linear infinite;}
@keyframes spin {to {transform: rotate(360deg);}}