/* pw-std (Nov 5 2026, Erik t8186u): ONE shared standard for every in-app page, taken from Calculator + Stacks (stdstacks1105).
   Opt in with <body class="pw-std">. Header rules live in calc-top/pp3/hp4up/hdrphoto (shared, also matched by .pw-std).
   Tokens: */
body.pw-std{--std-gap:6px;--std-row:8px;--std-pill:26px;--std-pill-sm:24px;--std-btn-sm:28px;--std-btn:34px;--std-tab:30px;--std-input:34px;--std-card-pad:8px 12px;--std-card-r:18px;--std-fs-btn:13px;--std-fs-tag:11px}
/* page head: centered title block, short lede, even action row */
body.pw-std main>.page-head{display:flex!important;flex-direction:column!important;align-items:center!important;gap:var(--std-gap)!important;text-align:center!important;margin-bottom:var(--std-row)!important}
body.pw-std main>.page-head p{font-size:13px!important;line-height:1.35!important;margin:4px auto 0!important;max-width:40ch}
body.pw-std main>.page-head :is(.head-actions,.btn-row,.chips){display:flex!important;flex-wrap:wrap;justify-content:center!important;gap:var(--std-gap)!important;margin-top:var(--std-row)!important}
/* buttons and pills */
body.pw-std main .btn{min-height:0!important;height:var(--std-btn)!important;padding:0 16px!important;font-size:14px!important;border-radius:999px!important;line-height:1!important}
body.pw-std main .btn:is(.btn-sm,#std-id-weight){height:var(--std-btn-sm)!important;min-height:0!important;max-height:none!important;padding:0 11px!important;font-size:var(--std-fs-btn)!important}
body.pw-std main .btn.btn-2l{height:auto!important;min-height:var(--std-btn)!important;padding:5px 16px!important;line-height:1.2!important}
body.pw-std main .pill{font-size:var(--std-fs-tag)!important;padding:2px 8px!important;line-height:1.3!important;border-radius:999px!important}
body.pw-std main .chip{min-height:0!important;padding:5px 10px!important;font-size:12.5px!important;line-height:1.2!important;border-radius:999px!important}
body.pw-std main :is(.chips,.head-actions,.btn-row,.actions-row){gap:var(--std-gap)!important}
/* segmented toggles and tabs: calculator 28-30px */
body.pw-std main .seg{padding:2px!important;gap:2px!important}
body.pw-std main .seg button,body.pw-std main [role=tab]{min-height:0!important;height:var(--std-btn-sm)!important;padding:0 12px!important;font-size:13px!important;line-height:1!important}
/* cards: calculator padding/radius, 8px rhythm */
body.pw-std main :is(.card,.card-grad){padding:var(--std-card-pad)!important;border-radius:var(--std-card-r)!important}
body.pw-std main>:is(section,.card,.card-grad){margin-top:0!important;margin-bottom:var(--std-row)!important}
body.pw-std main :is(.card,.card-grad) :is(h2,h3){font-size:15px!important;line-height:1.2!important;margin-top:0!important;margin-bottom:6px!important}
body.pw-std main .card-head{margin-bottom:6px!important;gap:var(--std-gap)!important}
/* inputs */
body.pw-std main :is(.input:not(textarea),select,input:not(span>input):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color])){min-height:0!important;height:var(--std-input)!important;padding-top:0!important;padding-bottom:0!important;box-sizing:border-box!important}
/* collapsible long sections: <details class="std-coll"> or .cc-coll (same + / – head as the calculator) */
body.pw-std main details>summary{min-height:28px}
/* title token (also for pages whose .page-head is not a direct child of .main) */
body.pw-std main .page-head h1{font-size:24px!important;font-weight:700!important;line-height:1.1!important;margin:0!important;text-align:center!important;letter-spacing:-0.01em!important}
body.pw-std main .page-head{display:flex!important;flex-direction:column!important;align-items:center!important;gap:var(--std-gap)!important;text-align:center!important}
body.pw-std main .page-head>div{margin:0!important}
body.pw-std main .page-head>[aria-hidden=true]{flex:none;margin-bottom:var(--std-gap)!important}
/* shared side-scroll edge fade (Erik t8194u/t8197u): soft short BOTH sides (~18px).
   Left only once scrolled; right gone at end (pw-std.js). Sits in the carousel gutter outside the centered card border.
   Mask only — taps unaffected. Calculator Popular row (#cmChips) keeps its own cc-fr/cc-fl. */
body.pw-std main .seg>a{min-height:0!important;height:var(--std-btn-sm)!important;padding:0 12px!important;font-size:13px!important;line-height:1!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
body.pw-std main .seg.res-nav{gap:2px!important;padding:2px!important;margin-bottom:var(--std-row)!important}
/* Profile already shows the big photo in its own card: no second photo tile there */
body.pw-std[data-page="user"] .cc-hero-av{display:none!important}
body.pw-std[data-page="user"] #pfSwitch{margin-top:8px!important}
/* legacy component aliases mapped onto the standard (one rule per family, not per page) */
body.pw-std main :is(.vt-chip){min-height:0!important;height:28px!important;padding:0 12px!important;font-size:13px!important;border-radius:999px!important}
body.pw-std main :is(.vt-chips){gap:var(--std-gap)!important}
body.pw-std main :is(.vt-seg2){padding:2px!important;gap:2px!important}
body.pw-std main :is(.vt-seg2)>button{min-height:0!important;height:var(--std-btn-sm)!important;padding:0 12px!important;font-size:13px!important}
/* stacked full-width card buttons: one 8px rhythm (no double margins between groups) */
body.pw-std main :is(.card,.card-grad) .btn-block{margin-top:var(--std-row)!important}
body.pw-std main :is(.card,.card-grad)>div:has(.btn-block){margin-top:0!important}
/* "label + toggle" rows are centered as one unit */
body.pw-std main div:has(> span + .seg),body.pw-std main div:has(> label + .seg){display:flex!important;justify-content:center!important;align-items:center!important;gap:var(--std-gap)!important;flex-wrap:wrap}
/* photo tile under a page nav or breadcrumb (not directly under Back): one 8px gap instead of the calculator's tuck-up */
html body.pw-std main :not(.pw-back-row)+.cc-hero-av{margin-top:var(--std-row)!important}
/* legacy ID-scoped spacing on Profile mapped to the same 8px rhythm (styles.css 1717-1718 used 20px + 20px) */
html body.pw-std[data-page="user"] #acctBox{margin-top:0!important}
html body.pw-std[data-page="user"] #acctOut .btn-block,html body.pw-std[data-page="user"] .profile-grid .card>.btn-block{margin-top:var(--std-row)!important}

/* batch 3: page titles that sit straight in <main> (doc pages) get the same title token */
body.pw-std main h1:not(.page-head h1):not(.card h1){font-size:24px!important;margin:var(--std-gap) 0 var(--std-row)!important;font-weight:700!important;line-height:1.1!important;letter-spacing:-0.01em!important}
/* back row inside an unpadded <main> (dosecard page layout .dpg) lines up with the content gutter */
body.pw-std main.dpg>.pw-back-row{padding-left:var(--s4,16px)!important;padding-right:var(--s4,16px)!important}
/* batch 3: shared component sizes (filter chip rows, reaction pills, poll options, carousel dots, ticker pause) */
body.pw-std main .filter-chips>button{min-height:0!important;height:var(--std-btn-sm)!important;padding:0 12px!important;font-size:13px!important}
body.pw-std main .nw-rx{min-height:0!important;width:auto!important;min-width:var(--std-btn-sm)!important;height:var(--std-btn-sm)!important;padding:0 8px!important}
body.pw-std main .nw-po{min-height:0!important;height:var(--std-btn)!important}
body.pw-std main .nw-dot{width:24px!important;height:24px!important;background:none!important;border:0!important;box-shadow:none!important}
body.pw-std main .nw-tk-p{width:var(--std-btn-sm)!important;height:var(--std-btn-sm)!important;margin-right:8px!important}
/* chip groups (How did you hear, any single-choice chip set): 28px chips, small tag text, equal 6px gaps, rows centered and stretched so both edges line up */
body.pw-std main :is(.hear-chips,.chip-group){display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:var(--std-gap)!important}
body.pw-std main :is(.hear-chips,.chip-group)>button{flex:1 1 auto!important;min-height:0!important;height:var(--std-btn-sm)!important;padding:0 10px!important;font-size:12px!important;line-height:1!important;font-weight:600!important}
body.pw-std main .hear-set{margin:var(--std-row) 0!important}
body.pw-std main .hear-set legend{margin-bottom:var(--std-gap)!important;font-size:14px!important}
/* a form's own submit: a standard centered 34px button, not a full-width bar */
body.pw-std main form>.btn-block[type=submit]{display:flex!important;align-items:center!important;justify-content:center!important;width:auto!important;min-width:140px!important;height:var(--std-btn)!important;min-height:0!important;margin:var(--std-row) auto 0!important;padding:0 22px!important}
/* settings rows (label left, small button right) on one centered line with even spacing */
body.pw-std main .list>.it{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;padding-top:var(--std-row)!important;padding-bottom:var(--std-row)!important;min-height:0!important}
body.pw-std main .list>.it>.btn-sm{flex:none!important}
body.pw-std main .nw-arr{width:var(--std-btn)!important;height:var(--std-btn)!important;min-height:0!important}

/* faderestore1105 (Erik t8223u/t8224u): visible soft 32px fades; neighbor cards peek 24px into the gutter so the fade has content to soften; centered card border stays outside the fade */
.std-fr{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 32px),rgba(0,0,0,.8) calc(100% - 24px),rgba(0,0,0,.45) calc(100% - 14px),rgba(0,0,0,.18) calc(100% - 6px),transparent 100%)!important;mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 32px),rgba(0,0,0,.8) calc(100% - 24px),rgba(0,0,0,.45) calc(100% - 14px),rgba(0,0,0,.18) calc(100% - 6px),transparent 100%)!important}
.std-fl{-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.18) 6px,rgba(0,0,0,.45) 14px,rgba(0,0,0,.8) 24px,#000 32px,#000 100%)!important;mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.18) 6px,rgba(0,0,0,.45) 14px,rgba(0,0,0,.8) 24px,#000 32px,#000 100%)!important}
.std-fl.std-fr{-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.18) 6px,rgba(0,0,0,.45) 14px,rgba(0,0,0,.8) 24px,#000 32px,#000 calc(100% - 32px),rgba(0,0,0,.8) calc(100% - 24px),rgba(0,0,0,.45) calc(100% - 14px),rgba(0,0,0,.18) calc(100% - 6px),transparent 100%)!important;mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.18) 6px,rgba(0,0,0,.45) 14px,rgba(0,0,0,.8) 24px,#000 32px,#000 calc(100% - 32px),rgba(0,0,0,.8) calc(100% - 24px),rgba(0,0,0,.45) calc(100% - 14px),rgba(0,0,0,.18) calc(100% - 6px),transparent 100%)!important}
body .scar{padding-left:34px!important;padding-right:34px!important;scroll-padding-inline:34px!important;gap:10px!important}
html body[data-page="calc"] #cmTop #cmChips.cm-chips.cc-fr:not(.cc-bmode){-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 32px),rgba(0,0,0,.8) calc(100% - 24px),rgba(0,0,0,.45) calc(100% - 14px),rgba(0,0,0,.18) calc(100% - 6px),transparent 100%)!important;mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 32px),rgba(0,0,0,.8) calc(100% - 24px),rgba(0,0,0,.45) calc(100% - 14px),rgba(0,0,0,.18) calc(100% - 6px),transparent 100%)!important}
html body[data-page="calc"] #cmTop #cmChips.cm-chips.cc-fl:not(.cc-bmode){-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.18) 6px,rgba(0,0,0,.45) 14px,rgba(0,0,0,.8) 24px,#000 32px,#000 100%)!important;mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.18) 6px,rgba(0,0,0,.45) 14px,rgba(0,0,0,.8) 24px,#000 32px,#000 100%)!important}
html body[data-page="calc"] #cmTop #cmChips.cm-chips.cc-fl.cc-fr:not(.cc-bmode){-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.18) 6px,rgba(0,0,0,.45) 14px,rgba(0,0,0,.8) 24px,#000 32px,#000 calc(100% - 32px),rgba(0,0,0,.8) calc(100% - 24px),rgba(0,0,0,.45) calc(100% - 14px),rgba(0,0,0,.18) calc(100% - 6px),transparent 100%)!important;mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.18) 6px,rgba(0,0,0,.45) 14px,rgba(0,0,0,.8) 24px,#000 32px,#000 calc(100% - 32px),rgba(0,0,0,.8) calc(100% - 24px),rgba(0,0,0,.45) calc(100% - 14px),rgba(0,0,0,.18) calc(100% - 6px),transparent 100%)!important}

/* startdate1105 (kept by trackers1105): date/time pill text vertically centered (WebKit iOS + Chromium). Erik t8218u/t8219u */
html body input:is([type=date],[type=time],[type=datetime-local],[type=month],[type=week]){display:flex!important;align-items:center!important;padding-top:0!important;padding-bottom:0!important;line-height:normal!important;-webkit-appearance:none!important;appearance:none!important}
html body input:is([type=date],[type=time],[type=datetime-local],[type=month],[type=week])::-webkit-date-and-time-value{margin:0!important;padding:0!important;min-height:0!important;line-height:normal!important;text-align:left}
html body input:is([type=date],[type=time],[type=datetime-local],[type=month],[type=week])::-webkit-datetime-edit{padding:0!important;margin:0!important;line-height:normal!important;display:flex;align-items:center}
html body input:is([type=date],[type=time],[type=datetime-local],[type=month],[type=week])::-webkit-datetime-edit-fields-wrapper{padding:0!important;line-height:normal!important}
