/* ========================================
   허쉬사천성: ASMR 마작 퍼즐 — 상세 페이지(hush-tiles.html) 전용 색
   틀(첫 화면·휴대폰 화면·특징·게임 정보)은 hp.css·kd.css 를 그대로 쓰고, 여기서는 게임 색(해 질 녘 남빛·상앗빛·비취·분홍, 스토어 대표 그림처럼)으로만 바꿉니다.
   ======================================== */
.htl-page {
    --kd-bg: #1a1f3d;
    --kd-panel: rgba(40, 52, 96, 0.72);
    --kd-line: rgba(190, 230, 215, 0.22);
    --kd-gold: #f3dfb4;
    --kd-crimson: #e88aa2;
    --kd-crimson-hi: #ffa6bb;
    --kd-text: #f4f6fb;
    --kd-sub: #bcc6dd;
    --hp-lavender: #9fe0c8;
}

body.hp-page.htl-page {
    background:
        radial-gradient(1200px 700px at 85% 0%, rgba(110, 200, 180, 0.20), transparent 70%),
        radial-gradient(900px 600px at 0% 40%, rgba(240, 140, 170, 0.14), transparent 70%),
        linear-gradient(180deg, #26335f 0%, var(--kd-bg) 38%, #140f26 100%);
}

.htl-page .navbar {
    background: rgba(26, 31, 61, 0.82);
}

.htl-page .footer {
    background: #100d22;
}

/* 앱스토어 배지는 공개 전까지 hidden(hp.css 의 .hp-play display 가 hidden 을 덮지 않게) */
.hp-play[hidden] {
    display: none;
}

/* 특징 다섯 칸: 넓은 화면에서는 2×2 + 마지막 한 칸은 가로로 길게, 좁으면 한 줄씩.
   글은 스토어 등록정보처럼 • 줄마다 끊어 읽기 */
.htl-features {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
}

@media (min-width: 900px) {
    .htl-features {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.htl-features .kd-feature p {
    line-height: 1.75;
}

@media (min-width: 900px) {
    .htl-features .kd-feature:last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }
}
