/* 과제⑦ — 메인 홈(home.js) · 내 작품(works.js) · 작가별 서가(author.js) · 프로젝트 허브(project.js)
   app.css 의 공통 토큰·.card/.btn/.bdg/.grid/.pagehd/.chips/.empty/.skel/.mini/.hp 를 그대로 쓰고,
   여기엔 이 네 화면에만 필요한 것만 추가한다. 이름이 app.css 의 바닥(.sub·.chl)과 부딪히지 않게
   화면별 접두사(hm-·au-·pj-)를 붙였다. */

/* ── 공용 — 작은 아이콘 한 벌(마크업에 sb/tabbar 같은 부모가 없어 app.css 의 svg 규칙이 안 먹는다) ── */
.svgic{flex:none;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.btn.line{color:var(--gold-text);border-color:rgba(232,195,122,.35);background:transparent}
.btn.line:hover:not(:disabled){background:var(--gold-soft)}

/* ── 공용 — 구역 머리글(제목 + 오른쪽 「전체 →」류 링크). app.css 의 .sect 와 달리 오른쪽 링크를 끝에 민다 ── */
.sec{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:24px 0 10px;font-size:20px;font-weight:700;color:#f3e7ce}
.sec>span{display:inline-flex;align-items:center;gap:4px;min-width:0}
.sec a{flex:none;font-size:16px;font-weight:700;color:var(--gold-dim);text-decoration:none}
.sec a:hover{color:var(--gold-text)}

/* ══════════════════════════════════════════════════════════
   R01 메인 홈(home.js) — 4타일 + 이어읽기 + 작가별 서가 미리보기
   ══════════════════════════════════════════════════════════ */
.hm-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 22px}
.hm-tile{height:168px;display:flex;flex-direction:column;text-align:left;padding:0;border-radius:16px;overflow:hidden;
  border:1px solid var(--ln2);background:var(--s1);color:var(--ink);cursor:pointer;text-decoration:none;
  transition:transform .13s ease-out,border-color .13s ease-out}
.hm-tile:active{transform:scale(.97)}
.hm-tile.pri{border-color:var(--gold-line)}
.hm-art{flex:1;min-height:0;position:relative;background-size:72% auto;background-position:50% 46%;background-repeat:no-repeat;
  background-color:rgba(255,255,255,.02);box-shadow:inset 0 -22px 38px -20px rgba(232,195,122,.16)}
.hm-tx{flex:none;padding:9px 12px 10px}
.hm-tx b{display:block;font-size:21px;font-weight:700;color:#fff8ea;letter-spacing:-.01em}
.hm-tx span{display:block;margin-top:3px;font-size:16px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:420px){.hm-tile{height:150px}.hm-tx b{font-size:20px}}

.hm-blk{margin-bottom:22px}
.hm-blk .sec{margin-bottom:2px}
.hm-strip{display:flex;flex-direction:column;gap:10px;padding:4px 0 6px}
.hm-cont{width:100%;padding:16px;border-radius:15px;border:1px solid var(--ln2);background:rgba(255,255,255,.02);
  text-align:left;cursor:pointer;transition:transform .13s ease-out}
.hm-cont:active{transform:scale(.97)}
.hm-cont b{display:block;font-size:18px;color:#f3e7ce;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:9px}
.hm-cont .m{display:flex;justify-content:space-between;font:600 15px var(--mono);color:var(--dim)}
.hm-cont .m i{font-style:normal;color:var(--gold-text)}
.hm-cont .bar{margin-top:6px}

.hm-auth{margin-bottom:10px;padding:12px;border-radius:14px;border:1px solid var(--ln2);background:rgba(255,255,255,.02)}
.hm-ah{display:flex;align-items:center;gap:10px;cursor:pointer;min-width:0}
.hm-av{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:17px;color:var(--gold-on);background:var(--gold)}
.hm-ah b{flex:none;font-size:19px;color:#fff8ea;max-width:46%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-bs{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.hm-bkrow{display:flex;flex-direction:column;gap:8px;margin-top:12px;padding:1px}
.hm-bk{width:100%;display:flex;gap:11px;align-items:center;padding:10px;border-radius:12px;border:1px solid var(--ln);
  background:rgba(255,251,240,.03);text-align:left;cursor:pointer;transition:transform .13s ease-out}
.hm-bk:active{transform:scale(.97)}
.hm-bk .hm-mh{flex:none;width:34px;height:48px;border-radius:5px;background:radial-gradient(120% 110% at 50% 0%,rgba(232,195,122,.22),rgba(232,195,122,.04) 60%,transparent 80%),linear-gradient(180deg,#1f1a13,#16130f)}
.hm-bk .t{min-width:0;display:flex;flex-direction:column;gap:3px}
.hm-bk .t b{font-size:17px;line-height:1.3;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:keep-all}
.hm-bk .t i{font-style:normal;font:700 14px var(--sans);color:var(--gold-dim)}
@media(max-width:768px){
  .hm-tiles{margin:14px 0 20px}
  .hm-tile{height:158px}
}

/* ══════════════════════════════════════════════════════════
   R18b 작가별 서가(author.js) — 원작 아래 외전·브랜치가 가지로 붙는다
   ══════════════════════════════════════════════════════════ */
.au-head{display:flex;align-items:center;gap:12px;margin:18px 0 6px}
.au-av{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:20px;color:var(--gold-on);background:var(--gold)}
.au-head h1{margin:0;font-size:28px;color:#fff8ea;letter-spacing:-.01em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.au-bs{display:flex;gap:6px;margin:10px 0 20px;flex-wrap:wrap}
.au-grp{margin-bottom:16px}
.au-bk1{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;border:1px solid var(--ln2);background:rgba(255,255,255,.03)}
.au-mh{flex:none;width:44px;height:60px;border-radius:6px;background:radial-gradient(120% 110% at 50% 0%,rgba(232,195,122,.24),rgba(232,195,122,.05) 55%,transparent 78%),linear-gradient(180deg,#1f1a13,#16130f)}
.au-bk1 .t{flex:1;min-width:0}
.au-bk1 .t b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:19px;line-height:1.3;color:#f3e7ce;overflow:hidden}
.au-bk1 .t span{display:block;margin-top:4px;font-size:16px;color:var(--dim)}
.au-kids{margin:0 0 0 22px;padding-left:14px}
.au-kid{position:relative;margin-top:10px;display:flex;align-items:center;gap:10px;min-height:62px;padding:10px 12px;border-radius:10px;border:1px solid var(--ln);background:rgba(255,251,240,.025)}
.au-kid::before{content:'';position:absolute;left:-15px;top:-9px;width:14px;height:calc(50% + 9px);border-left:1px solid var(--gold-line);border-bottom:1px solid var(--gold-line);border-bottom-left-radius:9px}
.au-kid:not(:last-child)::after{content:'';position:absolute;left:-15px;top:50%;bottom:-9px;border-left:1px solid var(--gold-line)}
.au-kid .t{flex:1;min-width:0}
.au-kid .l1{display:flex;align-items:center;gap:6px;min-width:0}
.au-kid .l1 b{font-size:17px;line-height:1.35;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.au-kid .s{display:block;margin-top:3px;font-size:15px;color:var(--faint)}
.au-kid.more{border-style:dashed;background:transparent;min-height:48px;padding:0 10px;color:var(--dim);font-size:16px;font-weight:600;cursor:pointer;justify-content:center}
.au-kid.more:hover{color:var(--gold-text)}
.au-kid.hide{display:none}
.au-fab{position:fixed;right:18px;bottom:24px;z-index:30;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;border:0;cursor:pointer;
  background:var(--gold);color:var(--gold-on);box-shadow:0 10px 26px rgba(0,0,0,.5),0 0 0 4px rgba(232,195,122,.14);transition:transform .13s ease-out}
.au-fab:active{transform:scale(.95)}
@media(max-width:768px){.au-fab{bottom:calc(var(--tabh) + 16px + env(safe-area-inset-bottom,0px))}}

/* ══════════════════════════════════════════════════════════
   R00b 프로젝트 허브(project.js) — 2x2 타일 + 자동 집필 챕터 목록
   ══════════════════════════════════════════════════════════ */
.pj-hub{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 20px}
.pj-tile{min-height:132px;display:flex;flex-direction:column;justify-content:space-between;padding:12px;text-align:left;
  border-radius:16px;border:1px solid var(--ln2);background:rgba(255,255,255,.03);color:var(--ink);text-decoration:none;
  cursor:pointer;transition:transform .13s ease-out,border-color .13s ease-out}
.pj-tile:active{transform:scale(.97)}
.pj-tile.read{border-color:var(--gold-line);background:var(--gold-soft)}
.pj-tile.read .pj-sub{color:var(--gold-text);font-weight:700}
.pj-ico{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;color:var(--gold);background:var(--gold-soft);border:1px solid rgba(232,195,122,.28)}
.pj-tile b{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:20px;line-height:1.25;color:#fff8ea;margin-top:8px}
.pj-sub{display:flex;align-items:center;gap:6px;margin-top:4px;font-size:16px;color:var(--dim);min-height:22px}
/* MD.progress() 가 <span class="bar"> 를 내보내는데, 이 자리는 부모가 flex 가 아니라서(다른 화면은 대개 flex 부모 안에서
   써서 자동으로 block 이 됐다) span 이 inline 으로 남아 height 가 안 먹고 부풀어 보이던 결함(과제⑦b QA) — block 으로 못박는다 */
.pj-tile .bar{display:block;margin-top:5px}
.pjn{flex:none;width:26px;font:700 14px var(--mono);color:var(--faint)}
.pjtt{flex:1;min-width:0;font-size:17px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pjread{flex:none}
.bdg.live{color:var(--gold-text)}
.bdg.live::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--gold);margin-right:5px;vertical-align:1px}
@media(max-width:420px){.pj-tile{min-height:126px;padding:12px}.pj-tile b{font-size:19px}}

/* 소설 보기 목록 — 재민 2026-10-14 */
.lb-ahd{display:flex;align-items:center;gap:12px;margin:22px 0 10px;padding:12px 14px;cursor:pointer;
  background:var(--glass);border:1px solid var(--line);border-radius:16px;min-height:66px}
.lb-ahd:active{transform:scale(.995)}
.lb-ahd>b{font:700 21px/1.25 var(--sans);color:var(--ink)}
.lb-ahd .s{font:500 15px/1.3 var(--sans);color:var(--faint)}
.lb-ahd em{margin-left:auto;font-style:normal;font:600 15px/1 var(--sans);color:var(--gold-text);white-space:nowrap}
.lb-tip{margin:0 0 14px;padding:14px 15px;border-radius:14px;background:var(--gold-soft);
  border:1px solid var(--gold-line);font:500 16px/1.55 var(--sans);color:var(--ink)}
.lb-tip b{color:var(--gold-text)}
.lb-toc{margin:6px 0 2px 16px;border-left:2px solid var(--line);display:flex;flex-direction:column}
.lb-toc a{display:flex;text-decoration:none;align-items:center;gap:12px;padding:13px 14px;min-height:56px;
  border-bottom:1px solid var(--line);color:var(--ink);font:500 17px/1.4 var(--sans)}
.lb-toc a:last-child{border-bottom:0}
.lb-toc a i{flex:none;min-width:58px;font-style:normal;font:600 15px/1 var(--sans);color:var(--faint)}
.lb-toc a b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-toc a.all{color:var(--gold-text);font-weight:600;justify-content:center}
.lb-toc a:active{background:var(--gold-soft)}
.btn.line.sm.on{background:var(--gold-soft);color:var(--gold-text);border-color:var(--gold-line)}

/* 폰 — 책 줄은 «표지+제목» 한 줄, «회차·읽기» 버튼 한 줄(재민 2026-10-14: 큰 버튼) */
@media(max-width:768px){
  .au-bk1{flex-wrap:wrap;padding:14px;align-items:flex-start}
  .au-bk1 .t{flex:1 1 0;min-width:0;order:1}
  .au-bk1::after{content:'';flex-basis:100%;height:0;order:2}            /* 버튼 줄을 아래로 민다 */
  .au-bk1 .btn,.au-bk1 .btn.sm{flex:1 1 calc(50% - 6px);min-width:0;height:50px;font-size:17px;padding:0 10px;order:3;margin-top:4px}
  .au-kid{flex-wrap:wrap}
  .au-kid .t{flex:1 1 100%}
  .au-kid .btn,.au-kid .btn.sm{flex:1 1 100%;height:46px;font-size:17px}
}
/* 트리 가지선은 들여쓴 묶음에서만(창작 묶음은 평평하다) */
.au-kids[style] .au-kid::before,.au-kids[style] .au-kid::after{display:none}

/* 내 작품 카드 — 큰 버튼 하나로 끝낸다(재민 2026-10-14) */
.card.proj .pj-go{display:flex;width:100%;margin-top:12px}
.card.proj h3 .hp{margin-left:8px}

/* ── 표지(.cv) — 서버가 구독 레인으로 그린 webp · 없으면 제목 얹은 금빛 자리표시(재민 2026-10-14 1안) ── */
.cv{position:relative;flex:none;overflow:hidden;border-radius:2px 4px 4px 2px;aspect-ratio:97/135;container-type:inline-size;background-color:#17130e;background-size:cover;background-position:center;
  background-image:radial-gradient(120% 80% at 50% 0%,rgba(232,195,122,.24),transparent 62%),linear-gradient(180deg,#221c14,#120f0b);
  box-shadow:inset 0 0 0 1px rgba(255,251,240,.10),0 6px 16px rgba(0,0,0,.45)}
.cv.has{box-shadow:inset 0 0 0 1px rgba(255,251,240,.14),0 6px 16px rgba(0,0,0,.5)}
/* 표지 인쇄(재민 2026-10-14 «실제 책처럼») — 그림 위 제목·갈래·저자. 크기는 표지 폭 기준(cqw) */
.cv-pr{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;padding:36% 9% 7%;text-align:center;pointer-events:none;
  background:radial-gradient(70% 34% at 50% 44%,rgba(8,6,4,.42),transparent 72%),linear-gradient(0deg,rgba(8,6,4,.55),transparent 22%)}
.cv-pr b{display:block;font-family:'Nanum Myeongjo','Noto Serif KR','Batang',serif;font-weight:800;font-size:10.5cqw;line-height:1.25;color:#fbf3e2;letter-spacing:.02em;
  word-break:keep-all;overflow-wrap:anywhere;text-shadow:0 1px 3px rgba(0,0,0,.85),0 0 12px rgba(0,0,0,.5)}
.cv-pr em{margin-top:4cqw;font-style:normal;font-family:'Nanum Myeongjo','Noto Serif KR',serif;font-weight:700;font-size:7.5cqw;color:#f1e3c4;text-shadow:0 1px 3px rgba(0,0,0,.85)}
.cv-pr small{margin-top:auto;font-family:'Nanum Myeongjo','Noto Serif KR',serif;font-size:6.2cqw;letter-spacing:.06em;color:rgba(246,236,214,.86);text-shadow:0 1px 2px rgba(0,0,0,.9)}
/* 책등 홈·천결 — 발주 #10 양장 질감(회색 50% 기준)을 overlay 로 얹어 그림 색은 두고 주름·결만 입힌다 */
.cv-sp{position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;mix-blend-mode:overlay;opacity:.95;
  background:url(../img/cover-hardcover.webp) center/100% 100% no-repeat}
.cv::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;background:linear-gradient(90deg,rgba(0,0,0,.62) 0,rgba(0,0,0,.28) 2.6%,rgba(0,0,0,.42) 6.6%,rgba(255,244,222,.34) 8.6%,rgba(255,244,222,.08) 9.8%,rgba(0,0,0,.30) 10.8%,rgba(0,0,0,.08) 13%,transparent 16%,transparent 96%,rgba(0,0,0,.35) 100%)}
.cv[data-cst="ordered"]::after{content:'';position:absolute;inset:0;z-index:3;background:linear-gradient(105deg,transparent 30%,rgba(232,195,122,.16) 50%,transparent 70%);
  background-size:220% 100%;animation:cvShine 1.8s linear infinite}
@keyframes cvShine{from{background-position:120% 0}to{background-position:-120% 0}}
@media (prefers-reduced-motion:reduce){.cv[data-cst="ordered"]::after{animation:none}}
.cv.sm{width:44px}.cv.sm .cv-pr small,.cv.sm .cv-pr em{display:none}.cv.sm .cv-pr{padding-top:30%}.cv.sm .cv-pr b{font-size:15cqw}
.cv.md{width:100%}
.cv.lg{width:108px}

/* ── 홈 1안(.hm2) ── */
.hm2{padding-top:14px}
.hm2-hero{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 16px;align-items:start;padding:16px;border-radius:20px;overflow:hidden;isolation:isolate;
  background:linear-gradient(160deg,rgba(232,195,122,.10),rgba(26,23,19,.92) 46%),var(--s1);border:1px solid rgba(232,195,122,.22)}
.hm2-hero::before{content:'';position:absolute;inset:-40% -30% auto auto;width:70%;aspect-ratio:1;z-index:-1;
  background:radial-gradient(closest-side,rgba(232,195,122,.16),transparent);pointer-events:none}
.hm2-hero .tx{min-width:0;display:flex;flex-direction:column;gap:8px;align-items:flex-start;align-self:center}
/* 표지는 언제나 책 비율(2:3) — 글줄이 길어도 늘리지 않고, 버튼을 표지 아래 전폭으로 내려 균형을 맞춘다(재민 2026-10-14) */
.hm2-hero>.cv{align-self:start;height:auto}
.hm2-hero.empty{display:flex}.hm2-hero.empty .tx{flex:1;align-self:auto}
.hm2-hero .eb{font-weight:700;font-size:13px;letter-spacing:.14em;color:var(--gold-dim)}
.hm2-hero .tx>b{font-family:'Noto Serif KR','Nanum Myeongjo','Batang',serif;font-size:22px;line-height:1.3;color:#fff8ea;word-break:keep-all;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hm2-hero p{margin:0;font-size:15.5px;color:var(--dim)}
.hm2-hero .pg{width:100%;display:flex;align-items:center;gap:10px;margin-top:2px}
.hm2-hero .pg .bar{flex:1;height:6px}
.hm2-hero .pg span{flex:none;font-weight:600;font-size:14px;color:var(--gold-text);font-variant-numeric:tabular-nums}
.hm2-hero>.btn.gold{grid-column:1/-1;width:100%;height:46px;padding:0 22px}
.hm2-hero.empty .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.st{display:inline-flex;align-items:center;flex:none;height:26px;padding:0 10px;border-radius:99px;font-weight:700;font-size:13.5px;white-space:nowrap;
  color:var(--gold-text);background:var(--gold-soft);border:1px solid rgba(232,195,122,.3)}
.st.ok{color:var(--ok);background:rgba(52,211,153,.1);border-color:rgba(52,211,153,.3)}
.st.warm{color:#fff3d6;background:rgba(255,243,214,.07);border-color:rgba(255,243,214,.2)}
.st.dim{color:var(--dim);background:rgba(255,251,240,.04);border-color:var(--ln2)}

.hm2-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 4px}
.hm2-stats>div{padding:11px 12px;border-radius:14px;background:rgba(255,251,240,.03);border:1px solid var(--ln2);min-width:0}
.hm2-stats b{display:block;font-weight:700;font-size:22px;line-height:1.15;color:#fff8ea;font-variant-numeric:tabular-nums}
.hm2-stats b i{font-style:normal;font-size:15px;color:var(--faint);font-weight:600}
.hm2-stats span{display:flex;align-items:center;margin-top:3px;font-size:14px;color:var(--dim);white-space:nowrap}
.hm2-stats .hp{margin-left:4px}

.hm2-list{display:flex;flex-direction:column;border-radius:16px;border:1px solid var(--ln2);background:rgba(255,251,240,.02);overflow:hidden}
.hm2-row{display:flex;align-items:center;gap:12px;padding:10px 12px;min-height:76px;text-decoration:none;color:inherit;transition:background .13s}
.hm2-row+.hm2-row{border-top:1px solid var(--ln)}
.hm2-row:hover{background:rgba(255,251,240,.03)}
.hm2-row:active{background:rgba(232,195,122,.06)}
.hm2-row .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.hm2-row .t b{font-size:17px;line-height:1.3;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm2-row .t i{font-style:normal;font-size:14px;color:var(--faint)}
.hm2-row .chev{flex:none;width:18px;height:18px;fill:none;stroke:var(--faint);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.hm2-shelf{display:flex;gap:12px;overflow-x:auto;margin:0 -14px;padding:2px 14px 8px;scroll-snap-type:x mandatory;scroll-padding:14px;scrollbar-width:none}
.hm2-shelf::-webkit-scrollbar{display:none}
.hm2-bk{flex:none;width:118px;scroll-snap-align:start;text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:6px;transition:transform .16s cubic-bezier(.23,1,.32,1)}
.hm2-bk:active{transform:scale(.97)}
.hm2-bk .cvw{position:relative;display:block}
.hm2-bk .cvw .bdg{position:absolute;left:6px;bottom:6px;font-size:12px;padding:3px 7px;background:rgba(13,11,9,.78);backdrop-filter:blur(6px)}
.hm2-bk>b{font-size:15px;line-height:1.3;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:keep-all}
.hm2-bk>i{font-style:normal;font-size:13.5px;color:var(--faint);margin-top:-3px}

.hm2-quick{display:flex;gap:8px;margin:22px 0 6px}
.hm2-quick a{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;height:46px;border-radius:13px;font-size:15px;font-weight:700;
  color:var(--dim);text-decoration:none;border:1px solid var(--ln2);background:rgba(255,251,240,.03);white-space:nowrap;transition:color .13s,border-color .13s,transform .13s}
.hm2-quick a:hover{color:var(--gold-text);border-color:rgba(232,195,122,.3)}
.hm2-quick a:active{transform:scale(.97)}
@media(min-width:768.02px){
  .hm2{max-width:880px;margin:0 auto}
  .hm2-hero{padding:22px;gap:16px 24px;grid-template-rows:1fr auto}.cv.lg{width:150px}
  .hm2-hero>.cv{grid-row:1/3}.hm2-hero>.btn.gold{grid-column:2;width:auto;justify-self:start;align-self:end}.hm2-hero .tx>b{font-size:28px}
  .hm2-shelf{margin:0;padding:2px 0 8px;flex-wrap:wrap;overflow:visible}
  .hm2-bk{width:136px}
}
@media(max-width:360px){.cv.lg{width:100px}.hm2-hero .tx>b{font-size:20px}.hm2-stats b{font-size:20px}}
