/* Page content styles. The home catalogue uses the shared sheet only. */
/* Plate: every capture sits on a mat */
.plate{background:var(--color-mat);padding:var(--space-mat);border-radius:var(--radius-card)}
.plate > img{cursor:zoom-in}
.plate img,.plate video{width:100%;border-radius:4px;outline:1px solid var(--color-plate-edge);outline-offset:-1px}
.plate video{background:var(--color-bg)}
.demo{position:relative;display:block;border-radius:4px;text-decoration:none}
.demo__btn{position:absolute;left:12px;bottom:12px;gap:8px;min-height:44px;padding:10px 16px;background:var(--color-surface)}
.demo .icon--pause,.demo[data-playing="true"] .icon--play{display:none}
.demo[data-playing="true"] .icon--pause{display:block}
.plate__cap{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 16px;padding:8px 4px 2px;font-size:.8125rem;line-height:1.5;color:var(--color-text-muted)}
.plate__open{flex:none;color:var(--color-text);font-weight:600}

/* Features */
.features{display:grid;gap:40px}
.feature > p{margin-top:var(--space-head-small)}
.feature .plate{margin-top:16px}
.tag{display:inline-block;margin-left:8px;padding:1px 6px;border:1px solid var(--color-text);border-radius:4px;vertical-align:2px}
.note{margin-top:var(--space-block);padding:4px 0 4px 16px;border-left:3px solid var(--color-text);font-weight:500}
.actions--pro{margin-top:var(--space-block)}

/* Lists */
.needs,.rules{display:grid;gap:8px}
.rail__body .needs{margin-top:8px}
.needs li,.rules li{position:relative;padding-left:20px}
.needs li::before,.rules li::before{content:"";position:absolute;left:2px;top:.75em;width:8px;height:2px;background:var(--color-text-muted)}
.rules{gap:12px}
.rail__body .label + .steps{margin-top:12px}
.rail__body .needs + .label{margin-top:24px}
.steps{display:grid;gap:16px;counter-reset:step}
.steps li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:14px;align-items:start;counter-increment:step}
.steps li::before{content:counter(step);display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--color-text);border-radius:4px;font-family:var(--font-mono);font-size:.8125rem;font-weight:600}
.steps p{padding-top:1px}
.compare__row{display:grid;gap:4px;padding:14px 0;border-bottom:1px solid var(--color-border)}
.compare__row:first-child{padding-top:0}
.compare__row:last-child{border-bottom:0;padding-bottom:0}
.compare dt{font-weight:600}
.compare dd{color:var(--color-text-secondary)}
.faq{display:grid;gap:28px}
.faq__item dt{font-size:1.125rem;font-weight:600;line-height:1.35}
.faq__item p,.faq__item dd{margin-top:8px;color:var(--color-text-secondary)}
.linklist{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0 24px}
.linklist a{display:flex;align-items:center;gap:10px;min-height:48px;border-bottom:1px solid var(--color-border);font-weight:500;text-decoration:none}
@media (min-width:768px){.compare__row{grid-template-columns:180px minmax(0,1fr);gap:24px}}

/* Guides */
.lead--answer{color:var(--color-text)}
.byline{margin-top:12px;color:var(--color-text-muted)}
.options{display:grid;gap:48px;counter-reset:option}
.option{display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:14px;row-gap:var(--space-stack);align-items:start;counter-increment:option}
.option::before{content:counter(option);grid-column:1;grid-row:1;display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--color-text);border-radius:4px;font-family:var(--font-mono);font-size:.8125rem;font-weight:600}
.option__body{display:contents}
.option__body > *{grid-column:1 / -1;min-width:0}
.option__body > h3{grid-column:2;align-self:center}
.option__facts{display:grid;gap:10px;padding:12px 0;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}
.option__facts dt{color:var(--color-text-muted)}
.option__facts dd{margin-top:2px}
.option .actions--install{margin-top:4px}
.option .trustline{margin-top:-6px}
.sources{max-width:var(--layout-max-text);border-top:1px solid var(--color-border)}
.sources li{display:grid;gap:2px;padding:12px 0;border-bottom:1px solid var(--color-border)}
.sources__note{color:var(--color-text-muted)}
.icon--lead{display:inline-block;vertical-align:-2px;margin-right:6px}
@media (min-width:768px){
  .option__body > *{grid-column:2}
  .sources li{grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:baseline}
}

/* Updates */
.release{padding:20px 0;border-bottom:1px solid var(--color-border)}
.release:first-child{padding-top:0}
.release:target{box-shadow:-10px 0 0 var(--color-bg),-13px 0 0 var(--color-accent)}
.release h3 a{text-decoration:none}
.release__version{margin-left:6px;font-weight:600;color:var(--color-text-secondary)}
.release .rules{margin-top:10px}
.release__meta{margin-top:10px;color:var(--color-text-muted)}
.release__meta .link{color:inherit}

/* Closing install row */
.closing{margin-top:var(--space-section);padding-top:24px;border-top:2px solid var(--color-text)}
.closing__text{display:flex;align-items:center;gap:8px;font-weight:600}
.closing .actions--install{margin-top:16px}
.closing + .section{margin-top:56px}

/* Pro page */
.tiers{display:grid;gap:16px}
.tier{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:20px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card)}
.tier--main{padding:19px;border:2px solid var(--color-text)}
.tier .tag{margin-left:0}
.tier__price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.price{font-size:var(--type-price);font-weight:700;line-height:1.05;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.tier__period{font-size:1.125rem;color:var(--color-text-secondary)}
.tier__body{flex:1;max-width:48ch;color:var(--color-text-secondary)}
.tier .btn{align-self:stretch;margin-top:4px}
.table-wrap{overflow-x:auto}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:12px 16px 12px 0;border-bottom:1px solid var(--color-border);text-align:left;vertical-align:top}
.table td{padding-right:0;color:var(--color-text-secondary)}
.table thead th{border-bottom:2px solid var(--color-text);font-family:var(--font-mono);font-size:.8125rem;font-weight:500;color:var(--color-text-muted)}
.table tbody th{width:36%;font-weight:600}
.reviewed{margin-top:var(--space-block)}
@media (max-width:1023px){.page--info .section,.page--info .proof{margin-top:48px}}
@media (min-width:768px){
  .tiers{grid-template-columns:7fr 5fr;gap:24px}
  .tier{padding:28px}
  .tier--main{padding:27px}
  .tier .btn{align-self:flex-start}
  .table tbody th{width:232px}
}

/* Check results: the numbered legend, the matrix, the command, the checked block of a plugin page */
.legend p{margin-top:4px;color:var(--color-text-secondary)}
.legend h3{padding-top:2px}
.matrix th,.matrix td{padding:10px 0;vertical-align:middle}
.matrix thead th{vertical-align:bottom;white-space:nowrap}
.matrix tbody th{position:relative;width:auto;padding-right:12px}
.matrix .matrix__col,.matrix .matrix__cell{width:32px;text-align:center}
.matrix td.matrix__cell{color:var(--color-text)}
.matrix__n{display:inline-grid;place-items:center;width:24px;height:24px;border:1px solid var(--color-text);border-radius:4px;color:var(--color-text);font-weight:600}
.matrix__meta{display:block;color:var(--color-text-muted)}
.matrix__meta time{display:block}
.matrix__dot{display:none}
.matrix__icon{margin-inline:auto}
.matrix td.matrix__none{font-size:.8125rem;color:var(--color-text-muted)}
.matrix tr:target th[scope="row"]{padding-left:12px}
.matrix tr:target th[scope="row"]::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:2px;background:var(--color-accent)}
.matrix__key{display:flex;flex-wrap:wrap;gap:4px 20px;color:var(--color-text-muted)}
.matrix__key li{display:inline-flex;align-items:center;gap:6px}
.matrix__key .icon{color:var(--color-text)}
.rail__body .sub{margin-top:var(--space-block)}
.extra__count{white-space:nowrap;color:var(--color-text-muted)}
.extra__names{color:var(--color-text-muted)}
.table--cases td:first-child{padding-right:16px;color:var(--color-text)}
.table--cases td + td{white-space:nowrap}
.table--cases td:nth-child(2){padding-right:16px}
.table--hash td{white-space:nowrap;color:var(--color-text)}
.table--hash td:nth-child(2){padding-right:16px}
.cmd{margin-bottom:0;padding:12px 16px;max-width:var(--layout-max-text);background:var(--color-mat);border-radius:4px;white-space:pre-wrap;overflow-wrap:anywhere}
.cmd code{padding:0;background:none;font-size:inherit}
.checked{display:grid;gap:10px;margin-top:20px;padding:12px 0;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);font-size:.875rem;line-height:1.5}
.checked dt{color:var(--color-text-muted)}
.checked dd{margin-top:2px;max-width:var(--layout-max-text);color:var(--color-text-secondary)}
.checked .link{white-space:nowrap}
@media (max-width:767px){.matrix__w{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}
@media (min-width:768px){
  .matrix__n{display:none}
  .matrix__meta time,.matrix__dot{display:inline}
  .matrix .matrix__col,.matrix .matrix__cell{width:70px}
  .matrix tbody th{padding-right:16px}
  .checked{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 32px}
  .checked--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1280px){
  .matrix .matrix__col,.matrix .matrix__cell{width:80px}
  .checked--4{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* Large image dialog. Below 768 px the capture opens at its natural size and pans in both directions. */
.zoom{width:100vw;max-width:100vw;height:100vh;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:#0C0B09;color:#EEE9DD;overflow:hidden}
.zoom[open]{display:flex;flex-direction:column}
.zoom::backdrop{background:rgba(12,11,9,.95)}
.zoom__scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.zoom img{width:auto;max-width:none;max-height:none}
.zoom__bar{display:flex;flex:none;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:4px 16px calc(4px + env(safe-area-inset-bottom));font-size:.8125rem;border-top:1px solid #3A362E}
.zoom__close{flex:none;color:inherit;border:1px solid currentColor}
.zoom :focus-visible{outline-color:#FFD43B}
.zoom__scroll:focus-visible{outline-offset:-3px}
@media (min-width:768px){
  .zoom{width:auto;height:auto;max-width:96vw;max-height:96vh;margin:auto;background:transparent;overflow:visible}
  .zoom__scroll{overflow:visible}
  .zoom img{max-width:96vw;max-height:calc(96vh - 64px);max-height:calc(96dvh - 64px);border-radius:6px}
  .zoom__bar{padding:4px 0;border-top:0}
}

/* Keep these overrides after the content rules when the sheets load separately. */
@media (pointer:coarse){.demo__btn{min-height:48px}}
.checked dd{max-width:calc(var(--layout-max-text) * .875)}

/* Tip ask on free pages only (guides, references, checks, /support/). Outline buttons keep the paid actions primary. */
.support{max-width:40rem;padding:var(--space-card-padding);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card)}
.support__title{display:flex;align-items:center;gap:12px;font-size:1.125rem;font-weight:600;line-height:1.35}
.support__text{margin-top:8px;color:var(--color-text-secondary)}
.support__actions{margin-top:16px}
.support__actions .btn{min-height:44px}
.support__face{flex:none;width:44px;height:44px;border-radius:50%;background:var(--color-mat)}
.support__face-row .support__face{width:48px;height:48px}
.support__face-row{margin-bottom:16px}
.support--footer{margin-bottom:40px}
.support-page .rail__body .actions{margin-top:0}
@media (min-width:1024px){.support-note .support{margin-left:calc(var(--layout-rail) + 48px)}}
/* Support CTA v3: maker row with a 32px portrait, the $3 PayPal tip first, Buy Me a Coffee as a text link, "Not now". */
.support__maker{display:flex;align-items:center;gap:10px;margin-top:8px;font-weight:600}
.support__maker .support__face{width:32px;height:32px}
.support__bmc{flex-direction:column;align-items:flex-start;line-height:1.2}
.support__sub{display:block;font-size:.8125rem;font-weight:400;color:var(--color-text-muted);text-decoration:none}
.support__dismiss{min-height:44px;padding:0 4px;border:0;background:none;color:var(--color-text-muted);font:inherit;font-size:.875rem;text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
/* Support CTA v4: portrait next to the headline, $5 PayPal button with a sub-label, quieter card button, GitHub Sponsors as a text link. */
.support__title--card{gap:10px}
.support__title--card .support__face{width:32px;height:32px}
.support__stack{flex-direction:column;gap:2px}
.support__stack .support__sub{color:inherit;opacity:.75}
.support__alt{border-color:var(--color-border)}
.support__quiet{color:var(--color-text-secondary);font-weight:500}
/* /hello/ landing page (site-src/lib/pages_hello.py) */
.page--hello .hello-closing{margin-top:16px}
.page--hello .rail__body > .caption + .cards{margin-top:12px}