

.mh-p3-cover{position:relative}
.mh-p3-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.mh-p3-ringwrap{position:absolute;top:6px;left:6px;filter:drop-shadow(0 1px 3px rgb(0 0 0/.4))}
.mh-p3-ring-bg{fill:none;stroke:rgb(255 255 255/.3);stroke-width:3}
.mh-p3-ring-fg{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset .4s var(--motion-ease-standard,ease)}
.mh-p3-ring-t{font-size:10px;font-weight:700;fill:#fff}
.mh-p3-badge{position:absolute;left:6px;bottom:6px;font-size:9px;font-weight:700;padding:2px 6px;border-radius:999px;background:rgb(0 0 0/.5);color:#fff;letter-spacing:.02em;backdrop-filter:blur(4px)}
.mh-p3-sub{opacity:.85}

.mh-p3-stage{position:fixed;inset:0;z-index:400;pointer-events:none}
.mh-p3-stage[aria-hidden=false]{pointer-events:auto}
body.mh-p3-open{overflow:hidden}
.mh-p3-detail{position:absolute;inset:0;background:var(--theme-bg);opacity:1;transform:translateY(0);transition:opacity var(--motion-duration-normal,.28s) var(--motion-ease-standard,ease),transform var(--motion-duration-normal,.28s) var(--motion-ease-emphasized,ease);overflow:hidden;outline:none}
.mh-p3-detail[data-enter=true]{opacity:0;transform:translateY(14px)}
.mh-p3-detail[data-leave=true]{opacity:0;transform:translateY(10px)}
@media (prefers-reduced-motion:reduce){.mh-p3-detail{transition:opacity .09s linear}.mh-p3-detail[data-enter=true],.mh-p3-detail[data-leave=true]{transform:none}}
.mh-p3-scroll{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}

.mh-p3-chrome{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:8px;padding:calc(env(safe-area-inset-top,0px) + 10px) 12px 10px}
.mh-p3-chrome-spacer{flex:1}
.mh-p3-iconbtn{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgb(0 0 0/.32);color:#fff;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgb(255 255 255/.2);transition:transform .2s cubic-bezier(.34,1.56,.64,1),background .2s}
.mh-p3-iconbtn:active{transform:scale(.88)}
.mh-p3-iconbtn.is-on{color:#ff6b8a}
.mh-p3-iconbtn svg{width:19px;height:19px}

.mh-p3-hero{position:relative;margin-top:-64px;padding:88px 20px 20px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.mh-p3-hero-bgwrap{position:absolute;inset:0;bottom:auto;height:340px;overflow:hidden}
.mh-p3-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(28px) saturate(1.3) brightness(.75);transform:scale(1.25)}
.mh-p3-hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgb(0 0 0/.25) 0%,transparent 30%,var(--theme-bg) 96%)}
.mh-p3-cover-lg{position:relative;width:132px;aspect-ratio:2/3;border-radius:16px;box-shadow:0 14px 34px rgb(0 0 0/.4),0 0 0 1px rgb(255 255 255/.12) inset}
.mh-p3-cover-lg b{font-size:44px}
.mh-p3-hero-meta{position:relative;max-width:480px}
.mh-p3-title{margin:0 0 6px;font-size:22px;font-weight:800;line-height:1.3;color:#fff;text-shadow:0 2px 10px rgb(0 0 0/.5)}
.mh-p3-sub2{margin:0;font-size:13px;color:rgb(255 255 255/.8);text-shadow:0 1px 4px rgb(0 0 0/.5)}

.mh-p3-actrow{display:flex;align-items:center;gap:16px;padding:6px 20px 0;margin-top:-6px}
.mh-p3-actring{display:flex;flex-direction:column;align-items:center;gap:2px;flex:0 0 auto}
.mh-p3-actring-l{font-size:10px;color:var(--theme-text-muted);white-space:nowrap}
.mh-p3-startbtn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px}
.mh-p3-startbtn svg{width:18px;height:18px}

.mh-p3-card2{margin:22px 16px 0;padding:16px;border-radius:18px;background:var(--theme-surface-elevated);border:1px solid var(--theme-border)}
.mh-p3-card2 h3{margin:0 0 10px;font-size:14px;font-weight:700}
.mh-p3-desc{margin:0;font-size:13.5px;line-height:1.7;color:var(--theme-text);white-space:pre-wrap;word-break:auto-phrase;overflow-wrap:anywhere}
.mh-p3-chips{display:flex;flex-wrap:wrap;gap:8px}
.mh-p3-chip{padding:6px 12px;border-radius:999px;font-size:12.5px;background:color-mix(in srgb,var(--color-accent) 14%,transparent);color:var(--theme-text)}
.mh-p3-chip--add{background:transparent;border:1px dashed var(--theme-border);cursor:pointer}

.mh-p3-chhead{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}
.mh-p3-chcount{font-size:12px;color:var(--theme-text-muted)}
.mh-p3-chtools{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.mh-p3-chsearch{flex:1;min-width:100px;padding:8px 12px;border-radius:10px;border:1px solid var(--theme-border);background:var(--theme-surface);color:var(--theme-text);font-size:13px}
.mh-p3-chfilter{padding:8px 10px;border-radius:10px;border:1px solid var(--theme-border);background:var(--theme-surface);color:var(--theme-text);font-size:12.5px}
.mh-p3-chtools .mh-p3-iconbtn{width:34px;height:34px;background:color-mix(in srgb,var(--color-accent) 14%,transparent);color:var(--theme-text)}
.mh-p3-selbtn{padding:7px 14px;font-size:12.5px}
.mh-p3-chlist2{display:flex;flex-direction:column;max-height:520px;overflow-y:auto}
.mh-p3-ch{display:flex;align-items:center;border-bottom:1px solid var(--theme-border)}
.mh-p3-ch:last-child{border-bottom:0}
.mh-p3-ch-cb{width:16px;height:16px;margin:0 6px 0 2px;border-radius:4px;border:2px solid var(--theme-text-muted);flex:0 0 auto}
.mh-p3-ch.is-sel .mh-p3-ch-cb{background:var(--color-accent);border-color:var(--color-accent)}
.mh-p3-ch-main{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:10px;flex:1;padding:11px 4px;cursor:pointer;min-width:0}
.mh-p3-ch-n{font-size:13.5px;font-weight:600;white-space:nowrap}
.mh-p3-ch-t{margin-left:8px;font-size:12.5px;color:var(--theme-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mh-p3-ch.is-read .mh-p3-ch-n{color:var(--theme-text-muted)}
.mh-p3-ch-meta{display:flex;gap:6px;flex:0 0 auto}
.mh-p3-ch-flag{font-size:10px;font-style:normal;padding:2px 7px;border-radius:999px;background:color-mix(in srgb,var(--theme-text) 8%,transparent);color:var(--theme-text-muted)}
.mh-p3-ch-flag--read{background:color-mix(in srgb,var(--color-success) 18%,transparent);color:var(--color-success)}
.mh-p3-ch-flag--bm{color:#f5a623;background:color-mix(in srgb,#f5a623 18%,transparent)}
.mh-p3-bulkbar{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--theme-border);flex-wrap:wrap}
.mh-p3-bulkn{font-size:12px;color:var(--theme-text-muted);margin-right:4px}
.mh-p3-bulkbtn{padding:7px 12px;border-radius:999px;background:color-mix(in srgb,var(--color-accent) 16%,transparent);font-size:12px;color:var(--theme-text)}

.mh-p3-actions2{margin:26px 16px 0}
.mh-p3-pad{height:48px}

@media (min-width:720px){
  .mh-p3-hero{flex-direction:row;text-align:left;align-items:flex-end;padding-top:100px}
  .mh-p3-hero-meta{max-width:none}
}

.mh-p3-card{position:relative;text-align:left}
.mh-p3-card-badges{position:absolute;right:6px;bottom:6px;display:flex;align-items:center;gap:4px;pointer-events:none}
.mh-p3-badge--favorite{left:auto;right:6px;top:6px;bottom:auto;background:rgb(0 0 0/.48);font-size:13px}
.mh-p3-badge--downloaded{background:color-mix(in srgb,var(--color-success) 38%,#000 55%)}
.mh-p3-badge--hidden{background:color-mix(in srgb,var(--color-danger) 38%,#000 55%)}
.mh-p3-card-state{display:block;min-height:14px;font-size:10px;color:var(--theme-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.mh-p3-info-grid{display:grid;grid-template-columns:minmax(72px,.34fr) 1fr;gap:9px 12px}
.mh-p3-info-row{display:contents}
.mh-p3-info-k{font-size:11px;color:var(--theme-text-muted)}
.mh-p3-info-v{font-size:12.5px;min-width:0;overflow-wrap:anywhere}
.mh-p3-source-link{grid-column:2;font-size:12px;color:var(--color-accent);text-decoration:none}
.mh-p3-source-link:hover{text-decoration:underline}
.mh-p3-chapter-nav{display:flex;gap:10px;margin:14px 16px 0}
.mh-p3-navbtn{flex:1}

.mh-p3-actbtns{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0}
.mh-p3-actbtns .mh-p3-startbtn{width:100%}
.mh-p3-startbtn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mh-p3-freshbtn{width:100%;justify-content:center;min-height:40px}
.mh-p3-ch-bar{display:inline-block;width:44px;height:4px;border-radius:2px;background:rgba(255,255,255,.16);overflow:hidden;vertical-align:middle}
.mh-p3-ch-bar>i{display:block;height:100%;background:var(--mh-accent,#5eead4);border-radius:2px}
.mh-p3-card-state{color:var(--mh-accent,#5eead4);font-size:11px;font-weight:600}
.mh-p3-card .mh-p3-cover::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,var(--mh-accent,#5eead4) var(--mh-card-pct,0%),transparent 0);pointer-events:none}
