:root{--accent:#f57990;--surface:#1e1e22;--border:#34343b;--foreground:#f1f0f3;--secondary-text:#b5b4bf}
.brand-image{width:228px;height:48px;display:block;object-fit:contain}.app-head{height:88px;gap:32px}.app-head .brand{min-width:228px}.app-head .head-search{min-width:170px}.home{padding-top:24px}.home-topline{display:flex;align-items:center;justify-content:space-between;margin:0 0 16px}.home-topline p{margin:0;color:var(--secondary-text);font-size:14px}.home-topline p b{color:var(--accent);margin-right:10px}.home-topline a{font-size:14px;color:var(--secondary-text);min-height:44px;display:flex;align-items:center}.feature{min-height:440px;margin:0 -24px 22px}.feature-copy{padding:40px 44px;max-width:580px}.feature-copy h1{font-size:20px;margin:0 0 28px;font-weight:600;color:var(--secondary-text)}.feature-copy h2{font-size:42px}.feature-copy .eyebrow{color:var(--accent);font-size:14px}.feature-copy>p:not(.eyebrow){max-width:420px;line-height:1.8}.feature-tags{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.feature-tags span{font-size:13px;padding:3px 10px;background:#141416bb;border:1px solid #ffffff30;border-radius:4px}.feature-actions{display:flex;gap:10px;align-items:center}.feature-actions a{min-height:48px;display:inline-flex;align-items:center;padding:10px 20px;border-radius:6px}.feature-actions .secondary{background:#14141688;border:1px solid #ffffff40}.feature-actions svg{width:20px;height:20px;margin-right:8px;fill:none;stroke:currentColor;stroke-width:2}.feature-bottom{color:var(--secondary-text);font-size:13px;margin-top:14px}.home-categories{margin-bottom:16px}.shelf-title{margin-top:30px}.shelf-title>div p{font-size:14px;color:var(--secondary-text);margin:3px 0 0}.shelf-title h2{font-size:24px;line-height:1.5}.home-cover{border-radius:6px}.home-cover .card-status{top:10px;bottom:auto;left:10px;background:var(--accent);color:#24131a;font-weight:600}.home-card h3{font-size:17px}.home-card p{font-size:14px}.card-detail{display:flex;justify-content:space-between;align-items:center;margin-top:8px;border-top:1px solid var(--border);padding-top:8px;color:var(--secondary-text);font-size:13px}.card-detail b{color:var(--accent);font-weight:500}.home-bottom{grid-template-columns:minmax(0,1fr) 320px;gap:36px;padding-top:12px}.latest-row{padding:18px 0}.latest-row img{width:76px;height:104px}.latest-row h3{font-size:17px}.latest-row .chapter-links{display:flex;gap:8px;flex-wrap:wrap}.chapter-links span{font-size:13px;color:var(--foreground);background:var(--surface);padding:4px 10px;border-radius:4px}.ranking li a{gap:14px;padding:14px 0}.ranking li img{width:48px;height:66px;object-fit:cover;border-radius:4px}.ranking b{font-size:22px;width:28px}.ranking span{flex:1}.rank-period{display:flex;gap:6px;margin:0 0 8px}.rank-period button{padding:8px 16px;border:1px solid var(--border);border-radius:4px;background:var(--surface);color:var(--secondary-text);font-size:14px}.rank-period button.selected{border-color:var(--accent);color:var(--accent)}.discovery{border-top:1px solid var(--border);margin-top:40px;padding-top:12px}.discovery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.discovery-item{display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--border);padding:18px 0}.discovery-item img{width:76px;height:104px;object-fit:cover;border-radius:4px}.discovery-item h3{font-size:17px;margin:0}.discovery-item p{font-size:14px;margin:4px 0;color:var(--secondary-text)}.discovery-item small{color:var(--accent);font-size:13px}.genre-directory{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 28px}.genre-directory a{display:flex;justify-content:space-between;align-items:center;min-height:58px;border-bottom:1px solid var(--border);font-size:16px}.genre-directory small{color:var(--secondary-text);font-size:14px}.home-footer{align-items:flex-start;flex-wrap:wrap;gap:24px}.home-footer .footer-links{display:flex;gap:24px;flex-wrap:wrap;align-items:center}.footer-links a{min-height:44px;display:flex;align-items:center;color:var(--secondary-text);font-size:14px}.footer-bottom{width:100%;padding-top:18px;border-top:1px solid var(--border);display:flex;justify-content:space-between}.footer-bottom p{margin:0}.resume-band{display:flex;align-items:center;gap:18px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:20px 0;margin:22px 0}.resume-band img{width:52px;height:72px;object-fit:cover;border-radius:4px}.resume-band div{flex:1}.resume-band p{margin:0;font-size:14px;color:var(--secondary-text)}.resume-band h3{margin:4px 0;font-size:17px}.resume-band>a{background:var(--surface);border:1px solid var(--border);padding:10px 20px;border-radius:4px;white-space:nowrap}.resume-band[hidden]{display:none}
@media(max-width:1000px){.app-head{gap:20px}.app-head .brand{min-width:190px}.brand-image{width:190px}.app-head .head-search{min-width:44px}.home-bottom{grid-template-columns:minmax(0,1fr) 270px}.discovery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.genre-directory{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.app-head{height:auto;padding:12px 16px}.app-head .brand{min-width:0}.brand-image{width:200px;height:46px}.app-head .head-search{min-width:44px}.home-topline{margin-bottom:8px}.home-topline p{font-size:13px}.home-topline a{font-size:13px}.feature{margin:0 -16px 20px;min-height:420px}.feature-copy{padding:28px 24px 24px}.feature-copy h1{font-size:18px;margin-bottom:22px}.feature-copy h2{font-size:32px}.feature-copy p{font-size:16px}.feature-tags span{font-size:13px}.feature-actions a{padding:10px 16px;font-size:16px}.feature-bottom{font-size:13px}.home-grid{gap:24px 16px}.home-card h3{font-size:16px}.home-card p{font-size:14px}.card-detail{font-size:13px}.home-bottom{grid-template-columns:1fr;gap:16px}.latest-row img{width:66px;height:92px}.latest-row{gap:12px}.latest-row time{max-width:52px;font-size:12px;text-align:right}.latest-row h3{font-size:16px}.discovery-grid{grid-template-columns:1fr}.genre-directory{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}.shelf-title{gap:10px}.shelf-title h2{font-size:22px}.shelf-title>div p{font-size:14px}.home-footer .brand-image{width:210px}.footer-bottom{display:block}.footer-bottom p{margin-bottom:8px}.resume-band{gap:12px}.resume-band>a{padding:10px 12px}.ranking span{font-size:16px}}
