:root{color-scheme:light;--ink:#302319;--brown:#71441f;--line:#b88c55;--paper:#f8efdf;--cream:#f0e2c9;--focus:#0d5c84}
*{box-sizing:border-box}
html{font-family:Georgia,'Times New Roman',serif;color:var(--ink);background:#24160d;line-height:1.55}
body{margin:0;min-height:100vh;background:#24160d url('/static/desk-background-desktop-custom-e9156d5bafa4.png?v=e9156d5bafa4') center center/cover no-repeat fixed}
a{color:#5d3418;text-underline-offset:.18em}
a:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
button:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:1rem;top:-5rem;z-index:10;background:#fff;padding:.6rem 1rem}
.skip:focus{top:1rem}
.site-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem clamp(1rem,4vw,3rem);background:#281a10;color:#fff}
.site-header a{color:#fff}
.brand{display:flex;align-items:center;gap:.65rem;font-size:1.2rem;font-weight:700;text-decoration:none}
.brand img{object-fit:contain}
.site-header nav{display:flex;gap:clamp(.7rem,2vw,1.6rem);flex-wrap:wrap;align-items:center}
main{max-width:1080px;margin:0 auto;padding:clamp(1.1rem,3vw,2.6rem)}
.intro,.help-end{background:#f8efdfed;border:2px solid var(--line);border-radius:16px;padding:clamp(1.2rem,3vw,2rem);box-shadow:0 12px 28px #10090070}
.intro{position:relative;overflow:hidden;padding-right:clamp(170px,24vw,255px);min-height:215px}
.intro-portrait{position:absolute;right:12px;bottom:-15px;width:clamp(150px,21vw,235px);height:auto;pointer-events:none}
.eyebrow{text-transform:uppercase;letter-spacing:.1em;font:700 .84rem system-ui,sans-serif;color:var(--brown);margin:0 0 .3rem}
h1,h2{line-height:1.18;margin:.2rem 0 .7rem}
h1{font-size:clamp(2rem,4vw,3.1rem)}
h2{font-size:clamp(1.4rem,2.4vw,2rem)}
.intro>p:last-child{margin-bottom:0}
.pilot-note{font: .94rem/1.5 system-ui,sans-serif;background:#f2e7d6;padding:.7rem .9rem;border-left:4px solid var(--brown);border-radius:4px}
.page-tabs,.role-tabs{display:flex;flex-wrap:wrap;gap:.65rem;margin:1rem 0;padding:.45rem;background:#281a10df;border:1px solid #b88c55;border-radius:11px}
.page-tabs a,.role-tabs a{display:inline-flex;align-items:center;min-height:44px;padding:.5rem 1rem;border:1px solid #9f7950;border-radius:9px;background:#fff9ef;font:600 1rem/1.3 system-ui,sans-serif;text-decoration:none}
.page-tabs a[aria-current],.role-tabs a[aria-current]{background:var(--brown);border-color:var(--brown);color:#fff}
.step-progress{display:inline-block;font:700 1.1rem system-ui,sans-serif;color:#fff4dd;background:#281a10db;padding:.35rem .65rem;border-radius:6px;margin:1.2rem 0 .5rem}
.steps{display:grid;gap:1rem}
.step-card{background:#f8efdfed;border:2px solid var(--line);border-radius:16px;padding:clamp(1rem,2.5vw,2rem);box-shadow:0 10px 24px #10090064}
.step-copy{position:relative;padding-left:3.2rem}
.step-number{position:absolute;left:0;top:0;display:grid;place-items:center;width:2.45rem;height:2.45rem;border-radius:50%;background:var(--brown);color:#fff;font:700 1.1rem system-ui,sans-serif}
.step-copy p{font-size:1.11rem;max-width:62ch}
.real-action,.step-nav a{display:inline-flex;justify-content:center;align-items:center;min-height:44px;padding:.58rem .9rem;border:1px solid var(--brown);border-radius:8px;background:#fff;color:var(--brown);font:700 .95rem/1.3 system-ui,sans-serif;text-align:center;text-decoration:none}
.real-action:hover,.step-nav a:hover{background:#f0dfc5}
.screen-gallery{display:grid;gap:1.4rem;margin-top:1.3rem}
.screen-figure{margin:0 auto;min-width:0;width:100%;max-width:960px}
.screen-figure picture{display:block}
.screen-figure img{display:block;width:100%;height:auto;background:#24160d;border:2px solid #765133;border-radius:10px;box-shadow:0 8px 22px #24160d66}
.screen-enlarge{display:inline-block;margin-left:.35rem;font-weight:700}
figcaption{padding:.5rem .2rem 0;color:#5a4736;font:.9rem/1.4 system-ui,sans-serif}
.step-nav{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin:1.2rem 0 2rem}
.step-nav .step-next{margin-left:auto;background:var(--brown);color:#fff}
.step-nav .step-next:hover{background:#593213}
.help-end{margin:2rem 0 0}
footer{text-align:center;padding:1rem;background:#281a10;color:#fff;font:.85rem system-ui,sans-serif}
@media(max-width:700px){
  body{background-image:none}
  body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:#24160d url('/static/desk-background-mobile-custom-e9156d5bafa4.png?v=e9156d5bafa4') left top/auto 100vh no-repeat}
  body>*{position:relative;z-index:1}
  .site-header{align-items:flex-start;flex-direction:column}
  .site-header nav{width:100%;justify-content:space-between}
  .intro{padding-right:1.2rem;padding-bottom:1rem}
  .intro-portrait{position:static;display:block;width:120px;max-width:42%;margin:-.2rem 0 -.7rem auto}
  .step-copy{padding-left:3rem}
  .step-copy p{font-size:1rem}
  .step-card{padding:1rem}
  .screen-figure img{border-radius:6px}
}
@media(prefers-reduced-motion:no-preference){a{transition:background-color .15s ease}}