:root{--green:#164f4a;--soft:#eaf2ef}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{background:#164f4a;border:0;color:#fff}.site-header .topbar{min-height:76px;display:flex;flex-wrap:nowrap;gap:22px;padding-block:12px}.site-header .header-brand{color:#fff;gap:0;font-size:23px;letter-spacing:-.7px}.site-header .brand-icon{width:40px;height:40px;margin-right:10px;background:#0f3834;border-radius:50%;color:#fff}.site-header .brand-name{color:#fff!important}.novels-pill{display:inline-flex;align-items:center;gap:9px;padding:10px 15px;border-radius:9px;background:#ffffff18;font-size:15px;font-weight:600;white-space:nowrap}.novels-pill svg{width:21px;height:21px}.header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}.header-icon{display:inline-flex;align-items:center;justify-content:center;position:relative;width:42px;height:42px;flex-shrink:0;padding:9px;border:0;background:transparent;color:inherit;border-radius:9px;cursor:pointer}.header-icon:hover{background:#ffffff12}.header-icon svg{width:24px;height:24px}.profile-button{background:#0f3834;border-radius:50%;padding:0;overflow:hidden;font-size:13px;font-weight:700}.profile-button img,.profile-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.notification-dot{position:absolute;top:6px;right:7px;width:8px;height:8px;background:#ff5469;border-radius:50%;box-shadow:0 0 0 2px #164f4a}.notification-dot[hidden]{display:none}
.library-intro{margin-top:38px;margin-bottom:10px}.library-intro h1{font-size:32px}.library-sync{display:flex;align-items:center;gap:7px;color:var(--muted);margin:0 0 25px}.library-sync p{font-size:12px;margin:0}.sync-dot{width:6px;height:6px;flex-shrink:0;border-radius:50%;background:#7aa79b}.library-signin{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:18px 0 22px}.library-signin strong{font-size:16px}.library-signin p{font-size:13px;color:var(--muted);margin:5px 0 0}.library-signin .signin-status{width:100%;font-size:12px;margin:0}.google-signin{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:14px;white-space:nowrap}.google-signin>span{display:grid;place-items:center;background:#fff;color:#4285f4;border-radius:50%;width:23px;height:23px;font-family:Arial,sans-serif;font-weight:700}.library-tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin:0 0 25px}.library-tabs a{display:flex;gap:8px;align-items:center;padding:12px 2px;font-size:14px;font-weight:600;color:var(--muted);border-bottom:2px solid transparent}.library-tabs [aria-current=page]{color:var(--green);border-bottom-color:var(--green)}.library-tabs span{display:grid;place-items:center;min-width:20px;height:20px;border-radius:5px;background:var(--soft);font-size:11px}.history-list{display:grid;gap:12px}.history-row{display:flex;align-items:center;gap:18px;padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:12px}.history-row .cover{width:56px;height:78px;object-fit:cover;border-radius:6px;flex-shrink:0}.history-row div{min-width:0}.history-row h2{font-size:16px;margin:0 0 8px}.history-row p{margin:0;color:var(--muted);font-size:13px}.history-row>span{margin-left:auto;font-size:25px;color:var(--muted)}
.site-drawer{--drawer-bg:#17312e;--drawer-panel:#102724;--drawer-border:#31504a;--drawer-muted:#a6b8b3;--drawer-purple:#8fc5b7;position:fixed;inset:0 0 0 auto;width:min(460px,100%);max-width:100%;height:100dvh;max-height:100dvh;margin:0;padding:0;border:0;border-left:1px solid var(--drawer-border);border-radius:0;background:var(--drawer-bg);color:#f0f7f5;overflow-y:auto;overscroll-behavior:contain;color-scheme:dark;font:15px/1.5 'DM Sans',sans-serif}.site-drawer[open]{animation:drawer-in .18s ease-out}.site-drawer::backdrop{background:#071713a8;backdrop-filter:blur(3px)}@keyframes drawer-in{from{transform:translateX(24px);opacity:0}to{transform:translateX(0);opacity:1}}body:has(.site-drawer[open]){overflow:hidden}.site-drawer button,.site-drawer a{touch-action:manipulation}.site-drawer button:focus-visible,.site-drawer a:focus-visible,.site-drawer summary:focus-visible,.site-drawer input:focus-visible{outline:2px solid #9ad0c1;outline-offset:3px}.drawer-top{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;min-height:80px;padding:16px 22px;background:var(--drawer-bg);border-bottom:1px solid var(--drawer-border)}.drawer-brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px;letter-spacing:-.3px}.drawer-brand>span{display:grid;place-items:center;width:36px;height:36px;background:#164f4a;border-radius:50%;font:italic bold 24px Georgia}.drawer-top .header-icon{color:#f0f7f5}.menu-content{padding:22px}.drawer-search{display:flex;align-items:center;gap:10px;background:var(--drawer-panel);border:1px solid var(--drawer-border);padding:4px 8px 4px 14px;border-radius:10px;margin-bottom:24px}.drawer-search>svg{width:19px;height:19px;flex-shrink:0;color:var(--drawer-muted)}.drawer-search input{width:100%;min-width:0;height:44px;border:0;background:transparent;color:inherit;font:inherit;outline-offset:0!important}.drawer-search input::placeholder{color:#81938e}.drawer-search button{display:grid;place-items:center;width:36px;height:36px;padding:8px;border:0;border-radius:6px;background:#1e433d;color:var(--drawer-purple)}.drawer-search button svg{width:20px;height:20px}.menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.menu-grid a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;min-height:110px;padding:15px 6px;background:var(--drawer-panel);border:1px solid var(--drawer-border);border-radius:11px;font-size:13px}.menu-grid a:hover{border-color:#5a8d81;background:#193a35}.menu-grid svg{width:25px;height:25px;color:#bccdc8}.menu-divider{display:flex;align-items:center;gap:12px;margin:28px 0 14px;font-size:10px;letter-spacing:1.4px;color:#81938e}.menu-divider:after{content:'';height:1px;flex:1;background:var(--drawer-border)}.drawer-rows{padding:10px 0}.drawer-row{display:flex;align-items:center;gap:14px;width:100%;padding:17px 22px;text-align:left;list-style:none;cursor:pointer}.menu-content .drawer-row{padding-inline:0}.drawer-row:hover{background:#ffffff04}.row-icon{display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;background:#1e433d;border-radius:50%;color:#91c8ba}.row-icon svg{width:22px;height:22px}.drawer-row>span:nth-child(2){min-width:0}.drawer-row strong{display:block;font-size:16px;font-weight:500}.drawer-row small{display:block;color:var(--drawer-muted);font-size:12px;margin-top:3px}.row-chevron{margin-left:auto;color:#7f918c;font-size:26px}.profile-summary{display:flex;align-items:center;gap:16px;padding:26px 22px;background:linear-gradient(100deg,#1e433d,transparent);border-bottom:1px solid var(--drawer-border)}.profile-avatar{display:grid;place-items:center;flex-shrink:0;width:62px;height:62px;border-radius:50%;background:#102724;border:2px solid #31504a;color:#a8d7cb;overflow:hidden;font-size:20px;font-weight:700}.profile-avatar svg{width:29px;height:29px}.profile-summary>div:last-child{min-width:0}.profile-summary h2{font-size:20px;line-height:1.3;margin:0 0 5px;overflow-wrap:anywhere}.profile-summary p{font-size:13px;color:var(--drawer-muted);margin:0;overflow-wrap:anywhere}.drawer-signin{padding:22px;border-bottom:1px solid var(--drawer-border)}.drawer-signin p{font-size:13px;margin:0 0 16px;color:var(--drawer-muted)}.site-drawer .button{border-radius:8px;background:#164f4a;color:white;border:1px solid #164f4a;padding:11px 17px}.site-drawer .button.outline{background:transparent;border-color:#4a746b;color:#badbd3}.account-settings summary::-webkit-details-marker{display:none}.account-settings[open] .row-chevron{transform:rotate(90deg)}.settings-content{padding:0 22px 20px 76px}.settings-content .button{display:flex;margin-bottom:10px;font-size:13px}.settings-content p{font-size:12px;color:var(--drawer-muted);line-height:1.6}.profile-bottom{padding:20px 22px;border-top:1px solid var(--drawer-border)}.profile-bottom p{font-size:12px;color:var(--drawer-muted);margin:0 0 16px}.signout-button{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:13px;border:0;border-radius:9px;background:#203a36;color:#dceae6;font:inherit}.signout-button svg{width:20px;height:20px}.quiet-button{border:0;background:transparent;color:var(--drawer-purple,#164f4a);padding:8px;font:inherit;font-size:12px;cursor:pointer}.notifications-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:24px 22px 20px}.notifications-heading h2{font-size:21px;font-weight:600;margin:0}.notification-tabs{padding:0 22px 17px;border-bottom:1px solid var(--drawer-border)}.notification-tabs>span{display:inline-flex;align-items:center;gap:10px;background:#1e433d;color:#d2eae4;border-radius:7px;padding:8px 13px;font-size:13px}.notification-tabs b{font-weight:400;color:#91c8ba}.update-list{list-style:none;padding:0;margin:0}.update-list li{border-bottom:1px solid #ffffff06;background:linear-gradient(90deg,#1d423c,#17312e)}.update-list a{display:flex;align-items:center;gap:16px;padding:20px 22px}.update-list img{width:52px;height:74px;object-fit:cover;border-radius:7px;border:1px solid #3e6a61;flex-shrink:0}.update-list a>div{min-width:0}.update-list strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:15px;font-weight:500;line-height:1.4}.update-list span{display:block;color:#91c8ba;font-size:13px;margin-top:8px}.update-list em{font-style:normal;color:#50c69b;margin-right:7px}.empty-notifications{display:flex;flex-direction:column;align-items:center;text-align:center;padding:64px 34px 46px}.empty-notifications>div{display:grid;place-items:center;width:66px;height:66px;background:#1e433d;border-radius:50%;color:#91c8ba}.empty-notifications svg{width:30px;height:30px}.empty-notifications h3{font-size:18px;margin:20px 0 8px}.empty-notifications p{color:var(--drawer-muted);font-size:13px;max-width:260px;margin:0 0 23px;line-height:1.7}.empty-notifications .button{font-size:13px}.notifications-footnote{text-align:center;font-size:11px;color:#81938e;margin:20px 22px}
@media(max-width:760px){.site-header .topbar{min-height:66px;padding:11px 16px;gap:10px}.site-header .brand-name{display:none}.site-header .brand-icon{width:38px;height:38px;margin:0}.novels-pill{padding:9px 12px;font-size:14px;gap:8px}.header-actions{gap:6px}.header-icon{width:38px;height:38px}.header-icon svg{width:23px;height:23px}.site-drawer{border:0;width:100%}.library-intro{margin-top:26px}.library-intro h1{font-size:28px}.library-signin{gap:14px}.library-signin .google-signin{padding:10px 14px}.drawer-top{min-height:70px}.history-row{gap:13px}.history-row h2{font-size:15px}}
@media(prefers-reduced-motion:reduce){.site-drawer[open]{animation:none}}


/* Compact white header matching the mobile catalog reference. */
.site-header{
  background:#fff !important;
  border-bottom:1px solid #edf1ef !important;
  color:#24312f !important;
}
.site-header .topbar{
  max-width:760px;
  min-height:64px;
  padding:7px 18px;
  gap:12px;
}
.compact-header-brand{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#24312f;
  text-decoration:none;
  line-height:1;
}
.compact-brand-mark{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  color:var(--green);
  flex:0 0 34px;
}
.compact-brand-mark svg{width:34px;height:34px;display:block}
.compact-brand-copy{
  display:grid;
  gap:1px;
  line-height:.95;
  letter-spacing:.2px;
}
.compact-brand-copy small{
  color:#263532;
  font:800 9px/1 'DM Sans',system-ui,sans-serif;
  letter-spacing:1.15px;
}
.compact-brand-copy strong{
  color:var(--green);
  font:900 17px/1 'DM Sans',system-ui,sans-serif;
  letter-spacing:-.4px;
}
.compact-menu-button{
  position:relative;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  margin-left:auto;
  padding:8px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:var(--green);
  cursor:pointer;
}
.compact-menu-button:hover{background:var(--soft)}
.compact-menu-button svg{width:28px;height:28px}
.compact-menu-button .notification-dot{
  top:5px;
  right:5px;
  box-shadow:0 0 0 2px #fff;
}
.drawer-action-row{
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
}
.drawer-action-row .menu-update-dot{
  position:static;
  width:8px;
  height:8px;
  margin-left:auto;
  box-shadow:none;
  flex:0 0 8px;
}
.drawer-action-row .menu-update-dot + .row-chevron{margin-left:0}

@media(max-width:760px){
  .site-header .topbar{
    min-height:58px;
    padding:5px 14px;
    gap:8px;
  }
  .compact-brand-mark{width:31px;height:31px;flex-basis:31px}
  .compact-brand-mark svg{width:31px;height:31px}
  .compact-brand-copy small{font-size:8px}
  .compact-brand-copy strong{font-size:16px}
  .compact-menu-button{width:40px;height:40px;padding:7px}
  .compact-menu-button svg{width:26px;height:26px}
}


/* Visible chapter-update button beside the compact menu. */
.compact-header-actions{display:flex;align-items:center;gap:4px;margin-left:auto}
.compact-notification-button,.compact-menu-button{position:relative;display:grid;place-items:center;width:44px;height:44px;margin-left:0;padding:8px;border:0;border-radius:7px;background:transparent;color:var(--green);cursor:pointer}
.compact-notification-button:hover,.compact-menu-button:hover{background:var(--soft)}
.compact-notification-button svg,.compact-menu-button svg{width:27px;height:27px}
.compact-notification-button .notification-dot{top:5px;right:5px;box-shadow:0 0 0 2px #fff}
@media(max-width:760px){.compact-header-actions{gap:1px}.compact-notification-button,.compact-menu-button{width:40px;height:40px;padding:7px}.compact-notification-button svg,.compact-menu-button svg{width:25px;height:25px}}


/* Catalog-style Novel list / Genres navigation inside the menu drawer. */
.catalog-menu-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  margin:2px -22px 0;
  border-block:1px solid var(--drawer-border);
}
.catalog-menu-tabs button{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:58px;
  padding:12px 10px;
  border:0;
  border-right:1px solid var(--drawer-border);
  background:#f7faf9;
  color:#43504d;
  font:800 14px/1.2 'DM Sans',sans-serif;
}
.catalog-menu-tabs button:last-child{border-right:0}
.catalog-menu-tabs button svg{width:23px;height:23px}
.catalog-menu-tabs button[aria-selected="true"]{
  background:#164f4a;
  color:#fff;
}
.catalog-menu-panel{
  margin:0 -22px 6px;
  background:#fff;
  color:#27322f;
}
.catalog-menu-panel[hidden]{display:none}
.catalog-menu-list{
  display:grid;
  grid-template-columns:1fr 1fr;
}
.catalog-menu-list a{
  display:flex;
  align-items:center;
  gap:11px;
  min-height:68px;
  padding:14px 18px;
  border-right:1px solid #dfe6e3;
  border-bottom:1px dashed #d7dfdc;
  background:#fff;
  font:700 14px/1.25 'DM Sans',sans-serif;
}
.catalog-menu-list a:nth-child(2n){border-right:0}
.catalog-menu-list a:hover,
.catalog-genre-grid a:hover{
  background:#f0f6f4;
  color:#164f4a;
}
.catalog-menu-icon{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  flex:0 0 28px;
  color:#177a70;
}
.catalog-menu-icon svg{width:24px;height:24px}
.catalog-genre-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  max-height:56dvh;
  overflow-y:auto;
}
.catalog-genre-grid a{
  display:flex;
  align-items:center;
  min-height:52px;
  padding:11px 14px;
  border-right:1px dashed #d7dfdc;
  border-bottom:1px dashed #d7dfdc;
  background:#fff;
  color:#303936;
  font:650 13px/1.25 'DM Sans',sans-serif;
  overflow-wrap:anywhere;
}
.catalog-genre-grid a:nth-child(3n){border-right:0}

@media(max-width:430px){
  .catalog-menu-tabs{margin-inline:-22px}
  .catalog-menu-tabs button{min-height:54px;font-size:13px}
  .catalog-menu-list a{min-height:64px;padding:13px 14px;font-size:13px}
  .catalog-genre-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog-genre-grid a:nth-child(3n){border-right:1px dashed #d7dfdc}
  .catalog-genre-grid a:nth-child(2n){border-right:0}
}
