/* Project profile (pp-). Loaded only on single cn_project pages. */
.pp { --accent: var(--gold); }
.pp-hero { position: relative; overflow: hidden; background: radial-gradient(circle at 85% 0%, color-mix(in srgb, var(--accent) 28%, transparent), transparent 45%), radial-gradient(circle at 0% 100%, rgba(91,76,255,.28), transparent 50%), var(--night); color: #cfd5ea; padding-block: clamp(24px, 4vw, 40px) clamp(32px, 5vw, 56px); }
.pp-hero .crumbs a, .pp-hero .crumbs ol { color: #9aa3c4; }
.pp-hero__grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, 1fr); gap: clamp(24px, 5vw, 64px); align-items: center; }
.pp-hero__name { display: flex; align-items: center; gap: 1.1rem; }
.pp-hero__name img { border-radius: 50%; box-shadow: 0 0 0 6px color-mix(in srgb, var(--accent) 18%, transparent), 0 12px 40px color-mix(in srgb, var(--accent) 35%, transparent); }
.pp-hero__sym { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: var(--accent); color: #fff; font: 800 1.1rem/1 var(--font-head); }
.pp-hero h1 { color: #fff; margin: 0 0 .35rem; font-size: clamp(2.2rem, 5vw, 3.4rem); }
.pp-hero__ticker { font-size: .45em; font-weight: 600; color: #8d96b8; vertical-align: middle; letter-spacing: .04em; }
.pp-badge { display: inline-block; padding: .3rem .7rem; border-radius: 999px; background: color-mix(in srgb, var(--accent) 18%, transparent); color: var(--accent); font: 600 .8rem/1 var(--font-head); }
.pp-hero__tagline { font-size: clamp(1.1rem, 2vw, 1.3rem); line-height: 1.6; color: #dfe4f5; margin: 1.25rem 0 1rem; max-width: 560px; }
.pp-tags { display: flex; flex-wrap: wrap; gap: .45rem; list-style: none; margin: 0 0 1.5rem; padding: 0; }
.pp-tags li { padding: .4rem .8rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.04); font: 500 .86rem/1 var(--font-head); color: #dfe4f5; }
.pp-links { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.1rem; }
.pp-links .btn--primary { background: var(--accent); border-color: var(--accent); color: #1a1205; }
.pp-links .btn--primary:hover { box-shadow: 0 10px 30px color-mix(in srgb, var(--accent) 40%, transparent); }
.pp-link { color: #b8c0dc; font-weight: 500; font-size: .95rem; }
.pp-link:hover { color: #fff; }

.pp-price { padding: clamp(20px, 3vw, 28px); border-radius: 22px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(8px); display: flex; flex-direction: column; gap: .35rem; }
.pp-price__label { font-size: .85rem; color: #8d96b8; }
.pp-price__value { font: 800 clamp(2.2rem, 4.5vw, 3rem)/1.1 var(--font-head); color: #fff; font-variant-numeric: tabular-nums; text-align: start; }
.pp-price__chg { font-size: 1.05rem; }
.pp-price__chg small { color: #8d96b8; font-size: .82rem; }
.pp-hero .chg--up { color: #34d399; }
.pp-hero .chg--down { color: #fb7185; }
.pp-range { margin-top: 1rem; }
.pp-range__bar { position: relative; height: 6px; border-radius: 99px; background: linear-gradient(90deg, #fb7185, #fbbf24, #34d399); opacity: .85; }
.pp-range__bar span { position: absolute; top: 50%; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid var(--night); transform: translate(-50%, -50%); box-shadow: 0 0 0 2px #fff; }
.pp-range__ends { display: flex; justify-content: space-between; align-items: center; margin-top: .5rem; font-size: .82rem; color: #b8c0dc; font-variant-numeric: tabular-nums; }
.pp-range__ends small { color: #7f89ab; }
.pp-price__mini { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: 1rem 0 0; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,.08); }
.pp-price__mini dt { font-size: .78rem; color: #8d96b8; }
.pp-price__mini dd { margin: 0; font-weight: 700; }

.pp-nav { position: sticky; top: var(--pp-top, 64px); z-index: 50; background: color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.pp-nav ul { display: flex; gap: .25rem; list-style: none; margin: 0; padding: .55rem 0; overflow-x: auto; scrollbar-width: none; }
.pp-nav ul::-webkit-scrollbar { display: none; }
.pp-nav a { display: block; padding: .5rem .95rem; border-radius: 999px; color: var(--ink-2); font: 500 .92rem/1 var(--font-head); white-space: nowrap; text-decoration: none !important; transition: .15s; }
.pp-nav a:hover { color: var(--ink); background: var(--bg-soft); }
.pp-nav a.is-active { background: var(--ink); color: var(--bg); }

.pp-sec { padding-block: clamp(40px, 6vw, 72px); scroll-margin-top: 130px; }
.pp-sec--soft { background: var(--bg-soft); }
.pp-h { font-size: clamp(1.45rem, 2.6vw, 2rem); margin-bottom: 1.25rem; }
.pp-lead { color: var(--ink-2); font-size: 1.1rem; margin: -.5rem 0 1.75rem; max-width: 680px; }
.pp-muted { color: var(--ink-3); font-size: .9rem; margin: 1rem 0 0; }
.pp-source { color: var(--ink-3); font-size: .85rem; margin: 1rem 0 0; }
.pp-card { background: var(--bg-elev); border: 1px solid var(--line); border-radius: 20px; padding: clamp(20px, 3vw, 28px); }

.pp-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-bottom: clamp(40px, 5vw, 56px); }
.pp-stats--4 { grid-template-columns: repeat(4, 1fr); margin-bottom: 0; }
.pp-stat { display: flex; flex-direction: column; gap: .3rem; padding: 1.25rem 1.35rem; border-radius: 18px; background: var(--bg-elev); border: 1px solid var(--line); position: relative; overflow: hidden; }
.pp-stat::before { content: ""; position: absolute; inset-inline-start: 0; top: 1.25rem; bottom: 1.25rem; width: 3px; border-radius: 3px; background: var(--accent); opacity: .7; }
.pp-stat > span { font-size: .86rem; color: var(--ink-3); }
.pp-stat strong { font: 700 1.55rem/1.2 var(--font-head); font-variant-numeric: tabular-nums; color: var(--ink); text-align: start; }
.pp-stat strong em { font-style: normal; font-size: .6em; color: var(--ink-3); }
.pp-stat small { font-size: .84rem; color: var(--ink-2); }

.pp-id { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; background: var(--line); gap: 1px; }
.pp-id > div { display: grid; grid-template-columns: 40px 1fr; grid-template-rows: auto auto; column-gap: .85rem; align-items: center; padding: 1.1rem 1.25rem; background: var(--bg-elev); }
.pp-id__icon { grid-row: 1 / 3; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent); }
.pp-id dt { font-size: .8rem; color: var(--ink-3); }
.pp-id dd { margin: 0; font-weight: 600; line-height: 1.4; text-align: start; }

.pp-chart { background: var(--bg-elev); border: 1px solid var(--line); border-radius: 22px; padding: clamp(18px, 3vw, 28px); box-shadow: var(--shadow); }
.pp-chart__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
.pp-chart__head .pp-h { margin-bottom: .25rem; }
.pp-chart__readout { margin: 0; color: var(--ink-3); font-size: .9rem; }
.pp-chart__readout b { font: 700 1.35rem/1.2 var(--font-head); color: var(--ink); margin-inline-end: .4rem; font-variant-numeric: tabular-nums; }
.pp-tabs { display: inline-flex; padding: .25rem; border-radius: 999px; background: var(--bg-soft); border: 1px solid var(--line); }
.pp-tabs button { border: 0; background: transparent; padding: .45rem .9rem; border-radius: 999px; font: 500 .88rem/1 var(--font-head); color: var(--ink-2); cursor: pointer; }
.pp-tabs button[aria-selected="true"] { background: var(--bg-elev); color: var(--ink); box-shadow: var(--shadow); }
.pp-chart__plot { margin-top: 1rem; min-height: 230px; }
.pp-chart__empty { display: grid; place-items: center; min-height: 200px; color: var(--ink-3); }
.pp-svg { display: block; width: 100%; height: auto; overflow: visible; touch-action: pan-y; cursor: crosshair; }
.pp-svg__grid { stroke: var(--line); stroke-dasharray: 3 4; }
.pp-svg__axis { fill: var(--ink-3); font: 500 11px var(--font); }
.pp-svg__line { fill: none; stroke-width: 2.25; stroke-linejoin: round; stroke-linecap: round; }
.pp-svg.is-up .pp-svg__line { stroke: var(--up); }
.pp-svg.is-down .pp-svg__line { stroke: var(--down); }
.pp-svg.is-up .pp-svg__stop1 { stop-color: var(--up); stop-opacity: .22; }
.pp-svg.is-down .pp-svg__stop1 { stop-color: var(--down); stop-opacity: .22; }
.pp-svg__stop2 { stop-color: var(--bg-elev); stop-opacity: 0; }
.pp-svg__cross { stroke: var(--ink-3); stroke-dasharray: 3 3; }
.pp-svg__dot { fill: var(--bg-elev); stroke-width: 3; }
.pp-svg.is-up .pp-svg__dot { stroke: var(--up); }
.pp-svg.is-down .pp-svg__dot { stroke: var(--down); }
.pp-chart__foot { margin: .75rem 0 0; font-size: .85rem; color: var(--ink-3); }

.pp-supply { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 1rem; }
.pp-ring { display: flex; flex-direction: column; align-items: center; }
.pp-ring__wrap { position: relative; width: min(220px, 70%); }
.pp-ring svg { display: block; width: 100%; transform: rotate(-90deg); }
.pp-ring circle { fill: none; stroke-width: 12; }
.pp-ring__bg { stroke: var(--bg-soft); }
.pp-ring__fg { stroke: var(--accent); stroke-linecap: round; }
.pp-ring__label { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.pp-ring__label strong { font: 800 2rem/1 var(--font-head); }
.pp-ring__label span { color: var(--ink-3); font-size: .88rem; margin-top: .3rem; }
.pp-ring__legend { width: 100%; margin: 1.25rem 0 0; }
.pp-ring__legend div { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-top: 1px solid var(--line); font-size: .94rem; }
.pp-ring__legend dt { color: var(--ink-2); display: flex; align-items: center; gap: .5rem; }
.pp-ring__legend i { width: 10px; height: 10px; border-radius: 50%; background: var(--bg-soft); border: 1px solid var(--line); }
.pp-ring__legend i.is-fg { background: var(--accent); border-color: var(--accent); }
.pp-ring__legend dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.pp-halving h3 { margin-bottom: 1.25rem; }
.pp-bars { display: grid; grid-template-columns: repeat(6, 1fr); gap: .6rem; align-items: end; height: 220px; list-style: none; margin: 0; padding: 0; }
.pp-bars li { height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: .35rem; }
.pp-bars b { font: 700 .9rem/1 var(--font-head); font-variant-numeric: tabular-nums; }
.pp-bars__bar { width: 100%; max-width: 64px; border-radius: 10px 10px 4px 4px; background: color-mix(in srgb, var(--accent) 30%, var(--bg-soft)); }
.pp-bars small { color: var(--ink-3); font-size: .8rem; }
.pp-bars .is-now .pp-bars__bar { background: var(--accent); box-shadow: 0 8px 24px color-mix(in srgb, var(--accent) 40%, transparent); }
.pp-bars .is-now b { color: var(--accent); }
.pp-bars .is-next .pp-bars__bar { background: transparent; border: 2px dashed color-mix(in srgb, var(--accent) 60%, transparent); }
.pp-next { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-top: 1.25rem; padding: 1rem; border-radius: 14px; background: color-mix(in srgb, var(--accent) 9%, var(--bg-elev)); border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent); }
.pp-next span { display: block; font-size: .8rem; color: var(--ink-3); }
.pp-next strong { font: 700 1.05rem/1.3 var(--font-head); }

.pp-wp { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 2fr); gap: clamp(20px, 3vw, 32px); align-items: start; }
.pp-paper { position: sticky; top: 140px; display: flex; flex-direction: column; gap: 1rem; color: var(--ink); text-decoration: none !important; }
.pp-paper__sheet { display: flex; flex-direction: column; align-items: center; gap: .5rem; aspect-ratio: 1 / 1.3; padding: 2rem 1.5rem; border-radius: 6px; background: #fdfcf8; color: #1b1b1b; text-align: center; box-shadow: 0 1px 0 #e7e2d6, 0 2px 0 #fff, 0 3px 0 #e7e2d6, 0 24px 50px rgba(11,18,32,.18); transform: rotate(-1.5deg); transition: transform .25s ease; font-family: Georgia, "Times New Roman", serif; }
.pp-paper:hover .pp-paper__sheet { transform: rotate(0) translateY(-4px); }
.pp-paper__sheet strong { font-size: 1.05rem; line-height: 1.35; }
.pp-paper__sheet em { font-size: .85rem; color: #555; }
.pp-paper__lines { display: flex; flex-direction: column; gap: .55rem; width: 100%; margin-top: 1rem; }
.pp-paper__lines i { height: 5px; border-radius: 3px; background: #e9e6dd; }
.pp-paper__lines i:nth-child(3n) { width: 70%; }
.pp-paper__meta { display: flex; flex-direction: column; gap: .3rem; }
.pp-paper__meta > span { font: 600 1.05rem/1.4 var(--font-head); }
.pp-paper__meta small { color: var(--ink-3); }
.pp-paper__meta b { color: var(--brand-ink); margin-top: .25rem; }
.pp-ideas { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; list-style: none; margin: 0; padding: 0; counter-reset: idea; }
.pp-ideas li { counter-increment: idea; padding: 1.35rem 1.4rem; border-radius: 18px; background: var(--bg-elev); border: 1px solid var(--line); }
.pp-ideas li::before { content: counter(idea, decimal-leading-zero); display: block; font: 800 1.6rem/1 var(--font-head); color: var(--accent); opacity: .85; margin-bottom: .75rem; }
.pp-ideas h3 { font-size: 1.08rem; margin-bottom: .4rem; }
.pp-ideas p { margin: 0; color: var(--ink-2); font-size: .96rem; line-height: 1.65; }

.pp-timeline { position: relative; list-style: none; margin: 0; padding: 0; max-width: 880px; display: grid; gap: .75rem; }
.pp-timeline::before { content: ""; position: absolute; top: .5rem; bottom: .5rem; inset-inline-start: 129px; width: 2px; background: linear-gradient(var(--accent), color-mix(in srgb, var(--accent) 10%, transparent)); }
.pp-timeline li { position: relative; display: grid; grid-template-columns: 110px 1fr; column-gap: 40px; align-items: start; }
.pp-timeline li::after { content: ""; position: absolute; top: 1.35rem; inset-inline-start: 124px; width: 12px; height: 12px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px var(--bg-soft); }
.pp-timeline time { grid-row: 1 / 3; padding-top: 1.1rem; font: 700 .95rem/1.2 var(--font-head); color: var(--accent); text-align: end; font-variant-numeric: tabular-nums; }
.pp-timeline li > h3, .pp-timeline li > p { grid-column: 2; background: var(--bg-elev); border-inline: 1px solid var(--line); padding-inline: 1.3rem; margin: 0; }
.pp-timeline li > h3 { font-size: 1.05rem; padding-top: 1rem; border-top: 1px solid var(--line); border-radius: 16px 16px 0 0; padding-bottom: .3rem; }
.pp-timeline li > p { color: var(--ink-2); font-size: .94rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); border-radius: 0 0 16px 16px; }
.pp-timeline li:hover > h3, .pp-timeline li:hover > p { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }

.pp-analysis { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: clamp(28px, 5vw, 64px); max-width: 1100px; }
.pp-aside { position: sticky; top: 140px; align-self: start; display: flex; flex-direction: column; gap: 1rem; }
.pp-aside .toc { position: static; align-self: stretch; }
.pp-guide { display: flex; gap: .85rem; align-items: flex-start; color: var(--ink-2); font-size: .94rem; text-decoration: none !important; padding: 1.1rem 1.2rem; transition: .15s; }
.pp-guide:hover { border-color: var(--accent); }
.pp-guide .icon { color: var(--accent); width: 24px; height: 24px; margin-top: .1rem; }
.pp-guide b { display: block; color: var(--ink); font-family: var(--font-head); }
.pp .prose .risk-box { background: color-mix(in srgb, var(--down) 7%, var(--bg)); border: 1px solid color-mix(in srgb, var(--down) 25%, transparent); border-radius: var(--radius); padding: 1.25rem 1.5rem; }
.pp-disclosure { padding-block: 0 clamp(40px, 6vw, 72px); }
.pp-disclosure .note-box { margin-top: 0; }
#faq { padding-bottom: 2rem; }
#faq ~ .pp-disclosure { background: var(--bg-soft); max-width: none; }
#faq ~ .pp-disclosure .note-box { max-width: 900px; margin-inline: auto; }

@media (max-width: 960px) {
	.pp-hero__grid, .pp-supply, .pp-wp, .pp-analysis { grid-template-columns: 1fr; }
	.pp-stats, .pp-stats--4, .pp-id { grid-template-columns: 1fr 1fr; }
	.pp-paper, .pp-aside { position: static; }
	.pp-paper { flex-direction: row; align-items: center; }
	.pp-paper__sheet { width: 150px; flex: none; padding: 1rem .75rem; }
	.pp-paper__sheet strong { font-size: .75rem; }
	.pp-paper__sheet em { font-size: .7rem; }
}
@media (max-width: 640px) {
	.pp-stats, .pp-stats--4 { gap: .6rem; }
	.pp-stat { padding: 1rem; }
	.pp-stat strong { font-size: 1.2rem; }
	.pp-id, .pp-ideas { grid-template-columns: 1fr; }
	.pp-bars { height: 170px; gap: .35rem; }
	.pp-bars b { font-size: .72rem; }
	.pp-next { grid-template-columns: 1fr; }
	.pp-chart__head { flex-direction: column; }
	.pp-hero__name img, .pp-hero__sym { width: 56px; height: 56px; }
	.pp-timeline::before { inset-inline-start: 5px; }
	.pp-timeline li { grid-template-columns: 1fr; padding-inline-start: 28px; }
	.pp-timeline li::after { inset-inline-start: 0; top: .2rem; }
	.pp-timeline time { grid-row: auto; padding: 0 0 .4rem; text-align: start; }
	.pp-timeline li > h3, .pp-timeline li > p { grid-column: 1; }
}

/* Chart: 7 range tabs, loading state. */
.pp-tabs { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.pp-tabs::-webkit-scrollbar { display: none; }
.pp-tabs button { white-space: nowrap; }
.pp-chart.is-loading .pp-chart__plot { opacity: .45; transition: opacity .2s; }

/* Supply line (coins without a max supply). */
.pp-supplyline h3 { margin-bottom: 1rem; }
.pp-spark { display: block; width: 100%; height: 160px; }
.pp-spark__area { fill: color-mix(in srgb, var(--accent) 16%, transparent); }
.pp-spark__line { fill: none; stroke: var(--accent); stroke-width: 2.5; }
.pp-supplyline .pp-ring__legend small { color: var(--ink-3); font-weight: 400; }

/* Issuance policy steps. */
.pp-policy h3 { margin-bottom: 1rem; }
.pp-policy ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.pp-policy li { display: grid; grid-template-columns: 64px 1fr; gap: .9rem; align-items: start; padding: .85rem 1rem; border-radius: 14px; background: var(--bg-soft); }
.pp-policy time { font: 800 1.05rem/1.4 var(--font-head); color: var(--accent); }
.pp-policy b { display: block; font-family: var(--font-head); }
.pp-policy span { color: var(--ink-2); font-size: .93rem; }
