@charset "utf-8";

:root{
    --bp-blue:#155EEF;
    --bp-blue-2:#0B4BD4;
    --bp-navy:#071B3A;
    --bp-ink:#12233F;
    --bp-muted:#66758A;
    --bp-line:#E7EDF5;
    --bp-soft:#F5F8FC;
    --bp-white:#fff;
    --bp-radius:24px;
    --bp-shadow:0 18px 60px rgba(24,62,123,.12);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--bp-ink);font-family:Pretendard,"Noto Sans KR",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
.bp-container{width:min(1360px,calc(100% - 40px));margin:0 auto}
.bp-page{padding-top:76px}

.bp-header{position:fixed;left:0;right:0;top:0;z-index:1000;height:76px;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(222,231,243,.75)}
.bp-header__inner{width:min(1420px,calc(100% - 36px));height:100%;margin:auto;display:flex;align-items:center;gap:34px}
.bp-brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:22px;letter-spacing:-.7px}
.bp-brand__mark{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,#1F6BFF,#0A3FB6);display:grid;place-items:center;color:#fff;font-size:13px;box-shadow:0 8px 20px rgba(21,94,239,.28)}
.bp-nav{display:flex;align-items:center;gap:26px;margin-left:18px;font-size:14px;font-weight:700;color:#42526A}
.bp-nav a:hover{color:var(--bp-blue)}
.bp-account{margin-left:auto;display:flex;align-items:center;gap:9px}
.bp-user-name{font-size:14px;font-weight:700;margin-right:6px}

.bp-btn{border:0;border-radius:12px;padding:11px 17px;font-weight:800;font-size:14px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:.2s ease}
.bp-btn:hover{transform:translateY(-1px)}
.bp-btn--primary{background:var(--bp-blue);color:#fff;box-shadow:0 10px 24px rgba(21,94,239,.24)}
.bp-btn--primary:hover{background:var(--bp-blue-2)}
.bp-btn--ghost{background:#F3F6FA;color:#31445F}
.bp-btn--light{background:#fff;color:#173A73;box-shadow:0 10px 30px rgba(21,61,119,.1)}
.bp-btn--white{background:#fff;color:#0D4FD3;margin-top:25px}
.bp-btn--large{padding:14px 21px;border-radius:14px;font-size:15px}
.bp-btn--full{width:100%;padding:14px}

.bp-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#F8FBFF 0%,#fff 100%);padding:74px 0 66px}
.bp-hero__grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:64px;position:relative;z-index:2}
.bp-kicker{display:inline-block;font-size:12px;letter-spacing:1.8px;color:var(--bp-blue);font-weight:900;margin-bottom:14px}
.bp-kicker--light{color:#93BCFF}
.bp-hero h1{font-size:64px;line-height:1.08;letter-spacing:-3.4px;margin:0 0 24px;color:#0C1D38;font-weight:900}
.bp-hero h1 span{color:var(--bp-blue)}
.bp-hero__copy>p{font-size:18px;line-height:1.8;color:#5E6F86;max-width:620px;margin:0}
.bp-hero__actions{display:flex;gap:11px;margin-top:31px}
.bp-hero__stats{display:flex;gap:36px;margin-top:39px}
.bp-hero__stats div{display:flex;flex-direction:column;gap:3px}
.bp-hero__stats strong{font-size:18px;color:#17365F}
.bp-hero__stats span{font-size:11px;letter-spacing:.5px;color:#8A97A8;text-transform:uppercase}
.bp-hero__glow{position:absolute;border-radius:50%;filter:blur(2px)}
.bp-hero__glow--one{width:450px;height:450px;background:radial-gradient(circle,rgba(50,119,255,.17),transparent 68%);right:-80px;top:-140px}
.bp-hero__glow--two{width:300px;height:300px;background:radial-gradient(circle,rgba(63,214,255,.14),transparent 68%);left:-100px;bottom:-150px}

.bp-hero__visual{position:relative;display:flex;justify-content:center}
.bp-dashboard-card{width:440px;min-height:420px;background:linear-gradient(160deg,#0A285A,#0C4CC8 62%,#1B68F0);border-radius:32px;padding:26px;color:#fff;box-shadow:0 32px 80px rgba(16,67,150,.26);position:relative;overflow:hidden}
.bp-dashboard-card:before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.08);right:-100px;top:-90px}
.bp-dashboard-card__top{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:800;letter-spacing:.4px;position:relative;z-index:1}
.bp-live-dot{background:rgba(255,255,255,.13);padding:6px 9px;border-radius:99px;font-size:10px}
.bp-score-orb{width:200px;height:200px;margin:25px auto 24px;border-radius:50%;background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.22),rgba(255,255,255,.08));border:1px solid rgba(255,255,255,.2);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;z-index:1;box-shadow:inset 0 0 36px rgba(255,255,255,.08)}
.bp-score-orb span{font-size:12px;opacity:.78}
.bp-score-orb strong{font-size:39px;letter-spacing:-1px;margin:6px 0}
.bp-score-orb small{font-size:10px;background:#fff;color:#165DE3;border-radius:99px;padding:5px 8px;font-weight:900}
.bp-mini-rank{position:relative;z-index:1;display:grid;gap:8px}
.bp-mini-rank div{display:grid;grid-template-columns:28px 1fr auto;align-items:center;padding:11px 13px;border-radius:12px;background:rgba(255,255,255,.08);font-size:12px}
.bp-mini-rank b{font-weight:700}
.bp-mini-rank em{font-style:normal;font-weight:800}
.bp-mini-rank .is-me{background:#fff;color:#164AAB}

.bp-ad-strip{height:96px;margin-top:26px;border:1px solid var(--bp-line);border-radius:18px;background:#FAFBFD;display:flex;align-items:center;justify-content:center;gap:22px;color:#74839A}
.bp-ad-strip__label{font-size:9px;letter-spacing:1.5px;border:1px solid #DCE4ED;border-radius:6px;padding:5px 7px}
.bp-ad-strip__content{display:flex;flex-direction:column;gap:3px}
.bp-ad-strip__content strong{font-size:13px;color:#506078}
.bp-ad-strip__content span{font-size:11px}

.bp-section{padding:78px 0}
.bp-section--soft{background:var(--bp-soft)}
.bp-section--compact{padding-top:22px}
.bp-section__head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:30px}
.bp-section__head h2{font-size:38px;letter-spacing:-1.7px;margin:0;color:#10213B}
.bp-section__head p{color:#74839A;font-size:14px;margin:9px 0 0}
.bp-text-link{font-size:13px;font-weight:800;color:var(--bp-blue)}

.bp-featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.bp-featured-card{border:1px solid var(--bp-line);border-radius:22px;overflow:hidden;background:#fff;transition:.24s;box-shadow:0 10px 30px rgba(36,63,105,.05)}
.bp-featured-card:hover{transform:translateY(-5px);box-shadow:var(--bp-shadow)}
.bp-featured-card__visual{height:190px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.bp-featured-card__visual:after{content:"";position:absolute;width:170px;height:170px;border-radius:50%;background:rgba(255,255,255,.16);right:-48px;bottom:-70px}
.bp-featured-card__visual--1{background:linear-gradient(140deg,#0F5FEF,#41A3FF)}
.bp-featured-card__visual--2{background:linear-gradient(140deg,#1A3A73,#245CC4)}
.bp-featured-card__visual--3{background:linear-gradient(140deg,#08377E,#22A3DA)}
.bp-featured-card__badge{position:absolute;left:16px;top:16px;color:#fff;border:1px solid rgba(255,255,255,.32);background:rgba(255,255,255,.13);font-size:9px;font-weight:900;letter-spacing:1.2px;padding:6px 8px;border-radius:99px}
.bp-featured-card__icon{font-size:68px;filter:drop-shadow(0 14px 18px rgba(0,0,0,.15))}
.bp-featured-card__body{padding:22px}
.bp-featured-card__body h3{margin:0;font-size:19px}
.bp-featured-card__body p{min-height:46px;font-size:13px;line-height:1.7;color:#78869A;margin:10px 0 17px}
.bp-featured-card__body>span{font-size:11px;color:var(--bp-blue);font-weight:900;letter-spacing:.6px}

.bp-game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.bp-game-card{background:#fff;border:1px solid #E6ECF4;border-radius:21px;overflow:hidden;transition:.22s}
.bp-game-card:hover{transform:translateY(-4px);border-color:#CDDDFC;box-shadow:0 15px 38px rgba(47,78,126,.1)}
.bp-game-card__image{height:156px;display:grid;place-items:center;position:relative;overflow:hidden}
.bp-game-card__image:before,.bp-game-card__image:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.18)}
.bp-game-card__image:before{width:130px;height:130px;left:-35px;top:-55px}
.bp-game-card__image:after{width:90px;height:90px;right:-25px;bottom:-30px}
.bp-game-card__image span{font-size:57px;position:relative;z-index:1;filter:drop-shadow(0 10px 14px rgba(30,58,100,.13))}
.bp-game-card__image--read{background:linear-gradient(135deg,#DCEAFF,#A8C9FF)}
.bp-game-card__image--quiz{background:linear-gradient(135deg,#D7E3FF,#A6BDFB)}
.bp-game-card__image--typing{background:linear-gradient(135deg,#D9F0FF,#9DD8FA)}
.bp-game-card__image--memory{background:linear-gradient(135deg,#E3E8FF,#B6C0FF)}
.bp-game-card__image--puzzle{background:linear-gradient(135deg,#D9EEFF,#9ACDFA)}
.bp-game-card__image--detective{background:linear-gradient(135deg,#DCE4F9,#A8B7E4)}
.bp-game-card__image--brain{background:linear-gradient(135deg,#DDF4F7,#A9DDE6)}
.bp-game-card__image--word{background:linear-gradient(135deg,#E3EDFF,#B9D0FF)}
.bp-game-card__image--soon{background:linear-gradient(135deg,#EEF2F7,#DCE4ED)}
.bp-game-card__body{padding:20px 20px 21px}
.bp-game-card__body h3{margin:0;font-size:18px;letter-spacing:-.4px}
.bp-game-card__body p{font-size:13px;color:#7C899B;line-height:1.7;min-height:45px;margin:9px 0 15px}
.bp-game-card__action{font-size:11px;color:var(--bp-blue);font-weight:900}
.bp-game-card.is-soon{opacity:.7}

.bp-church-banner{background:linear-gradient(125deg,#061B42,#0A49B9 70%,#1773F6);border-radius:30px;color:#fff;display:grid;grid-template-columns:1.1fr .9fr;gap:36px;padding:54px 58px;overflow:hidden;position:relative}
.bp-church-banner:after{content:"";position:absolute;width:440px;height:440px;border:1px solid rgba(255,255,255,.08);border-radius:50%;right:-210px;top:-200px}
.bp-church-banner__copy{position:relative;z-index:1}
.bp-church-banner__copy h2{font-size:36px;line-height:1.25;letter-spacing:-1.8px;margin:0}
.bp-church-banner__copy p{font-size:14px;line-height:1.8;color:#D2E2FF;max-width:590px}
.bp-church-banner__features{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:19px;color:#E7F0FF;font-size:13px}
.bp-church-banner__panel{display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.bp-room-card{width:100%;max-width:380px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:23px;padding:24px;backdrop-filter:blur(8px)}
.bp-room-card__tag{font-size:9px;letter-spacing:1.3px;color:#BFD5FF;font-weight:900}
.bp-room-card h3{font-size:20px;margin:8px 0 23px}
.bp-room-card__metric{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.bp-room-card__metric div{padding:11px 8px;background:rgba(255,255,255,.08);border-radius:12px;display:flex;flex-direction:column}
.bp-room-card__metric strong{font-size:18px}
.bp-room-card__metric span{font-size:9px;opacity:.7;margin-top:3px}
.bp-progress{height:8px;border-radius:99px;background:rgba(255,255,255,.13);margin:22px 0 7px;overflow:hidden}
.bp-progress span{display:block;height:100%;border-radius:99px;background:#fff}
.bp-room-card small{font-size:10px;color:#C9DBFA}

.bp-promo-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.bp-promo-card{border:1px solid var(--bp-line);border-radius:20px;padding:27px;background:#fff}
.bp-promo-card>span{font-size:10px;font-weight:900;letter-spacing:1.1px;color:var(--bp-blue)}
.bp-promo-card h3{margin:8px 0 5px;font-size:19px}
.bp-promo-card p{font-size:12px;color:#8490A1;margin:0}
.bp-promo-card--ad{background:#F7F9FC}

.bp-footer{margin-top:70px;background:#07172E;color:#B9C5D7}
.bp-footer__inner{width:min(1180px,calc(100% - 40px));margin:auto;padding:48px 0 36px;display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:40px}
.bp-footer__brand{display:block;color:#fff;font-size:24px;font-weight:900;margin-bottom:8px}
.bp-footer__inner p{font-size:12px;margin:0;color:#8393AA}
.bp-footer__links,.bp-footer__company{display:flex;flex-direction:column;gap:10px;font-size:12px}
.bp-footer__company strong{color:#fff}
.bp-footer__bottom{border-top:1px solid rgba(255,255,255,.07);padding:17px 20px;text-align:center;font-size:10px;color:#65758D}

.bp-modal{position:fixed;inset:0;z-index:2000;display:none;align-items:center;justify-content:center;padding:20px}
.bp-modal.is-open{display:flex}
.bp-modal__backdrop{position:absolute;inset:0;background:rgba(4,16,36,.6);backdrop-filter:blur(5px)}
.bp-login-card{position:relative;z-index:1;width:min(430px,100%);background:#fff;border-radius:24px;padding:31px;box-shadow:0 30px 90px rgba(0,0,0,.24)}
.bp-modal__close{position:absolute;right:16px;top:13px;border:0;background:none;font-size:28px;color:#7D8999;cursor:pointer}
.bp-login-card__eyebrow{font-size:10px;color:var(--bp-blue);font-weight:900;letter-spacing:1.5px}
.bp-login-card h2{font-size:27px;margin:7px 0 6px}
.bp-login-card__head p{font-size:12px;color:#8792A2;margin:0 0 22px}
.bp-login-form{display:grid;gap:14px}
.bp-login-form label>span{display:block;font-size:11px;font-weight:800;margin-bottom:6px}
.bp-login-form input[type=text],.bp-login-form input[type=password]{width:100%;height:48px;border:1px solid #DEE6F0;border-radius:12px;padding:0 14px;outline:0;background:#FBFCFE}
.bp-login-form input:focus{border-color:#8AB1FA;box-shadow:0 0 0 3px rgba(21,94,239,.08)}
.bp-login-options{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#6E7E92}
.bp-check{display:flex;align-items:center;gap:5px}
.bp-social-login{margin-top:23px;padding-top:20px;border-top:1px solid #E9EEF4}
.bp-social-login__label{display:block;text-align:center;font-size:10px;color:#8794A5;margin-bottom:10px}
.bp-social-login__buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.bp-social-btn{height:39px;border:1px solid #E0E6EE;border-radius:10px;display:grid;place-items:center;font-size:11px;font-weight:800;background:#fff}
.bp-social-login small{display:block;text-align:center;color:#A0A9B5;font-size:9px;margin-top:9px}

@media(max-width:980px){
    .bp-nav{display:none}
    .bp-hero h1{font-size:52px}
    .bp-hero__grid{gap:32px}
    .bp-dashboard-card{width:100%}
    .bp-featured-grid,.bp-game-grid{grid-template-columns:repeat(2,1fr)}
    .bp-church-banner{grid-template-columns:1fr;padding:45px}
}
@media(max-width:720px){
    .bp-page{padding-top:66px}
    .bp-header{height:66px}
    .bp-header__inner{width:calc(100% - 24px)}
    .bp-brand__name{font-size:19px}
    .bp-account .bp-btn{padding:9px 11px;font-size:12px}
    .bp-hero{padding:48px 0 46px}
    .bp-hero__grid{grid-template-columns:1fr}
    .bp-hero h1{font-size:43px;letter-spacing:-2.3px}
    .bp-hero__copy>p{font-size:15px}
    .bp-hero__stats{gap:18px}
    .bp-dashboard-card{min-height:390px}
    .bp-section{padding:58px 0}
    .bp-section__head{align-items:flex-start;gap:20px}
    .bp-section__head h2{font-size:31px}
    .bp-featured-grid,.bp-game-grid,.bp-promo-grid{grid-template-columns:1fr}
    .bp-game-card{display:grid;grid-template-columns:120px 1fr}
    .bp-game-card__image{height:100%;min-height:145px}
    .bp-game-card__body p{min-height:0}
    .bp-church-banner{padding:35px 28px}
    .bp-church-banner__copy h2{font-size:33px}
    .bp-church-banner__features{grid-template-columns:1fr}
    .bp-footer__inner{grid-template-columns:1fr;gap:26px}
}


/* =========================================================
   BiblePang Dark Mode
   ========================================================= */

html {
    color-scheme: light;
}

html.bp-dark {
    color-scheme: dark;
}

html,
body,
.bp-header,
.bp-featured-card,
.bp-game-card,
.bp-promo-card,
.bp-login-card,
.bp-ad-strip,
.bp-btn,
input,
textarea,
select {
    transition:
        background-color .22s ease,
        border-color .22s ease,
        color .22s ease,
        box-shadow .22s ease;
}

/* Theme toggle */
.bp-theme-toggle {
    position: relative;
    width: 58px;
    height: 32px;
    flex: 0 0 58px;
    padding: 0;
    border: 1px solid #DDE6F2;
    border-radius: 999px;
    background: #F3F6FA;
    cursor: pointer;
    outline: none;
}

.bp-theme-toggle::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #FFFFFF;
    box-shadow: 0 3px 10px rgba(28, 48, 78, .16);
    transition: transform .22s ease, background-color .22s ease;
}

.bp-theme-toggle__sun,
.bp-theme-toggle__moon {
    position: absolute;
    top: 50%;
    width: 18px;
    height: 18px;
    transform: translateY(-50%);
    z-index: 1;
    display: grid;
    place-items: center;
}

.bp-theme-toggle__sun {
    left: 7px;
    color: #F4A51C;
}

.bp-theme-toggle__moon {
    right: 7px;
    color: #607089;
}

.bp-theme-toggle svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bp-theme-toggle__moon svg path {
    fill: currentColor;
    stroke: none;
}

.bp-theme-toggle:focus-visible {
    box-shadow: 0 0 0 4px rgba(21, 94, 239, .14);
}

/* Global dark palette */
html.bp-dark {
    --bp-navy:#EAF1FF;
    --bp-ink:#E7EDF7;
    --bp-muted:#9BA9BC;
    --bp-line:#2C394C;
    --bp-soft:#101827;
    --bp-white:#172131;
    --bp-shadow:0 18px 60px rgba(0,0,0,.30);
}

html.bp-dark body {
    background:#0B1220 !important;
    color:#E7EDF7 !important;
}

html.bp-dark .bp-page {
    background:#0B1220;
}

html.bp-dark .bp-header {
    background:rgba(11,18,32,.92) !important;
    border-bottom-color:rgba(76,92,116,.42) !important;
}

html.bp-dark .bp-brand {
    color:#F3F7FF;
}

html.bp-dark .bp-nav {
    color:#AEB9C9;
}

html.bp-dark .bp-nav a:hover {
    color:#78A7FF;
}

html.bp-dark .bp-user-name {
    color:#DCE5F3;
}

html.bp-dark .bp-theme-toggle {
    background:#172235;
    border-color:#334156;
}

html.bp-dark .bp-theme-toggle::after {
    transform:translateX(26px);
    background:#24334A;
}

html.bp-dark .bp-theme-toggle__sun {
    color:#7E8AA0;
}

html.bp-dark .bp-theme-toggle__moon {
    color:#D9E6FF;
}

html.bp-dark .bp-btn--ghost {
    background:#182438 !important;
    color:#D8E2F1 !important;
}

html.bp-dark .bp-btn--light,
html.bp-dark .bp-btn--white {
    background:#182438 !important;
    color:#9FC0FF !important;
}

html.bp-dark .bp-hero {
    background:linear-gradient(180deg,#0D1626 0%,#0B1220 100%) !important;
}

html.bp-dark .bp-hero h1 {
    color:#F1F5FC !important;
}

html.bp-dark .bp-hero__copy>p,
html.bp-dark .bp-section__head p,
html.bp-dark .bp-game-card__body p,
html.bp-dark .bp-featured-card__body p,
html.bp-dark .bp-promo-card p {
    color:#9BA9BC !important;
}

html.bp-dark .bp-hero__stats strong {
    color:#DDE8F8 !important;
}

html.bp-dark .bp-hero__stats span {
    color:#8391A6 !important;
}

html.bp-dark .bp-ad-strip {
    background:#111B2B !important;
    border-color:#2B394D !important;
    color:#94A2B6 !important;
}

html.bp-dark .bp-ad-strip__label {
    border-color:#344256 !important;
}

html.bp-dark .bp-ad-strip__content strong {
    color:#BCC8D8 !important;
}

html.bp-dark .bp-section--soft {
    background:#101827 !important;
}

html.bp-dark .bp-section__head h2,
html.bp-dark .bp-featured-card__body h3,
html.bp-dark .bp-game-card__body h3,
html.bp-dark .bp-promo-card h3 {
    color:#EDF3FC !important;
}

html.bp-dark .bp-featured-card,
html.bp-dark .bp-game-card,
html.bp-dark .bp-promo-card {
    background:#151F2E !important;
    border-color:#2C394B !important;
    box-shadow:0 10px 30px rgba(0,0,0,.18);
}

html.bp-dark .bp-game-card:hover,
html.bp-dark .bp-featured-card:hover {
    border-color:#43658F !important;
    box-shadow:0 16px 42px rgba(0,0,0,.28) !important;
}

html.bp-dark .bp-game-card__image--read,
html.bp-dark .bp-game-card__image--quiz,
html.bp-dark .bp-game-card__image--typing,
html.bp-dark .bp-game-card__image--memory,
html.bp-dark .bp-game-card__image--puzzle,
html.bp-dark .bp-game-card__image--detective,
html.bp-dark .bp-game-card__image--brain,
html.bp-dark .bp-game-card__image--word,
html.bp-dark .bp-game-card__image--soon {
    filter:brightness(.72) saturate(.85);
}

html.bp-dark .bp-promo-card--ad {
    background:#111A29 !important;
}

html.bp-dark .bp-login-card {
    background:#151F2E !important;
    border:1px solid #2D3A4D;
    color:#E7EDF7;
}

html.bp-dark .bp-login-card h2 {
    color:#F2F6FC;
}

html.bp-dark .bp-login-card__head p,
html.bp-dark .bp-social-login__label {
    color:#95A3B6;
}

html.bp-dark .bp-login-form input[type=text],
html.bp-dark .bp-login-form input[type=password] {
    background:#0E1725 !important;
    border-color:#334156 !important;
    color:#E9EFF8 !important;
}

html.bp-dark .bp-login-form input::placeholder {
    color:#6E7C91 !important;
}

html.bp-dark .bp-login-options {
    color:#98A5B8;
}

html.bp-dark .bp-social-login {
    border-top-color:#2C394B !important;
}

html.bp-dark .bp-social-btn {
    background:#111B2A !important;
    border-color:#324054 !important;
    color:#DCE5F2 !important;
}

html.bp-dark .bp-modal__backdrop {
    background:rgba(0,4,12,.72);
}

/* Native / generic controls on future subpages */
html.bp-dark input,
html.bp-dark textarea,
html.bp-dark select {
    background-color:#0F1826;
    color:#E7EDF7;
    border-color:#344257;
}

html.bp-dark input::placeholder,
html.bp-dark textarea::placeholder {
    color:#74839A;
}

@media(max-width:720px){
    .bp-theme-toggle {
        width:52px;
        flex-basis:52px;
    }

    .bp-theme-toggle::after {
        width:22px;
        height:22px;
        top:4px;
    }

    html.bp-dark .bp-theme-toggle::after {
        transform:translateX(22px);
    }
}


/* =========================================================
   BiblePang Advertising System
   Desktop: left + content + right
   Tablet/Mobile: content only
   ========================================================= */

.bp-side-ad {
    position: fixed;
    top: 102px;
    z-index: 80;
    width: 160px;
    min-height: 600px;
}

.bp-side-ad--left {
    left: max(18px, calc((100vw - 1780px) / 2));
}

.bp-side-ad--right {
    right: max(18px, calc((100vw - 1780px) / 2));
}

.bp-content-ad {
    margin-top: 26px;
    margin-bottom: 12px;
}

.bp-content-ad__label {
    margin: 0 0 7px;
    color: #9AA6B6;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.4px;
    text-align: center;
}

.bp-content-ad__slot {
    width: 100%;
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Visible mock ads used while TEST_MODE=true */
.bp-ad-test {
    position: relative;
    overflow: hidden;
    border: 1px dashed #B9C9DD;
    background:
        linear-gradient(135deg, rgba(21,94,239,.035) 25%, transparent 25%) 0 0/18px 18px,
        linear-gradient(315deg, rgba(21,94,239,.035) 25%, transparent 25%) 0 0/18px 18px,
        #F8FAFD;
    color: #718198;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.bp-ad-test::after {
    content: "Google AdSense";
    position: absolute;
    left: 50%;
    bottom: 12px;
    transform: translateX(-50%);
    white-space: nowrap;
    color: #A1ADBD;
    font-size: 9px;
    letter-spacing: .6px;
}

.bp-ad-test--left,
.bp-ad-test--right {
    width: 160px;
    height: 600px;
    border-radius: 14px;
}

.bp-ad-test--content {
    width: 100%;
    min-height: 100px;
    border-radius: 15px;
}

.bp-ad-test__badge {
    margin-bottom: 10px;
    padding: 4px 7px;
    border: 1px solid #BDD0EA;
    border-radius: 999px;
    background: #FFFFFF;
    color: #5276A6;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.2px;
}

.bp-ad-test strong {
    color: #49627F;
    font-size: 13px;
    letter-spacing: .3px;
}

.bp-ad-test > span:not(.bp-ad-test__badge) {
    margin-top: 5px;
    font-size: 11px;
}

.bp-ad-test small {
    margin-top: 6px;
    color: #A1ADBD;
    font-size: 8px;
}

.bp-adsense-unit--content {
    width: 100%;
}

/*
 * Side advertising:
 * - desktop >= 1580px: original 160x600 rails
 * - small/medium desktop 1101-1579px: 120x600 rails
 * - <=1100px: hide side rails and use content ads only
 */
@media (max-width:1100px){
    .bp-side-ad{
        display:none!important;
    }
}

@media (min-width:1101px) and (max-width:1579px){
    .bp-side-ad{
        display:block!important;
        width:120px!important;
        min-height:600px!important;
        top:92px!important;
    }

    .bp-side-ad--left{
        left:6px!important;
    }

    .bp-side-ad--right{
        right:6px!important;
    }

    .bp-side-ad .bp-ad-test,
    .bp-side-ad .bp-adsense-unit,
    .bp-adsense-unit--left,
    .bp-adsense-unit--right{
        width:120px!important;
        max-width:120px!important;
        height:600px!important;
    }

    /* Keep the central site responsive between the two tablet ad rails. */
    .bp-container{
        width:min(1360px,calc(100% - 304px))!important;
    }

    .bp-main .bp-container{
        max-width:calc(100% - 304px)!important;
    }
}

@media (max-width: 720px) {
    .bp-content-ad {
        width: calc(100% - 24px);
        margin-top: 18px;
    }

    .bp-content-ad__slot {
        min-height: 90px;
    }

    .bp-ad-test--content {
        min-height: 90px;
    }
}

/* Dark mode */
html.bp-dark .bp-ad-test {
    border-color: #35465E;
    background:
        linear-gradient(135deg, rgba(94,139,212,.045) 25%, transparent 25%) 0 0/18px 18px,
        linear-gradient(315deg, rgba(94,139,212,.045) 25%, transparent 25%) 0 0/18px 18px,
        #111B2A;
    color: #91A1B6;
}

html.bp-dark .bp-ad-test__badge {
    border-color: #405774;
    background: #182438;
    color: #9FB8DB;
}

html.bp-dark .bp-ad-test strong {
    color: #BBC9DA;
}

html.bp-dark .bp-ad-test small,
html.bp-dark .bp-ad-test::after,
html.bp-dark .bp-content-ad__label {
    color: #6F7F96;
}
@media (min-width: 1580px) {
    .bp-hero__copy {
        transform: translateX(40px);
    }
}
/* Header BiblePang brand */
.bp-header .bp-brand .bp-brand__name {
    margin-left: 2px !important;
    font-size: 24px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: -0.5px !important;
}

/* BiblePang header logo - slightly smaller */
.bp-header .bp-brand__mark,
.bp-header .bp-brand__logo {
    width: 40px !important;
    height: 40px !important;
}
.bp-header .bp-brand__logo {
    display: block;
    object-fit: contain;
}

@media (max-width: 767px) {
    .bp-header .bp-brand__mark,
    .bp-header .bp-brand__logo {
        width: 35px !important;
        height: 35px !important;
    }
}
/* Featured / Popular images - Dark Mode */
html.bp-dark .bp-featured-card__img {
    filter: brightness(0.72) saturate(0.9);
    transition: filter 0.25s ease;
}

/* =========================================================
   Bible Sudoku / Coming Soon card text clarity
   기존 .bp-game-card.is-soon { opacity:.7; } 때문에 카드 전체가 흐려지는 문제 수정
   ========================================================= */
.bp-game-card.is-soon{
    opacity:1 !important;
}

.bp-game-card.is-soon .bp-game-card__body h3{
    color:var(--bp-ink) !important;
}

.bp-game-card.is-soon .bp-game-card__body p{
    color:#7C899B !important;
}

.bp-game-card.is-soon .bp-game-card__action{
    color:var(--bp-blue) !important;
}

html.bp-dark .bp-game-card.is-soon .bp-game-card__body h3{
    color:#EDF3FC !important;
}

html.bp-dark .bp-game-card.is-soon .bp-game-card__body p{
    color:#9BA9BC !important;
}

html.bp-dark .bp-game-card.is-soon .bp-game-card__action{
    color:#8FB8FF !important;
}


/* =========================================================
   BiblePang Member Benefit Gold Seal — Dark Mode
   index.php의 금박 씰 다크모드와 동일한 보정값.
   ========================================================= */
html.bp-dark .bp-member-benefit-seal img,
body.bp-dark .bp-member-benefit-seal img,
html[data-theme="dark"] .bp-member-benefit-seal img{
    opacity:.96!important;
    filter:
        brightness(.72)
        contrast(1.18)
        saturate(.88)
        sepia(.08)!important;
}

html.bp-dark .bp-member-benefit-seal,
body.bp-dark .bp-member-benefit-seal,
html[data-theme="dark"] .bp-member-benefit-seal{
    filter:
        drop-shadow(0 20px 30px rgba(0,0,0,.68))
        drop-shadow(0 0 7px rgba(201,145,34,.16))!important;
}

html.bp-dark .bp-member-benefit-seal:hover img,
html.bp-dark .bp-member-benefit-seal:focus-visible img,
body.bp-dark .bp-member-benefit-seal:hover img,
body.bp-dark .bp-member-benefit-seal:focus-visible img,
html[data-theme="dark"] .bp-member-benefit-seal:hover img,
html[data-theme="dark"] .bp-member-benefit-seal:focus-visible img{
    opacity:1!important;
    filter:
        brightness(.86)
        contrast(1.16)
        saturate(.98)
        sepia(.04)!important;
}

html.bp-dark .bp-member-benefit-seal:hover,
html.bp-dark .bp-member-benefit-seal:focus-visible,
body.bp-dark .bp-member-benefit-seal:hover,
body.bp-dark .bp-member-benefit-seal:focus-visible,
html[data-theme="dark"] .bp-member-benefit-seal:hover,
html[data-theme="dark"] .bp-member-benefit-seal:focus-visible{
    z-index:2147483647!important;
    filter:
        drop-shadow(0 30px 44px rgba(0,0,0,.72))
        drop-shadow(0 0 15px rgba(224,166,48,.26))!important;
}

/* =========================================================
   Featured Games heading = BiblePang 게임 heading
   두 섹션 제목의 색상을 라이트/다크 모드에서 정확히 통일합니다.
   ========================================================= */
.bp-section--featured .bp-section__head h2{
    color:#10213B !important;
}

html.bp-dark .bp-section--featured .bp-section__head h2,
body.bp-dark .bp-section--featured .bp-section__head h2,
html[data-theme="dark"] .bp-section--featured .bp-section__head h2{
    color:#EDF3FC !important;
}



/* BiblePang game content guide: isolated AdSense/content-quality enhancement */
.bp-game-guide{margin:22px 0 8px;border:1px solid var(--bp-line,#e7edf5);border-radius:18px;background:var(--bp-white,#fff);box-shadow:0 8px 24px rgba(24,62,123,.06);overflow:hidden}
.bp-game-guide>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 19px;font-weight:900;color:var(--bp-ink,#12233f);user-select:none}
.bp-game-guide>summary::-webkit-details-marker{display:none}
.bp-game-guide>summary::after{content:'+';flex:0 0 28px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--bp-soft,#f5f8fc);color:var(--bp-blue,#155eef);font-size:20px;line-height:1;transition:transform .2s ease}
.bp-game-guide[open]>summary::after{content:'−'}
.bp-game-guide>summary small{display:block;margin-top:3px;font-size:12px;font-weight:600;color:var(--bp-muted,#66758a)}
.bp-game-guide__title{display:flex;flex-direction:column;min-width:0}
.bp-game-guide__body{padding:0 19px 20px;border-top:1px solid var(--bp-line,#e7edf5);color:var(--bp-ink,#12233f)}
.bp-game-guide__body h3{margin:18px 0 7px;font-size:16px;line-height:1.35;color:var(--bp-ink,#12233f)}
.bp-game-guide__body p{margin:0 0 10px;font-size:14px;line-height:1.78;color:var(--bp-muted,#66758a)}
.bp-game-guide__body ul{margin:8px 0 4px;padding-left:20px}
.bp-game-guide__body li{margin:6px 0;font-size:14px;line-height:1.65;color:var(--bp-muted,#66758a)}
.bp-public-game-intro{max-width:980px;margin:28px auto;padding:0 18px}
.bp-public-game-intro__hero{padding:28px;border:1px solid var(--bp-line,#e7edf5);border-radius:22px;background:var(--bp-white,#fff);box-shadow:0 12px 34px rgba(24,62,123,.08)}
.bp-public-game-intro__hero .bp-kicker{margin-bottom:8px}
.bp-public-game-intro__hero h1{margin:0 0 10px;font-size:clamp(28px,4vw,42px);color:var(--bp-ink,#12233f)}
.bp-public-game-intro__hero p{margin:0;color:var(--bp-muted,#66758a);font-size:15px;line-height:1.75}
.bp-public-game-intro__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.bp-public-game-intro__actions a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;border-radius:12px;text-decoration:none;font-weight:800}
.bp-public-game-intro__actions .is-primary{background:var(--bp-blue,#155eef);color:#fff}
.bp-public-game-intro__actions .is-secondary{border:1px solid var(--bp-line,#e7edf5);color:var(--bp-ink,#12233f);background:var(--bp-white,#fff)}
html.bp-dark .bp-game-guide,html.bp-dark .bp-public-game-intro__hero{background:var(--bp-white,#172131);border-color:var(--bp-line,#2c394c);box-shadow:0 12px 30px rgba(0,0,0,.22)}
@media(max-width:640px){.bp-game-guide{margin:16px 0 6px;border-radius:14px}.bp-game-guide>summary{padding:14px 15px}.bp-game-guide__body{padding:0 15px 16px}.bp-public-game-intro{padding:0 12px;margin:18px auto}.bp-public-game-intro__hero{padding:20px;border-radius:18px}}


/* BiblePang content guide shell: keeps guide outside each game's UI layout */
.bp-game-guide-shell{
    width:min(1180px,calc(100% - 36px));
    margin:22px auto 42px;
}
.bp-game-guide-shell .bp-game-guide{margin:0}
@media(max-width:640px){
    .bp-game-guide-shell{width:calc(100% - 24px);margin:16px auto 28px}
}


/* =========================================================
   BiblePang Game Guide UI — unified final CSS
   대상: 성경읽기/성경타자/성경빙고 제외, 나머지 게임의
         "게임방법과 학습 안내" 펼침 UI
   ========================================================= */

.bp-game-guide-shell{
    width:min(1180px, calc(100% - 32px)) !important;
    max-width:1180px !important;
    margin:24px auto 42px !important;
    padding:0 !important;
    clear:both !important;
    float:none !important;
    position:relative !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    box-sizing:border-box !important;
}

.bp-public-game-intro{
    width:min(1180px, calc(100% - 32px)) !important;
    max-width:1180px !important;
    margin:28px auto 42px !important;
    padding:0 !important;
    box-sizing:border-box !important;
}

.bp-game-guide,
.bp-game-guide-shell,
.bp-public-game-intro{
    --bp-guide-accent:var(--bp-site-accent,var(--bp-main-accent,var(--bp-theme-accent,#1769e0)));
    --bp-guide-accent-2:var(--bp-site-accent-2,var(--bp-main-accent-2,var(--bp-theme-accent-2,#4388eb)));
    --bp-guide-deep:var(--bp-site-deep,var(--bp-main-deep,var(--bp-theme-deep,#0d52bc)));
    --bp-guide-soft:var(--bp-site-soft,var(--bp-main-soft,#edf5ff));
    --bp-guide-bg:var(--bp-white,#fff);
    --bp-guide-ink:var(--bp-ink,#17233b);
    --bp-guide-muted:var(--bp-muted,#66758a);
    --bp-guide-line:var(--bp-line,#e6edf5);
}

.bp-game-guide{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid color-mix(in srgb,var(--bp-guide-accent) 22%,var(--bp-guide-line)) !important;
    border-radius:20px !important;
    background:var(--bp-guide-bg) !important;
    box-shadow:0 12px 30px rgba(23,49,86,.08) !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
}

.bp-game-guide>summary{
    list-style:none !important;
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:16px !important;
    min-height:76px !important;
    padding:17px 22px 17px 72px !important;
    cursor:pointer !important;
    user-select:none !important;
    color:var(--bp-guide-ink) !important;
    background:linear-gradient(
        90deg,
        color-mix(in srgb,var(--bp-guide-soft) 72%,#fff) 0%,
        color-mix(in srgb,var(--bp-guide-soft) 26%,#fff) 42%,
        #fff 100%
    ) !important;
    border:0 !important;
    box-sizing:border-box !important;
}
.bp-game-guide>summary::-webkit-details-marker{display:none !important}

.bp-game-guide>summary::before{
    content:"📘" !important;
    position:absolute !important;
    left:22px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    width:34px !important;
    height:34px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:50% !important;
    background:color-mix(in srgb,var(--bp-guide-accent) 12%,#fff) !important;
    border:1px solid color-mix(in srgb,var(--bp-guide-accent) 24%,transparent) !important;
    box-shadow:0 4px 12px color-mix(in srgb,var(--bp-guide-accent) 12%,transparent) !important;
    font-size:16px !important;
    line-height:1 !important;
}

.bp-game-guide>summary::after{
    content:"⌄" !important;
    flex:0 0 34px !important;
    width:34px !important;
    height:34px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:50% !important;
    background:#fff !important;
    color:var(--bp-guide-deep) !important;
    border:1px solid color-mix(in srgb,var(--bp-guide-accent) 24%,var(--bp-guide-line)) !important;
    box-shadow:0 4px 12px rgba(23,49,86,.06) !important;
    font-size:20px !important;
    font-weight:900 !important;
    line-height:1 !important;
    transition:transform .18s ease,background-color .18s ease !important;
}
.bp-game-guide[open]>summary::after{
    transform:rotate(180deg) !important;
}

.bp-game-guide>summary:hover{
    background:linear-gradient(
        90deg,
        color-mix(in srgb,var(--bp-guide-soft) 86%,#fff) 0%,
        color-mix(in srgb,var(--bp-guide-soft) 38%,#fff) 44%,
        #fff 100%
    ) !important;
}
.bp-game-guide>summary:focus-visible{
    outline:3px solid color-mix(in srgb,var(--bp-guide-accent) 24%,transparent) !important;
    outline-offset:-3px !important;
}

.bp-game-guide__title{
    display:flex !important;
    flex-direction:column !important;
    min-width:0 !important;
    gap:4px !important;
    font-size:18px !important;
    line-height:1.35 !important;
    font-weight:900 !important;
    color:var(--bp-guide-deep) !important;
}
.bp-game-guide__title small,
.bp-game-guide>summary small{
    display:block !important;
    margin:0 !important;
    font-size:12.5px !important;
    line-height:1.55 !important;
    font-weight:600 !important;
    color:var(--bp-guide-muted) !important;
}

.bp-game-guide__body{
    display:block !important;
    padding:28px 30px 30px !important;
    border-top:1px solid color-mix(in srgb,var(--bp-guide-accent) 14%,var(--bp-guide-line)) !important;
    background:linear-gradient(
        180deg,
        color-mix(in srgb,var(--bp-guide-soft) 10%,#fff) 0%,
        #fff 100%
    ) !important;
    color:var(--bp-guide-ink) !important;
    box-sizing:border-box !important;
}

.bp-game-guide__body h3{
    margin:24px 0 9px !important;
    padding:0 0 8px 14px !important;
    position:relative !important;
    font-size:15.5px !important;
    line-height:1.45 !important;
    font-weight:900 !important;
    color:var(--bp-guide-deep) !important;
    border-bottom:1px solid color-mix(in srgb,var(--bp-guide-accent) 12%,var(--bp-guide-line)) !important;
}
.bp-game-guide__body h3:first-child{margin-top:0 !important}
.bp-game-guide__body h3::before{
    content:"" !important;
    position:absolute !important;
    left:0 !important;
    top:.28em !important;
    width:4px !important;
    height:1.05em !important;
    border-radius:4px !important;
    background:linear-gradient(180deg,var(--bp-guide-accent-2),var(--bp-guide-deep)) !important;
}

.bp-game-guide__body p{
    margin:0 0 14px !important;
    font-size:14px !important;
    line-height:1.9 !important;
    color:var(--bp-guide-muted) !important;
    letter-spacing:-.01em !important;
    word-break:keep-all !important;
    overflow-wrap:anywhere !important;
}
.bp-game-guide__body ul{
    margin:4px 0 16px !important;
    padding:0 0 0 22px !important;
}
.bp-game-guide__body li{
    margin:8px 0 !important;
    padding-left:2px !important;
    font-size:14px !important;
    line-height:1.8 !important;
    color:var(--bp-guide-muted) !important;
    word-break:keep-all !important;
    overflow-wrap:anywhere !important;
}
.bp-game-guide__body li::marker{
    color:var(--bp-guide-accent) !important;
}

/* 공개 비회원 안내 */
.bp-public-game-intro__hero{
    border:1px solid color-mix(in srgb,var(--bp-guide-accent) 22%,var(--bp-guide-line)) !important;
    border-radius:22px !important;
    background:linear-gradient(
        135deg,
        color-mix(in srgb,var(--bp-guide-soft) 66%,#fff) 0%,
        #fff 48%,
        #fff 100%
    ) !important;
    box-shadow:0 14px 34px rgba(23,49,86,.08) !important;
}
.bp-public-game-intro__hero h1{color:var(--bp-guide-ink) !important}
.bp-public-game-intro__hero p{
    line-height:1.8 !important;
    color:var(--bp-guide-muted) !important;
}
.bp-public-game-intro__actions{gap:10px !important}
.bp-public-game-intro__actions .is-primary{
    background:linear-gradient(135deg,var(--bp-guide-deep),var(--bp-guide-accent)) !important;
    border:1px solid var(--bp-guide-deep) !important;
    color:#fff !important;
    box-shadow:0 6px 16px color-mix(in srgb,var(--bp-guide-accent) 20%,transparent) !important;
}
.bp-public-game-intro__actions .is-secondary{
    background:#fff !important;
    color:var(--bp-guide-deep) !important;
    border:1px solid color-mix(in srgb,var(--bp-guide-accent) 24%,var(--bp-guide-line)) !important;
}

/* DARK MODE */
html.bp-dark .bp-game-guide,
body.bp-dark .bp-game-guide,
html[data-theme="dark"] .bp-game-guide{
    background:#172131 !important;
    border-color:color-mix(in srgb,var(--bp-guide-accent) 34%,#2b394c) !important;
    box-shadow:0 14px 34px rgba(0,0,0,.28) !important;
}
html.bp-dark .bp-game-guide>summary,
body.bp-dark .bp-game-guide>summary,
html[data-theme="dark"] .bp-game-guide>summary{
    background:linear-gradient(
        90deg,
        color-mix(in srgb,var(--bp-guide-accent) 14%,#172131) 0%,
        #172131 48%,
        #172131 100%
    ) !important;
}
html.bp-dark .bp-game-guide>summary::before,
body.bp-dark .bp-game-guide>summary::before,
html[data-theme="dark"] .bp-game-guide>summary::before{
    background:color-mix(in srgb,var(--bp-guide-accent) 16%,#101827) !important;
    border-color:color-mix(in srgb,var(--bp-guide-accent) 34%,#2b394c) !important;
}
html.bp-dark .bp-game-guide>summary::after,
body.bp-dark .bp-game-guide>summary::after,
html[data-theme="dark"] .bp-game-guide>summary::after{
    background:#101827 !important;
    color:color-mix(in srgb,var(--bp-guide-accent-2) 78%,#fff) !important;
    border-color:color-mix(in srgb,var(--bp-guide-accent) 34%,#2b394c) !important;
    box-shadow:none !important;
}
html.bp-dark .bp-game-guide__title,
body.bp-dark .bp-game-guide__title,
html[data-theme="dark"] .bp-game-guide__title{
    color:color-mix(in srgb,var(--bp-guide-accent-2) 74%,#fff) !important;
}
html.bp-dark .bp-game-guide__title small,
html.bp-dark .bp-game-guide>summary small,
body.bp-dark .bp-game-guide__title small,
body.bp-dark .bp-game-guide>summary small,
html[data-theme="dark"] .bp-game-guide__title small,
html[data-theme="dark"] .bp-game-guide>summary small{
    color:#aab6c6 !important;
}
html.bp-dark .bp-game-guide__body,
body.bp-dark .bp-game-guide__body,
html[data-theme="dark"] .bp-game-guide__body{
    background:linear-gradient(
        180deg,
        color-mix(in srgb,var(--bp-guide-accent) 5%,#172131) 0%,
        #172131 100%
    ) !important;
    border-top-color:color-mix(in srgb,var(--bp-guide-accent) 24%,#2b394c) !important;
}
html.bp-dark .bp-game-guide__body h3,
body.bp-dark .bp-game-guide__body h3,
html[data-theme="dark"] .bp-game-guide__body h3{
    color:color-mix(in srgb,var(--bp-guide-accent-2) 72%,#fff) !important;
    border-bottom-color:color-mix(in srgb,var(--bp-guide-accent) 18%,#2b394c) !important;
}
html.bp-dark .bp-game-guide__body p,
html.bp-dark .bp-game-guide__body li,
body.bp-dark .bp-game-guide__body p,
body.bp-dark .bp-game-guide__body li,
html[data-theme="dark"] .bp-game-guide__body p,
html[data-theme="dark"] .bp-game-guide__body li{
    color:#aeb9c9 !important;
}
html.bp-dark .bp-public-game-intro__hero,
body.bp-dark .bp-public-game-intro__hero,
html[data-theme="dark"] .bp-public-game-intro__hero{
    background:linear-gradient(
        135deg,
        color-mix(in srgb,var(--bp-guide-accent) 10%,#172131) 0%,
        #172131 48%,
        #172131 100%
    ) !important;
    border-color:color-mix(in srgb,var(--bp-guide-accent) 34%,#2b394c) !important;
    box-shadow:0 14px 34px rgba(0,0,0,.26) !important;
}
html.bp-dark .bp-public-game-intro__hero h1,
body.bp-dark .bp-public-game-intro__hero h1,
html[data-theme="dark"] .bp-public-game-intro__hero h1{
    color:#edf3fc !important;
}
html.bp-dark .bp-public-game-intro__hero p,
body.bp-dark .bp-public-game-intro__hero p,
html[data-theme="dark"] .bp-public-game-intro__hero p{
    color:#aeb9c9 !important;
}
html.bp-dark .bp-public-game-intro__actions .is-secondary,
body.bp-dark .bp-public-game-intro__actions .is-secondary,
html[data-theme="dark"] .bp-public-game-intro__actions .is-secondary{
    background:#182438 !important;
    color:color-mix(in srgb,var(--bp-guide-accent-2) 74%,#fff) !important;
    border-color:color-mix(in srgb,var(--bp-guide-accent) 34%,#334156) !important;
}

/* RESPONSIVE */
@media(max-width:900px){
    .bp-game-guide-shell,
    .bp-public-game-intro{
        width:min(100% - 24px,1180px) !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }
    .bp-game-guide__body{
        padding:24px 22px 26px !important;
    }
}
@media(max-width:640px){
    .bp-game-guide-shell,
    .bp-public-game-intro{
        width:calc(100% - 20px) !important;
        margin-top:16px !important;
        margin-bottom:26px !important;
    }
    .bp-game-guide{border-radius:16px !important}
    .bp-game-guide>summary{
        min-height:68px !important;
        padding:14px 54px 14px 56px !important;
        gap:10px !important;
    }
    .bp-game-guide>summary::before{
        left:14px !important;
        width:30px !important;
        height:30px !important;
        font-size:14px !important;
    }
    .bp-game-guide>summary::after{
        position:absolute !important;
        right:14px !important;
        width:30px !important;
        height:30px !important;
        font-size:18px !important;
    }
    .bp-game-guide__title{font-size:16px !important}
    .bp-game-guide__title small,
    .bp-game-guide>summary small{font-size:11.5px !important}
    .bp-game-guide__body{padding:20px 18px 23px !important}
    .bp-game-guide__body h3{font-size:15px !important}
    .bp-game-guide__body p,
    .bp-game-guide__body li{
        font-size:13.5px !important;
        line-height:1.75 !important;
    }
    .bp-public-game-intro__actions{
        display:grid !important;
        grid-template-columns:1fr !important;
    }
    .bp-public-game-intro__actions a{width:100% !important}
}