/* 로로 만화방 / 2026.11.11 - compact webtoon portal layout.
   Two published series only: no fictional ranking, ratings, view counts or placeholders. */
.home-page .featured-area{padding-top:25px}
.home-page .featured-head{margin-bottom:12px}
.home-page .featured-banner{height:262px;border-radius:12px}
.home-page .featured-copy{width:60%;padding:24px 43px}
.home-page .featured-copy h1{font-size:43px;line-height:1.15;letter-spacing:-2px;margin:9px 0}
.home-page .featured-copy p{font-size:13px;line-height:1.5}
.home-page .featured-label{font-size:10px;padding:6px 11px}
.home-page .featured-category{font-size:11px;margin-top:12px}
.home-page .featured-cta{font-size:12px;padding:10px 16px;margin-top:15px}
.home-page .featured-image{width:67%}
.home-comics-layout{padding-top:55px;display:grid;grid-template-columns:minmax(0,1fr) 312px;gap:42px;align-items:start}
.home-comics-layout .catalog-section,
.home-comics-layout .new-episodes{padding-top:0}
.home-comics-layout .section-header{margin-bottom:15px}
.home-comics-layout .section-header h2{font-size:23px;white-space:nowrap}
.home-comics-layout .section-header>p{display:none}
.home-comics-layout .filter-tabs{margin-bottom:19px}
.home-comics-layout .filter-tab{padding:10px 14px 12px;font-size:13px}
.home-comics-layout .catalog-grid{display:flex;gap:19px;align-items:flex-start}
.home-comics-layout .work-card{display:block;flex:0 0 min(47%,250px);width:min(47%,250px);padding:0;border:0;border-radius:0;box-shadow:none;transition:none}
.home-comics-layout .work-card:hover{transform:none;box-shadow:none}
.home-comics-layout .work-cover{display:block;width:100%;height:auto;flex-basis:auto;aspect-ratio:3/4;border-radius:7px;box-shadow:none;background:#e9ebeb}
.home-comics-layout .work-cover:hover img{transform:scale(1.035)}
.home-comics-layout .work-content{padding:11px 2px 0}
.home-comics-layout .work-title{font-size:17px;line-height:1.3;letter-spacing:-.6px}
.home-comics-layout .work-summary{font-size:12px;margin:7px 0 6px;line-height:1.6}
.home-comics-layout .work-meta{font-size:11px}
.home-comics-layout .work-read{font-size:12px;margin-top:12px;display:inline-flex}
.home-comics-layout .work-pill{font-size:10px;padding:6px 8px}
.home-comics-layout .new-episodes{border-left:1px solid #e9ece8;padding-left:26px;margin:0}
.home-comics-layout .new-episodes .section-overline{font-size:10px}
.home-comics-layout .new-episodes .section-header h2{font-size:20px}
.home-comics-layout .episode-grid{display:block}
.home-comics-layout .episode-item{display:flex;padding:13px 0;gap:12px;border:0;border-top:1px solid #ebeeeb;border-radius:0;background:transparent}
.home-comics-layout .episode-item:hover{background:transparent}
.home-comics-layout .episode-image{width:82px;height:76px;flex:0 0 82px;border-radius:5px}
.home-comics-layout .episode-info strong{font-size:14px}
.home-comics-layout .episode-info p{font-size:12px;line-height:1.4}
.home-comics-layout .episode-info small{font-size:11px;margin-top:4px}
.home-comics-layout .episode-chevron{display:none}
.home-page .category-section{padding-top:45px;padding-bottom:73px}
.home-page .category-section .section-header{margin-bottom:14px}
.home-page .category-section .section-header h2{font-size:21px}
.home-page .category-tile{padding:18px 23px}
.home-page .category-tile strong{font-size:17px}
.home-page .category-tile .tile-icon{height:44px;width:44px;flex-basis:44px;font-size:12px}
@media(max-width:980px){
 .home-comics-layout{grid-template-columns:minmax(0,1fr) 265px;gap:25px}
 .home-comics-layout .new-episodes{padding-left:20px}
 .home-comics-layout .work-card{flex-basis:min(46%,220px);width:min(46%,220px)}
}
@media(max-width:760px){
 .home-comics-layout{display:block;padding-top:45px}
 .home-comics-layout .new-episodes{margin-top:45px;border-left:0;border-top:1px solid #e8ece8;padding:31px 0 0}
 .home-comics-layout .catalog-grid{gap:13px;justify-content:space-between}
 .home-comics-layout .work-card{flex-basis:calc((100% - 13px)/2);width:calc((100% - 13px)/2)}
 .home-comics-layout .work-cover{aspect-ratio:3/4.1}
 .home-comics-layout .work-title{font-size:15px}
 .home-comics-layout .new-episodes .episode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .home-comics-layout .episode-item{border:1px solid #e8ece8;border-radius:9px;padding:9px}
 .home-comics-layout .episode-image{width:85px;height:79px;flex-basis:85px}
 .home-page .featured-banner{height:245px}
 .home-page .featured-copy{width:71%;padding:22px}
 .home-page .featured-copy h1{font-size:35px}
 .home-page .featured-image{width:71%}
}
@media(max-width:520px){
 .home-page .featured-banner{height:263px;border-radius:11px;align-items:end}
 .home-page .featured-image{inset:0 0 16% 0;width:100%}
 .home-page .featured-copy{position:relative;z-index:2;width:100%;padding:15px 20px 20px}
 .home-page .featured-banner:after{background:linear-gradient(0deg,rgba(13,50,53,.97) 0%,rgba(13,50,53,.94) 25%,rgba(13,50,53,.52) 52%,transparent 86%)}
 .home-page .featured-copy h1{font-size:31px;margin:7px 0}
 .home-page .featured-copy h1 br{display:none}
 .home-page .featured-copy p{font-size:11px;line-height:1.45}
 .home-page .featured-copy p br{display:none}
 .home-page .featured-category{font-size:10px;margin-top:7px}
 .home-page .featured-cta{padding:8px 12px;font-size:11px;margin-top:11px}
 .home-comics-layout{padding-top:39px}
 .home-comics-layout .section-header h2{font-size:20px}
 .home-comics-layout .work-cover{aspect-ratio:3/4}
 .home-comics-layout .work-card{flex-basis:calc((100% - 14px)/2);width:calc((100% - 14px)/2)}
 .home-comics-layout .work-title{font-size:14px}
 .home-comics-layout .work-summary{font-size:11px}
 .home-comics-layout .work-read{font-size:11px;margin-top:8px}
 .home-comics-layout .new-episodes{margin-top:43px}
 .home-comics-layout .new-episodes .episode-grid{display:block}
 .home-comics-layout .episode-item{border:0;border-top:1px solid #e9ece8;border-radius:0;padding:11px 0}
 .home-comics-layout .episode-image{width:99px;height:78px;flex-basis:99px}
}

/* Prevent category link arrows from escaping the 320px viewport. */
.home-page .category-tile{min-width:0}
.home-page .category-tile>span:nth-child(2){min-width:0}
.home-page .category-tile .tile-arrow{flex:0 0 auto}
@media(max-width:360px){
 .home-page .category-tile{padding:11px 7px;gap:5px}
 .home-page .category-tile .tile-icon{width:29px;height:32px;flex-basis:29px;font-size:10px}
 .home-page .category-tile strong{font-size:12px}
 .home-page .category-tile small{font-size:9px}
 .home-page .category-tile .tile-arrow{font-size:14px;margin-left:auto}
}

/* 2026-11-12: latest registered comic banner, balanced breathing room, catalog only. */
.home-page .featured-area{padding-top:46px}
.home-page .featured-head{margin-bottom:18px}
.home-page .featured-banner{height:340px;min-height:0;border-radius:14px}
.home-page .featured-copy{width:58%;padding:36px 45px}
.home-page .featured-copy h1{font-size:clamp(34px,3.6vw,48px);line-height:1.14;letter-spacing:-2px;margin:12px 0}
.home-page .featured-copy p{font-size:14px;line-height:1.6;max-width:470px}
.home-page .featured-category{margin-top:15px;font-size:13px}
.home-page .featured-label{padding:7px 12px}
.home-page .featured-cta{margin-top:22px;padding:12px 21px}
.home-page .featured-banner.is-roun{background:radial-gradient(ellipse at 76% 25%,#355b92 0%,#213d67 40%,#132b4a 79%),#132b4a}
.home-page .featured-banner.is-roun:before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.55;
  background:radial-gradient(circle at 82% 24%,rgba(122,225,235,.24),transparent 35%),
             repeating-linear-gradient(90deg,rgba(115,202,233,.15) 0 1px,transparent 1px 36px);
  mask-image:linear-gradient(90deg,transparent 34%,#000 94%)
}
.home-page .featured-banner.is-roun:after{background:linear-gradient(90deg,rgba(17,36,63,.98) 0%,rgba(17,36,63,.95) 32%,rgba(17,36,63,.55) 54%,transparent 77%)}
.home-page .featured-banner.is-roun .featured-label{color:#185f59;background:#e4fff5}
.home-page .featured-banner.is-roun .featured-label-dot{background:#39c2a2}
.home-page .featured-banner.is-roun .featured-category{color:#d4e5f3}
.home-page .featured-banner.is-roun .featured-copy p{color:#dbe8f5}
.home-page .featured-banner.is-roun .featured-cta{color:#173e58;background:#e9fff5}
.home-page .featured-banner.is-roun .featured-image{
  top:0;bottom:0;right:2%;width:48%;display:flex;align-items:center;justify-content:center;overflow:visible
}
.home-page .featured-banner.is-roun .featured-image img{
  display:block;width:auto;height:117%;max-width:none;max-height:none;
  border:6px solid rgba(250,251,255,.88);border-radius:12px;
  object-fit:contain;object-position:center;
  box-shadow:0 20px 45px rgba(6,13,42,.4);
  transform:rotate(6deg);
  transition:transform .5s ease;
}
.home-page .featured-banner.is-roun:hover .featured-image img{transform:rotate(4deg) scale(1.025)}
.home-comics-layout{display:block;padding-top:73px;padding-bottom:104px}
.home-comics-layout .catalog-section{width:100%}
.home-comics-layout .catalog-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,255px));
  align-items:start;justify-content:start;gap:27px
}
.home-comics-layout .work-card{width:100%;max-width:none;flex:none}
.home-comics-layout .work-cover{width:100%;aspect-ratio:3/4.05}
.home-comics-layout .catalog-empty{max-width:550px}
@media(max-width:980px){
  .home-page .featured-area{padding-top:40px}
  .home-page .featured-banner{height:320px}
  .home-page .featured-copy{width:61%;padding:31px 31px}
  .home-page .featured-copy h1{font-size:39px}
  .home-page .featured-cta{margin-top:18px}
  .home-comics-layout{padding-top:65px}
}
@media(max-width:760px){
  .home-page .featured-area{padding-top:32px}
  .home-page .featured-banner{height:315px}
  .home-page .featured-copy{padding:28px;width:61%}
  .home-page .featured-copy h1{font-size:35px}
  .home-page .featured-copy p{font-size:13px}
  .home-page .featured-banner.is-roun .featured-image{width:44%;right:0}
  .home-page .featured-banner.is-roun .featured-image img{height:103%}
  .home-comics-layout{padding-top:58px;padding-bottom:83px}
  .home-comics-layout .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}
  .home-comics-layout .work-card{width:100%;max-width:none;flex:none}
}
@media(max-width:520px){
  .home-page .featured-area{padding-top:28px}
  .home-page .featured-head{margin-bottom:15px}
  .home-page .featured-banner{height:370px;border-radius:12px}
  .home-page .featured-copy{width:100%;padding:15px 19px 21px;position:relative}
  .home-page .featured-copy h1{font-size:31px;margin:8px 0;line-height:1.13}
  .home-page .featured-copy p{font-size:11.5px;line-height:1.48;max-width:95%}
  .home-page .featured-category{margin-top:8px;font-size:11px}
  .home-page .featured-label{padding:5px 9px;font-size:10px}
  .home-page .featured-cta{padding:9px 14px;margin-top:12px;font-size:12px}
  .home-page .featured-banner.is-roun:after{background:linear-gradient(0deg,rgba(16,37,66,.99) 0%,rgba(16,37,66,.97) 19%,rgba(16,37,66,.82) 34%,rgba(16,37,66,.20) 72%,transparent 100%)}
  .home-page .featured-banner.is-roun .featured-image{
    position:absolute;inset:0 0 27% 0;width:100%;height:auto;
    display:flex;align-items:flex-start;justify-content:flex-end;padding-right:21px;overflow:hidden;
  }
  .home-page .featured-banner.is-roun .featured-image img{
    height:296px;width:auto;max-height:none;object-fit:contain;
    transform:rotate(8deg) translateY(-18px);border-width:5px;border-radius:9px;
  }
  .home-page .featured-banner.is-roun:hover .featured-image img{transform:rotate(8deg) translateY(-18px)}
  .home-comics-layout{padding-top:50px;padding-bottom:70px}
  .home-comics-layout .catalog-grid{gap:14px}
  .home-comics-layout .work-cover{aspect-ratio:3/4}
}
@media(max-width:360px){
  .home-page .featured-banner{height:374px}
  .home-page .featured-copy h1{font-size:29px}
  .home-page .featured-banner.is-roun .featured-image img{height:270px}
  .home-comics-layout{padding-top:46px;padding-bottom:65px}
}

/* Final optical corrections: keep the title's intentional line break and protect poster margins. */
.home-page .featured-banner.is-roun .featured-image img{height:91%;transform:rotate(5deg)}
.home-page .featured-banner.is-roun:hover .featured-image img{transform:rotate(3deg) scale(1.025)}
@media(max-width:520px){
  .home-page .featured-copy h1 br{display:initial}
  .home-page .featured-banner.is-roun .featured-image img{height:250px;transform:rotate(5deg) translateY(7px)}
  .home-page .featured-banner.is-roun:hover .featured-image img{transform:rotate(5deg) translateY(7px)}
}
@media(max-width:360px){
  .home-page .featured-banner.is-roun .featured-image img{height:224px}
  .home-page .featured-banner.is-roun:hover .featured-image img{transform:rotate(5deg) translateY(7px)}
}

/* Keep the complete newest cover inside the banner with visible top/bottom air. */
.home-page .featured-banner.is-roun .featured-image img{height:85%}
@media(max-width:520px){
  .home-page .featured-banner.is-roun .featured-image img{height:225px;transform:rotate(5deg) translateY(22px)}
  .home-page .featured-banner.is-roun:hover .featured-image img{transform:rotate(5deg) translateY(22px)}
}
@media(max-width:360px){
  .home-page .featured-banner.is-roun .featured-image img{height:205px;transform:rotate(5deg) translateY(20px)}
  .home-page .featured-banner.is-roun:hover .featured-image img{transform:rotate(5deg) translateY(20px)}
}