/* Shared fixed navigation and the existing homepage quest card. */
html{scroll-padding-top:110px}.header,.document-page .header{position:fixed;background:#081923;backdrop-filter:none;box-shadow:0 4px 24px #0002}.document-page:not(.demo-page) main{padding-top:88px}.doc-sidebar{top:110px;max-height:calc(100vh - 135px)}[id],button,a,input,select{scroll-margin-top:110px}.main-nav .mobile-quest-link{display:none}.hero-note{width:420px;max-width:42%;padding:22px;gap:20px;border-color:#d8ba7766;background:#0a2029;overflow:hidden;box-shadow:0 20px 60px #0005;bottom:17%}.hero-note-art{width:100px;flex-shrink:0}.hero-note-art .place-art{margin:0;aspect-ratio:1;display:grid;place-items:center;border-radius:6px;overflow:hidden}.hero-note strong{font-size:20px;line-height:1.4;margin-top:9px}.hero-note small{font-size:10px;letter-spacing:.04em}.hero-note-action{display:block;color:#e5c37d;font-size:12px;margin-top:16px}.hero-note:hover{transform:translateY(-4px) scale(1.012);border-color:#e3c483}.hero-note:active{transform:translateY(0) scale(.99)}.hero-note:after{content:'';position:absolute;inset:-40% auto -40% -60%;width:25%;background:linear-gradient(90deg,transparent,#f3d89a22,transparent);transform:rotate(22deg);animation:quest-shine 1.8s ease-out .4s 1;pointer-events:none}@keyframes quest-shine{to{left:140%}}.budget-row{border-block:1px solid var(--line);padding:20px 0}.budget-row b{white-space:nowrap}.target-grid{display:none}
@media(min-width:801px) and (max-width:1200px){.main-nav .mobile-quest-link{display:block}.hero-note{width:340px;max-width:40%;padding:18px;gap:14px}.hero-note-art{width:65px}.hero-note strong{font-size:17px}}
@media(max-width:800px){html{scroll-padding-top:92px}.header,.document-page .header{height:76px}.main-nav{background:#081923;max-height:calc(100svh - 76px);overflow:auto;backdrop-filter:none}.main-nav .mobile-quest-link{display:block}.document-page:not(.demo-page) main{padding-top:76px}[id],button,a,input,select{scroll-margin-top:92px}.hero-note{right:24px;left:24px;width:auto;max-width:none;bottom:100px;padding:19px 22px;gap:20px}.hero-note-art{width:82px}.hero-note strong{font-size:18px}.hero-note small{font-size:10px}.hero-note-action{margin-top:10px}.hero-note:hover{transform:translateY(-3px)}.hero-note .original-art .approved-fragment{max-width:100%}}
@media(max-width:420px){.hero-note{left:20px;right:20px;padding:17px;gap:14px}.hero-note-art{width:65px}.hero-note strong{font-size:17px}.hero-note small{font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-note,.button{transition:none}.hero-note:after{animation:none;display:none}.hero-note:hover,.button:hover{transform:none}}
/* Use one offset for anchor navigation; avoid adding padding and margin twice. */
.hero-note{position:relative;inset:auto;width:455px;max-width:100%;padding:21px 24px;margin:25px 0 0;background:#0b1d27;border:1px solid #c6ad704d;gap:23px;border-radius:12px;box-shadow:0 12px 35px #0002}.hero-note .note-icon{width:54px;height:54px;flex:none;font-size:22px;border:1px solid #d7bc79}.hero-note strong{font-size:21px;line-height:1.4;margin-top:6px}.hero-note small{font-size:11px;color:#e3bd70;letter-spacing:.08em}.hero-note>.arrow{margin-left:auto;color:#f1e9d6}.hero-secondary-actions{margin-top:16px;gap:22px}.hero-secondary-actions .button.secondary{border-color:#b6aa8277;background:#08192366;color:#d4d5c9;min-height:42px;padding:7px 18px;font-size:12px;box-shadow:none}.hero-secondary-actions .text-link{font-size:12px}.resume-quest{margin:30px 0}.topic-anchor{display:block;scroll-margin-top:110px}.budget-total small{display:block;margin-top:14px;font-size:17px;line-height:1.6}
@media(max-width:800px){.hero-note{position:relative;inset:auto;width:455px;max-width:100%;margin-top:24px;padding:19px;gap:18px}.hero-note strong{font-size:19px}.hero-note .note-icon{width:48px;height:48px}.hero-note small{font-size:10px}.hero{min-height:980px}.hero-copy{max-width:610px}.hero-secondary-actions{gap:14px}.topic-anchor{scroll-margin-top:92px}}
@media(max-width:420px){.hero-note{gap:14px;padding:17px 15px}.hero-note strong{font-size:17px}.hero-note small{font-size:9px}.hero-note .note-icon{width:43px;height:43px}.hero-note>.arrow{font-size:17px}.hero .hero-secondary-actions .button{padding:7px 14px;font-size:11px}.hero .hero-secondary-actions .text-link{font-size:11px}}
:root{scroll-padding-top:0}
@media print{.document-page:not(.demo-page) main{padding-top:0}.header{display:none}}
