/* ══════════════════════════════════════════
   EROGE RANKING TIERLIST  ―  #detl-wrap 外部CSS
   detl.css （FTPアップロード用）
   ══════════════════════════════════════════ */
#detl-wrap{font-family:'Noto Sans JP','Hiragino Kaku Gothic Pro',sans-serif;font-size:14px;color:#1a1a2e;-webkit-font-smoothing:antialiased;}
#detl-wrap .detl-hd{background:linear-gradient(135deg,#0a0a2e,#1a1060 50%,#2d1080);padding:14px 18px 10px;border-radius:10px 10px 0 0;}
#detl-wrap .detl-ttl{font-size:1.15rem;font-weight:900;color:#fff;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
#detl-wrap .detl-badge{background:#e8184a;color:#fff;font-size:.56rem;padding:2px 6px;border-radius:3px;font-weight:700;}
#detl-wrap .detl-sub{font-size:.65rem;color:rgba(255,255,255,.6);margin-top:4px;}
#detl-wrap .detl-anim-note{font-size:.62rem;color:#f0d060;margin-top:3px;font-weight:700;}
#detl-wrap .detl-tabs{background:#1a1a3e;border-bottom:2px solid rgba(255,255,255,.1);padding:0 10px;display:flex;gap:2px;flex-wrap:wrap;}
#detl-wrap .detl-tab{font-family:inherit;font-size:.78rem;font-weight:700;color:rgba(255,255,255,.5);background:none;border:none;border-bottom:3px solid transparent;padding:7px 10px;cursor:pointer;}
#detl-wrap .detl-tab:hover{color:#fff;}
#detl-wrap .detl-tab.active{color:#f0a500;border-bottom-color:#f0a500;}
#detl-wrap .detl-fbar{background:#f5f7fa;border:1px solid rgba(21,101,192,.15);border-top:none;padding:10px 12px;}
#detl-wrap .detl-frow{display:flex;align-items:flex-start;gap:8px;margin-bottom:6px;}
#detl-wrap .detl-frow:last-of-type{margin-bottom:0;}
#detl-wrap .detl-flabel{font-size:.9rem;font-weight:800;color:#1565c0;min-width:52px;padding-top:5px;white-space:nowrap;}
#detl-wrap .detl-chips{display:flex;flex-wrap:wrap;gap:4px;}
/* ▼ ボタンサイズを emtl と統一（font .9rem / padding拡大 / radius14） */
#detl-wrap .detl-chip{background:#fff;border:1.5px solid rgba(21,101,192,.25);color:#555;font-size:.9rem;font-weight:700;padding:5px 13px;border-radius:14px;cursor:pointer;font-family:inherit;transition:all .15s;}
#detl-wrap .detl-chip:hover{border-color:#1565c0;color:#1565c0;}
#detl-wrap .detl-chip.on{background:#1565c0;border-color:#1565c0;color:#fff;}
#detl-wrap .detl-chip.new-chip{border-color:rgba(0,144,74,.4);color:#00904a;}
#detl-wrap .detl-chip.new-chip.on{background:#00904a;border-color:#00904a;color:#fff;}
#detl-wrap .detl-chip.anim-chip{border-color:rgba(230,81,0,.4);color:#e65100;}
#detl-wrap .detl-chip.anim-chip.on{background:#e65100;border-color:#e65100;color:#fff;}
#detl-wrap .detl-chip.free-chip{border-color:rgba(106,27,154,.4);color:#6a1b9a;}
#detl-wrap .detl-chip.free-chip.on{background:#6a1b9a;border-color:#6a1b9a;color:#fff;}
#detl-wrap .detl-faction{display:flex;gap:8px;margin-top:8px;justify-content:flex-end;}
#detl-wrap .detl-abtn{font-family:inherit;font-size:.9rem;font-weight:700;padding:6px 18px;border-radius:14px;cursor:pointer;transition:all .15s;}
#detl-wrap .detl-abtn-show{background:#fff;border:2px solid #1565c0;color:#1565c0;}
#detl-wrap .detl-abtn-show:hover{background:#1565c0;color:#fff;}
#detl-wrap .detl-abtn-clr{background:#fff;border:2px solid #aaa;color:#666;}
#detl-wrap .detl-abtn-clr:hover{background:#666;color:#fff;}
#detl-wrap .detl-panels{border:1px solid rgba(21,101,192,.15);border-top:none;}
#detl-wrap .detl-rank-block{border-bottom:1px solid rgba(21,101,192,.1);}
#detl-wrap .detl-rank-block:last-child{border-bottom:none;}
#detl-wrap .detl-rank-hd{display:flex;align-items:center;gap:8px;padding:9px 12px;cursor:pointer;background:rgba(21,101,192,.04);}
#detl-wrap .detl-rank-hd:hover{background:rgba(21,101,192,.09);}
#detl-wrap .detl-rbadge{font-size:.72rem;font-weight:900;color:#fff;padding:2px 8px;border-radius:4px;min-width:48px;text-align:center;}
#detl-wrap .detl-rdesc{font-size:.68rem;color:#666;font-weight:700;flex:1;}
#detl-wrap .detl-rcnt{font-size:.6rem;color:#fff;background:#e8184a;padding:1px 7px;border-radius:10px;font-weight:800;}
#detl-wrap .detl-rtog{font-size:.6rem;color:#aaa;transition:transform .22s;margin-left:4px;}
#detl-wrap .detl-rank-block.collapsed .detl-rtog{transform:rotate(-90deg);}

/* ── GRID: PC=3列 / SP=2列 ── */
#detl-wrap .detl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px 12px 12px;}
#detl-wrap .detl-rank-block.collapsed .detl-grid{display:none;}
@media(max-width:600px){#detl-wrap .detl-grid{grid-template-columns:repeat(2,1fr);gap:6px;padding:8px;}}

#detl-wrap .detl-card{cursor:pointer;border-radius:7px;overflow:hidden;border:2px solid transparent;transition:all .2s;background:#111;position:relative;}
#detl-wrap .detl-card:hover{transform:translateY(-3px);border-color:#ff4d75;box-shadow:0 6px 20px rgba(255,77,117,.3);}
#detl-wrap .detl-card.dim{opacity:.08;pointer-events:none;}

/* ── COVER: 横長 16:9 ── */
#detl-wrap .detl-cover{width:100%;aspect-ratio:16/9;position:relative;overflow:hidden;background:#1a1a2e;}
#detl-wrap .detl-cover img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;opacity:0;transition:opacity .3s;}

#detl-wrap .detl-badges{position:absolute;top:4px;left:4px;display:flex;flex-direction:column;gap:2px;}
#detl-wrap .detl-new{background:#00904a;color:#fff;font-size:.5rem;font-weight:900;padding:2px 6px;border-radius:3px;line-height:1.3;}
#detl-wrap .detl-anim{background:#e65100;color:#fff;font-size:.5rem;font-weight:900;padding:2px 6px;border-radius:3px;line-height:1.3;}
#detl-wrap .detl-free{background:#6a1b9a;color:#fff;font-size:.5rem;font-weight:900;padding:2px 6px;border-radius:3px;line-height:1.3;}
#detl-wrap .detl-gbadge{position:absolute;bottom:5px;left:5px;font-size:.46rem;padding:2px 7px;border-radius:4px;font-weight:800;color:#fff;max-width:55%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
#detl-wrap .detl-gb-love{background:#e91e8c;}
#detl-wrap .detl-gb-fantasy{background:#7b1fa2;}
#detl-wrap .detl-gb-rpg{background:#1565c0;}
#detl-wrap .detl-gb-sim{background:#00796b;}
#detl-wrap .detl-gb-harem{background:#f57c00;}
#detl-wrap .detl-gb-ntr{background:#37474f;}
#detl-wrap .detl-gb-chokyo{background:#c62828;}
#detl-wrap .detl-gb-chikan{background:#4e342e;}
#detl-wrap .detl-gb-nozoki{background:#283593;}
#detl-wrap .detl-gb-hard{background:#111;}
#detl-wrap .detl-gb-adv{background:#558b2f;}
#detl-wrap .detl-gb-action{background:#bf360c;}
#detl-wrap .detl-gb-suimin{background:#311b92;}
#detl-wrap .detl-gb-live{background:#0097a7;}
#detl-wrap .detl-gb-gal{background:#880e4f;}
#detl-wrap .detl-gb-muryou{background:#1b5e20;}
#detl-wrap .detl-ctitle{font-size:clamp(.62rem,1.1vw,.78rem);font-weight:700;line-height:1.45;color:#1a1a2e;padding:5px 7px 6px;background:#fff;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:2.6em;}
#detl-wrap .detl-footer{border:1px solid rgba(21,101,192,.15);border-top:none;background:#f5f7fa;padding:7px 12px;display:flex;align-items:center;justify-content:space-between;border-radius:0 0 10px 10px;}
#detl-wrap .detl-info{font-size:.7rem;color:#666;font-weight:700;}
#detl-wrap .detl-clrbtn{font-family:inherit;font-size:.68rem;font-weight:700;background:none;border:1.5px solid rgba(21,101,192,.3);color:#1565c0;padding:3px 10px;border-radius:7px;cursor:pointer;}
#detl-wrap .detl-clrbtn:hover{background:#1565c0;color:#fff;}
#detl-tooltip{position:fixed;z-index:9999;pointer-events:none;background:#fff;border:1.5px solid rgba(21,101,192,.2);border-radius:8px;width:230px;padding:12px 14px;font-size:.66rem;line-height:1.55;box-shadow:0 4px 20px rgba(21,101,192,.18);opacity:0;transition:opacity .15s;}
#detl-tooltip.show{opacity:1;}
#detl-tooltip .tt-ttl{font-weight:900;font-size:.74rem;margin-bottom:5px;color:#1a1a2e;}
#detl-tooltip .tt-row{color:#555;margin:2px 0;}
#detl-tooltip .tt-price{color:#c62828;font-weight:800;}
#detl-tooltip .tt-tags{display:flex;flex-wrap:wrap;gap:3px;margin-top:5px;}
#detl-tooltip .tt-tag{background:#f0f4f8;border:1px solid rgba(21,101,192,.2);color:#555;font-size:.55rem;padding:1px 5px;border-radius:5px;}
#detl-tooltip .tt-cta{margin-top:6px;color:#1565c0;font-weight:800;font-size:.62rem;}
@keyframes detl-rip{to{transform:translate(-50%,-50%) scale(3.5);opacity:0;}}

/* ── 追従ナビバー（青テーマ・emtlと同寸） ── */
#detl-nav{position:fixed;left:50%;bottom:16px;transform:translateX(-50%) translateY(140%);display:flex;align-items:stretch;gap:2px;background:rgba(26,26,46,.96);border:1px solid rgba(255,255,255,.08);border-radius:30px;padding:5px;box-shadow:0 10px 30px rgba(0,0,0,.4);z-index:9998;transition:transform .32s cubic-bezier(.22,1,.36,1);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-family:'Noto Sans JP','Hiragino Kaku Gothic Pro',sans-serif;}
#detl-nav.show{transform:translateX(-50%) translateY(0);}
#detl-nav button{appearance:none;background:transparent;border:none;cursor:pointer;color:rgba(255,255,255,.82);font-family:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:48px;padding:6px 8px;border-radius:22px;line-height:1;transition:background .18s,color .18s,transform .1s;}
#detl-nav button:hover{background:rgba(255,255,255,.10);color:#fff;}
#detl-nav button:active{transform:scale(.92);}
#detl-nav button:disabled{opacity:.32;cursor:default;}
#detl-nav .nav-ico{font-size:1.05rem;}
#detl-nav .nav-lbl{font-size:.52rem;font-weight:700;letter-spacing:.02em;}
#detl-nav .nav-list{background:#1565c0;color:#fff;}
#detl-nav .nav-list:hover{background:#1c74d8;color:#fff;}
#detl-nav .nav-pos{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:44px;color:#fff;padding:0 4px;}
#detl-nav .nav-pos b{font-size:.78rem;font-weight:800;}
#detl-nav .nav-pos small{font-size:.5rem;opacity:.55;}
@media(max-width:600px){#detl-nav button{min-width:42px;padding:6px 5px;}#detl-nav .nav-ico{font-size:1rem;}}