.comics-grid{grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:30px;max-width:1100px;margin:0 auto;display:grid}.comic-card{cursor:pointer;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);content-visibility:auto;contain-intrinsic-size:auto 420px;background:#fff;margin:0;transition:transform .2s,box-shadow .2s;overflow:hidden}.comic-card:hover{box-shadow:var(--shadow-md);transform:translateY(-5px)}.cc-cover{aspect-ratio:3/4;background:var(--bg-soft);position:relative;overflow:hidden}.cc-cover img{object-fit:cover;width:100%;height:100%;transition:transform .5s}.comic-card:hover .cc-cover img{transform:scale(1.04)}.cc-pages{color:#fff;border-radius:var(--r-pill);background:#1f2c3899;padding:4px 10px;font-size:12px;font-weight:700;position:absolute;top:10px;right:10px}.cc-hover{opacity:0;background:#2f8fdb2e;place-items:center;transition:opacity .2s;display:grid;position:absolute;inset:0}.comic-card:hover .cc-hover{opacity:1}.cc-body{padding:16px 18px 20px}.cc-tags{gap:7px;margin-bottom:10px;display:flex}.cc-title{letter-spacing:-.01em;margin:0;font-size:19px;font-weight:800}.cc-meta{color:var(--ink3);margin:5px 0 0;font-size:13px}.cc-desc{color:var(--ink2);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:11px 0 0;font-size:14px;line-height:1.65;display:-webkit-box;overflow:hidden}.viewer{z-index:9999;color:#fff;touch-action:none;-webkit-user-select:none;user-select:none;background:#16222e;animation:.22s lbFade;position:fixed;inset:0;overflow:hidden}.viewer:focus{outline:none}.viewer-stage{top:calc(env(safe-area-inset-top,0px) + 6px);right:calc(env(safe-area-inset-right,0px) + 6px);bottom:calc(env(safe-area-inset-bottom,0px) + 6px);left:calc(env(safe-area-inset-left,0px) + 6px);cursor:pointer;position:absolute}.vlayer{opacity:0;transition:opacity .22s;position:absolute;inset:0}.vlayer.on{opacity:1}.vlayer.out{opacity:0;pointer-events:none}.vpg{object-fit:contain;border-radius:var(--r-xs);background:#fff;width:auto;max-width:100%;height:auto;max-height:100%;display:block;box-shadow:0 20px 60px #00000080}.vlayer.two .vpg{border-radius:0;max-width:50%}.vlayer.two .vpg:first-child{border-radius:var(--r-xs) 0 0 var(--r-xs)}.vlayer.two .vpg:last-child{border-radius:0 var(--r-xs) var(--r-xs) 0;box-shadow:0 20px 60px #00000080,-1px 0 #0000002e}.viewer-top,.viewer-foot{z-index:5;transition:opacity .25s,transform .25s;position:absolute;left:0;right:0}.viewer-top{padding:calc(env(safe-area-inset-top,0px) + 12px) calc(env(safe-area-inset-right,0px) + 20px) 14px calc(env(safe-area-inset-left,0px) + 20px);background:linear-gradient(#16222eeb,#16222e99 70%,#16222e00);justify-content:space-between;align-items:center;gap:16px;display:flex;top:0}.viewer-foot{padding:18px calc(env(safe-area-inset-right,0px) + 20px) calc(env(safe-area-inset-bottom,0px) + 14px) calc(env(safe-area-inset-left,0px) + 20px);background:linear-gradient(#16222e00,#16222e99 30%,#16222eeb);flex-direction:column;align-items:center;gap:10px;display:flex;bottom:0}.viewer.ui-off .viewer-top{opacity:0;pointer-events:none;transform:translateY(-10px)}.viewer.ui-off .viewer-foot{opacity:0;pointer-events:none;transform:translateY(10px)}.viewer.ui-off .vnav{opacity:0;pointer-events:none}.viewer.ui-off .viewer-stage{cursor:none}.vt-title{flex-direction:column;min-width:0;display:flex}.vt-title b{white-space:nowrap;text-overflow:ellipsis;font-size:16px;font-weight:700;overflow:hidden}.vt-title span{color:#ffffff80;font-size:12px}.vt-counter{color:#fff;white-space:nowrap;margin-left:auto;margin-right:8px;font-size:15px;font-weight:700}.vt-counter i{color:#fff6;margin:0 3px;font-style:normal}.vnav{z-index:4;border-radius:var(--r-pill);cursor:pointer;width:52px;height:52px;color:var(--ink);background:#ffffffeb;border:none;place-items:center;transition:transform .15s,opacity .25s;display:grid;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 4px 16px #0000004d}.vnav:hover:not(:disabled){transform:translateY(-50%)scale(1.08)}.vnav:disabled{opacity:.3;cursor:default}.vnav-l{left:calc(env(safe-area-inset-left,0px) + 16px)}.vnav-r{right:calc(env(safe-area-inset-right,0px) + 16px)}.vbar{align-items:center;gap:3px;width:min(560px,100%);height:18px;display:flex}.vseg{border-radius:var(--r-pill);cursor:pointer;background:#ffffff38;border:none;flex:1;min-width:0;height:4px;padding:0;transition:background .15s,transform .15s}.vseg.past{background:#ffffff73}.vseg.on{background:var(--blue);transform:scaleY(1.6)}.vseg:hover{background:#ffffffb3}.vhint{color:#ffffff73;text-align:center;font-size:13px}@media (max-width:600px){.vnav,.vhint{display:none}.viewer-top{padding-left:calc(env(safe-area-inset-left,0px) + 14px);padding-right:calc(env(safe-area-inset-right,0px) + 12px);gap:10px}.vt-title span{display:none}}@media (hover:none){.viewer.ui-off .viewer-stage{cursor:default}}
