/* PDF AppNova demo v1.0. Scoped to P14; shared S18 and brand assets are retained. */
.demo { --demo-bg:#211d16; --demo-panel:#332c22; --demo-text:#d7cfc0; --demo-title:#faf6ea; --demo-gold:#e6bb6a; --demo-success:#a8dcc1; --demo-error:#f3b5a6; color:var(--demo-text); font-size:1rem; line-height:1.55; padding-block:48px 72px; overflow-wrap:anywhere; }
.demo * { box-sizing:border-box; }
.demo [hidden] { display:none!important; }
.demo h1,.demo h2,.demo h3,.demo strong { color:var(--demo-title); }
.demo h1 { font-size:clamp(2rem,3.6vw,3.4rem); line-height:1.13; letter-spacing:-.035em; max-width:26ch; margin:20px 0 24px; }
.demo h2 { font-size:1.75rem; line-height:1.22; letter-spacing:-.025em; margin:12px 0 20px; }
.demo h3 { font-size:1rem; line-height:1.45; margin:0 0 12px; }
.demo p { margin:0 0 16px; }
.demo :where(button,input,textarea,select) { font:inherit; }
.demo :focus-visible { outline:3px solid var(--demo-gold); outline-offset:4px; }
.demo [tabindex="-1"]:focus { outline:2px solid var(--demo-gold); outline-offset:5px; }
.demo-eyebrow { color:var(--demo-gold); text-transform:uppercase; letter-spacing:.16em; font-size:.78rem; font-weight:750; }
.demo-intro { margin:0 0 40px; max-width:1100px; }
.demo-intro h1 { max-width:none; }
.demo-intro>p:last-child,.demo-lead { max-width:84ch; font-size:1.13rem; line-height:1.65; }
.demo-stories { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.demo-story { position:relative; isolation:isolate; min-height:415px; padding:30px; border:1px solid #5c5140; border-radius:9px; overflow:hidden; background:linear-gradient(125deg,#29231b 65%,#4d3b20); scroll-margin-top:32px; }
.demo-story h2 { font-size:2rem; margin-bottom:22px; }
.demo-story-copy { position:relative; z-index:2; width:67%; }
.demo-story-copy>.demo-button { margin-top:12px; }
.demo-mini-phone { position:absolute; z-index:0; right:-24px; top:150px; width:180px; padding:18px; border:3px solid #76664a; border-radius:26px; transform:rotate(7deg); background:var(--demo-bg); }
.demo-mini-phone>div { padding:14px; margin-top:12px; background:var(--demo-panel); border-radius:8px; }
.demo-mini-phone strong { color:var(--demo-gold); font-size:1.7rem; }
.demo-mini-phone p { font-size:.87rem; }
.demo-tags { display:flex; flex-wrap:wrap; gap:10px; margin:18px 0; }
.demo-pill { display:inline-block; color:var(--demo-gold); padding:5px 10px; border-radius:30px; font-size:.8rem; line-height:1.5; background:#e6bb6a12; }
.demo-button { display:inline-flex; justify-content:center; align-items:center; gap:8px; cursor:pointer; border:1px solid var(--demo-gold); border-radius:5px; background:var(--demo-gold); color:#211d16; font-weight:700; line-height:1.4; padding:13px 17px; min-height:48px; max-width:100%; text-align:center; white-space:normal; text-decoration:none; }
.demo-button:hover { background:#f1cb84; color:#211d16; }
.demo-button:disabled { cursor:wait; opacity:.7; }
.demo-secondary { color:var(--demo-text); background:transparent; border-color:#736855; font-weight:500; }
.demo-secondary:hover { color:var(--demo-title); background:#e6bb6a15; }
.demo-disclaimer { border-top:1px solid #655945; margin-top:30px!important; padding-top:22px; }
.demo-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:16px; padding-bottom:24px; }
.demo-toolbar p { margin:0; }
.demo-toolbar>.demo-button { margin-left:auto; }
.demo-layout { display:grid; grid-template-columns:minmax(210px,1fr) minmax(340px,400px) minmax(270px,1.1fr); gap:32px; align-items:start; }
.demo-layout>* { min-width:0; }
.demo-guide { padding-top:30px; }
.demo-guide h2 { font-size:1.65rem; }
.demo-guide>.demo-pill { margin-bottom:22px; }
.demo-progress { padding:0; list-style:none; margin:24px 0; border-left:2px solid #655945; }
.demo-progress li { padding:12px 12px 12px 16px; }
.demo-progress [aria-current] { color:var(--demo-title); border-left:2px solid var(--demo-gold); margin-left:-2px; background:#e6bb6a0b; }
.demo-phone { border:6px solid #615645; border-radius:36px; background:var(--demo-bg); padding:0; overflow:hidden; }
.demo-phone-top { display:flex; justify-content:space-between; padding:10px 20px; color:var(--demo-title); font-size:.75rem; font-weight:700; }
.demo-app-brand { display:flex; justify-content:space-between; align-items:center; gap:12px; border-bottom:1px solid #d7cfc01a; padding:10px 18px 14px; text-transform:uppercase; }
.demo-app-brand strong { font-size:.81rem; }
.demo-app-brand span { color:var(--demo-gold); font-size:.75rem; }
.demo-phone form { margin:0; }
.demo-phone-content { min-height:625px; padding:22px 18px 16px; }
.demo-phone-content>.demo-eyebrow { margin-bottom:8px; font-size:.75rem; }
.demo-phone h2 { font-size:1.7rem; margin:0 0 7px; line-height:1.18; }
.demo-subtitle { font-size:.85rem; margin-bottom:24px!important; }
.demo-card { margin:14px 0; padding:18px; border:1px solid #d7cfc014; border-radius:9px; background:var(--demo-panel); }
.demo-card p:last-child { margin-bottom:0; }
.demo-accent { border-color:#897044; background:linear-gradient(135deg,#423724,var(--demo-panel)); }
.demo-rows { margin:0; }
.demo-rows>div { display:flex; justify-content:space-between; align-items:baseline; gap:14px; padding:12px 0; border-bottom:1px solid #d7cfc014; }
.demo-rows>div:last-child { border-bottom:0; padding-bottom:0; }
.demo-rows dt { font-size:.88rem; flex:1 1 44%; }
.demo-rows dd { color:var(--demo-title); margin:0; font-size:.9rem; font-weight:700; text-align:right; flex:1 1 45%; min-width:0; }
.demo-rows+p { margin-top:16px; }
.demo-note { padding:10px 0 10px 12px; border-left:2px solid #655945; font-size:.88rem; margin-top:16px!important; }
.demo-notice { border-left:2px solid var(--demo-gold); color:var(--demo-gold); background:#e6bb6a09; padding:12px; font-size:.88rem; margin-block:16px!important; }
.demo-success { color:var(--demo-success); border-color:var(--demo-success); background:#a8dcc107; }
.demo-error { color:var(--demo-error)!important; border-color:var(--demo-error)!important; }
.demo-error-card { background:#36241e; border-color:#a97665; }
.demo-stamps { display:flex; gap:10px; justify-content:space-between; margin:20px 0 12px; }
.demo-stamps span { display:grid; place-items:center; width:44px; height:44px; border-radius:50%; border:1px solid #9e8352; color:var(--demo-text); font-size:1.3rem; }
.demo-stamps .is-filled { color:#211d16; background:var(--demo-gold); }
.demo-photo { display:block; width:100%; height:auto; aspect-ratio:708/266; object-fit:cover; border-radius:7px; margin:14px 0; }
.demo-list { padding-left:20px; margin:0; font-size:.92rem; }
.demo-list li { margin-block:10px; }
.demo-code { width:180px; min-height:180px; margin:20px auto 8px; color:#211d16; background:#faf6ea; border-radius:10px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.demo-code>span { font-family:monospace; font-size:120px; line-height:1; }
.demo-code strong { color:#211d16; letter-spacing:.2em; }
.demo-code-id { color:var(--demo-gold); text-align:center; font-weight:750; letter-spacing:.1em; }
.demo-result-icon { display:grid; place-items:center; width:68px; height:68px; margin:24px auto; border:1px solid var(--demo-success); color:var(--demo-success); border-radius:50%; font-size:2rem; }
.demo-pending { color:var(--demo-gold); border-color:var(--demo-gold); }
.demo-phone-actions { border-top:1px solid #d7cfc014; padding:12px 18px 6px; }
.demo-phone-actions>.demo-button { width:100%; margin:0 0 10px; }
.demo-phone-actions>p { font-size:.75rem; text-transform:uppercase; text-align:center; margin:0 0 14px; }
.demo-app-nav { display:flex; gap:4px; justify-content:space-around; padding:4px 12px 18px; }
.demo-app-nav .demo-button { border:0; font-size:.78rem; padding:8px; min-height:44px; }
.demo-app-nav .demo-button:hover { color:var(--demo-gold); }
.demo-field { margin:16px 0; }
.demo-field>label:not(.demo-check) { display:block; color:var(--demo-title); font-size:.9rem; font-weight:650; margin-bottom:6px; }
.demo input:not([type=checkbox],[type=radio]),.demo select,.demo textarea { display:block; width:100%; max-width:100%; min-height:48px; border:1px solid #8d8069; border-radius:5px; background:#29241c; color:var(--demo-title); padding:12px; }
.demo textarea { resize:vertical; }
.demo fieldset { padding:0; margin:0; border:0; min-width:0; }
.demo-check { display:flex; align-items:center; gap:12px; padding:12px; border:1px solid #736855; border-radius:5px; cursor:pointer; min-height:48px; margin:10px 0; font-size:.9rem; }
.demo-check input { appearance:auto; flex:0 0 auto; width:22px; height:22px; accent-color:var(--demo-gold); margin:0; }
.demo-check small { display:block; margin-top:3px; font-size:.78rem; }
.demo-field-error,.demo-validation { color:var(--demo-error); font-size:.9rem; }
.demo-validation { padding:14px; border:1px solid #a97665; border-radius:6px; }
.demo [aria-invalid] { border-color:var(--demo-error); }
.demo-evidence { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.demo-evidence>div { border:1px solid #736855; border-radius:7px; padding:6px; min-width:0; }
.demo-evidence .is-attached { border-color:var(--demo-success); }
.demo-evidence img { width:100%; height:auto; border-radius:5px; }
.demo-evidence .demo-field { margin:5px 0 0; }
.demo-evidence .demo-check { padding:6px; border:0; align-items:flex-start; font-size:.86rem; }
.demo-job-number { font-size:1.5rem; font-weight:700; margin:12px 0!important; color:var(--demo-title); }
.demo-split { display:flex; justify-content:space-between; }
.demo-business { padding-top:28px; }
.demo-business>summary { font-weight:650; color:var(--demo-title); cursor:pointer; padding:10px 0; }
.demo-business>summary>span { font-size:.85rem; color:var(--demo-gold); }
.demo-business>div>p:not(.demo-eyebrow) { font-size:.9rem; }
.demo-business>div>.demo-eyebrow { margin-top:16px; }
.demo-business h2 { font-size:1.35rem; }
.demo-events { padding:0 0 0 17px; margin:8px 0; border-left:1px solid #a78b56; list-style:none; }
.demo-events li { position:relative; padding:4px 0 10px; font-size:.87rem; }
.demo-events li:before { content:'•'; color:var(--demo-gold); position:absolute; left:-21px; }
.demo-fault-menu,.demo-technical { margin-top:18px; font-size:.88rem; }
.demo details>summary { min-height:44px; padding-block:10px; cursor:pointer; }
.demo-fault-menu .demo-button { display:flex; width:100%; text-align:left; margin-top:10px; font-size:.9rem; }
.demo-result { padding:12px 36px 32px; }
.demo-result h1 { max-width:30ch; }
.demo-result-grid { display:grid; grid-template-columns:1.3fr 1fr; gap:28px; align-items:start; margin-top:32px; }
.demo-result-grid>.demo-card { margin:0; padding:28px; background:#29231b; border-color:#655945; }
.demo-result-grid h3,.demo-result-grid h2 { font-size:1.55rem; margin:8px 0 25px; }
.demo-result-grid .demo-button { margin-block:16px; }
.demo-result .demo-rows>div { padding-block:16px; }
.demo-actions { display:flex; flex-wrap:wrap; gap:12px; }
.demo-help { font-size:.85rem; margin-top:10px!important; }
.demo-storage { border:1px solid #a97665; padding:18px; margin-bottom:24px; border-radius:7px; background:#36241e; }
.demo-dialog { background:var(--demo-bg); color:var(--demo-text); border:1px solid #897044; border-radius:12px; width:min(520px,calc(100% - 32px)); max-height:85dvh; overflow:auto; padding:28px; }
.demo-dialog::backdrop { background:#000a; }
.demo-sr { position:absolute; width:1px; height:1px; clip-path:inset(50%); overflow:hidden; white-space:nowrap; }
@media(max-width:1150px) { .demo-layout { grid-template-columns:minmax(180px,1fr) minmax(330px,400px); gap:24px; }.demo-business { grid-column:1/-1; padding:0; }.demo-business>div { max-width:900px; }.demo-business .demo-card { display:inline-block; vertical-align:top; width:calc(50% - 12px); margin-right:12px; }.demo-story-copy { width:100%; }.demo-mini-phone { display:none; }.demo-story { min-height:0; } }
@media(max-width:700px) {
 .demo { padding-block:28px 42px; }.demo h1 { font-size:2rem; }.demo h2 { font-size:1.6rem; }.demo-stories,.demo-result-grid,.demo-layout { display:block; }.demo-story { padding:22px; margin-bottom:22px; }.demo-story h2 { font-size:1.7rem; }.demo-story-copy { width:100%; }.demo-guide { padding:0; }.demo-guide>.demo-eyebrow,.demo-guide>h2,.demo-guide>.demo-note,.demo-guide>.demo-pill { display:none; }.demo-guide>p { font-size:.94rem; }.demo-progress { display:flex; flex-wrap:wrap; gap:6px; border:0; margin:12px 0; }.demo-progress li { display:none; padding:8px 0; }.demo-progress li[aria-current] { display:block; background:transparent; border:0; color:var(--demo-gold); }.demo-guide>.demo-button { margin-bottom:22px; }.demo-toolbar { gap:10px; }.demo-toolbar>.demo-button { margin-left:0; font-size:.88rem; }.demo-phone { border:0; border-radius:0; overflow:visible; width:100%; }.demo-phone-top { display:none; }.demo-app-brand { padding:12px 0; }.demo-phone-content { padding:22px 0 12px; min-height:0; }.demo-phone h2 { font-size:1.7rem; }.demo-phone-actions { padding:16px 0; }.demo-app-nav { padding:4px 0 16px; }.demo-business { margin-top:24px; border-top:1px solid #655945; }.demo-business .demo-card { display:block; width:100%; margin-right:0; }.demo-result { padding:0; }.demo-result-grid { margin-top:24px; }.demo-result-grid>.demo-card { padding:22px; margin-bottom:22px; }.demo-result-grid>.demo-button { margin:8px 0; }.demo-evidence { gap:8px; }.demo-evidence .demo-check { flex-wrap:wrap; }.demo-card { padding:16px; }
}
@media(prefers-reduced-motion:reduce) { .demo * { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
@media(forced-colors:active) { .demo-stamps span,.demo-button,.demo-card { border:1px solid ButtonText; }.demo input { appearance:auto; } }