/* Wave 2026-10-24, lane L02: the app and download pages (/download, /meshchat).
   One product per page, warm paper, near-black ink, one accent (brand blue), generous air.
   Loaded after tokens, glass, site, shell and app.css; every length is a multiple of --u.
   Scoped to body.paper so no other page changes shape. */

body.paper{background:var(--paper);--paper:#FAFAF8;--paper-2:#F4F2EC;--paper-rule:#E4E0D6;--paper-ink-2:#55534C;--on-sky:#17171A;--on-sky-2:rgba(23,23,26,.68)}
body.paper .mesh-sky{display:none}
body.paper main{width:auto;max-width:none;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;overflow:visible}
body.paper main a:not(.tape):not(.btn):not(.paper-cta){color:var(--brand-blue)}
body.paper .wrap{max-width:1080px;padding:0 var(--gutter)}
body.paper .fine,body.paper .app-note{color:var(--paper-ink-2)}

/* ---------- Hero: promise, one sentence, one primary action, one quiet link ---------- */
.paper-hero{padding:var(--s-24) 0 var(--s-16);border-bottom:1px solid var(--paper-rule)}
.paper-hero__in{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,4fr);gap:var(--s-16);align-items:center}
.paper-eyebrow{display:inline-flex;align-items:center;gap:var(--s-2);margin:0 0 var(--s-6);padding:var(--s-1) var(--s-3) var(--s-1) var(--s-1);border:1px solid var(--paper-rule);border-radius:var(--r-pill);font:500 var(--t-xs)/var(--lh-ui) var(--font-ui);color:var(--paper-ink-2);background:#fff}
.paper-eyebrow b{display:inline-block;padding:0 var(--s-2);border-radius:var(--r-pill);background:#F6EEDC;color:var(--ink);box-shadow:0 0 0 1px var(--mk-gold-soft);font-weight:600;line-height:var(--lh-ui)}
.paper-hero h1{margin:0 0 var(--s-5);font:500 clamp(2.5rem,1.5rem + 3.6vw,4.25rem)/1.04 var(--font-display);letter-spacing:-.02em;max-width:16ch}
.paper-lede{max-width:34em;margin:0 0 var(--s-8);font-size:var(--t-lg);line-height:1.55;color:var(--ink-2)}
.paper-actions{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-6);align-items:center}
.paper-cta{display:inline-flex;align-items:center;min-height:var(--tap-min);padding:0 var(--s-6);border-radius:var(--r-pill);background:linear-gradient(180deg,#DDBB6E 0%,#C79F50 100%);color:#21180A;font:600 var(--t-md)/1 var(--font-ui);text-decoration:none;transition:translate var(--dur-2) var(--ease-out),box-shadow var(--dur-2) var(--ease-out)}
.paper-cta:hover{translate:0 -1px;box-shadow:var(--lift-hover);text-decoration:none}
.paper-cta:active{translate:0 0;scale:var(--press-scale)}
/* A descendant link rule must never repaint the capsule label: pin it with a doubled class. */
.paper-cta.paper-cta{color:#21180A}
.paper-quiet{font:500 var(--t-md)/var(--lh-ui-lg) var(--font-ui);color:var(--brand-blue);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.24em}
.paper-quiet:hover{text-decoration-thickness:2px}
.paper-lede--small{font-size:var(--t-md);color:var(--paper-ink-2)}
.paper-lede--note{max-width:40em;margin-top:var(--s-6)}
body.paper .app-status{margin-bottom:var(--s-6)}

/* ---------- Device row: one real iPhone capture, one honest Android state ---------- */
.devices{display:flex;flex-wrap:wrap;gap:var(--s-8);align-items:flex-start;justify-content:center;margin:0;padding:0;list-style:none}
.devices__item{display:grid;gap:var(--s-3);justify-items:center;margin:0;max-width:260px}
.device-frame{position:relative;padding:10px;border-radius:44px;background:linear-gradient(160deg,#2C2C2E,#1A1A1C);box-shadow:0 18px 44px rgba(20,20,24,.18),0 0 0 1px rgba(255,255,255,.06) inset}
.device-frame img{display:block;width:220px;height:auto;border-radius:36px}
.device-frame--android{padding:9px;border-radius:32px}
.device-frame--android img{width:222px;border-radius:24px}
/* Punch hole and speaker: drawn geometry, no invented screen content. */
.device-frame::after{content:"";position:absolute;left:50%;top:18px;width:72px;height:18px;translate:-50% 0;border-radius:var(--r-pill);background:#111111}
.device-frame--android::after{left:26px;top:22px;width:9px;height:9px;translate:0 0;background:#111111;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.device-cap{margin:0;font:400 var(--t-xs)/1.5 var(--font-ui);color:var(--paper-ink-2);text-align:center;text-wrap:pretty}
.device-state{display:grid;gap:var(--s-3);width:222px;min-height:452px;padding:var(--s-8) var(--s-5);border-radius:24px;background:var(--paper-2);place-content:center;text-align:center}
.device-state b{font:600 var(--t-xl)/1.2 var(--font-display)}
.device-state span{font:400 var(--t-sm)/1.5 var(--font-ui);color:var(--paper-ink-2)}

/* ---------- Section rhythm on paper ---------- */
body.paper .section{padding:var(--s-20) 0}
body.paper .section + .section{padding-top:var(--s-16)}
body.paper .section--sheet,body.paper .section--deep{background:var(--paper-2);border-block:1px solid var(--paper-rule)}
body.paper .section__title{max-width:24em;font:500 clamp(1.9rem,1.4rem + 1.7vw,2.75rem)/1.14 var(--font-display);letter-spacing:-.02em}
body.paper .lede{max-width:36em;color:var(--ink-2)}

/* ---------- Numbered steps ---------- */
.paper-steps{display:grid;gap:0;margin:var(--s-8) 0 0;padding:0;list-style:none;border-top:1px solid var(--paper-rule);counter-reset:step}
.paper-steps > li{display:grid;grid-template-columns:var(--s-16) minmax(0,1fr);gap:var(--s-4);padding:var(--s-6) 0;border-bottom:1px solid var(--paper-rule);counter-increment:step}
.paper-steps > li::before{content:counter(step,decimal-leading-zero);font:400 var(--t-lg)/1.2 var(--font-display);color:var(--paper-ink-2);font-variant-numeric:tabular-nums}
.paper-steps b{display:block;margin-bottom:var(--s-1);font:600 var(--t-md)/var(--lh-ui-lg) var(--font-ui)}
.paper-steps p{margin:0;max-width:44em;color:var(--ink-2)}

/* ---------- Feature cards ---------- */
.paper-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--s-4);margin:var(--s-8) 0 0;padding:0;list-style:none}
.paper-card{padding:var(--s-6);border:1px solid var(--paper-rule);border-radius:18px;background:#fff}
.paper-card b{display:block;margin-bottom:var(--s-2);font:600 var(--t-md)/var(--lh-ui-lg) var(--font-ui)}
.paper-card p{margin:0;color:var(--ink-2)}
.paper-card kbd{display:inline-block;margin-top:var(--s-3);padding:2px var(--s-2);border:1px solid var(--paper-rule);border-bottom-width:2px;border-radius:6px;background:var(--paper-2);font-size:var(--t-2xs)}

/* ---------- Honest comparison table ---------- */
.paper-table-wrap{margin:var(--s-6) 0 0;overflow-x:auto}
.paper-table{width:100%;border-collapse:collapse;font-size:var(--t-sm);line-height:1.45}
.paper-table caption{caption-side:bottom;margin-top:var(--s-3);font:400 var(--t-xs)/1.5 var(--font-ui);color:var(--paper-ink-2);text-align:left}
.paper-table th,.paper-table td{padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--paper-rule);text-align:left;vertical-align:top}
.paper-table thead th{font:600 var(--t-xs)/1.4 var(--font-ui);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--paper-ink-2);border-bottom:1px solid var(--ink)}
.paper-table tbody th{font-weight:600;color:var(--ink)}
/* Below 640px three columns no longer fit, so each row stacks into a card with both phones labelled and the caption stays under it.
   The table, row and cell roles in the markup keep the table semantics when display changes. Same treatment as the home comparison table. */
@media (max-width:639px){
  .paper-table-wrap{overflow:visible}
  .paper-table{display:flex;flex-direction:column}
  .paper-table caption,.paper-table tbody,.paper-table tr,.paper-table th,.paper-table td{display:block;width:auto;min-width:0}
  .paper-table caption{order:2}
  .paper-table tbody{order:1}
  .paper-table thead{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
  .paper-table tbody tr{margin-bottom:var(--s-3);border:1px solid var(--paper-rule);border-radius:16px;background:#fff;overflow:hidden}
  .paper-table tbody tr:last-child{margin-bottom:0}
  .paper-table tbody th{padding:var(--s-3) var(--s-5);border-bottom:1px solid var(--paper-rule);background:var(--paper-2)}
  .paper-table td{padding:var(--s-3) var(--s-5) 0;border-bottom:0}
  .paper-table td:last-child{padding-bottom:var(--s-4)}
  .paper-table td::before{content:attr(data-label);content:attr(data-label) / "";display:block;margin-bottom:2px;color:var(--paper-ink-2);font:600 var(--t-xs)/1.4 var(--font-ui);letter-spacing:var(--track-caps);text-transform:uppercase}
}

/* ---------- Pricing, plain ---------- */
.paper-price{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s-4);margin:var(--s-8) 0 0;padding:0;list-style:none}
.paper-price > li{padding:var(--s-6);border:1px solid var(--paper-rule);border-radius:18px;background:#fff}
.paper-price dl{margin:0}
.paper-price dt{font:600 var(--t-sm)/var(--lh-ui) var(--font-ui);color:var(--paper-ink-2)}
.paper-price dd{margin:var(--s-2) 0 0;font:400 var(--t-md)/1.5 var(--font-ui);color:var(--ink-2)}

/* ---------- FAQ ---------- */
body.paper .faq{margin-top:var(--s-6);border-top:1px solid var(--paper-rule)}
body.paper .faq details{border-bottom:1px solid var(--paper-rule)}
body.paper .faq summary{padding:var(--s-5) 0;font:600 var(--t-md)/var(--lh-ui-lg) var(--font-ui);cursor:pointer}
body.paper .faq details > div{padding:0 0 var(--s-5);max-width:60em;color:var(--ink-2)}

/* ---------- Forms and tickets sit flat on paper ---------- */
body.paper .ticket{background:#fff;border:1px solid var(--paper-rule);border-radius:20px;box-shadow:none}
body.paper .glass-card{background:#fff;border:1px solid var(--paper-rule);border-radius:20px;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
body.paper .platform__name{font:600 var(--t-xl)/1.2 var(--font-display)}
body.paper .platform__state{font:600 var(--t-xs)/1.4 var(--font-ui);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--paper-ink-2)}
body.paper .btn{border-radius:var(--r-pill)}
body.paper .link-quiet{color:var(--brand-blue)}

/* ---------- Close band: the promise again ---------- */
body.paper .close{padding:var(--s-20) 0 var(--s-24);border-top:1px solid var(--paper-rule)}
body.paper .close__title{max-width:20em;font:500 clamp(1.9rem,1.4rem + 1.6vw,2.6rem)/1.16 var(--font-display);letter-spacing:-.02em}
body.paper .close__line{max-width:36em;margin:var(--s-4) 0 var(--s-6);color:var(--ink-2)}

/* ---------- Motion, only for people who asked for it ---------- */
@media (prefers-reduced-motion:reduce){
  body.paper .paper-cta,body.paper .paper-quiet{transition:none}
  body.paper .paper-cta:hover,body.paper .paper-cta:active{translate:0 0;scale:1;box-shadow:none}
}

/* ---------- Narrow screens ---------- */
@media (max-width:959px){
  .paper-hero{padding:var(--s-16) 0 var(--s-12)}
  .paper-hero__in{grid-template-columns:1fr;gap:var(--s-10)}
  .paper-hero h1{max-width:20ch}
  .devices{gap:var(--s-6)}
}
@media (max-width:599px){
  .devices{flex-direction:column;align-items:center}
  .device-frame img{width:min(220px,72vw)}
  .device-state{min-height:0;width:min(222px,72vw);padding:var(--s-6) var(--s-4)}
  body.paper .section{padding:var(--s-16) 0}
  .paper-steps > li{grid-template-columns:var(--s-10) minmax(0,1fr);gap:var(--s-3)}
}
.dl__facts code{font-size:max(.9em,.75rem)}