@font-face {
font-family: 'Vazirmatn';
font-style: normal;
font-weight: 400 800;

font-display: swap;
src: url(/fonts/vazirmatn-arabic.woff2) format('woff2');
unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}

@font-face {
font-family: 'Vazirmatn';
font-style: normal;
font-weight: 400 800;
font-display: swap;
src: url(/fonts/vazirmatn-latin.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
font-family: 'Vazirmatn';
font-style: normal;
font-weight: 400 800;
font-display: swap;
src: url(/fonts/vazirmatn-latin-ext.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {

--brand-900: #10366F;
--brand-800: #154995;
--brand-700: #1A5CBB;
--brand-600: #1870D8;   
--brand-500: #2B86EA;
--brand-400: #5CA4F0;
--brand-200: #B9D8F8;
--brand-100: #DCEBFB;
--brand-50:  #EFF6FE;


--teal-800: #006C68;
--teal-700: #00857F;
--teal-600: #00A39C;
--teal-500: #00B0AC;
--teal-300: #5FD6CF;
--teal-100: #D2F2EF;
--teal-50:  #E9F9F7;


--ink:       #12263F;
--ink-2:     #3D566E;
--ink-3:     #6B8299;
--ink-4:     #9BADBE;
--line:      #DCE6EF;
--line-soft: #EDF2F8;
--surface:   #FFFFFF;
--surface-2: #F6F9FC;
--page:      #F1F6FB;


--ok: #0B8A5E;      --ok-bg: #E2F6EE;      --ok-line: #A5DEC8;
--warn: #9A5B08;    --warn-bg: #FDF1DF;    --warn-line: #EDC98E;
--danger: #B93A2E;  --danger-bg: #FCEAE7;  --danger-line: #EFB0A7;


--grad-brand: linear-gradient(135deg, var(--brand-700) 0%, var(--brand-600) 45%, var(--teal-500) 100%);
--grad-soft:  linear-gradient(135deg, var(--brand-50) 0%, var(--teal-50) 100%);


--sh-xs: 0 1px 2px rgba(18, 38, 63, .06);
--sh-sm: 0 1px 3px rgba(18, 38, 63, .07), 0 1px 2px rgba(18, 38, 63, .04);
--sh-md: 0 4px 12px -2px rgba(18, 38, 63, .09), 0 2px 6px -2px rgba(18, 38, 63, .05);
--sh-lg: 0 12px 28px -8px rgba(18, 38, 63, .14), 0 4px 10px -4px rgba(18, 38, 63, .06);
--sh-brand: 0 8px 20px -6px rgba(24, 112, 216, .40);
--sh-teal:  0 8px 20px -6px rgba(0, 176, 172, .38);


--r-sm: 8px;
--r-md: 12px;
--r-lg: 16px;
--r-xl: 22px;
--r-full: 999px;


--sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
--sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
--sp-12: 48px; --sp-16: 64px; --sp-20: 80px;

--font: 'Vazirmatn', system-ui, -apple-system, 'Segoe UI', sans-serif;
--header-h: 62px;
}



*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
margin: 0;
font-family: var(--font);
font-size: 16px;
font-weight: 400;
line-height: 1.85;
color: var(--ink);
background: var(--page);
direction: rtl;
text-align: right;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
}

img, svg { max-width: 100%; height: auto; display: block; }
button { font: inherit; color: inherit; }
input, textarea, select { font: inherit; }

a { color: var(--brand-600); text-decoration: none; }
a:hover { color: var(--brand-700); }

:focus-visible {
outline: 3px solid var(--brand-400);
outline-offset: 2px;
border-radius: var(--r-sm);
}

::selection { background: var(--brand-100); color: var(--brand-900); }



h1, h2, h3, h4 { margin: 0; font-weight: 800; line-height: 1.5; text-wrap: balance; letter-spacing: -0.01em; }
h1 { font-size: clamp(1.6rem, 5.2vw, 2.5rem); line-height: 1.45; }
h2 { font-size: clamp(1.3rem, 3.6vw, 1.85rem); }
h3 { font-size: clamp(1.05rem, 2.4vw, 1.25rem); font-weight: 700; }
h4 { font-size: 1rem; font-weight: 700; }
p  { margin: 0; }

.lede { font-size: 1.03rem; color: var(--ink-2); font-weight: 400; line-height: 2; }
.muted { color: var(--ink-3); }
.tiny { font-size: .78rem; line-height: 1.7; }
.small { font-size: .875rem; line-height: 1.8; }
.num { font-variant-numeric: tabular-nums; }
.ltr { direction: ltr; unicode-bidi: isolate; }

.eyebrow {
display: inline-flex; align-items: center; gap: var(--sp-2);
font-size: .75rem; font-weight: 700; letter-spacing: .04em;
color: var(--brand-700); background: var(--brand-50);
border: 1px solid var(--brand-100);
padding: 5px 13px; border-radius: var(--r-full);
}
.eyebrow .dot {
width: 7px; height: 7px; border-radius: 50%;
background: var(--teal-500); flex: none;
}

.grad-text {
background: var(--grad-brand);
-webkit-background-clip: text; background-clip: text;
color: transparent;
}



.container { width: 100%; max-width: 1140px; margin-inline: auto; padding-inline: var(--sp-4); }
@media (min-width: 768px) { .container { padding-inline: var(--sp-6); } }

.section { padding-block: var(--sp-12); }
@media (min-width: 768px) { .section { padding-block: var(--sp-16); } }
.section--tight { padding-block: var(--sp-10); }
.section--surface { background: var(--surface); }
.section--soft { background: var(--surface-2); }

.stack { display: flex; flex-direction: column; }
.stack-2 { gap: var(--sp-2); } .stack-3 { gap: var(--sp-3); }
.stack-4 { gap: var(--sp-4); } .stack-6 { gap: var(--sp-6); }

.grid { display: grid; gap: var(--sp-4); }
@media (min-width: 640px)  { .grid-2 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px)  { .grid-3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 640px)  { .grid-3 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px)  { .grid-4 { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 560px)  { .grid-4 { grid-template-columns: repeat(2, 1fr); } }

.section-head { display: flex; flex-direction: column; gap: var(--sp-3); margin-bottom: var(--sp-8); }
.section-head p { color: var(--ink-2); max-width: 62ch; }
.section-head--center { align-items: center; text-align: center; }
.section-head--center p { text-align: center; }

.hidden { display: none !important; }



.site-header {
position: sticky; top: 0; z-index: 60;
background: rgba(255, 255, 255, .92);
backdrop-filter: saturate(1.6) blur(12px);
-webkit-backdrop-filter: saturate(1.6) blur(12px);
border-bottom: 1px solid var(--line);
}
.header-inner {
height: var(--header-h);
display: flex; align-items: center; gap: var(--sp-4);
}
.brand { display: flex; align-items: center; flex: none; }

.site-header--focus .header-inner { justify-content: center; }
.focus-footer {
padding: var(--sp-4) 0 calc(var(--sp-6) + env(safe-area-inset-bottom));
border-top: 1px solid var(--line-soft); text-align: center;
}
.focus-footer p { margin: 0; font-size: .78rem; line-height: 2; color: var(--ink-3); }
.focus-footer a { color: var(--ink-2); font-weight: 600; }
.brand img { height: 34px; width: auto; }
@media (min-width: 480px) { .brand img { height: 38px; } }

.site-nav { display: none; margin-inline-start: var(--sp-4); }
@media (min-width: 940px) {
.site-nav { display: flex; align-items: center; gap: var(--sp-1); }
}
.site-nav a {
padding: 8px 13px; border-radius: var(--r-sm);
font-size: .9rem; font-weight: 600; color: var(--ink-2);
transition: background .15s, color .15s;
}
.site-nav a:hover { background: var(--brand-50); color: var(--brand-700); }

.header-actions { margin-inline-start: auto; display: flex; align-items: center; gap: var(--sp-2); }

.nav-toggle {
display: inline-flex; align-items: center; justify-content: center;
width: 42px; height: 42px; flex: none;
background: var(--surface-2); border: 1px solid var(--line);
border-radius: var(--r-md); cursor: pointer; color: var(--ink-2);
}
@media (min-width: 940px) { .nav-toggle { display: none; } }
.nav-toggle:hover { background: var(--brand-50); border-color: var(--brand-200); }


.mobile-nav {
border-top: 1px solid var(--line);
background: var(--surface);
padding: var(--sp-3) var(--sp-4) var(--sp-5);
}
@media (min-width: 940px) { .mobile-nav { display: none !important; } }
.mobile-nav a {
display: flex; align-items: center; gap: var(--sp-3);
padding: 12px 14px; border-radius: var(--r-md);
font-weight: 600; color: var(--ink); font-size: .95rem;
}
.mobile-nav a:hover { background: var(--brand-50); }
.mobile-nav a svg { color: var(--brand-600); flex: none; }




.sess-in { display: none; }
html.is-signed .sess-out { display: none; }
html.is-signed .hdr-out { display: block; }
html.is-signed .mobile-nav .sess-in { display: flex; }


.hdr-acc { display: none; position: relative; }
@media (min-width: 940px) { html.is-signed .hdr-acc { display: block; } }

.hdr-avatar {
display: inline-flex; align-items: center; justify-content: center;
width: 42px; height: 42px; flex: none;
background: var(--surface-2); border: 1px solid var(--line);
border-radius: var(--r-full); cursor: pointer; color: var(--ink-2);
transition: background .18s, border-color .18s, color .18s;
}
.hdr-avatar:hover { background: var(--brand-50); border-color: var(--brand-200); color: var(--brand-700); }
.hdr-avatar[aria-expanded="true"] { background: var(--brand-50); border-color: var(--brand-400); color: var(--brand-700); }


.hdr-menu {
position: absolute; top: calc(100% + 10px); inset-inline-end: 0;
min-width: 196px; z-index: 70;
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-md); box-shadow: var(--sh-lg);
padding: var(--sp-2);
}
.hdr-menu a, .hdr-menu button {
display: flex; align-items: center; gap: var(--sp-3);
width: 100%; padding: 11px 12px; border: 0; background: none;
border-radius: var(--r-sm); font-size: .92rem; font-weight: 600;
font-family: inherit; color: var(--ink); text-align: start; cursor: pointer;
}
.hdr-menu a svg { color: var(--brand-600); flex: none; }
.hdr-menu a:hover { background: var(--brand-50); color: var(--brand-700); }


.hdr-menu-out, .mn-out button { color: var(--danger); }
.hdr-menu-out svg, .mn-out button svg { color: var(--danger); flex: none; }
.hdr-menu-out:hover { background: var(--danger-bg); }


.mn-out button {
display: flex; align-items: center; gap: var(--sp-3);
width: 100%; padding: 12px 14px; border: 0; background: none;
border-radius: var(--r-md); font-size: .95rem; font-weight: 600;
font-family: inherit; text-align: start; cursor: pointer;
}
.mn-out button:hover { background: var(--danger-bg); }



.btn {
display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
padding: 13px 22px; border: 1px solid transparent; border-radius: var(--r-md);
font-size: .95rem; font-weight: 700; line-height: 1.4;
cursor: pointer; text-align: center; white-space: nowrap;
transition: transform .12s, box-shadow .18s, background .18s, border-color .18s, color .18s;
}
.btn:active { transform: translateY(1px) scale(.995); }
.btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.btn svg { flex: none; }

.btn-primary { background: var(--grad-brand); color: #fff; box-shadow: var(--sh-brand); }
.btn-primary:hover { color: #fff; filter: brightness(1.06); box-shadow: 0 10px 24px -6px rgba(24,112,216,.5); }

.btn-teal { background: var(--teal-600); color: #fff; box-shadow: var(--sh-teal); }
.btn-teal:hover { color: #fff; background: var(--teal-700); }

.btn-outline { background: var(--surface); color: var(--brand-700); border-color: var(--brand-200); box-shadow: var(--sh-xs); }
.btn-outline:hover { background: var(--brand-50); border-color: var(--brand-400); color: var(--brand-800); }

.btn-ghost { background: transparent; color: var(--ink-2); }
.btn-ghost:hover { background: var(--surface-2); color: var(--ink); }

.btn-block { width: 100%; }
.btn-lg { padding: 16px 26px; font-size: 1.02rem; border-radius: var(--r-lg); }

.btn-sm { padding: 9px 15px; font-size: .85rem; min-height: 44px; }



.hero { position: relative; overflow: hidden; background: var(--surface); }
.hero::before {
content: ''; position: absolute; inset-inline-end: -18%; top: -55%;
width: 78%; aspect-ratio: 1; border-radius: 50%;
background: var(--grad-soft); filter: blur(8px); opacity: .85; pointer-events: none;
}
.hero::after {
content: ''; position: absolute; inset-inline-start: -22%; bottom: -48%;
width: 62%; aspect-ratio: 1; border-radius: 50%;
background: radial-gradient(circle, var(--teal-50) 0%, transparent 70%);
pointer-events: none;
}
.hero-inner { position: relative; z-index: 1; padding-block: var(--sp-10) var(--sp-12); }
@media (min-width: 900px) { .hero-inner { padding-block: var(--sp-16) var(--sp-20); } }

.hero-grid { display: grid; gap: var(--sp-10); align-items: center; }
@media (min-width: 940px) { .hero-grid { grid-template-columns: 1.05fr .95fr; gap: var(--sp-12); } }


.hero h1 { margin-block: 0 var(--sp-4); }
.hero-cta { display: flex; flex-direction: column; gap: var(--sp-3); margin-top: var(--sp-8); }
@media (min-width: 480px) { .hero-cta { flex-direction: row; flex-wrap: wrap; } }
@media (min-width: 480px) { .hero-cta .btn { flex: 1 1 200px; } }


.hero-note {
display: flex; align-items: center; gap: var(--sp-2);
margin-top: var(--sp-5); font-size: .82rem; color: var(--ink-3);
}
.hero-note svg { color: var(--teal-600); flex: none; }


.hero-panel {
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-xl); box-shadow: var(--sh-lg); overflow: hidden;
}
.hero-panel-head {
background: var(--grad-brand); color: #fff;
padding: var(--sp-5) var(--sp-6);
}
.hero-panel-head h3 { color: #fff; font-size: 1.05rem; }
.hero-panel-head p { color: rgba(255,255,255,.86); font-size: .84rem; margin-top: 2px; }
.hero-panel-body { padding: var(--sp-5) var(--sp-6) var(--sp-6); }


.hp-lede { font-size: .86rem; color: var(--ink-2); margin-bottom: var(--sp-3); }
.hp-chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-bottom: var(--sp-5); }
.hp-chip {
display: inline-flex; align-items: center; gap: var(--sp-2);
padding: 7px 14px; border: 1px solid var(--brand-100); border-radius: var(--r-full);
background: var(--brand-50); color: var(--ink); font-size: .86rem;
text-decoration: none; transition: border-color .15s, background .15s;
}
.hp-chip:hover { background: var(--brand-100); border-color: var(--brand-200); text-decoration: none; }

.hp-chip b { color: var(--brand-700); font-variant-numeric: tabular-nums; }
.hp-stamp { margin-top: var(--sp-3); font-size: .76rem; color: var(--ink-4); text-align: center; }



.lsearch { position: relative; margin-bottom: var(--sp-5); }
.lsearch-box {
display: flex; align-items: center; gap: var(--sp-2);
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-full); padding: 5px 5px 5px var(--sp-4);
box-shadow: var(--sh-xs); transition: border-color .15s, box-shadow .15s;
}
.lsearch-box:focus-within { border-color: var(--brand-400); box-shadow: var(--sh-sm); }
.lsearch-icon { color: var(--ink-4); flex: none; }
.lsearch-box input {
flex: 1; min-width: 0; border: 0; background: none; outline: none;
font: inherit; font-size: .95rem; color: var(--ink); padding: 8px 0;
}
.lsearch-box input::placeholder { color: var(--ink-4); }

.lsearch-box input::-webkit-search-cancel-button { display: none; }
.lsearch-box .btn { flex: none; border-radius: var(--r-full); }


.lsearch-list {
position: absolute; z-index: 30; inset-inline: 0; top: calc(100% + 6px);
margin: 0; padding: var(--sp-1); list-style: none;
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-lg); box-shadow: var(--sh-lg);
max-height: 340px; overflow-y: auto;
}
.lsearch-list a {
display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap;
padding: var(--sp-3); border-radius: var(--r-md);
color: var(--ink); text-decoration: none;
}
.lsearch-list li.is-active a,
.lsearch-list a:hover { background: var(--brand-50); text-decoration: none; }
.lsearch-name { font-weight: 500; }
.lsearch-meta { font-size: .8rem; color: var(--ink-3); width: 100%; }
.lsearch-empty { padding: var(--sp-4); color: var(--ink-3); font-size: .88rem; text-align: center; }




.newsline { list-style: none; margin: 0 0 var(--sp-6); padding: 0; border-top: 1px solid var(--line); }
.newsline li {
display: grid; grid-template-columns: 6.5em 1fr; gap: var(--sp-1) var(--sp-4);
align-items: baseline; padding-block: var(--sp-3);
border-bottom: 1px solid var(--line);
}
.newsline time {
grid-column: 1; font-size: .78rem; color: var(--ink-4);
font-variant-numeric: tabular-nums;
}
.newsline a { grid-column: 2; color: var(--ink); font-weight: 500; text-decoration: none; }
.newsline a:hover { color: var(--brand-700); text-decoration: underline; }
.newsline p { grid-column: 2; margin: 0; color: var(--ink-2); font-size: .88rem; }
.newsline li.is-lead { padding-block: var(--sp-4); }
.newsline li.is-lead a { font-size: 1.06rem; font-weight: 700; }
.newsline-more { display: flex; justify-content: center; }

@media (max-width: 30rem) {

.newsline li { display: block; }
.newsline time { margin-inline-end: var(--sp-2); }
.newsline p { margin-top: var(--sp-1); }
}




.card {
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-lg); padding: var(--sp-5);
box-shadow: var(--sh-sm);
transition: transform .18s, box-shadow .18s, border-color .18s;
}
.card--pad-lg { padding: var(--sp-6); }
.card--hover:hover { transform: translateY(-3px); box-shadow: var(--sh-lg); border-color: var(--brand-200); }
.card--flat { box-shadow: none; }

.card-icon {
width: 46px; height: 46px; border-radius: var(--r-md);
display: inline-flex; align-items: center; justify-content: center;
margin-bottom: var(--sp-4); flex: none;
}
.card-icon.is-brand { background: var(--brand-50); color: var(--brand-600); border: 1px solid var(--brand-100); }
.card-icon.is-teal  { background: var(--teal-50); color: var(--teal-600); border: 1px solid var(--teal-100); }
.card h3 { margin-bottom: var(--sp-2); }
.card p { color: var(--ink-2); font-size: .92rem; }


.loan-card { display: flex; flex-direction: column; gap: var(--sp-4); height: 100%; }
.loan-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); }
.loan-card h3 { font-size: 1.1rem; }
.loan-specs { display: flex; flex-direction: column; gap: var(--sp-2); margin-top: auto; }
.loan-spec {
display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
padding: 9px 13px; background: var(--surface-2);
border: 1px solid var(--line-soft); border-radius: var(--r-sm); font-size: .86rem;
}
.loan-spec dt { color: var(--ink-3); margin: 0; }
.loan-spec dd { margin: 0; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }


.guide-card { display: flex; gap: var(--sp-4); align-items: flex-start; }
.guide-step {
width: 38px; height: 38px; flex: none; border-radius: var(--r-md);
background: var(--grad-brand); color: #fff;
display: flex; align-items: center; justify-content: center;
font-weight: 800; font-size: .95rem; font-variant-numeric: tabular-nums;
}



.badge {
display: inline-flex; align-items: center; gap: 5px;
padding: 3px 10px; border-radius: var(--r-full);
font-size: .74rem; font-weight: 700; line-height: 1.7; white-space: nowrap;
border: 1px solid transparent;
}
.badge-brand  { background: var(--brand-50); color: var(--brand-700); border-color: var(--brand-100); }
.badge-teal   { background: var(--teal-50); color: var(--teal-700); border-color: var(--teal-100); }
.badge-ok     { background: var(--ok-bg); color: var(--ok); border-color: var(--ok-line); }
.badge-warn   { background: var(--warn-bg); color: var(--warn); border-color: var(--warn-line); }
.badge-danger { background: var(--danger-bg); color: var(--danger); border-color: var(--danger-line); }
.badge-muted  { background: var(--surface-2); color: var(--ink-3); border-color: var(--line); }

.badge-urgent {
background: var(--danger-bg); color: var(--danger); border-color: var(--danger-line);
animation: urgentPulse 1.9s ease-in-out infinite;
}
@keyframes urgentPulse {
0%, 100% { box-shadow: 0 0 0 0 rgba(185, 58, 46, 0); }
50%      { box-shadow: 0 0 0 5px rgba(185, 58, 46, .13); }
}



.checklist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-3); }
.checklist li { display: flex; align-items: flex-start; gap: var(--sp-3); font-size: .93rem; color: var(--ink-2); }
.checklist svg { color: var(--teal-600); flex: none; margin-top: 5px; }



.accordion { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-sm); }
.accordion + .accordion { margin-top: var(--sp-3); }
.accordion-btn {
width: 100%; display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4);
padding: var(--sp-4) var(--sp-5); background: none; border: 0; cursor: pointer;
text-align: right; font-weight: 700; font-size: .96rem; color: var(--ink);
}
.accordion-btn:hover { background: var(--surface-2); }
.accordion-chevron { flex: none; color: var(--ink-4); transition: transform .22s ease; }
.accordion.is-open .accordion-chevron { transform: rotate(180deg); color: var(--brand-600); }
.accordion-body { padding: 0 var(--sp-5) var(--sp-5); color: var(--ink-2); font-size: .93rem; }



.contact-cta {
display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4);
padding: var(--sp-4); border-radius: var(--r-md); text-decoration: none;
transition: transform .14s, box-shadow .16s;
}
.contact-cta:active { transform: scale(.99); }
.contact-cta.is-teal { background: var(--teal-50); border: 1px solid var(--teal-100); }
.contact-cta.is-brand { background: var(--brand-50); border: 1px solid var(--brand-100); }
.contact-cta-label { font-size: .78rem; font-weight: 600; margin-bottom: 1px; }
.contact-cta.is-teal .contact-cta-label { color: var(--teal-700); }
.contact-cta.is-brand .contact-cta-label { color: var(--brand-700); }
.contact-cta-phone { font-size: 1.05rem; font-weight: 800; letter-spacing: .02em; }
.contact-cta.is-teal .contact-cta-phone { color: var(--teal-800); }
.contact-cta.is-brand .contact-cta-phone { color: var(--brand-800); }
.contact-cta-icon {
width: 40px; height: 40px; border-radius: 50%; flex: none;
display: flex; align-items: center; justify-content: center; color: #fff;
}
.contact-cta.is-teal .contact-cta-icon { background: var(--teal-600); }
.contact-cta.is-brand .contact-cta-icon { background: var(--brand-600); }



.flow { min-height: 100dvh; display: flex; flex-direction: column; background: var(--page); }
.flow-header { background: var(--surface); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.flow-header-inner { height: var(--header-h); display: flex; align-items: center; gap: var(--sp-3); }
.flow-back {
width: 40px; height: 40px; flex: none; border-radius: var(--r-md);
display: inline-flex; align-items: center; justify-content: center;
background: var(--surface-2); border: 1px solid var(--line); cursor: pointer; color: var(--ink-2);
}
.flow-back:hover { background: var(--brand-50); color: var(--brand-700); border-color: var(--brand-200); }
.flow-title { font-weight: 700; font-size: .95rem; }
.flow-title span { display: block; font-size: .75rem; font-weight: 500; color: var(--ink-3); }

.progress { padding: var(--sp-4) 0 0; }

.progress-meta {
display: flex; align-items: center; justify-content: space-between;
padding-inline: var(--sp-4);
font-size: .78rem; color: var(--ink-3); margin-bottom: var(--sp-2);
}
.progress-track { height: 7px; background: var(--line-soft); border-radius: var(--r-full); overflow: hidden; }
.progress-bar { height: 100%; background: var(--grad-brand); border-radius: var(--r-full); transition: width .35s cubic-bezier(.4,0,.2,1); }

.flow-body { flex: 1; padding-block: var(--sp-8) var(--sp-12); }
.flow-step { max-width: 520px; margin-inline: auto; }
.flow-question { font-size: 1.22rem; font-weight: 800; line-height: 1.6; margin-bottom: var(--sp-2); }
.flow-hint { font-size: .88rem; color: var(--ink-3); margin-bottom: var(--sp-6); }

.option-list { display: flex; flex-direction: column; gap: var(--sp-3); }
.option {
width: 100%; display: flex; align-items: center; gap: var(--sp-3);
padding: 15px 18px; text-align: right; cursor: pointer;
background: var(--surface); border: 2px solid var(--line); border-radius: var(--r-md);
font-size: .97rem; font-weight: 600; color: var(--ink);
box-shadow: var(--sh-xs); transition: border-color .16s, background .16s, transform .12s;
}
.option:hover { border-color: var(--brand-400); background: var(--brand-50); }
.option:active { transform: scale(.985); }
.option.is-selected { border-color: var(--brand-600); background: var(--brand-50); color: var(--brand-800); }
.option-mark {
width: 22px; height: 22px; flex: none; border-radius: 50%;
border: 2px solid var(--line); display: inline-flex; align-items: center; justify-content: center;
margin-inline-start: auto; color: transparent; transition: all .16s;
}
.option.is-selected .option-mark { border-color: var(--brand-600); background: var(--brand-600); color: #fff; }


.score-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-3); }
.score-btn {
padding: 14px 8px; cursor: pointer; text-align: center;
background: var(--surface); border: 2px solid var(--line); border-radius: var(--r-md);
font-weight: 800; font-size: 1rem; box-shadow: var(--sh-xs);
transition: border-color .16s, background .16s, transform .12s, color .16s;
}
.score-btn:hover { border-color: var(--brand-400); }
.score-btn:active { transform: scale(.97); }
.score-btn.is-selected { border-color: var(--brand-600); background: var(--brand-600); color: #fff; }
.score-btn small { display: block; font-size: .68rem; font-weight: 500; color: var(--ink-3); margin-top: 1px; }
.score-btn.is-selected small { color: rgba(255,255,255,.85); }

.field { display: flex; flex-direction: column; gap: var(--sp-2); }
.field label { font-size: .88rem; font-weight: 700; color: var(--ink-2); }
.input {
width: 100%; padding: 14px 16px; border-radius: var(--r-md);
background: var(--surface); border: 2px solid var(--line); color: var(--ink);
font-size: 1rem; transition: border-color .16s, box-shadow .16s;
}
.input::placeholder { color: var(--ink-4); }
.input:focus { outline: none; border-color: var(--brand-600); box-shadow: 0 0 0 4px var(--brand-50); }
.input.is-valid { border-color: var(--ok); }
.input.is-invalid { border-color: var(--danger); }

.input-suffix {
display: flex; align-items: center; gap: var(--sp-2);
padding: 14px 16px; border-radius: var(--r-md);
background: var(--surface); border: 2px solid var(--line);
transition: border-color .16s, box-shadow .16s;
}
.input-suffix:focus-within {
border-color: var(--brand-600); box-shadow: 0 0 0 4px var(--brand-50);
}
.input-suffix .input {
flex: 1 1 auto; min-width: 0;
padding: 0; border: 0; background: none; border-radius: 0;
}
.input-suffix .input:focus { box-shadow: none; }
.input-suffix .suffix {
flex: 0 0 auto;
font-size: .85rem; color: var(--ink-3); font-weight: 600;
white-space: nowrap; pointer-events: none;
}


.input.num::-webkit-outer-spin-button,
.input.num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.input.num[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.field-error { font-size: .8rem; color: var(--danger); font-weight: 600; }


.combo { position: relative; }
.combo-list {
position: absolute; inset-inline: 0; top: calc(100% + 6px); z-index: 30;

max-height: min(60vh, 420px); overflow-y: auto;
overscroll-behavior: contain;
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-md); box-shadow: var(--sh-lg);
}
.combo-item { width: 100%; padding: 11px 16px; text-align: right; background: none; border: 0; cursor: pointer; font-size: .93rem; color: var(--ink); }
.combo-item:hover { background: var(--brand-50); color: var(--brand-700); }
.combo-empty { padding: 14px 16px; font-size: .87rem; color: var(--ink-3); }


.combo-group {
position: sticky; top: 0; z-index: 1;
padding: 7px 16px;
background: var(--surface-2);
border-block: 1px solid var(--line-soft);
font-size: .76rem; font-weight: 700; letter-spacing: .02em;
color: var(--ink-3);
}
.combo-group:first-child { border-top: 0; }


.notice { display: flex; gap: var(--sp-3); padding: var(--sp-4); border-radius: var(--r-md); font-size: .89rem; line-height: 1.9; }
.notice svg { flex: none; margin-top: 4px; }
.notice-info { background: var(--brand-50); border: 1px solid var(--brand-100); color: var(--brand-900); }
.notice-info svg { color: var(--brand-600); }
.notice-warn { background: var(--warn-bg); border: 1px solid var(--warn-line); color: #6B3F06; }
.notice-warn svg { color: var(--warn); }
.notice-teal { background: var(--teal-50); border: 1px solid var(--teal-100); color: var(--teal-800); }
.notice-teal svg { color: var(--teal-600); }


.success { max-width: 480px; margin-inline: auto; text-align: center; }
.success-icon {
width: 84px; height: 84px; margin-inline: auto; margin-bottom: var(--sp-6);
border-radius: 50%; background: var(--teal-50); border: 2px solid var(--teal-100);
display: flex; align-items: center; justify-content: center; color: var(--teal-600);
animation: popIn .45s cubic-bezier(.34, 1.56, .64, 1);
}
@keyframes popIn { from { transform: scale(.5); opacity: 0; } to { transform: scale(1); opacity: 1; } }

.recap { text-align: right; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.recap-row { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); padding: 11px var(--sp-4); font-size: .89rem; }
.recap-row + .recap-row { border-top: 1px solid var(--line-soft); }
.recap-row dt { color: var(--ink-3); margin: 0; }
.recap-row dd { margin: 0; font-weight: 700; }



.site-footer { background: var(--surface); border-top: 1px solid var(--line); padding-block: var(--sp-12) var(--sp-8); }
.footer-grid { display: grid; gap: var(--sp-8); }
@media (min-width: 720px) { .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; gap: var(--sp-10); } }
.footer-brand img { height: 78px; width: auto; margin-bottom: var(--sp-4); }
.footer-brand-logo { display: block; width: fit-content; }

.footer-brand .footer-tagline { margin: calc(-1 * var(--sp-2)) 0 var(--sp-3); font-size: .95rem; font-weight: 700; color: var(--brand-700); }
.footer-brand p { font-size: .89rem; color: var(--ink-2); max-width: 42ch; }
.footer-col h4 { font-size: .88rem; margin-bottom: var(--sp-4); color: var(--ink); }

.footer-links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.footer-links li { line-height: 1.9; }
.footer-links li:empty { display: none; }
.footer-links a { font-size: .89rem; color: var(--ink-2); }
.footer-links a:hover { color: var(--brand-600); }
.footer-bottom {
margin-top: var(--sp-10); padding-top: var(--sp-6); border-top: 1px solid var(--line);
display: flex; flex-direction: column; gap: var(--sp-3); font-size: .8rem; color: var(--ink-3);
}
@media (min-width: 640px) { .footer-bottom { flex-direction: row; align-items: center; justify-content: space-between; } }
.footer-disclaimer { background: var(--surface-2); border: 1px solid var(--line-soft); border-radius: var(--r-md); padding: var(--sp-4); font-size: .8rem; color: var(--ink-3); line-height: 1.9; margin-top: var(--sp-6); }


.footer-identity {
margin-top: var(--sp-8); padding-top: var(--sp-6); border-top: 1px solid var(--line-soft);
display: flex; flex-direction: column; gap: var(--sp-3); font-size: .86rem; color: var(--ink-2); line-height: 1.9;
}
.footer-company { margin: 0; }
.footer-registry { margin: 0; font-size: .8rem; color: var(--ink-3); }
.footer-registry .ltr { white-space: nowrap; }
.footer-company strong { color: var(--ink); font-weight: 700; }
.footer-address { font-style: normal; display: flex; flex-direction: column; gap: var(--sp-1); }
.footer-address a, .footer-legal a { color: var(--ink-2); }
.footer-address a:hover, .footer-legal a:hover { color: var(--brand-600); }
.footer-legal { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-5); }

.footer-address .ltr, .identity-list .ltr, .contact-cta-phone .ltr { white-space: nowrap; }
@media (min-width: 720px) { .footer-address { flex-direction: row; flex-wrap: wrap; column-gap: var(--sp-6); } }



.identity-card { margin-top: var(--sp-8); }
.identity-card h2 { font-size: 1.05rem; margin-bottom: var(--sp-4); }
.identity-list { margin: 0; display: grid; gap: var(--sp-4); }
.identity-list > div { display: grid; gap: 2px; }
.identity-list dt { font-size: .8rem; font-weight: 600; color: var(--ink-3); }
.identity-list dd { margin: 0; color: var(--ink); line-height: 1.9; }
@media (min-width: 560px) {
.identity-list > div { grid-template-columns: 8.5rem 1fr; gap: var(--sp-4); align-items: baseline; }
}

.identity-actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-6); }
.identity-channel { margin-top: var(--sp-6); font-size: .92rem; color: var(--ink-2); }
.identity-notice { margin-top: var(--sp-6); }

.contact-grid { display: grid; gap: var(--sp-5); }
@media (min-width: 720px) { .contact-grid { grid-template-columns: 1fr 1fr; } }
.contact-grid .card { display: flex; flex-direction: column; gap: var(--sp-4); }
.contact-grid .card h2 { font-size: 1.05rem; margin: 0; }
.contact-grid .card p { margin: 0; flex: 1; }



.toast-container {
position: fixed; bottom: 20px; inset-inline-end: 16px; z-index: 200;
display: flex; flex-direction: column; gap: var(--sp-2); pointer-events: none;
}
.toast {
padding: 11px 17px; border-radius: var(--r-md); color: #fff;
font-size: .87rem; font-weight: 700; max-width: 300px;
box-shadow: var(--sh-lg); direction: rtl;
opacity: 0; transform: translateX(-40px);
transition: opacity .25s, transform .25s;
}
.toast.is-in { opacity: 1; transform: translateX(0); }



.skeleton {
background: linear-gradient(90deg, var(--line-soft) 25%, var(--line) 50%, var(--line-soft) 75%);
background-size: 200% 100%;
animation: shimmer 1.5s ease-in-out infinite;
border-radius: var(--r-md);
}
@keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }




.reveal { opacity: 1; transform: none; }
.js-reveal .reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.js-reveal .reveal.is-visible { opacity: 1; transform: none; }




.flow-step--wide { max-width: 720px; }

.report-hero {
background: var(--grad-brand); color: #fff;
border-radius: var(--r-xl); padding: var(--sp-6);
box-shadow: var(--sh-lg); text-align: center;
}
.report-hero .label { font-size: .82rem; opacity: .88; }
.report-amount {
font-size: clamp(1.7rem, 7vw, 2.3rem); font-weight: 800;
line-height: 1.35; margin: var(--sp-2) 0; font-variant-numeric: tabular-nums;
}
.report-hero .unit { font-size: .95rem; font-weight: 600; opacity: .9; }
.report-tally {
display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sp-2);
margin-top: var(--sp-5);
}
.report-tally .badge { background: rgba(255,255,255,.16); color: #fff; border-color: rgba(255,255,255,.28); }


.report-ungrounded {
background: var(--warn-bg); border: 1px solid var(--warn-line);
border-radius: var(--r-md); padding: var(--sp-4);
display: flex; gap: var(--sp-3); font-size: .9rem; line-height: 1.9; color: #6B3F06;
}
.report-ungrounded svg { color: var(--warn); flex: none; margin-top: 4px; }


.result {
background: var(--surface); border: 1px solid var(--line);
border-inline-start: 4px solid var(--line);
border-radius: var(--r-md); padding: var(--sp-4);
display: flex; flex-direction: column; gap: var(--sp-3);
}
.result.is-eligible { border-inline-start-color: var(--ok); }
.result.is-partial  { border-inline-start-color: var(--warn); }
.result.is-unknown  { border-inline-start-color: var(--ink-3); border-inline-start-style: dashed; }


.results { display: flex; flex-direction: column; gap: var(--sp-3); }


.result-group:not([open]) .results,
.result-group:not([open]) .result-group-note { display: none; }

.result-group { margin-bottom: var(--sp-4); }
.result-group:last-child { margin-bottom: 0; }

.result-group-head {
display: flex; align-items: baseline; justify-content: space-between;
gap: var(--sp-3); cursor: pointer; list-style: none;
padding: var(--sp-3) var(--sp-4);
background: var(--surface-2); border: 1px solid var(--line-soft);
border-radius: var(--r-md);
}
.result-group-head::-webkit-details-marker { display: none; }
.result-group-head:hover { border-color: var(--line); }
.result-group-head:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }


.result-group-title { font-weight: 700; font-size: 1rem; display: flex; align-items: center; gap: var(--sp-2); }
.result-group-title::before {
content: ''; flex: none; width: 0; height: 0;
border-block: 5px solid transparent;
border-inline-end: 6px solid currentColor;
transition: transform .15s ease;
}
.result-group[open] .result-group-title::before { transform: rotate(-90deg); }

.result-group.is-confirmed  .result-group-title { color: var(--ok); }
.result-group.is-mismatch   .result-group-title { color: var(--warn); }
.result-group.is-unverified .result-group-title { color: var(--ink-3); }

.result-group-count { font-size: .82rem; color: var(--ink-3); white-space: nowrap; }

.result-group-note {
font-size: .85rem; color: var(--ink-3); line-height: 1.9;
margin: var(--sp-3) var(--sp-1) var(--sp-3);
}

@media (prefers-reduced-motion: reduce) {
.result-group-title::before { transition: none; }
}


.ask-answers { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-3); }
.ask-answers li {
padding: var(--sp-3); border: 1px solid var(--line);
border-radius: var(--r-md); background: var(--surface-2);
}
.ask-answers a { font-weight: 700; font-size: .95rem; color: var(--brand-700); text-decoration: none; }
.ask-answers a:hover { text-decoration: underline; }
.ask-answers .tiny { margin-top: 4px; line-height: 1.85; }

.result-note {
margin-top: var(--sp-3); padding-top: var(--sp-3);
border-top: 1px dashed var(--line);
font-size: .82rem; line-height: 1.9; color: var(--ink-3);
}
.result.is-blocked  { border-inline-start-color: var(--ink-4); opacity: .82; }
.result-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; }

.result-head > div { min-width: 0; max-width: 100%; }
.result-name { font-weight: 700; font-size: 1rem; }
.result-name a { color: var(--ink); }
.result-name a:hover { color: var(--brand-600); }
.result-bank { font-size: .78rem; color: var(--ink-3); margin-top: 2px; }
.result-amount { font-size: 1.15rem; font-weight: 800; color: var(--brand-700); font-variant-numeric: tabular-nums; }
.result-amount small { font-size: .74rem; font-weight: 600; color: var(--ink-3); }
.result-specs { display: flex; flex-wrap: wrap; gap: var(--sp-2); font-size: .8rem; }
.result-specs span {
background: var(--surface-2); border: 1px solid var(--line-soft);
border-radius: var(--r-sm); padding: 4px 10px; color: var(--ink-2);
}
.result-reasons { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.result-reasons li { display: flex; gap: var(--sp-2); font-size: .86rem; line-height: 1.8; }
.result-reasons svg { flex: none; margin-top: 4px; }
.result-reasons .is-blocker { color: var(--danger); }
.result-reasons .is-gap { color: var(--warn); }


.todo { display: flex; flex-direction: column; gap: var(--sp-3); }
.todo-item {
display: flex; gap: var(--sp-3); align-items: flex-start;
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-md); padding: var(--sp-4);
}
.todo-num {
width: 26px; height: 26px; flex: none; border-radius: 50%;
background: var(--warn-bg); border: 1px solid var(--warn-line); color: var(--warn);
display: flex; align-items: center; justify-content: center;
font-size: .78rem; font-weight: 800; font-variant-numeric: tabular-nums;
}
.todo-item .title { font-weight: 700; font-size: .92rem; }
.todo-item .action { font-size: .85rem; color: var(--ink-2); margin-top: 2px; line-height: 1.85; }


.contact-terms {
margin-top: var(--sp-4); padding: var(--sp-3) var(--sp-4);
background: var(--surface-2); border: 1px solid var(--line);
border-radius: var(--r-md); color: var(--ink-2);
}
.contact-terms p { margin: 0; }
.contact-terms p + p { margin-top: var(--sp-1); }




.breadcrumb { margin-bottom: var(--sp-6); }
.breadcrumb ol {
list-style: none; margin: 0; padding: 0;
display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2);
font-size: .82rem; color: var(--ink-3);
}
.breadcrumb a { color: var(--ink-3); }
.breadcrumb a:hover { color: var(--brand-600); }
.breadcrumb li[aria-current] { color: var(--ink); font-weight: 600; }
.breadcrumb .sep { color: var(--ink-4); }


.prose { color: var(--ink-2); font-size: 1.02rem; line-height: 2.15; max-width: 68ch; }
.prose > * + * { margin-top: var(--sp-5); }
.prose p { margin: 0; }
.prose h2 {
font-size: 1.3rem; font-weight: 800; color: var(--ink);
margin-top: var(--sp-10); line-height: 1.6;
}
.prose h3 {
font-size: 1.08rem; font-weight: 700; color: var(--ink);
margin-top: var(--sp-8); line-height: 1.65;
}
.prose ul, .prose ol { margin: 0; padding-inline-start: var(--sp-6); display: flex; flex-direction: column; gap: var(--sp-3); }
.prose li { padding-inline-start: var(--sp-2); }
.prose li::marker { color: var(--teal-600); font-weight: 700; }

@counter-style persian-num {
system: numeric;
symbols: "۰" "۱" "۲" "۳" "۴" "۵" "۶" "۷" "۸" "۹";
suffix: ". ";
}
.prose ol { list-style-type: persian-num; }
.prose a { text-decoration: underline; text-underline-offset: 3px; }
.prose strong { color: var(--ink); font-weight: 700; }


.prose-table { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--line); border-radius: var(--r-md); }
.prose-table table { width: 100%; border-collapse: collapse; font-size: .93rem; line-height: 1.85; }
.prose-table th, .prose-table td { padding: var(--sp-3) var(--sp-4); text-align: start; vertical-align: top; border-bottom: 1px solid var(--line); }
.prose-table thead th { background: var(--surface); color: var(--ink); font-weight: 700; white-space: nowrap; }
.prose-table tbody tr:last-child td { border-bottom: 0; }
.prose-table td strong { color: var(--ink); }

@media (max-width: 480px) {
.prose .prose-table th, .prose .prose-table td { padding: var(--sp-3); }
.prose .prose-table thead th { white-space: normal; }
}

.prose-note { padding: var(--sp-4); border-radius: var(--r-md); font-size: .95rem; line-height: 2;
background: var(--teal-50); border: 1px solid var(--teal-100); color: var(--teal-800); }
.prose-note--warn { background: var(--warn-bg); border-color: var(--warn-line); color: #6B3F06; }
.prose-note strong { color: inherit; }


.prose-figure { margin-inline: 0; }
.prose-figure img { display: block; width: 100%; height: auto; border-radius: var(--r-md); border: 1px solid var(--line); background: var(--surface); }
.prose-figure figcaption { margin-top: var(--sp-2); font-size: .85rem; line-height: 1.7; color: var(--ink-3); text-align: center; }
.prose > .prose-figure + p { margin-top: var(--sp-5); }

.prose--steps > p + p { margin-top: var(--sp-4); }


.rp-head { border-bottom: 1px solid var(--line); padding-bottom: var(--sp-5); margin-bottom: var(--sp-6); }
.rp-meta { color: var(--ink-3); font-size: .92rem; margin: var(--sp-2) 0 var(--sp-4); }
.rp-sec { margin-bottom: var(--sp-8); }
.rp-sec > h2 { font-size: 1.25rem; margin-bottom: var(--sp-4); }
.rp-sec > h3 { font-size: 1.05rem; margin: var(--sp-5) 0 var(--sp-3); }
.rp-sec p { line-height: 2; color: var(--ink-2); }
.rp-sec .prose-table { margin-bottom: var(--sp-4); }
.rp-sec .prose-table th { width: 42%; }
.rp-sec .prose-note { margin-bottom: var(--sp-3); }

.rp-plan { border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--sp-5); margin-bottom: var(--sp-5); }
.rp-plan-head { display: flex; gap: var(--sp-4); align-items: flex-start; margin-bottom: var(--sp-4); }
.rp-rank { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
background: var(--brand-50); color: var(--brand-700); font-weight: 700; }
.rp-plan h3 { font-size: 1.08rem; margin: 0; }
.rp-bank { color: var(--ink-3); font-size: .9rem; margin: 2px 0 0; }
.rp-label { color: var(--teal-700); font-size: .92rem; font-weight: 600; margin: var(--sp-2) 0 0; }
.rp-plan h4 { font-size: .98rem; margin: var(--sp-4) 0 var(--sp-3); }
.rp-met { color: var(--teal-700); font-weight: 600; }
.rp-unmet { color: #B3261E; font-weight: 600; }
.rp-unknown { color: var(--ink-3); }


.rp-guide + .rp-guide { margin-top: var(--sp-5); }
.rp-guide > h5 {
font-size: .95rem; font-weight: 700; color: var(--brand-800);
margin: 0 0 var(--sp-3); padding-inline-start: var(--sp-3);
border-inline-start: 3px solid var(--brand-200);
}
.rp-guide-block + .rp-guide-block { margin-top: var(--sp-4); }
.rp-guide-block > strong { display: block; margin-bottom: var(--sp-2); }
.rp-guide-block .prose { font-size: .96rem; line-height: 2.05; }
.rp-guide-block .prose > :first-child { margin-top: 0; }
.rp-guide-block .prose > :last-child { margin-bottom: 0; }

.rp-steps { padding-inline-start: var(--sp-6); display: flex; flex-direction: column; gap: var(--sp-4); line-height: 2; }
.rp-steps li::marker { color: var(--brand-600); font-weight: 700; }

.rp-support textarea { width: 100%; border: 1px solid var(--line); border-radius: var(--r-md);
padding: var(--sp-3); font: inherit; margin-bottom: var(--sp-3); resize: vertical; }
.rp-disclaimer { border-top: 1px solid var(--line); padding-top: var(--sp-5); margin-top: var(--sp-8);
color: var(--ink-3); font-size: .86rem; line-height: 2; }

.rp-form .rp-field, .rp-buy .rp-field { margin-bottom: var(--sp-5); }
.rp-form label, .rp-buy label { display: block; font-weight: 600; margin-bottom: var(--sp-2); }
.rp-form input, .rp-form select, .rp-buy input { width: 100%; border: 1px solid var(--line); border-radius: var(--r-md);
padding: var(--sp-3); font: inherit; background: #fff; }
.rp-hint { color: var(--ink-3); font-size: .86rem; margin: var(--sp-2) 0 0; }
.rp-warn { color: #B3261E; font-size: .88rem; line-height: 1.9; margin: var(--sp-2) 0 0;
background: var(--warn-bg); border: 1px solid var(--warn-line); border-radius: var(--r-md); padding: var(--sp-3); }
.rp-field.is-empty label { color: #B3261E; }

.rp-echo { color: var(--ink-2); font-size: .92rem; font-weight: 600;
margin: var(--sp-2) 0 0; font-variant-numeric: tabular-nums; }


.rp-offer { border: 1px solid var(--brand-100); background: var(--brand-50); border-radius: var(--r-lg);
padding: var(--sp-5); margin: var(--sp-6) 0; }
.rp-offer h3 { font-size: 1.12rem; margin: 0 0 var(--sp-3); color: var(--brand-900); }
.rp-offer p { line-height: 2; color: var(--ink-2); margin: 0 0 var(--sp-4); }
.rp-offer-list { list-style: none; padding: 0; margin: 0 0 var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-2); }
.rp-offer-list li { padding-inline-start: var(--sp-6); position: relative; line-height: 1.9; }
.rp-offer-list li::before { content: '✓'; position: absolute; inset-inline-start: 0; color: var(--teal-600); font-weight: 700; }
.rp-price { display: flex; align-items: baseline; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-4); }
.rp-price-old { color: var(--ink-3); text-decoration: line-through; font-size: 1rem; }
.rp-price-new { color: var(--brand-700); font-size: 1.5rem; font-weight: 800; }
.rp-price-why { color: var(--teal-700); font-size: .86rem; background: var(--teal-50);
border-radius: var(--r-sm); padding: 2px var(--sp-2); }

.rp-offer-note { font-size: .82rem; color: var(--ink-3); line-height: 1.9;
margin: 0 0 var(--sp-3); }


.rp-credit h2, .rp-buy h2, .rp-confirm h2 { font-size: 1.25rem; margin-bottom: var(--sp-3); }
.rp-credit .notice { margin: var(--sp-5) 0; }
.rp-consent { background: var(--surface); border-radius: var(--r-md); padding: var(--sp-4); margin-bottom: var(--sp-5); }
.rp-consent label { display: flex; gap: var(--sp-3); align-items: flex-start; line-height: 1.9; font-size: .93rem; cursor: pointer; }
.rp-consent input { width: 20px; height: 20px; flex: none; margin-top: 2px; accent-color: var(--brand-600); }
.rp-none { color: var(--ink-3); font-size: .9rem; line-height: 1.9; margin: 0 0 var(--sp-4); }

.rp-code-toggle { margin: 0 0 var(--sp-4); }
.rp-code-toggle .btn-link {
background: none; border: 0; padding: 0; font: inherit; cursor: pointer;
color: var(--ink-3); font-size: .88rem; text-decoration: underline;
}
.rp-code-toggle .btn-link:hover { color: var(--brand-700); }
.rp-buy #rp-code { text-transform: uppercase; }
.rp-confirm p { line-height: 2; color: var(--ink-2); }
.rp-confirm .btn { margin-top: var(--sp-3); }




.rp-doc-head {
background: var(--grad-brand); color: #fff;
border-radius: var(--r-lg) var(--r-lg) 0 0;
padding: var(--sp-5) var(--sp-5) var(--sp-4);
}
.rp-doc-head h1 { color: #fff; font-size: 1.32rem; margin: 0 0 var(--sp-3); line-height: 1.6; }
.rp-doc-meta {
display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-5);
font-size: .85rem; color: rgba(255,255,255,.88);
}
.rp-doc-meta span { display: inline-flex; align-items: center; gap: 6px; }
.rp-doc-meta b { font-weight: 700; color: #fff; }

.rp-doc {
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-lg); box-shadow: var(--sh-md); overflow: hidden;
}
.rp-doc-body { padding: var(--sp-5); }


.rp-band {
background: var(--brand-100); color: var(--brand-900);
font-weight: 700; font-size: 1rem; line-height: 1.8;
padding: var(--sp-3) var(--sp-4); border-radius: var(--r-md);
margin: 0 0 var(--sp-4);
}

.rp-band--warn { background: var(--warn-bg); color: #6B3F06; border: 1px solid var(--warn-line); }
.rp-blockers > p { margin-top: var(--sp-4); color: var(--ink-2); line-height: 2; }

.rp-burden { background: var(--surface-2); border-inline-start: 3px solid var(--brand-400);
padding: var(--sp-3) var(--sp-4); border-radius: var(--r-sm); }

.rp-levers { margin: 0; padding-inline-start: var(--sp-5); }
.rp-levers li { margin-bottom: var(--sp-4); line-height: 2; }
.rp-lever-n {
display: inline-block; margin-inline-start: var(--sp-2);
padding: 2px var(--sp-3); border-radius: var(--r-full);
background: var(--brand-100); color: var(--brand-800); font-weight: 700; font-size: .88rem;
}
.rp-sec + .rp-sec { margin-top: var(--sp-7); }
.rp-sec > h3 { font-size: 1rem; margin: var(--sp-5) 0 var(--sp-3); color: var(--ink); }


.rp-tally { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: var(--sp-3); margin-bottom: var(--sp-5); }
.rp-tally-item {
border: 1px solid var(--line); border-radius: var(--r-md);
padding: var(--sp-3); text-align: center; background: var(--surface-2);
}
.rp-tally-n { display: block; font-size: 1.5rem; font-weight: 800; line-height: 1.4; color: var(--ink); }
.rp-tally-l { display: block; font-size: .78rem; color: var(--ink-3); line-height: 1.7; }
.rp-tally-item.is-high { background: var(--ok-bg); border-color: var(--ok-line); }
.rp-tally-item.is-high .rp-tally-n { color: var(--ok); }
.rp-tally-item.is-mid { background: var(--brand-50); border-color: var(--brand-200); }
.rp-tally-item.is-mid .rp-tally-n { color: var(--brand-700); }
.rp-tally-item.is-low { background: var(--warn-bg); border-color: var(--warn-line); }
.rp-tally-item.is-low .rp-tally-n { color: var(--warn); }

.rp-tally-item.is-zero { opacity: .55; }
.rp-tally-item.is-zero .rp-tally-n { color: var(--ink-3); }


.rp-one {
border: 1px solid var(--brand-200);
border-inline-start: 4px solid var(--brand-600);
background: var(--brand-50);
border-radius: var(--r-lg);
padding: var(--sp-4);
margin-bottom: var(--sp-5);
}
.rp-one-k {
margin: 0 0 6px;
font-size: .76rem;
font-weight: 700;
color: var(--brand-700);
letter-spacing: .01em;
}
.rp-one-t { margin: 0 0 6px; font-size: 1.04rem; font-weight: 800; color: var(--ink); line-height: 1.7; }
.rp-one-b { margin: 0; font-size: .9rem; color: var(--ink-2); line-height: 1.9; }


.rp-validity {
border: 1px solid var(--line);
border-radius: var(--r-lg);
background: var(--surface-2, var(--bg-soft, #f8fafc));
padding: var(--sp-4);
margin: var(--sp-5) 0 var(--sp-4);
}
.rp-validity p { margin: 0 0 var(--sp-3); font-size: .86rem; color: var(--ink-2); line-height: 1.95; }
.rp-validity p:last-child { margin-bottom: 0; }


.rp-building {
display: flex;
flex-direction: column;
align-items: center;
gap: var(--sp-3);
text-align: center;
border: 1px solid var(--brand-200);
background: var(--brand-50);
border-radius: var(--r-lg);
padding: var(--sp-6) var(--sp-4);
margin-bottom: var(--sp-4);
}

.rp-building--over {
position: fixed; inset: 0; z-index: 90;
justify-content: center;
margin: 0; border: 0; border-radius: 0;
background: color-mix(in srgb, var(--brand-50) 94%, transparent);
padding: var(--sp-6);
}
@supports not (background: color-mix(in srgb, red 50%, transparent)) {
.rp-building--over { background: var(--brand-50); }
}

.rp-spin {
width: 34px; height: 34px;
border-radius: 50%;
border: 3px solid var(--brand-200);
border-top-color: var(--brand-600);
animation: rp-spin 900ms linear infinite;
}
@keyframes rp-spin { to { transform: rotate(360deg); } }
.rp-building-t { margin: 0; font-size: 1.02rem; font-weight: 800; color: var(--ink); }
.rp-building-b { margin: 0; font-size: .86rem; color: var(--ink-2); line-height: 1.95; max-width: 34ch; }

@media (prefers-reduced-motion: reduce) {
.rp-spin { animation: none; }
}





.pn-new { margin-bottom: var(--sp-5); }
.pn-new .btn { inline-size: 100%; font-size: 1.02rem; }

.pn-cases { list-style: none; margin: 0 0 var(--sp-6); padding: 0; display: grid; gap: var(--sp-3); }
.pn-case {
border: 1px solid var(--line);
border-radius: var(--r-lg);
background: var(--surface);
padding: var(--sp-4);
box-shadow: var(--sh-xs);
}
.pn-case-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); }
.pn-case-t { margin: 0; font-size: .97rem; font-weight: 800; color: var(--ink); line-height: 1.7; }
.pn-case-m { margin: 4px 0 0; font-size: .82rem; color: var(--ink-3); line-height: 1.8; }
.pn-case-n { margin: var(--sp-3) 0; font-size: .85rem; color: var(--ink-2); line-height: 1.95; }
.pn-case .btn { margin-top: var(--sp-3); }

.pn-badge {
flex-shrink: 0;
display: inline-block;
padding: 4px 10px;
border-radius: 999px;
font-size: .76rem;
font-weight: 700;
background: var(--brand-50);
color: var(--brand-700);
border: 1px solid var(--brand-200);
}
.pn-badge.is-ok { background: var(--ok-bg); color: var(--ok); border-color: var(--ok-line); }
.pn-badge.is-warn { background: var(--warn-bg); color: var(--warn); border-color: var(--warn-line); }

.pn-empty {
border: 1px dashed var(--line);
border-radius: var(--r-lg);
padding: var(--sp-5);
margin: 0 0 var(--sp-6);
color: var(--ink-2);
font-size: .9rem;
line-height: 1.95;
text-align: center;
}

.pn-sec { margin-bottom: var(--sp-6); }
.pn-sec h2 { font-size: 1.02rem; margin: 0 0 var(--sp-3); color: var(--ink); }
.pn-sec p { font-size: .88rem; color: var(--ink-2); line-height: 1.95; margin: 0 0 var(--sp-3); }

.pn-consents { list-style: none; margin: 0 0 var(--sp-4); padding: 0; display: grid; gap: var(--sp-2); }
.pn-consent {
border: 1px solid var(--line);
border-radius: var(--r-md, 12px);
background: var(--surface);
padding: var(--sp-3);
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: var(--sp-3);
}

.pn-consent label { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; min-height: 44px; }
.pn-consent input { margin-top: 4px; width: 18px; height: 18px; flex-shrink: 0; }
.pn-consent-t { display: block; font-size: .88rem; font-weight: 600; color: var(--ink); line-height: 1.8; }
.pn-consent-m { display: block; font-size: .78rem; color: var(--ink-3); line-height: 1.8; margin-top: 2px; }
.pn-consent-link { flex-shrink: 0; font-size: .8rem; color: var(--brand-700); align-self: center; }

.pn-sure { display: flex; align-items: center; gap: 10px; margin-bottom: var(--sp-3); font-size: .86rem; color: var(--ink-2); min-height: 44px; }
.pn-sure input { width: 18px; height: 18px; }

.btn-danger {
background: var(--danger-bg);
color: var(--danger);
border-color: var(--danger-line);
}
.btn-danger:hover { background: var(--danger); color: #fff; border-color: var(--danger); }

.pn-out { margin-top: var(--sp-6); text-align: center; }
.pn-out .btn-link {
background: none; border: 0; padding: 10px; min-height: 44px;
color: var(--ink-3); font-size: .85rem; cursor: pointer; font-family: inherit;
}
.pn-out .btn-link:hover { color: var(--danger); }


.rp-tools { display: flex; align-items: center; gap: var(--sp-4); flex-wrap: wrap; margin-bottom: var(--sp-4); }
.rp-mine { font-size: .85rem; color: var(--brand-700); }
.rp-print-hint {
margin: calc(-1 * var(--sp-2)) 0 var(--sp-4);
padding: var(--sp-3);
border-radius: var(--r-md, 12px);
background: var(--warn-bg);
color: var(--warn);
font-size: .82rem;
line-height: 1.95;
}
.rp-print-hint[hidden] { display: none; }
@media print { .rp-tools { display: none !important; } }


.rp-get {
border: 1px solid var(--brand-200);
background: var(--brand-50);
border-radius: var(--r-lg);
padding: var(--sp-5) var(--sp-4);
margin-bottom: var(--sp-5);
text-align: center;
}
.rp-get-q { margin: 0 0 6px; font-size: 1.08rem; font-weight: 800; color: var(--ink); }
.rp-get-a { margin: 0 0 var(--sp-4); font-size: .92rem; color: var(--ink-2); line-height: 1.9; }
.rp-get .btn { min-width: 220px; }
.rp-get-n { margin: var(--sp-4) 0 0; font-size: .76rem; color: var(--ink-3); line-height: 1.95; }



.rp-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--sp-4); }
.rp-card { border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; background: var(--surface); }
.rp-card-t {
background: var(--surface-2); border-bottom: 1px solid var(--line);
padding: var(--sp-2) var(--sp-3); font-size: .88rem; font-weight: 700; color: var(--ink-2);
}
.rp-card dl { margin: 0; padding: var(--sp-2) var(--sp-3); }
.rp-card div { display: flex; justify-content: space-between; gap: var(--sp-3);
padding: var(--sp-2) 0; border-bottom: 1px solid var(--line-soft); font-size: .9rem; }
.rp-card div:last-child { border-bottom: 0; }
.rp-card dt { color: var(--ink-3); }
.rp-card dd { margin: 0; font-weight: 600; color: var(--ink); text-align: left; }


.rp-badge {
display: inline-block; padding: 2px 9px; border-radius: 999px;
font-size: .78rem; font-weight: 700; line-height: 1.9; white-space: nowrap;
border: 1px solid transparent;
}
.rp-badge.is-met { background: var(--ok-bg); color: var(--ok); border-color: var(--ok-line); }
.rp-badge.is-unmet { background: var(--danger-bg); color: var(--danger); border-color: var(--danger-line); }
.rp-badge.is-unknown { background: var(--surface-2); color: var(--ink-3); border-color: var(--line); }


.rp-plan { border: 1px solid var(--line); border-radius: var(--r-lg); margin-bottom: var(--sp-5);
padding: 0; overflow: hidden; background: var(--surface); }
.rp-plan-head {
display: flex; gap: var(--sp-3); align-items: flex-start; margin: 0;
padding: var(--sp-4); background: var(--surface-2); border-bottom: 1px solid var(--line);
}
.rp-plan-body { padding: var(--sp-4); }
.rp-plan h3 { font-size: 1.06rem; margin: 0; line-height: 1.7; }
.rp-label {
display: inline-block; margin: var(--sp-2) 0 0; padding: 3px 10px;
border-radius: 999px; font-size: .82rem; font-weight: 700; line-height: 1.9;
background: var(--brand-50); color: var(--brand-800); border: 1px solid var(--brand-200);
}
.rp-plan.is-high .rp-label { background: var(--ok-bg); color: var(--ok); border-color: var(--ok-line); }
.rp-plan.is-low  .rp-label { background: var(--warn-bg); color: var(--warn); border-color: var(--warn-line); }


.rp-figs { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 1px;
background: var(--line); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.rp-figs > div { background: var(--surface); padding: var(--sp-3); }
.rp-figs span { display: block; font-size: .78rem; color: var(--ink-3); line-height: 1.8; }
.rp-figs b { display: block; font-size: .98rem; color: var(--ink); line-height: 1.8; font-weight: 700; }
.rp-figs b.muted { color: var(--ink-4); font-weight: 600; }


.rp-plan h3 a,
.rp-mine {
display: inline-block;
padding-block: 10px;
margin-block: -10px;
}


.rp-compare-wrap {
overflow-x: auto; -webkit-overflow-scrolling: touch;
border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface);
}
.rp-compare-wrap:focus-visible { outline: 2px solid var(--brand-600); outline-offset: 2px; }
.rp-compare table { border-collapse: collapse; width: 100%; font-size: .88rem; }
.rp-compare th, .rp-compare td {
padding: 10px 12px; text-align: right; vertical-align: top; line-height: 1.9;
border-bottom: 1px solid var(--line-soft);
}
.rp-compare thead th {
background: var(--surface-2); font-size: .92rem; color: var(--ink);
border-bottom: 1px solid var(--line);
}
.rp-compare-bank { display: block; font-size: .78rem; font-weight: 600; color: var(--ink-3); }

.rp-compare tbody th,
.rp-compare thead th:first-child {
position: sticky; inset-inline-start: 0; z-index: 1;
background: var(--surface-2); color: var(--ink-3); font-weight: 600; white-space: nowrap;
}
.rp-compare thead th:first-child { z-index: 2; }
.rp-compare td { min-width: 148px; color: var(--ink); }
.rp-compare td.muted { color: var(--ink-4); }
.rp-compare tbody tr:last-child th, .rp-compare tbody tr:last-child td { border-bottom: none; }
.rp-compare > p:first-of-type { margin-bottom: var(--sp-4); }
.rp-compare .tiny { margin-top: var(--sp-3); }


.rp-line { display: block; }
.rp-line + .rp-line { font-size: .92em; color: var(--ink-3); font-weight: 600; }


.rp-todo { margin: 0 0 var(--sp-4); padding-inline-start: var(--sp-5); }
.rp-todo li { font-size: .93rem; line-height: 2; color: var(--ink-2); margin-bottom: var(--sp-2); }
.rp-todo li.is-fix::marker { color: var(--warn); }
.rp-todo li.is-ask::marker { color: var(--ink-4); }
.rp-todo li.is-credit { color: var(--ink); font-weight: 600; }
.rp-todo li.is-credit::marker { color: var(--danger); }
.rp-todo-first {
display: inline-block; font-size: .72rem; font-weight: 700; line-height: 1.7;
background: var(--brand-50); color: var(--brand-700); border: 1px solid var(--brand-200);
border-radius: var(--r-sm); padding: 1px 7px; margin-inline-end: 6px;
}



.rp-offer { margin: var(--sp-3) 0 var(--sp-4); }
.rp-offer-s { margin: 0; padding: var(--sp-3); line-height: 2; color: var(--ink);
background: var(--surface-2); border-inline-start: 3px solid var(--brand-400); border-radius: var(--r-md); }
.rp-why { margin: 0 0 var(--sp-4); padding-inline-start: var(--sp-5); }
.rp-why li { font-size: .93rem; line-height: 2; color: var(--ink-2); margin-bottom: 4px; }
.rp-why li::marker { color: var(--ok); }


.rp-lever-cost { display: inline-block; font-size: .84rem; line-height: 1.9; color: #6B3F06;
background: var(--warn-bg); border: 1px solid var(--warn-line);
border-radius: var(--r-sm); padding: 2px var(--sp-2); margin-top: 4px; }


.rp-shared > p { margin-bottom: var(--sp-5); }
.rp-shared .rp-guide + .rp-guide { margin-top: var(--sp-6); }


.rp-applies {
margin: 0 0 var(--sp-2); font-size: .8rem; line-height: 1.9; color: var(--ink-3);
border-inline-start: 3px solid var(--line); padding-inline-start: var(--sp-3);
}


.rp-foot {
border-top: 1px solid var(--line); background: var(--surface-2);
padding: var(--sp-4) var(--sp-5); font-size: .8rem; color: var(--ink-3); line-height: 1.9;
display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-5); justify-content: space-between;
}

@media (max-width: 480px) {
.rp-doc-head { padding: var(--sp-4); }
.rp-doc-head h1 { font-size: 1.12rem; }
.rp-doc-body, .rp-foot { padding: var(--sp-4); }
.rp-band { font-size: .94rem; }
}

@media print {
.site-header, .site-footer, .rp-print, .rp-support, .skip-link { display: none !important; }
.rp-plan { break-inside: avoid; page-break-inside: avoid; }
.rp-one, .rp-validity { break-inside: avoid; page-break-inside: avoid; }
.prose-table { overflow: visible; }
body { background: #fff; }


.rp-doc { box-shadow: none; border: 0; }
.rp-doc-head, .rp-band, .rp-badge, .rp-tally-item, .rp-label, .rp-card-t, .rp-foot,
.rp-one, .rp-validity, .rp-compare thead th, .rp-compare tbody th, .rp-todo-first {
-webkit-print-color-adjust: exact; print-color-adjust: exact;
}


.rp-compare-wrap { overflow: visible; }
.rp-compare tbody th, .rp-compare thead th:first-child { position: static; }
.rp-compare table { font-size: .8rem; }
.rp-compare td { min-width: 0; }
.rp-doc-head { border-radius: 0; }


.rp-sec { break-inside: auto; }
.rp-plan, .rp-one, .rp-validity, .rp-tally, .rp-card,
.rp-compare-wrap, .rp-guide-block, .rp-figs {
break-inside: avoid; page-break-inside: avoid;
}

.rp-band { break-after: avoid-page; }
.rp-tally { break-before: avoid-page; }


.rp-foot {
position: static; border-top: 1px solid var(--line);
break-inside: avoid; page-break-inside: avoid;
}
@page { margin: 14mm 12mm 16mm; }
}



.tablewrap {
overflow-x: auto;
border: 1px solid var(--line);
border-radius: var(--r-lg);
background: var(--surface);
box-shadow: var(--sh-sm);
-webkit-overflow-scrolling: touch;
}
.spec-table { border-collapse: collapse; width: 100%; min-width: 320px; font-size: .93rem; }
.spec-table th, .spec-table td {
padding: 13px var(--sp-5); text-align: right; border-bottom: 1px solid var(--line-soft);
vertical-align: top; line-height: 1.8;
}
.spec-table th {
color: var(--ink-3); font-weight: 600; white-space: nowrap;
background: var(--surface-2); width: 42%;
}
.spec-table td { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.spec-table tr:last-child th, .spec-table tr:last-child td { border-bottom: none; }


.cost { margin-bottom: var(--sp-8); }
.cost > h2 { font-size: 1.12rem; margin-bottom: var(--sp-3); }
.cost > h3 { font-size: .98rem; margin: var(--sp-6) 0 var(--sp-3); color: var(--ink-2); }
.cost .tablewrap + .cost-note { margin-top: var(--sp-3); }
.cost-note { font-size: .86rem; color: var(--ink-3); line-height: 1.9; margin-bottom: var(--sp-2); }


.page-meta {
margin-top: var(--sp-8); padding-top: var(--sp-5);
border-top: 1px solid var(--line);
display: flex; flex-wrap: wrap; gap: var(--sp-3) var(--sp-6);
align-items: center; justify-content: space-between;
font-size: .82rem; color: var(--ink-3);
}


.calc-form { display: grid; gap: var(--sp-2); margin-bottom: var(--sp-4); }
.calc-form label { font-size: .88rem; font-weight: 600; color: var(--ink-2); }
.calc-form .btn { margin-top: var(--sp-2); justify-self: start; }
.calc-result { margin-bottom: var(--sp-6); }
.calc-result .calc-plan { font-weight: 700; margin-bottom: var(--sp-2); }
.calc-result .calc-figure { font-size: 1.05rem; }
.calc-result .calc-figure b { font-size: 1.2rem; color: var(--brand-700); }
.calc-result .calc-sub, .calc-result .calc-note { font-size: .86rem; color: var(--ink-3); margin-top: var(--sp-2); }
.calc-table-head { font-size: 1.05rem; margin: var(--sp-8) 0 var(--sp-2); }
.calc-more { margin-top: var(--sp-3); }
.calc-more > summary { cursor: pointer; font-weight: 600; color: var(--brand-700); margin-bottom: var(--sp-3); }


.news-plans { margin-top: var(--sp-8); padding-top: var(--sp-5); border-top: 1px solid var(--line); }
.news-plans > h2 { font-size: 1.02rem; margin-bottom: var(--sp-3); }


.link-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-1); }
.link-list li { border-bottom: 1px solid var(--line-soft); }
.link-list li:last-child { border-bottom: none; }
.link-list a { display: block; padding: 13px 0; font-weight: 600; font-size: .95rem; }


.card h2 a, .card h3 a { color: var(--ink); }
.card h2 a:hover, .card h3 a:hover { color: var(--brand-600); }



.skip-link {
position: absolute; inset-inline-start: -9999px; top: 8px; z-index: 300;
background: var(--brand-700); color: #fff; padding: 10px 18px; border-radius: var(--r-md); font-weight: 700;
}
.skip-link:focus { inset-inline-start: 16px; color: #fff; }

.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;
}

@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
html { scroll-behavior: auto; }
.js-reveal .reveal { opacity: 1; transform: none; }
}



.news-meta {
display: flex; flex-wrap: wrap; gap: var(--sp-3);
font-size: .78rem; color: var(--ink-3); margin-bottom: var(--sp-2);
}
.news-meta time { font-variant-numeric: tabular-nums; }



.report-actionbar {
position: fixed;
inset-inline: 0;
bottom: 0;
z-index: 60;
display: flex;
gap: var(--sp-3);
padding: var(--sp-3) var(--sp-4);

padding-bottom: calc(var(--sp-3) + env(safe-area-inset-bottom, 0px));
background: rgba(255, 255, 255, .92);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border-top: 1px solid var(--line);
box-shadow: 0 -6px 24px rgba(16, 24, 40, .09);
}

.report-actionbar .btn { flex: 1 1 0; min-width: 0; }

.report-actionbar .btn-primary { flex-grow: 1.6; }


body.has-actionbar #page-buyer { padding-bottom: 88px; }

@media (min-width: 768px) {
.report-actionbar {
inset-inline: auto;
inset-inline-end: var(--sp-6);
bottom: var(--sp-6);
border-radius: var(--r-lg);
border: 1px solid var(--line);
max-width: 460px;
}
}


.report-hero-call {
display: inline-flex;
align-items: center;
gap: var(--sp-2);
margin-top: var(--sp-5);
padding: var(--sp-2) var(--sp-4);
border-radius: 999px;
background: rgba(255, 255, 255, .17);
border: 1px solid rgba(255, 255, 255, .32);
color: #fff;
font-weight: 600;
font-size: .9rem;
text-decoration: none;
transition: background .18s ease;
}
.report-hero-call:hover { background: rgba(255, 255, 255, .26); }
.report-hero-call .num { font-variant-numeric: tabular-nums; letter-spacing: .02em; }


.channel-invite {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: var(--sp-5);
padding: var(--sp-6);
border-radius: var(--r-xl);
background: linear-gradient(135deg, #229ED9, #1B7FB0);
box-shadow: var(--sh-lg);
}
.channel-invite-text { flex: 1 1 320px; }
.channel-invite h2 { color: #fff; font-size: 1.15rem; margin: 0 0 var(--sp-2); }
.channel-invite p { color: rgba(255, 255, 255, .92); margin: 0; max-width: 60ch; }
.channel-invite-btn {
background: #fff; color: #1B7FB0; box-shadow: var(--sh-md);
display: inline-flex; align-items: center; gap: var(--sp-2); flex-shrink: 0;
}
.channel-invite-btn:hover { background: #f4fbff; }



.compare-filters {
background: var(--surface);
border: 1px solid var(--line);
border-radius: var(--r-xl);
padding: var(--sp-5);
margin-bottom: var(--sp-6);
box-shadow: var(--sh-sm);
}
.filter-row {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
gap: var(--sp-4);
margin-bottom: var(--sp-4);
}
.compare-filters .field { margin: 0; }
.compare-filters label { display: block; font-size: .84rem; color: var(--ink-2); margin-bottom: var(--sp-2); }
.compare-filters input[type="text"],
.compare-filters select {
width: 100%; padding: 10px 12px;
border: 1px solid var(--line); border-radius: var(--r-md);
font: inherit; font-size: .92rem; background: #fff; color: var(--ink);
}
.compare-filters input:focus, .compare-filters select:focus {
outline: 2px solid var(--brand-400); outline-offset: 1px; border-color: var(--brand-600);
}

.filter-checks {
display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4);
padding: var(--sp-4) 0; border-top: 1px solid var(--line);
}
.filter-check { display: inline-flex; align-items: center; gap: var(--sp-2); cursor: pointer; margin: 0; }
.filter-check input { width: 17px; height: 17px; accent-color: var(--brand-600); cursor: pointer; }
.filter-check span { font-size: .9rem; color: var(--ink); }

.filter-actions { display: flex; gap: var(--sp-3); flex-wrap: wrap; }


.active-filters { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-bottom: var(--sp-4); }
.chip {
display: inline-flex; align-items: center; gap: 6px;
background: var(--brand-50); color: var(--brand-700);
border: 1px solid var(--brand-100);
border-radius: 999px; padding: 4px 12px;
font-size: .84rem; font-weight: 600; text-decoration: none;
}
.chip:hover { background: var(--brand-100); }

.compare-count { color: var(--ink-2); font-size: .9rem; margin-bottom: var(--sp-4); }

.compare-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: var(--sp-4);
}
.compare-card { display: flex; flex-direction: column; gap: var(--sp-3); }
.compare-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--sp-3); }
.compare-card h2 { font-size: 1.03rem; margin: 0 0 4px; line-height: 1.6; }
.compare-card h2 a { color: var(--ink); text-decoration: none; }
.compare-card h2 a:hover { color: var(--brand-600); }
.compare-bank { font-size: .82rem; color: var(--ink-3); margin: 0; }

.compare-rate { text-align: center; flex-shrink: 0; line-height: 1.3; }
.compare-rate b { display: block; font-size: 1.25rem; color: var(--brand-600); font-variant-numeric: tabular-nums; }
.compare-rate span { font-size: .7rem; color: var(--ink-3); }

.compare-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.compare-note { font-size: .82rem; color: var(--ink-2); margin: 0; line-height: 1.85; }
.compare-actions { display: flex; gap: var(--sp-2); margin-top: auto; padding-top: var(--sp-2); }
.compare-disclaimer {
margin-top: var(--sp-6); font-size: .84rem; color: var(--ink-3);
text-align: center; line-height: 1.9;
}



.bank-mark {
display: inline-flex;
align-items: center;
gap: var(--sp-2);
min-width: 0;                 
max-width: 100%;
color: var(--ink-2);
font-weight: 600;
line-height: 1.4;
vertical-align: middle;
}

.bank-mark__logo {
flex: 0 0 auto;
object-fit: contain;          
background: var(--surface);
border: 1px solid var(--line);
border-radius: var(--r-sm);
padding: 2px;
box-sizing: border-box;
}


.bank-mark__logo--letter {
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--brand-50);
border-color: var(--brand-100);
color: var(--brand-700);
font-weight: 800;
padding: 0;
}

.bank-mark__name {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}



.bank-mark--sm { font-size: .84rem; }
.bank-mark--sm .bank-mark__logo { width: 28px; height: 28px; border-radius: 7px; }
.bank-mark--sm .bank-mark__logo--letter { font-size: .85rem; }

.bank-mark--md { font-size: .95rem; }
.bank-mark--md .bank-mark__logo { width: 40px; height: 40px; padding: 3px; }
.bank-mark--md .bank-mark__logo--letter { font-size: 1.15rem; }

.bank-mark--lg { font-size: 1.08rem; gap: var(--sp-3); color: var(--ink); }
.bank-mark--lg .bank-mark__logo { width: 56px; height: 56px; padding: 4px; border-radius: var(--r-md); }
.bank-mark--lg .bank-mark__logo--letter { font-size: 1.6rem; }




.section-head .bank-mark { margin-bottom: var(--sp-3); }


.loan-card-top { flex-wrap: wrap; }
.loan-card-top > h2 { flex: 1 1 100%; }
.loan-card-top .bank-mark { flex: 1 1 100%; margin-top: var(--sp-1); }
.compare-card-head .bank-mark { margin-top: var(--sp-2); }



.chip.is-selected {
background: var(--brand-600); color: #fff; border-color: var(--brand-600);
}

.report-loading {
padding: var(--sp-12) var(--sp-4);
text-align: center; color: var(--ink-3); font-size: .95rem;
}


.report-state {
background: var(--surface-2); border: 1px solid var(--line-soft);
border-inline-start: 3px solid var(--brand);
border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4);
margin-bottom: var(--sp-4); font-size: .86rem; color: var(--ink-2);
line-height: 1.7;
}

.report-head { margin-bottom: var(--sp-5); }
.report-head h2 { font-size: 1.35rem; margin-bottom: var(--sp-2); }


.report-recap {
display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2);
background: var(--surface-2); border: 1px solid var(--line-soft);
border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4);
margin-bottom: var(--sp-5); font-size: .88rem; color: var(--ink-2);
}
.report-recap > span { flex: 1 1 auto; min-width: 0; }

.result-rank {
font-size: .72rem; font-weight: 800; letter-spacing: .04em;
color: var(--ok); margin-bottom: 2px;
}


.result-figs {
display: grid; grid-template-columns: repeat(auto-fit, minmax(6.5rem, 1fr));
gap: var(--sp-3);
border-top: 1px solid var(--line-soft);
margin-top: var(--sp-3); padding-top: var(--sp-3);
}
.result-figs span { display: block; font-size: .72rem; color: var(--ink-3); margin-bottom: 2px; }
.result-figs b { font-size: 1rem; font-variant-numeric: tabular-nums; }

.result-cost { font-size: .86rem; color: var(--ink-2); margin: var(--sp-2) 0 0; }
.result-cost b { font-variant-numeric: tabular-nums; }
.result-figs .muted { font-weight: 500; font-size: .9rem; color: var(--ink-4); }

.result-reasons li.is-good::marker { color: var(--ok); }
.result-reasons li.is-bad { color: var(--warn); }
.result-reasons li.is-bad::marker { color: var(--warn); }

.result-reasons li.is-soft { color: var(--ink-3); }
.result-reasons li.is-soft::marker { color: var(--ink-4); }
.pref-tag {
font-size: .74rem; color: var(--ink-4);
border: 1px solid var(--line); border-radius: var(--r-sm);
padding: 0 4px; margin-inline-start: 4px; white-space: nowrap;
}


.result-reasons li.has-fix { flex-direction: column; align-items: flex-start; gap: 0; }

.result-fix {
display: inline-flex; align-items: center; gap: var(--sp-1);
margin-top: 2px; font-size: .82rem; line-height: 1.7;
color: var(--brand-600); text-decoration: underline;
text-underline-offset: 3px; text-decoration-thickness: 1px;
}
.result-fix::before { content: '←'; font-size: .9em; }
.result-fix:hover { color: var(--brand-700); }

.result-actions {
display: flex; flex-wrap: wrap; gap: var(--sp-2);
margin-top: var(--sp-4);
}
.result-actions .btn { flex: 1 1 auto; }

.report-foot {
margin-top: var(--sp-6); padding-top: var(--sp-5);
border-top: 1px solid var(--line-soft);
}
.report-foot-actions {
display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-3);
}





.shortcuts {
display: grid; gap: var(--sp-3);
grid-template-columns: minmax(0, 1fr);
margin-bottom: var(--sp-5);
}
.shortcut-row { display: flex; align-items: flex-start; gap: var(--sp-3); min-width: 0; }
.shortcut-label {
flex: 0 0 auto; padding-top: 6px;
font-size: .78rem; font-weight: 700; color: var(--ink-3);
min-width: 2.5rem;
}
.qchips { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.qchip {
display: inline-flex; align-items: center; gap: 5px;
padding: 5px 11px; border-radius: var(--r-full);
background: var(--surface); border: 1px solid var(--line);
font-size: .84rem; color: var(--ink-2); text-decoration: none;
transition: border-color .14s, background .14s, color .14s;
}
.qchip:hover { border-color: var(--brand-400); color: var(--brand-700); }
.qchip.is-on { background: var(--brand-600); border-color: var(--brand-600); color: #fff; }
.qchip span {
font-size: .72rem; opacity: .65;
font-variant-numeric: tabular-nums;
}
.qchips-more { display: inline-block; }
.qchips-more > summary {
display: inline-flex; align-items: center;
padding: 5px 11px; border-radius: var(--r-full);
border: 1px dashed var(--line); cursor: pointer;
font-size: .84rem; color: var(--ink-3); list-style: none;
}
.qchips-more > summary::-webkit-details-marker { display: none; }
.qchips-more[open] > summary { border-style: solid; color: var(--brand-700); }
.qchips-more .qchips { margin-top: 6px; }


.toolbar {
display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3);
padding: var(--sp-3) 0;
border-block: 1px solid var(--line-soft);
margin-bottom: var(--sp-4);
}
.toolbar-count { font-size: .9rem; color: var(--ink-2); }
.toolbar-count b { font-size: 1.05rem; color: var(--ink); font-variant-numeric: tabular-nums; }
.toolbar-right { display: flex; align-items: center; gap: var(--sp-3); margin-inline-start: auto; }
.toolbar-sort { display: flex; align-items: center; gap: var(--sp-2); }
.toolbar-sort label { font-size: .8rem; color: var(--ink-3); }
.toolbar-sort select {
padding: 7px 10px; border-radius: var(--r-sm);
border: 1px solid var(--line); background: var(--surface);
font-size: .85rem; color: var(--ink); font-family: inherit;
}
.viewtabs { display: inline-flex; border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; }
.viewtab {
padding: 7px 14px; font-size: .85rem; color: var(--ink-2);
text-decoration: none; background: var(--surface);
}
.viewtab + .viewtab { border-inline-start: 1px solid var(--line); }
.viewtab.is-on { background: var(--brand-600); color: #fff; font-weight: 600; }

.chip-clear { background: var(--surface-2); color: var(--ink-3); }


.lcards {
display: grid; gap: var(--sp-3);
grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
}

.lcard {
min-width: 0;
display: flex; flex-direction: column; gap: var(--sp-2);
padding: var(--sp-4); border-radius: var(--r-md);
background: var(--surface); border: 1px solid var(--line);
transition: border-color .14s, box-shadow .14s;
}
.lcard:hover { border-color: var(--brand-400); box-shadow: var(--sh-md); }
.lcard-link { text-decoration: none; }
.lcard-name {
font-size: .98rem; font-weight: 700; line-height: 1.55;
color: var(--ink); margin: 0;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
overflow: hidden;
}
.lcard:hover .lcard-name { color: var(--brand-700); }
.lcard-figs {
display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-2) var(--sp-3);
border-top: 1px solid var(--line-soft); padding-top: var(--sp-3); margin-top: auto;
}
.lcard-figs span { display: block; font-size: .7rem; color: var(--ink-3); }
.lcard-figs b { font-size: .92rem; font-variant-numeric: tabular-nums; }
.lcard-figs i { font-style: normal; font-weight: 500; color: var(--ink-4); font-size: .82rem; }
.lcard-badges { display: flex; flex-wrap: wrap; gap: 5px; }


.lcard-actions {
display: grid; gap: 6px; margin-top: var(--sp-3);
padding-top: var(--sp-3); border-top: 1px solid var(--line-soft);
}
.lcard-actions .btn { white-space: normal; line-height: 1.6; min-block-size: 44px; }


.loan-table { width: 100%; border-collapse: collapse; font-size: .87rem; min-width: 52rem; }
.loan-table th {
position: sticky; top: 0; z-index: 1;
background: var(--surface-2); text-align: right;
padding: 10px 12px; font-size: .76rem; font-weight: 700; color: var(--ink-2);
border-bottom: 1px solid var(--line); white-space: nowrap;
}
.loan-table td {
padding: 10px 12px; border-bottom: 1px solid var(--line-soft);
color: var(--ink-2); vertical-align: middle;
}
.loan-table tr:hover td { background: var(--brand-50); }
.loan-table .num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.loan-table i { font-style: normal; color: var(--ink-4); }
.loan-table .ok { color: var(--ok); font-weight: 700; }
.lt-name a { color: var(--ink); font-weight: 600; text-decoration: none; }
.lt-name a:hover { color: var(--brand-700); text-decoration: underline; }
.lt-bank { white-space: nowrap; }


.loan-table tbody tr { position: relative; }
.lt-link::after { content: ''; position: absolute; inset: 0; }
.loan-table tbody tr:hover td { background: var(--brand-50); cursor: pointer; }


.lt-cta { white-space: nowrap; text-align: left; }
.lt-cta .btn { position: relative; z-index: 1; }


.pager {
display: flex; align-items: center; justify-content: center;
flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-6);
}
.pg-nums { display: flex; flex-wrap: wrap; gap: 4px; }
.pg-item {
display: inline-flex; align-items: center; justify-content: center;
min-width: 2.25rem; padding: 8px 12px; border-radius: var(--r-sm);
border: 1px solid var(--line); background: var(--surface);
font-size: .88rem; color: var(--ink-2); text-decoration: none;
font-variant-numeric: tabular-nums;
}
.pg-item:hover { border-color: var(--brand-400); color: var(--brand-700); }
.pg-item.is-on { background: var(--brand-600); border-color: var(--brand-600); color: #fff; font-weight: 700; }
.pg-item.is-off { opacity: .4; pointer-events: none; }
.pg-gap { padding: 8px 4px; color: var(--ink-4); }
.pg-meta { text-align: center; font-size: .82rem; color: var(--ink-3); margin-top: var(--sp-3); }

@media (max-width: 40rem) {

.shortcut-row { flex-direction: column; align-items: stretch; gap: 6px; }
.shortcut-label { padding-top: 0; }
.toolbar-right { margin-inline-start: 0; width: 100%; justify-content: space-between; }
.lcards { grid-template-columns: 1fr; }
}


.filters-fold { margin-bottom: var(--sp-4); }
.filters-fold > summary {
display: inline-flex; align-items: center; gap: var(--sp-2);
padding: 9px 16px; border-radius: var(--r-sm);
background: var(--surface); border: 1px solid var(--line);
font-size: .88rem; font-weight: 600; color: var(--ink-2);
cursor: pointer; list-style: none; user-select: none;
}
.filters-fold > summary::-webkit-details-marker { display: none; }
.filters-fold > summary::after {
content: '▾'; font-size: .8rem; color: var(--ink-3); transition: transform .15s;
}
.filters-fold[open] > summary::after { transform: rotate(180deg); }
.filters-fold > summary:hover { border-color: var(--brand-400); color: var(--brand-700); }
.filters-fold[open] > summary {
border-color: var(--brand-400); color: var(--brand-700);
margin-bottom: var(--sp-3);
}
.fold-count {
display: inline-flex; align-items: center; justify-content: center;
min-width: 1.35rem; height: 1.35rem; border-radius: var(--r-full);
background: var(--brand-600); color: #fff; font-size: .72rem; font-weight: 700;
}
.filters-fold .compare-filters { margin-bottom: 0; }


@media (max-width: 40rem) {
.shortcut-row > .qchips {
flex-wrap: nowrap;
overflow-x: auto;
scroll-snap-type: x proximity;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
padding-bottom: 2px;

margin-inline: calc(var(--sp-4) * -1);
padding-inline: var(--sp-4);
}
.shortcut-row > .qchips::-webkit-scrollbar { display: none; }
.shortcut-row > .qchips > .qchip,
.shortcut-row > .qchips > .qchips-more { flex: 0 0 auto; scroll-snap-align: start; }
.qchips-more[open] .qchips { flex-wrap: wrap; max-width: 78vw; }


.section-head h1 { margin-bottom: var(--sp-2); }
.section-head p { font-size: .92rem; }
}


.kb-topic + .kb-topic { margin-top: var(--sp-8); }
.kb-topic > h2 {
font-size: 1.15rem; font-weight: 800; color: var(--ink);
margin-bottom: var(--sp-4); padding-inline-start: var(--sp-3);
border-inline-start: 3px solid var(--teal-500); line-height: 1.7;
}
.kb-block {
background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
padding: var(--sp-5) var(--sp-6);
}
.kb-block + .kb-block { margin-top: var(--sp-4); }
.kb-block > h3 {
font-size: 1.02rem; font-weight: 700; color: var(--ink);
margin-bottom: var(--sp-3); line-height: 1.7;
}
.kb-block .prose { font-size: 0.99rem; line-height: 2.05; }
.kb-block .tiny { margin-top: var(--sp-3); }


.gate-list { list-style: none; display: grid; gap: var(--sp-3); }
.gate-item {
background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
padding: var(--sp-4) var(--sp-5); display: grid; gap: var(--sp-1);
border-inline-start: 3px solid var(--teal-500);
}
.gate-item > b { font-size: 1rem; font-weight: 700; color: var(--ink); line-height: 1.8; }
.gate-proof, .gate-note { font-size: 0.9rem; color: var(--ink-3); line-height: 1.9; }


.gate-field { margin-bottom: var(--sp-5); }
.gate-field + .gate-field { padding-top: var(--sp-5); border-top: 1px solid var(--line-soft); }
.gate-ask {
font-size: 1rem; font-weight: 600; color: var(--ink);
line-height: 1.9; margin-bottom: var(--sp-3);
}
.gate-field .tiny.muted { margin-top: var(--sp-2); }
.gate-why { color: var(--ink-3); }

.gate-choices { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.gate-choice {
flex: 1 1 auto; min-width: 88px; min-height: 44px;   
padding: 10px var(--sp-4); border: 1.5px solid var(--line); border-radius: var(--r-lg);
background: var(--surface); color: var(--ink-2);
font: inherit; font-size: .95rem; font-weight: 600; cursor: pointer;
transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.gate-choice:hover { border-color: var(--brand-400); background: var(--brand-50); }
.gate-choice:active { transform: scale(.985); }
.gate-choice.is-selected { border-color: var(--brand-600); background: var(--brand-50); color: var(--brand-800); }

.gate-choice--unknown { border-style: dashed; color: var(--ink-3); }
.gate-choice--unknown.is-selected { border-style: solid; }


.gate-multi { display: grid; gap: 6px; }
.gate-check {
display: flex; align-items: center; gap: var(--sp-2);
padding: 9px 12px; border: 1px solid var(--line); border-radius: var(--r-sm);
background: var(--surface); font-size: .9rem; cursor: pointer;
}
.gate-check input { width: 18px; height: 18px; accent-color: var(--brand-600); flex-shrink: 0; }

.gate-check--none { margin-top: 4px; border-style: dashed; color: var(--ink-2); }
.gate-check:has(input:checked) { border-color: var(--brand-400); background: var(--brand-50); }


.social-links { list-style: none; display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.social-links a {
display: inline-flex; align-items: center; gap: var(--sp-2);
padding: var(--sp-2) var(--sp-3); border-radius: var(--r-lg);
background: var(--surface-2); border: 1px solid var(--line-soft);
color: var(--ink-2); font-size: 0.92rem;
transition: background 0.15s ease, border-color 0.15s ease;
}
.social-links a:hover { background: var(--brand-50); border-color: var(--line); color: var(--brand-700); }
.social-links svg { flex-shrink: 0; }

.footer-alt-names { font-size: 0.9rem; margin-bottom: var(--sp-2); }
.footer-alt-names .muted { opacity: 0.38; font-size: 0.78rem; font-weight: 400; }


.group-stats {
display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-3);
margin: var(--sp-6) 0;
}
.group-stats > div {
background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
padding: var(--sp-4); text-align: center;
}
.group-stats span { display: block; font-size: 0.85rem; color: var(--ink-3); margin-bottom: var(--sp-1); }
.group-stats b { font-size: 1.05rem; font-weight: 800; color: var(--ink); }
.group-body { margin-bottom: var(--sp-8); }
.group-body h2 { font-size: 1.15rem; font-weight: 800; margin: var(--sp-6) 0 var(--sp-3); }
.group-list-head, .group-faq-head { font-size: 1.15rem; font-weight: 800; margin: var(--sp-8) 0 var(--sp-4); }
.group-more { margin-top: var(--sp-5); text-align: center; }
.group-related { margin-top: var(--sp-8); }
.group-related h2 { font-size: 1.05rem; font-weight: 800; margin-bottom: var(--sp-3); }
.group-related-links { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.group-related-links a {
padding: var(--sp-2) var(--sp-4); border: 1px solid var(--line);
border-radius: var(--r-lg); background: #fff; font-size: 0.93rem;
}
.group-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--sp-3); }
.group-card {
display: block; background: #fff; border: 1px solid var(--line);
border-radius: var(--r-lg); padding: var(--sp-5);
border-inline-start: 3px solid var(--teal-500);
}
.group-card h2 { font-size: 1.02rem; font-weight: 800; color: var(--ink); margin-bottom: var(--sp-1); }
.group-card p { font-size: 0.9rem; color: var(--ink-3); }

.bank-card .bank-mark { gap: var(--sp-3); }
.bank-card .bank-mark__logo { width: 72px; height: 72px; padding: 5px; border-radius: var(--r-md); }
.bank-card .bank-mark__logo--letter { font-size: 1.8rem; }
@media (min-width: 700px) { .group-stats { grid-template-columns: repeat(4, 1fr); } }
.group-chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-bottom: var(--sp-4); }
.group-chips a {
display: inline-flex; align-items: center; gap: var(--sp-2);
padding: var(--sp-2) var(--sp-4); border: 1px solid var(--line);
border-radius: 999px; background: #fff; font-size: 0.9rem; font-weight: 600;
}
.group-chips a:hover { border-color: var(--teal-500); }
.group-chips .num { color: var(--ink-3); font-weight: 500; }


.footer-social { margin-top: var(--sp-5); }
.footer-social h4 { font-size: 0.92rem; font-weight: 700; margin-bottom: var(--sp-3); }
.footer-brand p { margin-bottom: 0; }

.footer-identity {
display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;
gap: var(--sp-3) var(--sp-5);
}
.footer-identity .footer-alt-names { margin: 0; }
.footer-legal { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); }
.footer-hours { font-size: .89rem; color: var(--ink-3); }




.footer-trust { line-height: 0; display: flex; align-items: flex-end; gap: var(--sp-3); }
@media (min-width: 820px) { .footer-trust { margin-inline-start: auto; } }

.footer-enamad, .footer-gateway {
box-sizing: border-box; flex: 0 0 auto;
width: 128px; height: 128px; padding: var(--sp-2);
display: inline-flex; align-items: center; justify-content: center;
background: #fff; border: 1px solid var(--line); border-radius: var(--r-md);
font-size: .72rem; color: var(--ink-3); text-align: center; line-height: 1.6;
}
.footer-enamad:hover, .footer-gateway:hover { border-color: var(--brand-600); }
.footer-enamad img, .footer-gateway img {
display: block; width: 100%; height: 100%; object-fit: contain;
}

@media (max-width: 719px) {
.footer-trust { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.footer-enamad, .footer-gateway { width: 100%; height: 104px; padding: var(--sp-1); }
}


@media (max-width: 719px) {
.site-footer { padding-block: var(--sp-8) var(--sp-6); }
.footer-grid { gap: var(--sp-6); }

.footer-col--links .footer-links { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3) var(--sp-4); }
.footer-brand img { height: 62px; margin-bottom: var(--sp-3); }
}


.group-kb { margin-top: var(--sp-8); }
.group-kb > h2 { font-size: 1.25rem; margin-bottom: var(--sp-2); }
.group-kb-note { color: var(--ink-3); font-size: .92rem; line-height: 1.9; margin: 0 0 var(--sp-5); }
.group-kb .kb-topic + .kb-topic { margin-top: var(--sp-6); }
.group-kb .kb-topic > h3 {
font-size: 1.02rem; font-weight: 700; color: var(--brand-800);
margin: 0 0 var(--sp-3); padding-inline-start: var(--sp-3);
border-inline-start: 3px solid var(--brand-200);
}
.group-kb .kb-block + .kb-block { margin-top: var(--sp-4); }
.group-kb .kb-block > h4 { font-size: .98rem; margin: 0 0 var(--sp-2); }
.group-kb .kb-block .prose { font-size: .98rem; line-height: 2.05; }
.group-kb .kb-block .prose > :first-child { margin-top: 0; }


.result--focused { border-color: var(--brand-400); box-shadow: 0 0 0 2px var(--brand-100) inset; }
.result-rank--focused { color: var(--brand-700); }


.cost-guess {
margin: var(--sp-3) 0 0;
padding: var(--sp-3);
background: var(--warn-bg);
border: 1px solid var(--warn-line);
border-radius: var(--r-md);
}
.cost-guess p { margin: 0; line-height: 1.9; }
.cost-guess-label {
margin-top: var(--sp-2) !important;
font-size: .86rem;
font-weight: 600;
color: var(--ink-2);
}


.ob-list {
display: flex; flex-wrap: wrap; gap: var(--sp-2);
list-style: none; padding: 0; margin: var(--sp-3) 0;
}
.ob-list li {
padding: var(--sp-1) var(--sp-3);
background: var(--surface-2); border: 1px solid var(--line);
border-radius: var(--r-pill); font-size: .92rem;
}


.report-lever {
background: var(--grad-soft); border: 1px solid var(--brand-200);
border-radius: var(--r-lg); padding: var(--sp-4) var(--sp-5);
margin-bottom: var(--sp-5);
}
.report-lever h3 {
font-size: .9rem; color: var(--brand-800); margin: 0 0 var(--sp-2);
font-weight: 700; letter-spacing: -.01em;
}
.report-lever-main { margin: 0; font-size: 1.02rem; line-height: 2; color: var(--ink); font-weight: 600; }
.report-lever-more { margin: var(--sp-2) 0 0; font-size: .86rem; color: var(--ink-3); line-height: 1.9; }


.flow-tally {
display: flex; align-items: center; gap: var(--sp-2);
margin-top: var(--sp-4); padding: var(--sp-3) var(--sp-4);
background: var(--grad-soft); border: 1px solid var(--brand-200);
border-radius: var(--r-lg); font-size: .92rem; color: var(--ink-2); line-height: 1.9;
}
.flow-tally b { color: var(--brand-800); font-weight: 700; }
.flow-tally-dot {
width: 8px; height: 8px; border-radius: 50%;
background: var(--brand-600); flex-shrink: 0;
}


.flow-note {
margin-top: var(--sp-4); padding: var(--sp-3) var(--sp-4);
background: var(--surface-2); border: 1px solid var(--line-soft);
border-radius: var(--r-lg); font-size: .88rem; color: var(--ink-2); line-height: 1.9;
}
.linkish {
background: none; border: 0; padding: 0; font: inherit; font-weight: 700;
color: var(--brand-700); cursor: pointer; text-decoration: underline;
}


.offers-title { font-size: 1.45rem; text-align: center; margin-bottom: var(--sp-5); }



.offers {
display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
grid-template-rows: auto 1fr auto;
gap: var(--sp-2); align-items: stretch;
}
@media (min-width: 720px) { .offers { gap: var(--sp-5); } }



.offer {
min-inline-size: 0;
background: var(--surface); border: 2px solid var(--line);
border-radius: var(--r-lg); padding: var(--sp-3);
display: grid; grid-row: span 3; grid-template-rows: subgrid; gap: var(--sp-2);
}
.offer-head { display: grid; gap: var(--sp-2); align-content: start; }

@supports not (grid-template-rows: subgrid) {
.offer { display: flex; flex-direction: column; }
.offer h3 { min-block-size: 3.6em; }
}

.offer h3, .offer-row-t, .offer-price { overflow-wrap: anywhere; }
@media (min-width: 720px) {
.offer { border-radius: var(--r-xl); padding: var(--sp-5); gap: var(--sp-3); }
}

.offer h3 { font-size: .98rem; line-height: 1.8; margin: 0; }
@media (min-width: 720px) { .offer h3 { font-size: 1.15rem; line-height: 1.9; } }

.offer--paid {
border-color: var(--brand-400); background: var(--grad-soft);
box-shadow: var(--sh-md);
}
.offer-what { color: var(--ink-2); font-size: .92rem; line-height: 2; margin: 0; }
.offer-adds-t { font-weight: 700; font-size: .92rem; margin: var(--sp-2) 0 0; }



.offer-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.offer-list li {
display: grid; grid-template-columns: 15px 1fr; gap: 7px; align-items: start;
font-size: .75rem; line-height: 1.6; color: var(--ink);
}
@media (min-width: 720px) {
.offer-list { gap: var(--sp-2); }
.offer-list li { grid-template-columns: 18px 1fr; gap: 10px; font-size: .86rem; line-height: 1.75; }
}


.offer-mark { position: relative; display: block; block-size: 1.3em; }

.offer-list li.is-yes .offer-mark::before {
content: ''; position: absolute; inset-inline-start: 1px; top: .38em;
width: 11px; height: 6px; border: 2px solid var(--teal-600);
border-top: 0; border-right: 0; transform: rotate(-45deg);
}
.offer-list--plus li.is-yes .offer-mark::before { border-color: var(--brand-600); }


.offer-list li.is-no { color: var(--ink-4); }
.offer-list li.is-no .offer-mark::before,
.offer-list li.is-no .offer-mark::after {
content: ''; position: absolute; inset-inline-start: 1px; top: .62em;
width: 11px; height: 2px; background: #E5252A; transform: rotate(45deg);
}
.offer-list li.is-no .offer-mark::after { transform: rotate(-45deg); }

.offer-foot { margin-top: auto; padding-top: var(--sp-3); display: grid; gap: var(--sp-2); }
@media (min-width: 720px) { .offer-foot { padding-top: var(--sp-4); gap: var(--sp-3); } }


.offer .btn {
white-space: normal; font-size: .82rem; line-height: 1.6;
padding-inline: 10px; min-block-size: 48px;
}
@media (min-width: 720px) {
.offer .btn { font-size: .95rem; line-height: 1.4; padding-inline: 22px; }
}

.offer-price {
margin: 0; min-height: 38px; display: flex;
align-items: baseline; flex-wrap: wrap; gap: 6px;
}
@media (min-width: 720px) { .offer-price { min-height: 44px; gap: var(--sp-2); } }
.offer-price s { color: var(--ink-3); font-size: .84rem; }
.offer-price b { font-size: 1.05rem; font-weight: 800; color: var(--brand-800); }
@media (min-width: 720px) {
.offer-price s { font-size: 1rem; }
.offer-price b { font-size: 1.5rem; }
}
.offer-why {
font-size: .68rem; color: var(--teal-700); background: var(--teal-50);
border: 1px solid var(--teal-100); border-radius: var(--r-full); padding: 1px 7px;
line-height: 1.8; white-space: normal; max-inline-size: 100%;
}
@media (min-width: 720px) { .offer-why { font-size: .78rem; padding: 2px 10px; } }
.offer-foot .tiny { line-height: 1.9; }


.offers-foot {
margin: var(--sp-5) auto 0; max-width: 60ch; text-align: center;
font-size: .86rem; line-height: 2.05; color: var(--ink-3);
}


.hero-cta--two { display: grid; grid-template-columns: 1fr; gap: var(--sp-4); }
@media (min-width: 560px) { .hero-cta--two { grid-template-columns: 1fr 1fr; } }
.hero-choice { display: grid; gap: 6px; align-content: start; }
.hero-choice-t {
margin: 0; font-size: .82rem; line-height: 1.85; color: var(--ink-3); font-weight: 600;
}


.guide-cover { margin: 0 0 var(--sp-7); }
.guide-cover img {
display: block; width: 100%; height: auto;
border-radius: var(--r-xl); border: 1px solid var(--line);
}


.guide-cta {
margin-block: var(--sp-8); padding: var(--sp-5); border-radius: var(--r-lg);
background: var(--brand-50); border: 1px solid var(--brand-200);
border-inline-start: 4px solid var(--brand-600);
}
.guide-cta .guide-cta-kicker { margin: 0 0 var(--sp-2); font-size: .8rem; font-weight: 800; color: var(--brand-700); }
.guide-cta .guide-cta-title { margin: 0 0 var(--sp-2); font-size: 1.08rem; font-weight: 800; color: var(--ink); line-height: 1.7; }
.guide-cta .guide-cta-text { margin: 0 0 var(--sp-4); font-size: .97rem; line-height: 2; color: var(--ink-2); }
.guide-cta .guide-cta-btn, .guide-cta-end .guide-cta-btn { width: 100%; text-decoration: none; }
@media (min-width: 560px) { .guide-cta .guide-cta-btn, .guide-cta-end .guide-cta-btn { width: auto; } }

.guide-cta.guide-cta--top { margin-block: var(--sp-5) var(--sp-6); padding: var(--sp-4); }
.guide-cta.guide-cta--top .guide-cta-title { font-size: 1rem; }
.guide-cta.guide-cta--top .guide-cta-text { margin-bottom: var(--sp-3); font-size: .93rem; line-height: 1.9; }

.guide-cta .guide-cta-fine { margin: var(--sp-3) 0 0; font-size: .85rem; line-height: 1.9; color: var(--ink-3); }

.guide-cta-card {
padding: var(--sp-6) var(--sp-5); border-radius: var(--r-xl);
background: var(--grad-brand); color: #fff; box-shadow: var(--sh-lg);
}
.guide-cta-card .guide-cta-kicker { margin: 0 0 var(--sp-2); font-size: .8rem; font-weight: 800; color: rgba(255,255,255,.85); }
.guide-cta-card .guide-cta-h { margin: 0 0 var(--sp-3); font-size: 1.3rem; line-height: 1.6; color: #fff; }
.guide-cta-card .guide-cta-text { margin: 0 0 var(--sp-4); line-height: 2; color: rgba(255,255,255,.93); }
.guide-cta-card .guide-cta-list { list-style: none; margin: 0 0 var(--sp-4); padding: 0; display: grid; gap: var(--sp-2); }
.guide-cta-card .guide-cta-list li { position: relative; padding-inline-start: 26px; font-size: .95rem; line-height: 1.9; color: #fff; }
.guide-cta-card .guide-cta-list li::before { content: "✓"; position: absolute; inset-inline-start: 0; font-weight: 800; color: #fff; }
.guide-cta-card .guide-cta-price { margin: 0 0 var(--sp-4); display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-2) var(--sp-3); }
.guide-cta-card .guide-cta-price-now { font-size: 1.35rem; font-weight: 800; color: #fff; }
.guide-cta-card .guide-cta-price-was { font-size: .95rem; color: rgba(255,255,255,.72); }
.guide-cta-card .guide-cta-price-note { font-size: .9rem; color: rgba(255,255,255,.88); }
.guide-cta-btn--light { background: #fff; color: var(--brand-700); box-shadow: var(--sh-md); }
.guide-cta-btn--light:hover { color: var(--brand-700); filter: brightness(.97); }
.guide-cta-card .guide-cta-fine { margin: var(--sp-4) 0 0; font-size: .85rem; line-height: 1.9; color: rgba(255,255,255,.9); }



.finder-panel { display: grid; gap: var(--sp-4); margin-bottom: var(--sp-8); }
@media (min-width: 720px) {
.finder-panel { grid-template-columns: 1fr 1fr; align-items: start; }
.finder-panel > .fcard--more { grid-column: 1 / -1; }
}

.fcard {
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-lg); padding: var(--sp-4) var(--sp-5);
margin: 0; min-inline-size: 0;
}
.fcard-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); }
.fcard-head label, .fcard-legend {
font-weight: 700; font-size: .95rem; color: var(--ink); line-height: 2; padding: 0;
}
.fcard-value { font-weight: 800; font-size: 1.05rem; color: var(--brand-700); white-space: nowrap; }
.fcard-ends {
display: flex; justify-content: space-between;
font-size: .75rem; color: var(--ink-4); margin-top: 2px;
}
.fcard-hint { font-size: .8rem; color: var(--ink-3); line-height: 1.95; margin: var(--sp-2) 0 0; }


.fcard-range {
-webkit-appearance: none; appearance: none;
inline-size: 100%; block-size: 44px; margin: var(--sp-2) 0 0;
background: transparent; cursor: pointer; touch-action: pan-y;
}
.fcard-range::-webkit-slider-runnable-track {
block-size: 6px; border-radius: var(--r-full); background: var(--brand-100);
}
.fcard-range::-moz-range-track {
block-size: 6px; border-radius: var(--r-full); background: var(--brand-100);
}
.fcard-range::-webkit-slider-thumb {
-webkit-appearance: none; appearance: none;
inline-size: 26px; block-size: 26px; margin-block-start: -10px;
border-radius: 50%; background: var(--brand-600);
border: 3px solid var(--surface); box-shadow: var(--sh-brand);
}
.fcard-range::-moz-range-thumb {
inline-size: 20px; block-size: 20px; border-radius: 50%;
background: var(--brand-600); border: 3px solid var(--surface); box-shadow: var(--sh-brand);
}
.fcard-range:focus-visible { outline: 2px solid var(--brand-600); outline-offset: 4px; border-radius: var(--r-sm); }


.fticks { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-3); }
.ftick {
display: inline-flex; align-items: center; gap: var(--sp-2);
min-block-size: 44px; padding: 0 var(--sp-4);
border: 1px solid var(--line); border-radius: var(--r-full);
font-size: .9rem; cursor: pointer; background: var(--surface-2);
}
.ftick:has(input:checked) { background: var(--teal-50); border-color: var(--teal-300); color: var(--teal-800); font-weight: 700; }
.ftick input { inline-size: 18px; block-size: 18px; accent-color: var(--teal-600); margin: 0; }
.ftick:focus-within { outline: 2px solid var(--brand-600); outline-offset: 2px; }

.fchips { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-3); }
.fchip {
min-block-size: 44px; padding: 0 var(--sp-4);
border: 1px solid var(--line); border-radius: var(--r-full);
background: var(--surface-2); color: var(--ink-2);
font: inherit; font-size: .875rem; cursor: pointer;
}
.fchip.is-on { background: var(--brand-600); border-color: var(--brand-600); color: #fff; font-weight: 700; }

.fcard--more { padding: 0; }
.fcard--more > summary {
padding: var(--sp-4) var(--sp-5); min-block-size: 44px;
font-weight: 700; font-size: .92rem; cursor: pointer; color: var(--brand-700);
}
.fcard-more-body { padding: 0 var(--sp-5) var(--sp-5); }


.finder-bar {
display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
gap: var(--sp-3); margin-bottom: var(--sp-4);
}
.finder-count { font-size: 1.1rem; margin: 0; line-height: 2; }
.finder-sort { display: inline-flex; align-items: center; gap: var(--sp-2); font-size: .85rem; color: var(--ink-3); }
.finder-sort select {
min-block-size: 44px; border: 1px solid var(--line); border-radius: var(--r-md);
background: var(--surface); color: var(--ink); font: inherit; font-size: .875rem; padding: 0 var(--sp-3);
}

.finder-grid { display: grid; gap: var(--sp-4); }
@media (min-width: 640px) { .finder-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1040px) { .finder-grid { grid-template-columns: repeat(3, 1fr); } }
.finder-grid[aria-busy="true"] { opacity: .55; transition: opacity .15s; }


.fcard-loan {
background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg);
padding: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-3);
}
.fc-name { font-weight: 800; font-size: 1rem; line-height: 1.9; color: var(--ink); }
.fc-bank { font-size: .82rem; color: var(--ink-3); margin: 0; }

.fc-figs {
display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: var(--sp-2);
margin: 0; padding-block: var(--sp-3); border-block: 1px solid var(--line-soft);
}
.fc-figs dt { font-size: .72rem; color: var(--ink-4); }
.fc-figs dd { margin: 0; font-size: .85rem; font-weight: 700; color: var(--ink); }
.fc-figs i { font-style: normal; color: var(--ink-4); font-weight: 400; }

.fc-chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.fc-chip {
font-size: .76rem; line-height: 1.9; padding: 1px 10px; border-radius: var(--r-full); border: 1px solid;
}
.fc-chip--ok { background: var(--ok-bg); border-color: var(--ok-line); color: var(--ok); }
.fc-chip--warn { background: var(--warn-bg); border-color: var(--warn-line); color: var(--warn); }

.fc-inst { margin: 0; font-size: .85rem; line-height: 2; color: var(--ink-2); }
.fc-inst b { color: var(--ink); font-weight: 800; }
.fc-inst i { font-style: normal; color: var(--ink-4); }

.fc-calc { display: block; font-size: .72rem; color: var(--ink-4); }

.fc-actions { margin-top: auto; padding-top: var(--sp-3); display: flex; gap: var(--sp-2); }
.fc-details { flex: 0 0 auto; }
.fc-go { flex: 1 1 auto; text-align: center; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }


@keyframes fc-pulse {
0%, 100% { box-shadow: 0 0 0 0 rgba(24, 112, 216, .45); }
50%      { box-shadow: 0 0 0 10px rgba(24, 112, 216, 0); }
}
.fc-go--pulse { animation: fc-pulse 1.6s ease-out 3; }


.fc-lockrow {
margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px var(--sp-2);
padding: 8px 12px; border-radius: var(--r-md); background: var(--warn-bg); border: 1px dashed var(--warn-line);
font-size: .8rem; line-height: 1.9; color: var(--ink-2);
}
.fc-lockrow b { color: var(--warn); font-weight: 800; }
.fc-locked { position: relative; overflow: hidden; border: 1.5px solid var(--brand-600); background: var(--brand-50); }
.fc-ghost { display: grid; gap: 8px; filter: blur(3px); opacity: .55; user-select: none; }
.fc-ghost span { display: block; height: 12px; border-radius: 6px; background: var(--line); }
.fc-ghost .fc-ghost-s { width: 60%; }
.fc-lock-h { margin: 0; font-weight: 800; font-size: 1rem; line-height: 1.9; color: var(--ink); }
.fc-lock-t { margin: 0; font-size: .86rem; line-height: 2; color: var(--ink-2); }
.fc-lock-go { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; text-align: center; }
@media (prefers-reduced-motion: reduce) {
.fc-go--pulse { animation: none; }
.finder-grid[aria-busy="true"] { transition: none; }
}

.finder-all { margin-top: var(--sp-5); }
.finder-foot {
margin-top: var(--sp-8); font-size: .85rem; color: var(--ink-3); line-height: 2;
text-align: center; max-width: 62ch; margin-inline: auto;
}
.finder-foot a { color: var(--brand-700); font-weight: 600; }


.rp-context {
background: var(--brand-50); border: 1px solid var(--brand-100);
border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4);
font-size: .85rem; color: var(--ink-2); line-height: 2; margin: var(--sp-4) 0 0;
}
.rp-context a { color: var(--brand-700); font-weight: 600; }



.cs-form { display: grid; gap: var(--sp-5); margin-top: var(--sp-6); }
.cs-field { display: grid; gap: var(--sp-2); }
.cs-field label { font-weight: 700; font-size: .95rem; color: var(--ink); }
.cs-opt { font-weight: 400; color: var(--ink-3); font-size: .85rem; }
.cs-field input {
min-block-size: 48px; padding: 0 var(--sp-4);
border: 1px solid var(--line); border-radius: var(--r-md);
background: var(--surface); color: var(--ink); font: inherit; font-size: 1rem;
}
.cs-field input:focus-visible { outline: 2px solid var(--brand-600); outline-offset: 1px; }
.cs-hint { font-size: .8rem; color: var(--ink-3); line-height: 1.9; margin: 0; }


.cs-agree {
margin: calc(-1 * var(--sp-3)) 0 0; text-align: center;
font-size: .8rem; line-height: 1.95; color: var(--ink-3);
}
.cs-agree a { color: var(--brand-700); font-weight: 600; }
#cs-phone { text-align: right; }
.cs-otp { display: grid; gap: var(--sp-3); padding-top: var(--sp-4); border-top: 1px solid var(--line-soft); }

.cs-otp[hidden] { display: none; }

#cs-ask[hidden] { display: none; }
#cs-ask { display: grid; gap: var(--sp-5); }


.cs-otp {
justify-items: center; text-align: center;
border: 1px solid var(--line); border-top: 0;
border-radius: var(--r-lg);
background: var(--surface);
padding: var(--sp-6) var(--sp-5);
box-shadow: 0 10px 30px rgba(16, 49, 79, .07);
}
.cs-otp-h { font-size: 1.25rem; font-weight: 800; margin: 0; color: var(--ink); }
.cs-otp-to { font-size: .92rem; font-weight: 700; color: var(--danger); margin: 0; }
.cs-otp-to b { font-weight: 700; unicode-bidi: isolate; }
.cs-otp-lede {
margin: 0; font-size: .88rem; color: var(--ink-2); line-height: 2.1; max-inline-size: 36ch;
}
.cs-otp-fix { margin: 0; font-size: .85rem; color: var(--ink-3); }
.cs-otp-back { margin: 0; font-size: .9rem; }
.cs-otp-back a { color: var(--brand-700); font-weight: 700; }
.cs-otp .btn { inline-size: 100%; }
.cs-left {
margin: 0; font-size: 1.05rem; font-weight: 700; color: var(--ink-2);
font-variant-numeric: tabular-nums;
}
.cs-left[hidden], #cs-resend[hidden] { display: none; }
.cs-code::placeholder { color: var(--ink-4); opacity: 1; }



.cs-code-box {

direction: ltr; text-align: left;
--cs-slot: 46px;   
--cs-pitch: 56px;  
inline-size: calc(5 * var(--cs-slot) + 4 * (var(--cs-pitch) - var(--cs-slot)));
max-inline-size: 100%; block-size: 56px;

overflow: hidden;
overflow: clip;
position: relative;
}

.cs-slots {
position: absolute; inset: 0; display: flex; justify-content: space-between;
pointer-events: none;
}
.cs-slots i {
inline-size: var(--cs-slot); block-size: 100%;
background: var(--surface); border: 1.5px solid var(--line); border-radius: 12px;
transition: border-color .15s;
}
.cs-code-box:focus-within .cs-slots i { border-color: var(--brand-400); }

.cs-code {
position: relative;
direction: ltr; text-align: left;

inline-size: calc(100% + var(--cs-pitch)); block-size: 56px;
padding: 0 0 0 calc((var(--cs-slot) - 1ch) / 2); margin: 0;
border: 0; border-radius: 0; outline: 0; background: transparent;
font: 700 24px/56px ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
letter-spacing: calc(var(--cs-pitch) - 1ch);
color: var(--ink); caret-color: var(--brand-600);
}


.pay-brief {
margin-top: var(--sp-6);
background: var(--brand-50);
border: 1px solid var(--brand-100);
border-inline-start: 4px solid var(--brand-600);
border-radius: var(--r-md);
padding: var(--sp-4) var(--sp-5);
text-align: start;
}
.pay-brief h2 {
margin: 0 0 var(--sp-2); font-size: .95rem; font-weight: 800; color: var(--brand-800);
}
.pay-brief p { margin: 0; font-size: .95rem; line-height: 2.1; color: var(--ink); }
.pay-brief-sub { margin-top: var(--sp-2) !important; font-size: .85rem !important; color: var(--ink-2) !important; }


.rc { padding-top: var(--sp-5); background: #fff; }
.rc-mark { display: flex; justify-content: center; margin-bottom: var(--sp-3); }

.rc-mark svg { inline-size: min(116px, 31vw); block-size: auto; }
.rc-title { margin: 0 0 var(--sp-3); text-align: center; font-size: clamp(1.45rem, 5.4vw, 1.9rem);
font-weight: 900; color: #0F1B2D; line-height: 1.6; }
.rc-lede { margin: 0 auto var(--sp-6); max-inline-size: 30em; text-align: center; font-size: 1rem;
line-height: 2.1; color: #5A6675; }
.rc-card { margin: 0; padding: 4px 22px; background: #fff; border: 1px solid #E4EBF1;
border-radius: 18px; box-shadow: 0 1px 2px rgba(16, 24, 40, .03); }
.rc-row { display: flex; align-items: center; justify-content: space-between; gap: 12px;
padding: 18px 0; border-bottom: 1px solid #EDF1F5; }
.rc-row:last-child { border-bottom: 0; }
.rc-row dt { display: flex; align-items: center; gap: 10px; margin: 0; color: #5A6675; font-size: .98rem;
white-space: nowrap; }
.rc-row dt svg { flex: none; color: #4B5563; }
.rc-row dd { margin: 0; min-inline-size: 0; color: #0F1B2D; font-size: 1rem; overflow-wrap: anywhere; text-align: end; }
@media (max-width: 420px) {
.rc-card { padding: 2px 16px; }
.rc-row { gap: 8px; }
.rc-row dt { gap: 7px; font-size: .9rem; }
.rc-row dd { font-size: .9rem; }
.rc-row dd b[dir="ltr"] { font-size: .84rem; letter-spacing: 0; }
}
.rc-row dd b { font-weight: 600; letter-spacing: .02em; }
.rc-brief { display: flex; align-items: center; gap: 18px; margin-top: var(--sp-6);
padding: 22px 22px 18px; background: #F3FBF7; border: 1px solid #DCF1E5; border-radius: 18px; }
.rc-brief-body { flex: 1; min-inline-size: 0; }
.rc-brief h2 { margin: 0 0 8px; font-size: 1.1rem; font-weight: 900; color: #15925A; }
.rc-brief p { margin: 0; font-size: .97rem; line-height: 2.15; color: #4A5562; }
.rc-brief .rc-brief-sub { display: flex; align-items: center; gap: 6px; margin-top: 10px;
font-size: .82rem; color: #7A8592; line-height: 1.9; }
.rc-brief-sub svg { flex: none; }
.rc-brief-icon { flex: none; display: grid; place-items: center; inline-size: 88px; block-size: 88px;
border-radius: 50%; background: #E3F5EB; color: #22A35A; }
@media (max-width: 420px) {
.rc-brief { gap: 12px; padding: 18px 16px 14px; }
.rc-brief-icon { inline-size: 64px; block-size: 64px; }
.rc-brief-icon svg { inline-size: 38px; block-size: 38px; }
}
.rc-cta { margin: var(--sp-5) 0 0; }

.rc-optin {
margin: var(--sp-6) 0 0; padding-top: var(--sp-4); border-top: 1px solid var(--line-soft);
display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3);
}
.rc-optin label { display: flex; align-items: flex-start; gap: var(--sp-2); flex: 1 1 220px; cursor: pointer; }
.rc-optin input { inline-size: 18px; block-size: 18px; margin: 5px 0 0; accent-color: var(--brand-600); flex: none; }
.rc-optin span { font-size: .82rem; line-height: 1.9; color: var(--ink-2); }
.rc-optin button {
min-block-size: 40px; padding: 0 var(--sp-4); border: 1px solid var(--line); border-radius: var(--r-md);
background: var(--surface); color: var(--brand-700); font: inherit; font-size: .85rem; font-weight: 700; cursor: pointer;
}
.rc-optin-note { flex-basis: 100%; margin: 0; font-size: .78rem; color: var(--ink-3); }
.rc-optin-note a, .rc-optin-done a { color: var(--brand-700); font-weight: 600; }
.rc-optin-done { margin: var(--sp-6) 0 0; font-size: .82rem; color: var(--ok); font-weight: 600; text-align: center; }

@media (max-width: 480px) {
.rc { padding-top: 6px; padding-bottom: var(--sp-5); }
.rc-mark { margin-bottom: 2px; }
.rc-title { margin-bottom: 2px; font-size: 1.32rem; line-height: 1.5; }
.rc-lede { margin-bottom: 8px; font-size: .92rem; line-height: 1.75; }
.rc-row { padding: 8px 0; }
.rc-brief { margin-top: 10px; padding: 11px 14px 9px; gap: 8px; }
.rc-brief h2 { margin-bottom: 2px; font-size: 1rem; }
.rc-brief p { font-size: .9rem; line-height: 1.8; }
.rc-brief .rc-brief-sub { margin-top: 4px; font-size: .78rem; line-height: 1.7; }
.rc-brief-icon { inline-size: 48px; block-size: 48px; }
.rc-brief-icon svg { inline-size: 28px; block-size: 28px; }
.rc-cta { margin-top: 10px; }
.rc-cta .btn-lg { padding-block: 12px; }
}

@media (max-width: 370px) {
.rc-title { font-size: 1.2rem; }
.rc-lede { font-size: .85rem; }
.rc-row dt, .rc-row dd { font-size: .84rem; }
.rc-row dd b[dir="ltr"] { font-size: .78rem; }
.rc-brief h2 { font-size: .94rem; }
.rc-brief p { font-size: .83rem; }
.rc-brief .rc-brief-sub { font-size: .74rem; }
}
.rc-go { display: flex; align-items: center; justify-content: center; gap: 10px; border-radius: 16px; }
.rc-chev { flex: none; }
.rc-foot { margin: 12px 0 0; text-align: center; font-size: 13px; color: var(--ink-3); line-height: 1.9; }




.ck-section { padding-block: var(--sp-3) var(--sp-8); }
@media (min-width: 768px) { .ck-section { padding-block: var(--sp-8) var(--sp-12); } }
.ck-top {
display: flex; align-items: center; justify-content: space-between;
gap: var(--sp-3); margin-bottom: var(--sp-3);
}
.ck-title { margin: 0; font-size: 1.15rem; font-weight: 800; }
.ck-back { font-size: .9rem; color: var(--ink-2); font-weight: 600; }
.ck-back::before { content: '→'; margin-inline-end: 6px; }


.ck-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); }
@media (min-width: 860px) {
.ck-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: start; }
}

.ck-sum {
background: var(--surface-2); border: 1px solid var(--line);
border-radius: var(--r-lg); padding: var(--sp-5);
display: grid; gap: var(--sp-3);
}
.ck-row {
display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
font-size: .9rem; color: var(--ink-2);
}
.ck-row b { color: var(--ink); font-weight: 700; }
.ck-row--total {
border-top: 1px dashed var(--line); padding-top: var(--sp-3);
font-weight: 700; color: var(--ink);
}
.ck-row--total b { color: var(--brand-700); font-size: 1.05rem; }
.ck-minus { color: var(--ink-3) !important; font-weight: 600 !important; }
.ck-list { color: var(--ink-3); font-weight: 600; text-decoration-thickness: 1.5px; }
.ck-row[hidden] { display: none; }


.ck-main { display: grid; gap: var(--sp-4); }
.ck-brief {
background: var(--grad-soft); border: 1px solid var(--brand-100);
border-radius: var(--r-lg); padding: var(--sp-4) var(--sp-5);
}
.ck-brief-h { margin: 0 0 var(--sp-2); font-size: .95rem; font-weight: 800; color: var(--ink); }
.ck-brief-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ck-brief-list li {
display: flex; align-items: flex-start; gap: var(--sp-2);
font-size: .84rem; line-height: 1.9; color: var(--ink-2);
}
.ck-brief-ic { flex: none; margin-top: 5px; color: var(--ok); }
.ck-brief-k { color: var(--ink); font-weight: 800; }
.ck-brief-list bdi { color: var(--ink); font-weight: 700; }

.ck-side { display: grid; gap: var(--sp-4); }
.ck-card {
background: var(--surface); border: 1px solid var(--line);
border-radius: var(--r-lg); padding: var(--sp-4) var(--sp-5);
display: grid; gap: var(--sp-3);
}
.ck-card-head {
display: flex; align-items: center; justify-content: space-between;
gap: var(--sp-3); font-size: .9rem; font-weight: 700; color: var(--ink);
}


.ck-code-wrap { display: grid; gap: var(--sp-2); justify-items: center; }
.ck-code-open {
min-block-size: 36px; padding: 0 var(--sp-2);
border: 0; background: none; color: var(--ink-3);
font: inherit; font-size: .8rem; font-weight: 600; cursor: pointer;
text-decoration: underline; text-underline-offset: 4px;
}
.ck-code-open:hover { color: var(--brand-700); }
.ck-code { display: flex; gap: var(--sp-2); inline-size: 100%; }
.ck-code[hidden] { display: none; }
.ck-code-input {
flex: 1 1 auto; min-inline-size: 0; min-block-size: 46px; padding: 0 var(--sp-4);
border: 1px solid var(--line); border-radius: var(--r-md);
background: var(--surface); color: var(--ink); font: inherit; font-size: .95rem;
}
.ck-code-go {
flex: 0 0 auto; min-inline-size: 72px; min-block-size: 46px;
border: 0; border-radius: var(--r-md);
background: var(--brand-600); color: #fff; font: inherit; font-weight: 700; cursor: pointer;
}
.ck-code-go:disabled { opacity: .6; cursor: default; }
.ck-code-msg { margin: 0; font-size: .82rem; line-height: 1.9; }
.ck-code-msg[hidden] { display: none; }
.ck-code-msg.is-ok { color: var(--ok); }
.ck-code-msg.is-bad { color: var(--danger); }


.ck-card--row {
grid-template-columns: auto 1fr; align-items: center;
gap: var(--sp-4); padding: var(--sp-3) var(--sp-4);
}
.ck-card-label { font-size: .9rem; font-weight: 700; color: var(--ink); }
.ck-gws { display: flex; flex-wrap: wrap; gap: var(--sp-2); justify-content: flex-end; }

.ck-gw {
display: grid; justify-items: center; align-content: center; gap: 2px;
inline-size: 88px; padding: 4px;
border: 1px solid var(--line); border-radius: var(--r-sm);
background: var(--surface); color: var(--ink); font: inherit; cursor: pointer;
}
.ck-gw:hover { border-color: var(--brand-500); }
.ck-gw.is-on {
border-color: var(--brand-600); background: var(--brand-50);
box-shadow: inset 0 0 0 1px var(--brand-600);
}
.ck-gw.is-off { opacity: .55; cursor: not-allowed; }
.ck-gw img { block-size: 60px; inline-size: auto; max-inline-size: 100%; object-fit: contain; }
.ck-gw-soon { font-size: .62rem; color: var(--ink-3); line-height: 1.4; }


.ck-vpn {
margin: 0; padding: var(--sp-3);
border: 1.5px solid var(--warn-line); border-radius: var(--r-sm);
background: var(--warn-bg); color: var(--warn); font-size: .84rem; line-height: 1.9;
}
.ck-vpn[hidden] { display: none; }
.ck-vpn-text { margin: 0; }
.ck-vpn b { display: block; font-size: .92rem; font-weight: 800; color: var(--warn); }
.ck-vpn.is-on {
border: 2px solid var(--warn); font-weight: 600;
animation: ck-vpn-pulse .9s ease-out 2;
}
@keyframes ck-vpn-pulse { 0% { box-shadow: 0 0 0 0 rgba(154, 91, 8, .4); } 100% { box-shadow: 0 0 0 12px rgba(154, 91, 8, 0); } }
.ck-vpn-skip { display: inline-block; margin-top: 6px; font-size: .8rem; color: var(--ink-3); text-decoration: underline; }
.ck-vpn-skip[hidden] { display: none; }


.ck-again {
margin: 0; padding: 2px var(--sp-3); justify-self: start;
border-radius: var(--r-sm); background: var(--ok-bg);
color: var(--ok); font-size: .8rem; font-weight: 600; line-height: 1.9;
}
.ck-again[hidden] { display: none; }


@media (max-width: 719px) {
.ck-grid, .ck-side { gap: var(--sp-2); }
.ck-sum { padding: var(--sp-3) var(--sp-4); gap: var(--sp-2); }
.ck-row--total { padding-top: var(--sp-2); }
.ck-card { padding: var(--sp-3) var(--sp-4); gap: var(--sp-2); }
.ck-card--row { padding: var(--sp-2) var(--sp-4); }
.ck-main { gap: var(--sp-2); }
.ck-brief { padding: var(--sp-3) var(--sp-4); }
.ck-gw img { block-size: 56px; }
.ck-vpn { padding: var(--sp-2) var(--sp-3); }
}

.ck-go { text-align: center; }
.ck-terms { margin: 0; font-size: .78rem; color: var(--ink-3); line-height: 1.95; }
.ck-terms a { color: var(--brand-700); font-weight: 600; }



.in-head { margin-bottom: var(--sp-5); }

.in-lede { margin: var(--sp-2) 0 0; font-size: .86rem; color: var(--ink-2); line-height: 1.9; }
.in-progress {
margin: var(--sp-3) 0 var(--sp-2); font-size: .88rem; font-weight: 700; color: var(--brand-700);
}
.in-bar {
block-size: 6px; border-radius: 99px; background: var(--line-soft);
overflow: hidden;
}
.in-bar-fill {
display: block; block-size: 100%; inline-size: 25%;
background: var(--grad-brand); border-radius: 99px;
transition: inline-size .25s ease;
}



.in-form [hidden] { display: none; }
.in-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); }
.in-step { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); }
.in-step[hidden] { display: none; }
.in-step-title { margin: 0; font-size: 1.15rem; font-weight: 800; color: var(--ink); }
.in-step-lede { margin: calc(-1 * var(--sp-3)) 0 0; font-size: .88rem; color: var(--ink-2); line-height: 1.95; }

.in-q { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); }
.in-q[hidden] { display: none; }
.in-ask { margin: 0; font-weight: 700; font-size: .98rem; color: var(--ink); }
.in-hint { margin: 0; font-size: .8rem; color: var(--ink-3); line-height: 1.9; }


.in-opts { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); }
.in-opts--banks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.in-opts--banks .in-opt { min-block-size: 44px; padding: var(--sp-2) var(--sp-3); font-size: .9rem; }
.in-opt {
min-block-size: 48px; padding: var(--sp-3) var(--sp-4);
border: 1px solid var(--line); border-radius: var(--r-md);
background: var(--surface); color: var(--ink);
font: inherit; font-size: .95rem; text-align: start; cursor: pointer;
transition: border-color .15s, background .15s;
}
.in-opt:hover { border-color: var(--brand-500); }
.in-opt[hidden] { display: none; }
.in-opt:focus-visible { outline: 2px solid var(--brand-600); outline-offset: 2px; }
.in-opt.is-on {
border-color: var(--brand-600); background: var(--brand-50);
color: var(--brand-800); font-weight: 700;
box-shadow: inset 0 0 0 1px var(--brand-600);
}


.in-q.is-gap .in-ask { color: var(--danger); }
.in-q.is-gap .in-opts { outline: 2px dashed var(--danger-line); outline-offset: 6px; border-radius: var(--r-md); }

.in-select {
min-block-size: 48px; padding: 0 var(--sp-4);
border: 1px solid var(--line); border-radius: var(--r-md);
background: var(--surface); color: var(--ink); font: inherit; font-size: .95rem;

max-inline-size: 100%; text-overflow: ellipsis;
}

.in-slider {
border: 1px solid var(--line); border-radius: var(--r-md);
background: var(--surface); padding: var(--sp-4); display: grid; gap: var(--sp-3);
}
.in-slider-out {
font-size: 1.1rem; font-weight: 800; color: var(--brand-700); text-align: center;
}
.in-range { inline-size: 100%; accent-color: var(--brand-600); block-size: 28px; }
.in-slider-ends {
display: flex; justify-content: space-between; font-size: .75rem; color: var(--ink-3);
}

.in-nav { display: grid; gap: var(--sp-3); }
.in-nav .btn { inline-size: 100%; }
.in-nav .btn[hidden] { display: none; }

.in-error {
background: var(--danger-bg); border: 1px solid var(--danger-line); color: var(--danger);
border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4);
font-size: .88rem; line-height: 1.95; margin: 0;
}
.in-error[hidden], .in-warn[hidden] { display: none; }
.in-warn {
background: var(--warn-bg); border: 1px solid var(--warn-line); color: var(--warn);
border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4);
font-size: .85rem; line-height: 1.95; margin: 0;
}
.in-foot {
margin-top: var(--sp-6); font-size: .8rem; color: var(--ink-3);
line-height: 2; text-align: center;
}
.in-foot a { color: var(--brand-700); font-weight: 600; }


.in-dialog {
border: 0; border-radius: var(--r-lg); padding: var(--sp-5);
max-inline-size: min(420px, calc(100vw - 32px));
background: var(--surface); color: var(--ink);
box-shadow: 0 20px 60px rgba(16, 49, 79, .25);
}
.in-dialog::backdrop { background: rgba(16, 49, 79, .45); }
.in-dialog .btn { margin-bottom: var(--sp-3); }
.in-dialog-text { margin: 0 0 var(--sp-4); font-size: .95rem; line-height: 2.1; }


.btn-warn {
background: #F6C445; border: 1px solid #E0AE2A; color: #4A3708; font-weight: 700;
}
.btn-warn:hover { background: #EFB92E; }


.cs-back {
background: none; border: 0; padding: var(--sp-2) var(--sp-3); min-block-size: 44px;
color: var(--brand-700); font: inherit; font-size: .85rem; font-weight: 600;
text-decoration: underline; cursor: pointer;
}
.btn-ghost {
background: transparent; border: 1px solid var(--line); color: var(--ink-2);
min-height: 44px;
}
.btn-ghost:disabled { color: var(--ink-4); cursor: default; }

.cs-error {
background: var(--danger-bg); border: 1px solid var(--danger-line); color: var(--danger);
border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4);
font-size: .88rem; line-height: 1.95; margin: 0;
}
.cs-foot {
margin-top: var(--sp-6); font-size: .82rem; color: var(--ink-3);
line-height: 2; text-align: center;
}
.cs-foot a { color: var(--brand-700); font-weight: 600; }


#advisor { scroll-margin-top: var(--header-h); }


.sl-wrap { max-width: 1080px; }
.sl-hero { text-align: center; max-width: 640px; margin: 0 auto var(--sp-8); }
.sl-hero h1 { margin: var(--sp-3) 0; font-size: clamp(1.5rem, 5vw, 2.1rem); }
.sl-hero .lede { margin: 0; }
.sl-hero .rp-context { margin-top: var(--sp-3); font-size: .9rem; color: var(--ink-3); }

.sl-main { display: grid; gap: var(--sp-6); margin-bottom: var(--sp-8); }
@media (min-width: 900px) { .sl-main { grid-template-columns: 1fr 1fr; align-items: start; } }

.sl-buy, .sl-preview, .sl-block {
background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-xl);
padding: var(--sp-5); box-shadow: var(--sh-sm);
}
.sl-buy { border-color: var(--brand-200); box-shadow: var(--sh-md); }
@media (min-width: 768px) { .sl-buy, .sl-preview, .sl-block { padding: var(--sp-6); } }
.sl-buy h2, .sl-preview h2, .sl-block h2 { font-size: 1.12rem; margin: 0 0 var(--sp-4); color: var(--ink); }

.sl-list { list-style: none; padding: 0; margin: 0 0 var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-3); }
.sl-list li { position: relative; padding-inline-start: var(--sp-6); line-height: 1.8; }
.sl-list li::before { content: '✓'; position: absolute; inset-inline-start: 0; top: 0;
color: var(--teal-600); font-weight: 800; }
.sl-list strong, .sl-steps strong { display: block; font-size: .96rem; color: var(--ink); }
.sl-list span, .sl-steps span { display: block; font-size: .86rem; color: var(--ink-3); }

.sl-pay { background: var(--surface-2); border: 1px solid var(--line-soft); border-radius: var(--r-lg); padding: var(--sp-4); }
.sl-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-2) var(--sp-3); margin-bottom: var(--sp-4); }
.sl-price-why { color: var(--teal-700); background: var(--teal-50); border-radius: var(--r-sm);
padding: 2px var(--sp-2); font-size: .8rem; font-weight: 600; margin-inline-end: auto; }
.sl-price-old { color: var(--ink-4); text-decoration: line-through; font-size: .92rem; }
.sl-price-new { color: var(--brand-700); font-size: 1.5rem; font-weight: 800; }
.sl-price-new small { font-size: .78rem; font-weight: 500; color: var(--ink-3); }
.sl-safe { margin: var(--sp-3) 0 0; text-align: center; font-size: .78rem; color: var(--ink-3); }

.sl-tag { font-size: .74rem; font-weight: 600; color: var(--warn); background: var(--warn-bg);
border-radius: var(--r-full); padding: 2px var(--sp-2); vertical-align: middle; margin-inline-start: var(--sp-2); }
.sl-shot { margin: 0; }
.sl-shot a { display: block; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden;
background: var(--surface-2); }
.sl-shot img { display: block; width: 100%; height: auto; object-fit: cover; object-position: top; }
.sl-shot-big img { aspect-ratio: 16 / 10; }
.sl-shots { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); margin-top: var(--sp-3); }
.sl-shots img { aspect-ratio: 4 / 3; }
.sl-shot figcaption { font-size: .78rem; color: var(--ink-3); text-align: center; margin-top: var(--sp-2); }

.sl-block { margin-bottom: var(--sp-6); }
.sl-steps { list-style: none; counter-reset: sl; padding: 0; margin: 0; display: grid; gap: var(--sp-3); }
@media (min-width: 720px) { .sl-steps { grid-template-columns: repeat(4, 1fr); } }

.sl-steps li { counter-increment: sl; background: var(--surface-2); border: 1px solid var(--line-soft);
border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4); line-height: 1.8;
display: grid; grid-template-columns: 26px 1fr; column-gap: var(--sp-3); align-items: start; }
.sl-steps li > * { grid-column: 2; }
.sl-steps li::before { content: counter(sl, persian); grid-column: 1; grid-row: 1 / span 2; display: grid; place-items: center;
width: 26px; height: 26px; border-radius: var(--r-full); background: var(--brand-50); color: var(--brand-700);
font-weight: 800; font-size: .85rem; margin-top: 2px; }
@media (min-width: 720px) {
.sl-steps li { display: block; padding: var(--sp-4); }
.sl-steps li::before { margin: 0 0 var(--sp-2); }
}
.sl-alt { margin: var(--sp-4) 0 0; font-size: .88rem; color: var(--ink-3); }

.sl-trust { display: grid; gap: var(--sp-3); }
@media (min-width: 720px) { .sl-trust { grid-template-columns: repeat(3, 1fr); } }
.sl-trust > div { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--sp-4); }
.sl-trust h3 { font-size: .98rem; margin: 0 0 var(--sp-2); }
.sl-trust p { margin: 0; font-size: .86rem; line-height: 1.9; color: var(--ink-2); }


.sl-define { max-width: 560px; margin: var(--sp-3) auto 0; font-size: .92rem; line-height: 1.95; color: var(--ink-2); }
.sl-trust + .sl-block { margin-top: var(--sp-6); }
.sl-for { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); }
.sl-for li { position: relative; padding-inline-start: var(--sp-6); line-height: 1.9; color: var(--ink-2); font-size: .94rem; }
.sl-for li::before { content: '✓'; position: absolute; inset-inline-start: 0; top: 0; color: var(--teal-600); font-weight: 800; }
.sl-block .prose-table th[scope="row"] { white-space: normal; background: var(--surface); color: var(--ink); min-width: 8.5rem; }
.sl-faq { display: grid; gap: var(--sp-2); }
.sl-q { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); }
.sl-q summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between;
gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); font-weight: 700; font-size: .95rem; line-height: 1.8; color: var(--ink); }
.sl-q summary::-webkit-details-marker { display: none; }
.sl-q summary::after { content: '+'; flex: none; font-size: 1.25rem; font-weight: 500; color: var(--teal-600); line-height: 1; }
.sl-q[open] summary::after { content: '2'; }
.sl-q[open] summary { border-bottom: 1px solid var(--line-soft); }
.sl-a { padding: var(--sp-3) var(--sp-4) var(--sp-4); }
.sl-a p { margin: 0; font-size: .92rem; line-height: 2; color: var(--ink-2); }
.sl-about { margin: 0; font-size: .92rem; line-height: 2; color: var(--ink-2); }
.sl-guides { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-2); }
.sl-guides a { font-size: .94rem; line-height: 1.9; }
.sl-updated { margin: var(--sp-4) 0 0; font-size: .8rem; color: var(--ink-3); }
@media (max-width: 600px) {

.sl-block .prose-table th, .sl-block .prose-table td { padding: var(--sp-2) var(--sp-2); font-size: .8rem; line-height: 1.8; }
.sl-block .prose-table thead th { white-space: normal; }
.sl-block .prose-table th[scope="row"] { min-width: 0; }
}

.sl-sticky {
position: fixed; inset-inline: 0; bottom: 0; z-index: 60;
display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
padding: var(--sp-3) var(--sp-4);
padding-bottom: calc(var(--sp-3) + env(safe-area-inset-bottom, 0px));
background: rgba(255, 255, 255, .95); border-top: 1px solid var(--line); box-shadow: var(--sh-lg);
}
.sl-sticky-price { display: flex; flex-direction: column; line-height: 1.4; }
.sl-sticky .sl-price-old { font-size: .74rem; }
.sl-sticky .sl-price-new { font-size: 1.15rem; }
.sl-sticky .btn { flex: none; }

.sl-page { padding-bottom: calc(var(--sp-20) + env(safe-area-inset-bottom, 0px)); }
@media (min-width: 900px) {
.sl-sticky { display: none; }
.sl-page { padding-bottom: var(--sp-16); }
}
@media print { .sl-sticky { display: none; } }



.pd .pd-sec { margin-block: var(--sp-8); }
.pd .pd-sec:first-child { margin-top: 0; }
.pd h2 { margin: 0 0 var(--sp-3); }
.pd h3 { margin: var(--sp-6) 0 var(--sp-2); font-size: 1.05rem; }
.pd p { color: var(--ink-2); line-height: 2.05; margin: 0 0 var(--sp-4); }
.pd .pd-answer { font-size: 1.05rem; color: var(--ink); }

.pd-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-3); margin-top: var(--sp-5); }
@media (min-width: 640px) { .pd-stats { grid-template-columns: repeat(4, 1fr); } }
.pd-stat {
background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
padding: var(--sp-4) var(--sp-3); text-align: center; cursor: help;
transition: border-color .15s ease, box-shadow .15s ease;
}
.pd-stat:hover, .pd-stat:focus-visible { border-color: var(--brand-400); box-shadow: var(--sh-md); outline: none; }
.pd-stat-v { display: block; font-size: 1.05rem; font-weight: 800; color: var(--brand-700); line-height: 1.7; }
.pd-stat-l { display: block; margin-top: 2px; font-size: .8rem; color: var(--ink-3); line-height: 1.7; }

.pd-table { margin: var(--sp-4) 0 var(--sp-5); }
.pd-table table { font-size: .9rem; }
.pd-table tbody tr[data-tooltip]:hover td, .pd-table tbody tr[data-tooltip]:hover th { background: var(--brand-50); }
.pd-table td[data-tooltip] { cursor: help; text-align: center; }
.pd-table td[data-tooltip]:hover, .pd-table td[data-tooltip]:focus-visible { background: var(--brand-50); outline: none; }
.pd-table td.pd-hi { background: var(--teal-50); color: var(--teal-800); font-weight: 800; }

.pd-tip {
position: absolute; z-index: 400; max-width: min(320px, calc(100vw - 16px));
background: var(--ink); color: #fff; border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4);
font-size: .85rem; line-height: 1.9; box-shadow: var(--sh-lg); pointer-events: none;
}
.pd-tip[hidden] { display: none; }
.pd-tip strong { display: block; margin-bottom: 2px; color: var(--teal-300); font-size: .85rem; }

.pd-chart { margin: var(--sp-6) 0; padding: var(--sp-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); }
.pd-kicker { margin: 0 0 var(--sp-2) !important; font-size: .78rem; font-weight: 800; color: var(--brand-700) !important; line-height: 1.6 !important; }
.pd-chart figcaption { display: grid; gap: 2px; margin-bottom: var(--sp-3); }
.pd-chart figcaption strong { color: var(--ink); font-size: .98rem; line-height: 1.8; }
.pd-chart figcaption span { color: var(--ink-3); font-size: .85rem; line-height: 1.9; }
.pd-svg { display: block; width: 100%; height: auto; }
.pd-grid { stroke: var(--line); stroke-width: 1; }
.pd-axis { fill: var(--ink-3); font-size: 13px; font-family: inherit; direction: ltr; text-anchor: start; }
.pd-axis-x { fill: var(--ink-2); direction: rtl; text-anchor: middle; }
.pd-bar { cursor: pointer; transition: opacity .12s ease; }
.pd-bar:hover, .pd-bar:focus-visible { opacity: .78; outline: none; stroke: var(--ink); stroke-width: 1.5; }
.pd-s0 { fill: var(--teal-600); background: var(--teal-600); }
.pd-s1 { fill: var(--brand-600); background: var(--brand-600); }
.pd-s2 { fill: #E0A030; background: #E0A030; }
.pd-legend { list-style: none; margin: var(--sp-3) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); font-size: .85rem; color: var(--ink-2); }
.pd-legend li { display: flex; align-items: center; gap: 6px; }
.pd-sw { display: inline-block; width: 12px; height: 12px; border-radius: 3px; }

.pd-tool { margin: var(--sp-6) 0; padding: var(--sp-5); background: var(--brand-50); border: 1px solid var(--brand-100); border-radius: var(--r-lg); }
.pd-tool h3 { margin-top: 0; }
.pd-tool-intro { font-size: .93rem; }
.pd-fields { display: grid; grid-template-columns: 1fr; gap: var(--sp-3); margin-bottom: var(--sp-4); }
@media (min-width: 640px) { .pd-fields { grid-template-columns: repeat(2, 1fr); } }
.pd-field { display: grid; gap: 4px; font-size: .88rem; color: var(--ink-2); }
.pd-field span { font-weight: 700; color: var(--ink); }
.pd-field input, .pd-field select {
width: 100%; min-height: 44px; padding: 0 var(--sp-3); font: inherit; color: var(--ink);
background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
}
.pd-field input:focus, .pd-field select:focus { outline: 2px solid var(--brand-400); outline-offset: 1px; }
.pd-field small { color: var(--ink-3); font-size: .78rem; }
.pd-result { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-3); }
.pd-result[hidden] { display: none; }
@media (min-width: 640px) { .pd-result { grid-template-columns: repeat(3, 1fr); } }
.pd-out { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-3); display: grid; gap: 2px; }
.pd-out span { font-size: .78rem; color: var(--ink-3); line-height: 1.7; }
.pd-out b { font-size: .98rem; color: var(--ink); line-height: 1.7; word-break: break-word; }
.pd-out.is-strong { border-color: var(--teal-300); background: var(--teal-50); }
.pd-out.is-strong b { color: var(--teal-800); font-size: 1.1rem; }
.pd-tool-note { min-height: 0; margin: var(--sp-3) 0 0 !important; font-size: .85rem; color: var(--warn) !important; }
.pd-tool-note:empty { display: none; }
.pd-ours { margin: var(--sp-3) 0 0 !important; font-size: .8rem; color: var(--ink-3) !important; }

.pd-formula {
margin: var(--sp-4) 0; padding: var(--sp-4); background: var(--ink); color: var(--teal-300);
border-radius: var(--r-md); font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .95rem;
overflow-x: auto; cursor: help; text-align: left;
}

.pd-steps { padding-inline-start: var(--sp-6); display: grid; gap: var(--sp-3); color: var(--ink-2); line-height: 2; }
.pd-steps li::marker { color: var(--teal-600); font-weight: 800; }

.pd-plans { list-style: none; margin: var(--sp-3) 0 var(--sp-5); padding: 0; display: grid; grid-template-columns: 1fr; gap: var(--sp-3); }
@media (min-width: 640px) { .pd-plans { grid-template-columns: repeat(2, 1fr); } }
.pd-plan {
background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-4);
cursor: help; display: grid; gap: var(--sp-2); transition: border-color .15s ease, box-shadow .15s ease;
}
.pd-plan:hover, .pd-plan:focus-visible { border-color: var(--brand-400); box-shadow: var(--sh-md); outline: none; }
.pd-plan a { color: var(--ink); text-decoration: none; line-height: 1.8; }
.pd-plan a:hover { color: var(--brand-700); }
.pd-plan dl { margin: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-2) var(--sp-3); }
.pd-plan dt { font-size: .75rem; color: var(--ink-3); }
.pd-plan dd { margin: 0; font-size: .86rem; color: var(--ink); line-height: 1.7; }

.pd-faq { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); margin-bottom: var(--sp-2); }
.pd-faq summary { cursor: pointer; padding: var(--sp-3) var(--sp-4); font-weight: 700; color: var(--ink); line-height: 1.9; }
.pd-faq p { padding: 0 var(--sp-4); margin: 0 0 var(--sp-4); }

.pd-sources { padding-inline-start: var(--sp-6); display: grid; gap: var(--sp-3); color: var(--ink-2); line-height: 1.9; font-size: .9rem; }
.pd-sources small { display: block; direction: ltr; text-align: left; word-break: break-all; }

.pd .pd-cta { margin-block: var(--sp-6); }


.pd-summary {
background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
padding: var(--sp-5); box-shadow: var(--sh-sm, none);
}
.pd-summary .pd-kicker { margin: 0 0 var(--sp-2); }
.pd-summary .pd-answer { margin: 0 0 var(--sp-5); line-height: 2.1; }
.pd-facts { margin: 0 0 var(--sp-5); display: grid; grid-template-columns: 1fr; gap: 0; border-top: 1px solid var(--line); }
@media (min-width: 640px) { .pd-facts { grid-template-columns: repeat(2, 1fr); column-gap: var(--sp-6); } }
.pd-facts > div { display: flex; justify-content: space-between; gap: var(--sp-3); padding: var(--sp-2) 0; border-bottom: 1px solid var(--line); }
.pd-facts dt { color: var(--ink-3); font-size: .88rem; }
.pd-facts dd { margin: 0; color: var(--ink); font-weight: 700; font-size: .92rem; text-align: left; }
.pd-toc { border-top: 1px dashed var(--line); padding-top: var(--sp-4); }
.pd-toc-title { margin: 0 0 var(--sp-2); font-weight: 800; color: var(--ink); font-size: .95rem; }
.pd-toc ol { margin: 0; padding-inline-start: var(--sp-5); display: grid; gap: var(--sp-1); font-size: .9rem; line-height: 1.9; }
.pd-toc a { color: var(--brand-700); text-decoration: none; }
.pd-toc a:hover { text-decoration: underline; }
.pd-article h2, .pd-article h3, #pd-faq { scroll-margin-top: 80px; }
.pd-article h2 { margin-top: var(--sp-8); }
.pd-article h2:first-child { margin-top: 0; }

.pd-article a:not(.btn) { color: var(--brand-700); text-decoration: underline; text-underline-offset: 3px; }
.pd-article code { direction: ltr; unicode-bidi: isolate; font-size: .9em; }
.pd .pd-dash {
margin: var(--sp-6) 0; padding: 0; border: 1px solid var(--line); border-radius: var(--r-md);
overflow: hidden; background: #fff; max-width: 100%;
}



.tz[hidden] { display: none; }
#in-section[hidden] { display: none; }
.tz .container { display: grid; gap: var(--sp-3); }
.tz.section { padding-block: var(--sp-4) var(--sp-8); }
.tz-head { display: flex; align-items: center; gap: var(--sp-3); }
.tz-ok {
flex: none; display: inline-grid; place-items: center; inline-size: 36px; block-size: 36px;
border-radius: var(--r-full); background: var(--ok-bg); color: var(--ok); font-weight: 800;
}
.tz-title { margin: 0; font-size: 1.2rem; font-weight: 800; line-height: 1.7; }
.tz-lede { margin: var(--sp-1) 0 0; font-size: .86rem; line-height: 1.9; color: var(--ink-2); }
.tz-counts { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2); margin-top: var(--sp-2); }
.tz-count {
display: grid; justify-items: center; text-align: center; gap: 0;
padding: var(--sp-2) var(--sp-3); border-radius: var(--r-lg);
border: 1px solid var(--line); background: var(--surface);
}
.tz-count b { font-size: 1.9rem; font-weight: 800; line-height: 1.35; }
.tz-count span { font-size: .8rem; color: var(--ink-2); line-height: 1.7; }

.tz-count--zero { background: var(--surface-2); border-color: var(--line-soft); }
.tz-count--zero b, .tz-count--zero span { color: var(--ink-4); }
.tz-count--fix { box-shadow: var(--sh-sm); }
.tz-count--ok { border-color: var(--ok-line); background: var(--ok-bg); }
.tz-count--ok b { color: var(--ok); }
.tz-count--fix { border-color: var(--warn-line); background: var(--warn-bg); }
.tz-count--fix b { color: var(--warn); }
.tz-note { margin: var(--sp-2) 0 0; font-size: .78rem; line-height: 1.9; color: var(--ink-3); }
.tz-sub { margin: var(--sp-4) 0 var(--sp-2); font-size: .95rem; font-weight: 800; }
.tz-cards { display: grid; gap: var(--sp-3); }
.tz-card {
padding: var(--sp-4); border: 1px solid var(--line); border-radius: var(--r-lg);
background: var(--surface); box-shadow: var(--sh-xs); display: grid; gap: var(--sp-2);
}
.tz-card-top { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); }
.tz-prio { font-size: .8rem; font-weight: 700; color: var(--ink-3); }
.tz-chip { padding: 2px var(--sp-3); border-radius: var(--r-full); font-size: .76rem; font-weight: 700; }
.tz-chip--actionable { background: var(--ok-bg); color: var(--ok); }
.tz-chip--fixable { background: var(--warn-bg); color: var(--warn); }
.tz-mask { margin: 0; font-size: .9rem; font-weight: 700; color: var(--ink); }

.tz-blur {
display: inline-block; filter: blur(5px); user-select: none; color: var(--ink-2);
background: var(--line-soft); border-radius: 4px; padding: 0 4px;
}
.tz-figs { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2) var(--sp-3); }
.tz-fig { display: grid; gap: 0; }
.tz-fig dt { font-size: .74rem; color: var(--ink-3); }
.tz-fig dd { margin: 0; font-size: .88rem; font-weight: 700; color: var(--ink); }
.tz-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.tz-tags li {
font-size: .76rem; padding: 2px var(--sp-3); border-radius: var(--r-full);
background: var(--brand-50); color: var(--brand-700); font-weight: 600;
}
.tz-edit { margin: 0; text-align: center; }
.tz-edit-btn {
border: 0; background: none; color: var(--brand-700); font: inherit; font-size: .85rem; font-weight: 700;
text-decoration: underline; text-underline-offset: 4px; cursor: pointer; min-block-size: 40px;
}
.tz-zero[hidden] { display: none; }
.tz-buy[hidden] { display: none; }

.tz-jump { margin: 0 0 var(--sp-3); text-align: center; }
.tz-jump[hidden] { display: none; }
.tz-jump-btn {
min-block-size: 40px; padding: 4px var(--sp-4); border-radius: var(--r-full);
border: 1px solid var(--brand-200); background: var(--brand-50); color: var(--brand-700);
font: inherit; font-size: .86rem; font-weight: 800; cursor: pointer;
}
.tz-jump-btn:hover { border-color: var(--brand-600); }
.tz-zero {
display: grid; gap: var(--sp-3); padding: var(--sp-4) var(--sp-5); border-radius: var(--r-lg);
border: 1px solid var(--warn-line); background: var(--warn-bg);
}
.tz-zero-t { margin: 0; font-weight: 800; line-height: 2; color: var(--ink); }
.tz-zero-p { margin: 0; font-size: .86rem; line-height: 2; color: var(--ink-2); }
.tz-buy {
display: grid; gap: var(--sp-3); padding: var(--sp-5); border-radius: var(--r-lg);
background: var(--surface); border: 1px solid var(--brand-100); box-shadow: var(--sh-sm);
}
.tz-buy-h { margin: 0; font-size: 1.02rem; font-weight: 800; line-height: 1.9; }
.tz-buy-p { margin: 0; font-size: .84rem; line-height: 2; color: var(--ink-2); }
.tz-buy .cs-form { margin-top: 0; }
@media (max-width: 330px) { .tz-figs { grid-template-columns: 1fr; } }
.ck-brief-edit { margin: var(--sp-2) 0 0; font-size: .8rem; }
.ck-brief-edit a { color: var(--brand-700); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }


.tz-lock {
display: flex; align-items: center; gap: var(--sp-2); inline-size: 100%;
padding: var(--sp-2) var(--sp-3); border: 1px dashed var(--brand-200); border-radius: var(--r-full);
background: linear-gradient(90deg, var(--brand-50), var(--teal-50)); color: var(--brand-700);
font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; text-align: start;
}
.tz-lock svg { flex: none; }
.tz-lock-go { margin-inline-start: auto; font-size: .78rem; color: var(--brand-600); }
.tz-why {
margin: 0; padding: 4px var(--sp-3); border-radius: var(--r-sm);
background: var(--warn-bg); color: var(--warn); font-size: .78rem; font-weight: 600; line-height: 1.9;
}
.tz-fine { margin: 0; font-size: .74rem; line-height: 1.9; color: var(--ink-3); }
.tz-gets { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.tz-gets li { position: relative; padding-inline-start: 22px; font-size: .84rem; line-height: 1.9; color: var(--ink-2); }
.tz-gets li::before { content: '✓'; position: absolute; inset-inline-start: 0; color: var(--ok); font-weight: 800; }


.tz-wait {
position: fixed; inset: 0; z-index: 900; display: grid; place-items: center; padding: var(--sp-4);
background: rgba(241, 246, 251, .94);
-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.tz-wait-card {
inline-size: min(100%, 380px); padding: var(--sp-6) var(--sp-5); border-radius: var(--r-xl);
background: var(--surface); box-shadow: var(--sh-lg); display: grid; gap: var(--sp-4);
}
.tz-wait-t { margin: 0; text-align: center; font-size: 1.05rem; font-weight: 800; color: var(--ink); }
.tz-wait-bar { block-size: 8px; border-radius: var(--r-full); background: var(--line-soft); overflow: hidden; }
.tz-wait-fill {
display: block; block-size: 100%; inline-size: 0; border-radius: inherit;
background: var(--grad-brand); transition: width 2.8s cubic-bezier(.3, .7, .4, 1);
}
.tz-wait-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); }
.tz-wait-list li { display: flex; align-items: center; gap: var(--sp-2); font-size: .85rem; line-height: 1.8; color: var(--ink-4); transition: color .2s; }
.tz-wait-ic {
flex: none; inline-size: 20px; block-size: 20px; border-radius: var(--r-full);
border: 2px solid var(--line); display: inline-grid; place-items: center; font-size: .7rem; font-weight: 800;
}
.tz-wait-list li.is-run { color: var(--ink); }
.tz-wait-list li.is-run .tz-wait-ic { border-color: var(--brand-200); border-top-color: var(--brand-600); animation: tz-spin .8s linear infinite; }
.tz-wait-list li.is-done { color: var(--ink-2); }
.tz-wait-list li.is-done .tz-wait-ic { border-color: var(--ok); background: var(--ok); color: #fff; }
.tz-wait-list li.is-done .tz-wait-ic::after { content: '✓'; }
@keyframes tz-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
.tz-wait-fill { transition: none; }
.tz-wait-list li.is-run .tz-wait-ic { animation: none; }
}


.tz-frame { display: block; inline-size: 100%; block-size: 600px; border: 0; background: transparent; }
.tz-near { display: grid; gap: var(--sp-3); padding: var(--sp-4); border-radius: var(--r-lg);
border: 1px solid var(--brand-100); background: var(--surface); box-shadow: var(--sh-sm); }
.tz-near-t { margin: 0; font-size: .9rem; font-weight: 700; line-height: 1.9; }
.tz-near-b { display: grid; gap: 2px; text-align: center; }
.tz-near-b small { font-size: .76rem; font-weight: 500; opacity: .9; }



.sl-focus {
margin: 0 0 var(--sp-3); padding: 10px 14px; border-radius: var(--r-md);
background: var(--brand-50); border: 1px solid var(--brand-500);
font-size: .92rem; font-weight: 700; line-height: 1.95; color: var(--brand-700);
}


.sx-who { margin: 0; font-size: .8rem; line-height: 1.9; color: var(--ink-3); }
.sx-who strong { color: var(--ink-2); }
.sx-tabs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-bottom: var(--sp-3); }
.sx-tabs::-webkit-scrollbar { display: none; }
.sx-tab {
flex: 0 0 auto; min-height: 40px; padding: 0 12px; border-radius: var(--r-full);
border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
font: inherit; font-size: .8rem; font-weight: 700; cursor: pointer; white-space: nowrap;
}
.sx-tab.is-on { background: var(--brand-600); border-color: var(--brand-600); color: #fff; }
.sx-track {
display: flex; gap: var(--sp-3); overflow-x: auto; scroll-snap-type: x mandatory;
overscroll-behavior-x: contain; scrollbar-width: none; padding-bottom: 4px;
}
.sx-track::-webkit-scrollbar { display: none; }
.sx-slide {
flex: 0 0 90%; scroll-snap-align: start; background: var(--surface-2);
border: 1px solid var(--line); border-radius: var(--r-lg); padding: 12px;
display: flex; flex-direction: column; gap: 10px;
}
@media (min-width: 768px) { .sx-slide { flex-basis: 70%; } }
.sx-h { margin: 0; font-size: 1rem; font-weight: 800; line-height: 1.8; color: var(--brand-700); }
.sx-row { background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--r-md); padding: 10px 12px; }
.sx-row-top { display: flex; align-items: flex-start; gap: 8px; }
.sx-n {
flex: 0 0 24px; height: 24px; border-radius: 50%; background: var(--brand-50); color: var(--brand-700);
font-size: .78rem; font-weight: 800; display: inline-flex; align-items: center; justify-content: center;
}
.sx-row-name { flex: 1 1 auto; font-size: .88rem; line-height: 1.8; }
.sx-row-name small { display: block; font-size: .75rem; color: var(--ink-3); }
.sx-pill { flex: 0 0 auto; font-size: .72rem; font-weight: 700; line-height: 1.9; padding: 0 9px; border-radius: var(--r-full); border: 1px solid; }
.sx-pill--ok { background: var(--ok-bg); border-color: var(--ok-line); color: var(--ok); }
.sx-pill--warn { background: var(--warn-bg); border-color: var(--warn-line); color: var(--warn); }
.sx-pill--bad { background: var(--danger-bg); border-color: var(--danger-line); color: var(--danger); }
.sx-figs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; margin: 8px 0 0; }
.sx-figs .sx-wide { grid-column: 1 / -1; }
.sx-figs dt { font-size: .7rem; color: var(--ink-4); }
.sx-figs dd { margin: 0; font-size: .8rem; font-weight: 700; color: var(--ink); line-height: 1.7; }
.sx-figs dd small { display: block; font-weight: 400; font-size: .68rem; color: var(--ink-3); }
.sx-status { margin: 6px 0 0; font-size: .76rem; color: var(--ink-3); }
.sx-more { margin: 0; font-size: .8rem; color: var(--ink-3); text-align: center; }
.sx-alert { border-radius: var(--r-md); padding: 10px 12px; border: 1px solid; font-size: .84rem; line-height: 1.95; }
.sx-alert p { margin: 4px 0 0; color: var(--ink-2); }
.sx-alert--bad { background: var(--danger-bg); border-color: var(--danger-line); }
.sx-alert--bad strong { color: var(--danger); }
.sx-alert--warn { background: var(--warn-bg); border-color: var(--warn-line); }
.sx-alert--warn strong { color: var(--warn); }
.sx-alert--info { background: var(--brand-50); border-color: var(--line); }
.sx-path { background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--r-md); padding: 10px 12px; font-size: .84rem; line-height: 1.95; }
.sx-path.is-rec { border-color: var(--ok-line); background: var(--ok-bg); }
.sx-path p { margin: 4px 0 0; color: var(--ink-2); }
.sx-tag { display: inline-block; font-size: .7rem; font-weight: 800; color: var(--brand-700); margin-bottom: 2px; }
.sx-path strong { display: block; }
.sx-sub { margin: 4px 0 0; font-size: .8rem; font-weight: 700; color: var(--ink-2); }
.sx-steps { margin: 0; padding-inline-start: 20px; font-size: .84rem; line-height: 1.95; color: var(--ink-2); }
.sx-hint { margin: var(--sp-2) 0 0; font-size: .8rem; color: var(--brand-700); text-align: center; }
.sx-hint[hidden] { display: none; }



.hero-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); margin-top: var(--sp-6); }
.hero-groups .hp-chip { justify-content: space-between; min-height: 44px; font-weight: 700; }
@media (min-width: 560px) { .hero-groups { display: flex; flex-wrap: wrap; } }
.hero-cta .hero-go { min-height: 54px; white-space: normal; line-height: 1.7; text-align: center; }
.hero-groups + .hero-cta { margin-top: var(--sp-5); }
.hero-note a { font-weight: 700; color: var(--brand-700); }
.hero-note span { line-height: 1.95; }


.lcards.lcards--slide {
display: flex; grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory;
overscroll-behavior-x: contain; scrollbar-width: none; gap: var(--sp-3); padding-bottom: 4px;
}
.lcards--slide::-webkit-scrollbar { display: none; }
.lcards--slide > * { flex: 0 0 84%; scroll-snap-align: start; }
.slide-hint { margin: var(--sp-2) 0 0; font-size: .8rem; color: var(--brand-700); text-align: center; }
@media (min-width: 768px) {
.lcards.lcards--slide { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; }
.lcards--slide > * { flex: none; }
.slide-hint { display: none; }
}


.plan-invite-wrap { margin-bottom: var(--sp-8); }
.plan-invite .guide-cta-btn { min-height: 52px; white-space: normal; line-height: 1.8; }
.plan-invite-easier { margin: var(--sp-4) 0 var(--sp-2); font-size: .84rem; font-weight: 700; color: var(--ink-2); }
.plan-invite-chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.plan-invite-chips .hp-chip { min-height: 40px; }

.sl-main > .sl-buy, .sl-main > .sl-preview { min-width: 0; }

.sx-track { align-items: flex-start; }
.sx-shot { margin: 0; }
.sx-shot a { display: block; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; background: var(--surface); }
.sx-shot img { display: block; width: 100%; height: auto; }
.sx-shot figcaption { margin-top: 6px; font-size: .78rem; color: var(--ink-3); text-align: center; }


.tz-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 6px 0 12px;
padding: 10px 12px; border-radius: var(--r-md); background: var(--brand-50); border: 1px solid var(--brand-100); }
.tz-price-old { color: var(--ink-4); text-decoration: line-through; font-size: .9rem; }
.tz-price-new { font-size: 1.35rem; font-weight: 800; color: var(--brand-700); }
.tz-price small { flex-basis: 100%; font-size: .78rem; color: var(--ink-3); }
.tz-vpn { margin: 0 0 12px; padding: 9px 12px; border-radius: var(--r-md); background: var(--warn-bg);
border: 1px solid var(--warn-line); color: var(--warn); font-size: .84rem; line-height: 1.9; }
.tz-vpn[hidden] { display: none; }
.tz-direct { margin: 8px 0 0; font-size: .8rem; color: var(--ink-3); text-align: center; }
.tz-code { margin: 10px 0 0; text-align: center; }
.tz-code-open { background: none; border: 0; padding: 4px; font: inherit; font-size: .82rem; color: var(--brand-700); text-decoration: underline; cursor: pointer; }
.tz-code-box { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.tz-code-box[hidden] { display: none; }
.tz-code-box input { flex: 1 1 140px; min-height: 40px; border: 1px solid var(--line); border-radius: var(--r-md); padding: 0 10px; font: inherit; }
.tz-code-msg { flex-basis: 100%; margin: 0; font-size: .8rem; }
.tz-code-msg[hidden] { display: none; }
.tz-code-msg.is-ok { color: var(--ok); }
.tz-code-msg.is-bad { color: var(--danger); }


.tz-retry { margin: 0 0 12px; padding: 10px 12px; border-radius: var(--r-md); background: var(--brand-50);
border: 1px solid var(--brand-100); color: var(--brand-700); font-size: .86rem; line-height: 1.9; }
.tz-retry[hidden] { display: none; }
.tz-edit-sep { margin: 0 6px; color: var(--ink-4); }


.sample-link {
display: inline-flex; align-items: center; gap: 4px; margin-top: var(--sp-3);
font-size: .86rem; font-weight: 700; color: var(--brand-700); text-decoration: underline;
text-underline-offset: 4px; text-decoration-thickness: 1px; line-height: 1.9;
}
.sample-link:hover { color: var(--brand-800, var(--brand-700)); }
.sample-link--light { color: #fff; }
.sample-link--light:hover { color: #fff; opacity: .9; }
.guide-cta .sample-link, .plan-invite .sample-link, .fc-locked .sample-link { display: flex; justify-content: center; }
.sl-pay .sample-link { display: flex; justify-content: center; }
.guide-cta-card .sample-link { display: flex; justify-content: center; }
.sample-btn { margin-top: var(--sp-4); background: var(--brand-50); }
.offers-sample { margin: var(--sp-4) 0 0; text-align: center; }
.offers-sample .sample-btn { margin-top: 0; min-height: 44px; }
.hero-sample { margin: var(--sp-3) 0 0; }
.hero-sample .sample-link { margin-top: 0; }