:root { color-scheme: light; }
body { overflow-x: hidden; }
.made-on-mac-badge { display: inline-flex; align-items: center; gap: .32rem; border: 1px solid #dbe5f0; border-radius: .65rem; background: #f8fbff; padding: .42rem .72rem; color: #475569; font-size: .72rem; font-weight: 800; letter-spacing: .02em; line-height: 1; white-space: nowrap; box-shadow: 0 5px 14px rgba(15,23,42,.05); }
.made-on-mac-apple { position: relative; top: -.01rem; color: #0f172a; font-family: -apple-system, BlinkMacSystemFont, sans-serif; font-size: 1rem; line-height: .75; }
.eyebrow { font-size: .75rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: #1473e6; }
.hero-pattern { background-image: radial-gradient(circle at 1px 1px, rgba(38,140,255,.14) 1px, transparent 0); background-size: 24px 24px; }
.device-stage { min-height: 42rem; }
.phone-shell { width: 43%; aspect-ratio: 1179 / 2556; overflow: hidden; border: 9px solid #0f172a; border-radius: 3rem; background: #f2f2f7; box-shadow: 0 40px 100px rgba(15, 23, 42, .22); }
.phone-shell img { display: block; width: 100%; height: 100%; object-fit: cover; }
.phone-island { position: absolute; left: 50%; top: .55rem; width: 28%; height: 1rem; border-radius: 999px; background: #0f172a; transform: translateX(-50%); box-shadow: 0 1px 2px rgba(15, 23, 42, .2); }
.mac-device { position: absolute; left: -8%; top: 7rem; width: 92%; filter: drop-shadow(0 35px 45px rgba(15, 23, 42, .17)); transform: rotate(-1.5deg); }
.mac-lid { position: relative; aspect-ratio: 16 / 10.3; border: 9px solid #0f172a; border-bottom-width: 12px; border-radius: 1.4rem 1.4rem .5rem .5rem; background: #0f172a; padding: .45rem; }
.mac-camera { position: absolute; left: 50%; top: -1px; z-index: 2; width: .28rem; height: .28rem; border-radius: 999px; background: #334155; transform: translate(-50%, -50%); }
.mac-screen { position: relative; height: 100%; overflow: hidden; border-radius: .65rem .65rem .2rem .2rem; background: #f8fafc; }
.mac-screen img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mac-base { position: relative; left: -5%; width: 110%; height: 1rem; border-radius: .2rem .2rem 1.2rem 1.2rem; background: linear-gradient(180deg, #d9e0e8, #aeb8c5); }
.mac-base::after { position: absolute; left: 4%; right: 4%; bottom: -.22rem; height: .25rem; border-radius: 0 0 999px 999px; background: #83909f; content: ''; }
.mac-base span { position: absolute; left: 50%; top: 0; width: 13%; height: .28rem; border-radius: 0 0 .45rem .45rem; background: #8793a1; transform: translateX(-50%); }
.ios-story { overflow: clip; background: linear-gradient(180deg, #eef7ff 0%, #f8fbff 52%, #fff 100%); padding: 6.5rem 0 4rem; }
.ios-story-intro h2 { margin: 1rem auto 0; max-width: 15ch; color: #020617; font-size: clamp(2.5rem, 5vw, 4.6rem); font-weight: 900; letter-spacing: -.05em; line-height: 1; }
.ios-story-intro > p:last-child { max-width: 44rem; margin: 1.5rem auto 0; color: #52657e; font-size: 1.1rem; line-height: 1.8; }
.ios-story-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(22rem, .82fr); gap: clamp(3rem, 8vw, 8rem); margin-top: 3.5rem; }
.ios-story-visual { position: sticky; top: 7rem; height: calc(100vh - 8rem); min-height: 42rem; align-self: start; display: grid; place-items: center; }
.ios-story-phone { position: relative; z-index: 2; width: min(54%, 22rem); aspect-ratio: 1179 / 2556; border: 10px solid #0f172a; border-radius: 3.5rem; background: #f2f2f7; box-shadow: 0 45px 100px rgba(15, 23, 42, .22); transform: rotate(-1deg); }
.ios-story-screen { position: absolute; inset: 0; overflow: hidden; border-radius: 2.8rem; background: #f2f2f7; }
.ios-story-screen img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.035); transition: opacity .45s ease, transform .65s cubic-bezier(.2,.75,.25,1); }
.ios-story-screen img.is-active { opacity: 1; transform: scale(1); }
.ios-story-island { position: absolute; z-index: 4; left: 50%; top: .55rem; width: 28%; height: 1rem; border-radius: 999px; background: #0f172a; transform: translateX(-50%); }
.ios-story-orbit { position: absolute; inset: 8% 0; }
.ios-story-orbit span { position: absolute; display: block; border-radius: 999px; }
.ios-story-orbit span:nth-child(1) { left: 4%; top: 18%; width: 9rem; height: 9rem; background: rgba(120,239,195,.45); }
.ios-story-orbit span:nth-child(2) { right: 1%; bottom: 13%; width: 11rem; height: 11rem; border: 2.5rem solid rgba(255,217,92,.38); }
.ios-story-orbit span:nth-child(3) { right: 9%; top: 12%; width: 4rem; height: 4rem; border-radius: 1.2rem; background: rgba(255,113,99,.8); transform: rotate(18deg); }
.ios-story-note { position: absolute; z-index: 3; right: 2%; bottom: 12%; display: flex; align-items: center; gap: .55rem; border-radius: 1rem; padding: .85rem 1rem; color: #fff; font-size: .78rem; font-weight: 900; box-shadow: 0 16px 35px rgba(20,115,230,.25); transition: background .35s ease, color .35s ease, padding .35s ease, font-size .35s ease, transform .4s cubic-bezier(.2,.75,.25,1), box-shadow .35s ease; }
.ios-story-note svg { width: 1rem; height: 1rem; }
.ios-story-note-icons { position: relative; display: block; width: 1rem; height: 1rem; flex: 0 0 1rem; }
.ios-story-note-icons svg { position: absolute; inset: 0; opacity: 0; transform: scale(.72) rotate(-12deg); transition: opacity .24s ease, transform .32s ease; }
.ios-story-note-icons svg.is-active { opacity: 1; transform: scale(1) rotate(0); }
.ios-story-note-today { background: #1473e6; transform: rotate(4deg); }
.ios-story-note-food { background: #ff7163; padding: .95rem 1.15rem; font-size: .84rem; box-shadow: 0 16px 35px rgba(255,113,99,.25); transform: rotate(-3deg); }
.ios-story-note-trends { background: #ffd95c; padding: .8rem 1.05rem; color: #503d00; box-shadow: 0 16px 35px rgba(229,169,0,.22); transform: rotate(2deg) scale(1.08); }
.ios-story-note-connections { background: #008a68; padding: .9rem 1.2rem; font-size: .82rem; box-shadow: 0 16px 35px rgba(0,138,104,.22); transform: rotate(-2deg); }
.ios-story-note-goals { background: #7c3aed; padding: 1rem 1.3rem; font-size: .86rem; box-shadow: 0 16px 35px rgba(124,58,237,.24); transform: rotate(3deg) scale(1.05); }
.ios-story-note-history { background: #e64668; padding: .82rem 1.05rem; box-shadow: 0 16px 35px rgba(230,70,104,.23); transform: rotate(-4deg); }
.ios-story-steps { padding-bottom: 12vh; }
.ios-story-step { position: relative; min-height: 72vh; display: flex; flex-direction: column; justify-content: center; opacity: .34; transform: translateY(1rem); transition: opacity .3s ease, transform .35s ease; }
.ios-story-step.is-active { opacity: 1; transform: none; }
.ios-story-step > svg { width: 2rem; height: 2rem; margin-bottom: 1.25rem; color: #1473e6; stroke-width: 2.25; }
.ios-story-step:nth-child(2) > svg { color: #ff7163; }.ios-story-step:nth-child(3) > svg { color: #e5a900; }.ios-story-step:nth-child(4) > svg { color: #008a68; }.ios-story-step:nth-child(5) > svg { color: #7c3aed; }.ios-story-step:nth-child(6) > svg { color: #e64668; }
.ios-story-kicker { color: #1473e6; font-size: .72rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.ios-story-step h3 { position: relative; max-width: 12ch; margin-top: .6rem; color: #020617; font-size: clamp(2.25rem, 4vw, 3.5rem); font-weight: 900; letter-spacing: -.045em; line-height: 1.02; }
.ios-story-step > p:not(.ios-story-kicker) { position: relative; max-width: 34rem; margin-top: 1.25rem; color: #52657e; font-size: 1.05rem; line-height: 1.75; }
.ios-story-step > a { display: inline-flex; align-items: center; gap: .65rem; width: fit-content; margin-top: 1.75rem; border-radius: 999px; background: #0f172a; padding: .9rem 1.25rem; color: #fff; font-weight: 900; transition: transform .2s ease, background .2s ease; }
.ios-story-step > a:hover { background: #1473e6; transform: translateY(-2px); }
.ios-story-mobile { display: none; }
.mac-story { overflow: clip; border-top: 1px solid #dbe5f0; background: linear-gradient(180deg, #fff 0%, #f4f8ff 42%, #eef7ff 100%); padding: 7rem 0 3rem; color: #020617; }
.mac-story .eyebrow { color: #1473e6; }
.mac-story-intro h2 { max-width: 16ch; margin: 1rem auto 0; font-size: clamp(2.7rem, 5vw, 4.8rem); font-weight: 900; letter-spacing: -.05em; line-height: 1; }
.mac-story-intro > p:last-child { max-width: 46rem; margin: 1.5rem auto 0; color: #52657e; font-size: 1.1rem; line-height: 1.8; }
.mac-story-layout { display: grid; grid-template-columns: minmax(38rem, 1.08fr) minmax(0, 1.25fr); gap: clamp(2rem, 3vw, 4rem); margin-top: 4rem; }
.mac-story-steps { padding-left: max(2rem, calc((100vw - 100rem) / 2)); padding-bottom: 14vh; }
.mac-story-step { position: relative; min-height: 76vh; display: flex; flex-direction: column; justify-content: center; padding-right: 2rem; opacity: .3; transform: translateY(1rem); transition: opacity .3s ease, transform .35s ease; }
.mac-story-step.is-active { opacity: 1; transform: none; }
.mac-story-step > svg { width: 2rem; height: 2rem; margin-bottom: 1.2rem; color: #1473e6; }
.mac-story-step > p:first-of-type { color: #1473e6; font-size: .72rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.mac-story-step h3 { position: relative; max-width: 15ch; margin-top: .65rem; font-size: clamp(2.25rem, 3.15vw, 3.6rem); font-weight: 900; letter-spacing: -.045em; line-height: 1.02; }
.mac-story-step > p:last-of-type { position: relative; max-width: 35rem; margin-top: 1.25rem; color: #52657e; font-size: 1.03rem; line-height: 1.75; }
.mac-story-step > a { display: inline-flex; align-items: center; gap: .65rem; width: fit-content; margin-top: 1.75rem; border-radius: 999px; background: #0f172a; padding: .9rem 1.25rem; color: #fff; font-weight: 900; transition: transform .2s ease, background .2s ease; }
.mac-story-step > a:hover { background: #1473e6; transform: translateY(-2px); }
.mac-story-visual { position: sticky; top: 5.5rem; height: calc(100vh - 6rem); min-height: 42rem; align-self: start; display: flex; align-items: center; }
.mac-story-shapes { position: absolute; inset: 8% 0 10%; pointer-events: none; }
.mac-story-shapes span { position: absolute; display: block; }
.mac-story-shapes span:nth-child(1) { left: -2%; top: 9%; width: 11rem; height: 11rem; border-radius: 999px; background: rgba(120,239,195,.38); }
.mac-story-shapes span:nth-child(2) { right: 3%; top: 3%; width: 6rem; height: 6rem; border-radius: 1.7rem; background: rgba(255,113,99,.68); transform: rotate(17deg); }
.mac-story-shapes span:nth-child(3) { right: 1%; bottom: 6%; width: 13rem; height: 13rem; border: 2.8rem solid rgba(255,217,92,.34); border-radius: 999px; }
.mac-story-shapes span:nth-child(4) { left: 10%; bottom: 3%; width: 5rem; height: 5rem; border-radius: 1.45rem; background: rgba(199,156,255,.52); transform: rotate(-22deg); }
.mac-story-device { position: relative; width: min(68vw, 70rem); transform: translateX(1%); filter: drop-shadow(0 45px 65px rgba(15,23,42,.24)); }
.mac-story-lid { position: relative; aspect-ratio: 16 / 10.25; border: 11px solid #101827; border-bottom-width: 15px; border-radius: 2rem 2rem .65rem .65rem; background: #101827; padding: .45rem; }
.mac-story-camera { position: absolute; z-index: 5; left: 50%; top: -2px; width: .35rem; height: .35rem; border-radius: 999px; background: #38455a; transform: translate(-50%, -50%); }
.mac-story-screen { position: relative; height: 100%; overflow: hidden; border-radius: 1.15rem .95rem .25rem .25rem; background: #1687d5; }
.mac-story-wallpaper { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mac-story-app { position: absolute; z-index: 2; left: 50%; top: 50%; width: 88%; height: 88%; object-fit: contain; opacity: 0; transform: translate(-50%, -48%) scale(.975); transition: opacity .45s ease, transform .65s cubic-bezier(.2,.75,.25,1); }
.mac-story-app.is-active { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.mac-story-base { position: relative; left: -4%; width: 108%; height: 1.25rem; border-radius: .25rem .25rem 1.5rem 1.5rem; background: linear-gradient(180deg,#e5eaf0,#8f9aaa); }
.mac-story-base::after { position: absolute; left: 3%; right: 3%; bottom: -.25rem; height: .3rem; border-radius: 0 0 999px 999px; background: #687589; content: ''; }
.mac-story-base span { position: absolute; left: 50%; top: 0; width: 14%; height: .32rem; border-radius: 0 0 .55rem .55rem; background: #7c8796; transform: translateX(-50%); }
.mac-story-badge { position: absolute; z-index: 5; left: 3%; bottom: 12%; display: flex; align-items: center; gap: .6rem; border-radius: 1rem; padding: .9rem 1.1rem; font-size: .8rem; font-weight: 900; box-shadow: 0 18px 40px rgba(15,23,42,.17); transition: background .35s ease, color .35s ease, padding .35s ease, transform .4s ease; }
.mac-story-badge-icons { position: relative; display: block; width: 1rem; height: 1rem; flex: 0 0 1rem; }
.mac-story-badge-icons svg { position: absolute; inset: 0; width: 1rem; height: 1rem; opacity: 0; transform: scale(.72) rotate(-12deg); transition: opacity .24s ease, transform .32s ease; }
.mac-story-badge-icons svg.is-active { opacity: 1; transform: scale(1) rotate(0); }
.mac-story-badge-today { background: #78efc3; color: #07111f; transform: rotate(-3deg); }.mac-story-badge-trends { background: #ffd95c; color: #503d00; padding: 1rem 1.25rem; transform: rotate(3deg) scale(1.05); }.mac-story-badge-weight { background: #ff9a42; color: #241202; transform: rotate(-2deg); }.mac-story-badge-food { background: #268cff; transform: rotate(2deg) scale(1.06); }.mac-story-badge-search { background: #fff; color: #0f172a; padding: 1rem 1.3rem; transform: rotate(-3deg); }.mac-story-badge-sleep { background: #71c9ff; color: #09233a; transform: rotate(2deg); }.mac-story-badge-profile { background: #c79cff; color: #24103d; padding: .95rem 1.2rem; transform: rotate(-2deg) scale(1.04); }
.mac-story-mobile { display: none; }
.feature-showcase { background: linear-gradient(180deg, #fff 0%, #f8fbff 48%, #fff 100%); }
.feature-filter-pill { display: inline-flex; align-items: center; gap: .5rem; border: 0; border-radius: 999px; background: transparent; padding: .75rem 1rem; color: #64748b; font: inherit; font-size: .83rem; font-weight: 900; transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease; }
.feature-filter-pill svg { width: 1rem; height: 1rem; stroke-width: 2.25; }
.feature-filter-pill:hover { color: #115bb7; transform: translateY(-1px); }
.feature-filter-pill.is-active { background: #1473e6; color: #fff; box-shadow: 0 8px 20px rgba(38, 140, 255, .23); }
.feature-filter-pill:focus-visible { outline: 3px solid rgba(38, 140, 255, .28); outline-offset: 3px; }
.feature-deck { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.feature-card { position: relative; display: flex; min-width: 0; min-height: 17rem; flex-direction: column; overflow: hidden; border: 1px solid rgba(148, 163, 184, .24); border-radius: 2rem; padding: 1.5rem; transition: opacity .22s ease, transform .22s ease, border-color .22s ease; }
.feature-card::after { position: absolute; right: -2.5rem; bottom: -3.5rem; width: 9rem; height: 9rem; border: 1.5rem solid rgba(255,255,255,.35); border-radius: 999px; content: ''; }
.feature-card::before { position: absolute; z-index: 1; right: calc(.25rem - 5px); bottom: calc(-.55rem - 9px); width: 4.15rem; height: 1.15rem; background: rgba(255,255,255,.5); clip-path: polygon(0 50%, 82% 7%, 94% 10%, 100% 28%, 100% 72%, 94% 90%, 82% 93%); content: ''; transform: rotate(45deg); transform-origin: right center; }
.feature-card:hover { transform: translateY(-4px); border-color: rgba(38, 140, 255, .38); }
.feature-card[hidden] { display: none; }
.feature-card.is-entering { opacity: 0; transform: translateY(12px) scale(.98); }
.feature-card-blue { background: linear-gradient(145deg, #eef7ff, #dcecff); }
.feature-card-coral { background: linear-gradient(145deg, #fff4f1, #ffe1dc); }
.feature-card-sun { background: linear-gradient(145deg, #fffbed, #fff0b8); }
.feature-card-mint { background: linear-gradient(145deg, #effcf7, #d4f7e9); }
.feature-card-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.feature-platform { border-radius: 999px; background: rgba(255,255,255,.65); padding: .35rem .55rem; color: rgba(15, 23, 42, .55); font-size: .62rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.feature-card h3 { position: relative; z-index: 1; max-width: 14ch; margin-top: auto; color: #0f172a; font-size: 1.45rem; font-weight: 900; letter-spacing: -.035em; line-height: 1.08; }
.feature-card p { position: relative; z-index: 1; max-width: 27ch; margin-top: .75rem; color: #526175; font-size: .83rem; line-height: 1.55; }
.add-on-carousel { position: relative; }
.add-on-rail { scroll-behavior: smooth; scroll-padding-inline: 2rem; scrollbar-width: none; }
.add-on-rail::-webkit-scrollbar { display: none; }
.add-on-card { transition: transform .2s ease, border-color .2s ease; }
.add-on-card:hover { transform: translateY(-3px); border-color: #60a5fa; }
.carousel-arrow { display: inline-grid; width: 2.5rem; height: 2.5rem; place-items: center; border: 1px solid #dbeafe; border-radius: 999px; background: #fff; color: #115bb7; font-weight: 900; transition: background .2s ease, color .2s ease, transform .2s ease; }
.carousel-arrow:hover { background: #1473e6; color: #fff; transform: translateY(-1px); }
.carousel-arrow:disabled { cursor: default; opacity: .35; transform: none; }
.carousel-dot { width: .5rem; height: .5rem; border: 0; border-radius: 999px; background: #cbd5e1; padding: 0; transition: width .2s ease, background .2s ease; }
.carousel-dot[aria-current="true"] { width: 1.5rem; background: #268cff; }
.carousel-dot:focus-visible, .carousel-arrow:focus-visible { outline: 3px solid rgba(38, 140, 255, .3); outline-offset: 3px; }
.momentum-bar { transition: height .45s cubic-bezier(.2, .8, .2, 1), background-color .25s ease; }
.help-sidebar { border: 1px solid rgba(23, 63, 58, .1); border-radius: 1.5rem; background: rgba(255, 255, 255, .9); padding: 1rem; box-shadow: 0 18px 50px rgba(15, 23, 42, .06); }
.help-side-nav { display: grid; gap: .35rem; }
.help-side-home { display: flex; align-items: center; gap: .55rem; margin-bottom: .65rem; border-radius: .85rem; padding: .7rem .75rem; color: #0d7464; font-size: .85rem; font-weight: 800; }
.help-side-home:hover { background: #e8f7f1; }
.help-side-report { display: flex; align-items: center; gap: .7rem; margin-bottom: .75rem; border-radius: 1rem; background: linear-gradient(135deg, #fff0ed, #fff8d8); padding: .8rem; color: #9f352d; }
.help-side-report > span:first-child { display: grid; width: 2.2rem; height: 2.2rem; flex: 0 0 2.2rem; place-items: center; border-radius: .7rem; background: #ff7163; color: #fff; }
.help-side-report strong, .help-side-report small { display: block; }
.help-side-report strong { font-size: .86rem; }
.help-side-report small { margin-top: .1rem; color: #8f625e; font-size: .68rem; }
.help-side-report:hover, .help-side-report.is-active { background: linear-gradient(135deg, #ff7163, #ff8c67); color: #fff; transform: translateY(-1px); }
.help-side-report:hover small, .help-side-report.is-active small { color: rgba(255,255,255,.78); }
.help-side-report:hover > span:first-child, .help-side-report.is-active > span:first-child { background: rgba(255,255,255,.2); }
.help-side-group { border-top: 1px solid #edf2f1; padding: .9rem .25rem .35rem; }
.help-side-group p { margin: 0 0 .45rem .5rem; color: #87958f; font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.help-side-group a { display: block; border-radius: .8rem; padding: .62rem .65rem; color: #52635f; font-size: .87rem; font-weight: 700; line-height: 1.35; transition: background .2s ease, color .2s ease, transform .2s ease; }
.help-side-group a:hover { background: #f1f7f5; color: #173f3a; transform: translateX(2px); }
.help-side-group a.is-active { background: #173f3a; color: #fff; box-shadow: 0 8px 18px rgba(23, 63, 58, .16); }
.help-side-group a.help-side-release { display: flex; align-items: center; gap: .55rem; margin-top: .55rem; border: 1px solid #9fd8c8; background: #effbf6; color: #0d7464; }
.help-side-group a.help-side-release svg { width: 1rem; height: 1rem; flex: 0 0 1rem; }
.help-side-group a.help-side-release:hover { border-color: #4cb99c; background: #dff5ed; }
.help-side-group a.help-side-release.is-active { border-color: #9fd8c8; background: #effbf6; color: #0d7464; box-shadow: none; }
.help-side-group-classic { margin-top: .6rem; border: 1px solid #ddd6fe; border-radius: 1rem; background: #faf7ff; padding: .9rem .5rem .55rem; }
.help-side-group-classic p { color: #6d48a8; }
.help-side-group-classic a:hover { background: #f1eafe; color: #4c1d95; }
.help-side-group-classic a.is-active { background: #6d48a8; color: #fff; }
.help-side-subgroup { margin: .25rem 0; }
.help-side-subgroup summary { display: flex; cursor: pointer; list-style: none; align-items: center; justify-content: space-between; border-radius: .75rem; padding: .55rem .65rem; color: #40534e; font-size: .78rem; font-weight: 850; }
.help-side-subgroup summary::-webkit-details-marker { display: none; }
.help-side-subgroup summary:hover { background: #f1f7f5; }
.help-side-subgroup summary svg { width: .9rem; height: .9rem; transition: transform .2s ease; }
.help-side-subgroup[open] summary svg { transform: rotate(180deg); }
.help-side-subgroup > div { padding-left: .35rem; }
.help-figure { margin: 2rem 0; border: 1px solid #dbe7e3; border-radius: 1.4rem; background: #f7fbfa; padding: 1rem; }
.help-figure img { width: 100%; max-height: 46rem; border-radius: 1rem; object-fit: contain; }
.help-figure.is-mobile { display: flex; flex-direction: column; align-items: center; background: radial-gradient(circle at 18% 15%,rgba(116,239,198,.32),transparent 28%),radial-gradient(circle at 88% 82%,rgba(255,217,92,.32),transparent 30%),#f7fbfa; padding: clamp(1.25rem,4vw,2.5rem); }
.help-device { position: relative; display: block; width: min(100%,19rem); overflow: hidden; border: 8px solid #111827; border-radius: 2.75rem; background: #111827; box-shadow: 0 24px 45px rgba(15,23,42,.2); }
.help-device::after { position: absolute; top: .48rem; left: 50%; z-index: 3; width: clamp(4.75rem,32%,6.1rem); height: 1.45rem; border-radius: 999px; background: #05070d; box-shadow: inset 0 -1px 0 rgba(255,255,255,.08),0 1px 3px rgba(15,23,42,.18); content: ''; transform: translateX(-50%); pointer-events: none; }
.help-device img, .help-figure.is-mobile .help-device img { display: block; width: 100%; max-height: none; border-radius: 2.15rem; object-fit: contain; }
.help-device-sequence { background: radial-gradient(circle at 12% 18%,rgba(116,239,198,.34),transparent 25%),radial-gradient(circle at 88% 80%,rgba(255,154,66,.26),transparent 28%),#f7fbfa; padding: clamp(1.25rem,4vw,2.5rem); }
.help-device-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; justify-items: center; gap: clamp(1rem,4vw,2.5rem); }
.help-device-step { width: 100%; text-align: center; }
.help-device-step .help-device { margin: 0 auto; }
.help-device-step strong { display: block; margin-top: .85rem; color: #334155; font-size: .78rem; }
.help-device-sequence > figcaption { margin-top: 1.1rem; }
.help-figure figcaption { margin-top: .75rem; color: #64748b; font-size: .82rem; line-height: 1.55; text-align: center; }
.help-mac-stage { display: flex; flex-direction: column; align-items: center; overflow: hidden; border-color: rgba(255,255,255,.55); background-image: linear-gradient(135deg,rgba(232,245,255,.25),rgba(255,255,255,.04) 42%,rgba(199,156,255,.18)),url('/assets/images/macOS/wallpaper.jpg'); background-position: center; background-size: cover; padding: clamp(1.25rem,4vw,2.6rem); box-shadow: inset 0 1px 0 rgba(255,255,255,.65),0 18px 42px rgba(15,23,42,.09); }
.help-mac-stage img { position: relative; z-index: 1; filter: drop-shadow(0 18px 24px rgba(15,23,42,.28)); }
.help-mac-stage figcaption { position: relative; z-index: 1; width: fit-content; max-width: min(100%,42rem); margin-top: 1.15rem; border: 1px solid rgba(255,255,255,.62); border-radius: 999px; background: rgba(255,255,255,.76); padding: .7rem 1.05rem; color: #334155; font-weight: 700; box-shadow: 0 10px 28px rgba(15,23,42,.12); backdrop-filter: blur(14px) saturate(1.15); -webkit-backdrop-filter: blur(14px) saturate(1.15); }
.help-ipad-stage { display: flex; flex-direction: column; align-items: center; overflow: hidden; background: radial-gradient(circle at 8% 18%,rgba(116,239,198,.38),transparent 26%),radial-gradient(circle at 91% 82%,rgba(199,156,255,.3),transparent 27%),linear-gradient(135deg,#eef8ff,#fff8ec); padding: clamp(1rem,3.5vw,2.25rem); }
.help-ipad-device { position: relative; display: block; width: 100%; overflow: hidden; border: clamp(7px,1vw,11px) solid #111827; border-radius: clamp(1.25rem,2.8vw,2rem); background: #111827; box-shadow: 0 24px 48px rgba(15,23,42,.22); }
.help-ipad-device::after { position: absolute; top: .36rem; left: 50%; z-index: 3; width: .42rem; height: .42rem; border-radius: 50%; background: #273449; box-shadow: 0 0 0 1px rgba(255,255,255,.08); content: ''; transform: translateX(-50%); pointer-events: none; }
.help-ipad-device img { display: block; width: 100%; max-height: none; border-radius: calc(clamp(1.25rem,2.8vw,2rem) - 10px); object-fit: contain; }
.help-ipad-stage figcaption { width: fit-content; max-width: min(100%,45rem); margin-top: 1.1rem; border: 1px solid rgba(255,255,255,.72); border-radius: 999px; background: rgba(255,255,255,.78); padding: .7rem 1.05rem; color: #334155; font-weight: 700; box-shadow: 0 10px 28px rgba(15,23,42,.1); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.help-platform-capture-title { display: flex; align-items: center; gap: .55rem; width: fit-content; margin: 2.2rem 0 -.9rem; border: 1px solid #cfe1dc; border-radius: 999px; background: #fff; padding: .5rem .78rem; color: #0d7464; font-size: .76rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.help-platform-capture-title svg { width: 1rem; height: 1rem; }
.help-disclosure { margin: 2rem 0; overflow: hidden; border: 1px solid #cfe1dc; border-radius: 1.25rem; background: #f7fbfa; }
.help-disclosure summary { display: flex; cursor: pointer; list-style: none; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem; color: #173f3a; font-weight: 850; }
.help-disclosure summary::after { color: #0d7464; font-size: 1.25rem; content: '+'; transition: transform .2s ease; }
.help-disclosure[open] summary::after { transform: rotate(45deg); }
.help-disclosure summary::-webkit-details-marker { display: none; }
.help-disclosure > div { border-top: 1px solid #dbe7e3; padding: 0 1.2rem 1.2rem; }
.help-disclosure .help-figure { margin-bottom: 0; }
.help-flow-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin: 2rem 0; }
.help-flow-grid .help-figure { margin: 0; }
.help-flow-grid-mobile img { max-height: 32rem; }
@media (max-width: 640px) { .help-flow-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .help-device-row { grid-template-columns: 1fr; gap: 1.75rem; } .help-device { width: min(78vw,18rem); border-width: 7px; border-radius: 2.5rem; } }
@media (max-width: 640px) { .help-mac-stage { padding: 1rem; } .help-mac-stage figcaption { border-radius: 1rem; padding: .65rem .8rem; } }
@media (max-width: 640px) { .help-ipad-stage { padding: .75rem; } .help-ipad-device { border-width: 6px; border-radius: 1rem; } .help-ipad-device::after { top: .18rem; width: .3rem; height: .3rem; } .help-ipad-stage figcaption { border-radius: 1rem; padding: .6rem .75rem; } }
.help-mobile-nav { overflow: hidden; border: 1px solid rgba(23, 63, 58, .12); border-radius: 1.25rem; background: #fff; box-shadow: 0 12px 30px rgba(15, 23, 42, .06); }
.help-mobile-nav summary { display: flex; cursor: pointer; list-style: none; align-items: center; justify-content: space-between; padding: 1rem 1.1rem; color: #173f3a; font-weight: 800; }
.help-mobile-nav summary::-webkit-details-marker { display: none; }
.help-article-hero { position: relative; min-height: 20rem; overflow: hidden; padding: 3rem 2rem; display: flex; align-items: center; }
.help-article-kicker { margin: 0; font-size: .72rem; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.help-article-hero h1 { max-width: 13ch; margin: .8rem 0 0; color: #0f172a; font-size: clamp(2.35rem, 5vw, 4.25rem); font-weight: 900; letter-spacing: -.045em; line-height: 1.02; }
.help-article-description { max-width: 36rem; margin: 1.25rem 0 0; color: #475569; font-size: 1.1rem; line-height: 1.7; }
.help-article-blue { background: linear-gradient(135deg, #e8f4ff 0%, #f6f2ff 100%); }
.help-article-blue .help-article-kicker { color: #1473e6; }
.help-article-coral { background: linear-gradient(135deg, #fff0ed 0%, #fff8e6 100%); }
.help-article-coral .help-article-kicker { color: #d7473b; }
.help-article-sun { background: linear-gradient(135deg, #fff8d8 0%, #eaf7ff 100%); }
.help-article-sun .help-article-kicker { color: #9a6700; }
.help-hero-art { position: absolute; inset: 0; pointer-events: none; }
.help-hero-art span { position: absolute; display: block; }
.help-hero-art span:nth-child(1) { right: 7%; top: 18%; width: 8.5rem; height: 8.5rem; border-radius: 2.3rem; background: #268cff; transform: rotate(12deg); opacity: .9; }
.help-hero-art span:nth-child(2) { right: 19%; bottom: -2.5rem; width: 10rem; height: 10rem; border-radius: 999px; background: #78efc3; opacity: .75; }
.help-hero-art span:nth-child(3) { right: 2%; bottom: 13%; width: 5.5rem; height: 5.5rem; border: 1.2rem solid #ffd95c; border-radius: 999px; transform: rotate(-8deg); }
.help-hero-art span:nth-child(4) { right: 31%; top: 14%; width: 2.3rem; height: 2.3rem; border-radius: .65rem; background: #ff7163; transform: rotate(25deg); }
.help-article-coral .help-hero-art span:nth-child(1) { background: #ff7163; transform: rotate(-9deg); }
.help-article-coral .help-hero-art span:nth-child(2) { background: #ffd95c; }
.help-article-coral .help-hero-art span:nth-child(3) { border-color: #268cff; }
.help-article-coral .help-hero-art span:nth-child(4) { background: #78efc3; }
.help-article-sun .help-hero-art span:nth-child(1) { background: #ffd95c; border-radius: 999px; }
.help-article-sun .help-hero-art span:nth-child(2) { background: #268cff; opacity: .6; }
.help-article-sun .help-hero-art span:nth-child(3) { border-color: #ff7163; }
.help-article-sun .help-hero-art span:nth-child(4) { background: #78efc3; }
.help-prose { color: #52635f; }
.help-prose > :first-child { margin-top: 0; }
.help-prose h2 { scroll-margin-top: 2rem; margin-top: 3rem; font-size: 1.75rem; font-weight: 900; letter-spacing: -.025em; color: #173f3a; }
.help-platform-jumps { position: sticky; z-index: 5; top: 1rem; display: flex; flex-wrap: wrap; gap: .65rem; margin: -1rem 0 2rem; }
.help-platform-jumps a, .release-platform-nav a { display: inline-flex; align-items: center; gap: .5rem; margin: 0; border: 1px solid #bfdbfe; border-radius: 999px; background: #eff6ff; padding: .7rem 1rem; color: #0d7464; font-size: .78rem; font-weight: 900; text-decoration: none !important; box-shadow: 0 5px 14px rgba(15,23,42,.05); }
.help-platform-jumps a:hover, .release-platform-nav a:hover { border-color: #7dd3c0; background: #effbf6; color: #134e4a; }
.help-platform-jumps svg, .release-platform-nav svg { width: 1rem; height: 1rem; }
.release-list { position: relative; display: grid; gap: 1rem; margin-top: 1.5rem; }
.release-platform-nav { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 2rem; }
.release-entry { position: relative; display: grid; grid-template-columns: 1rem minmax(0,1fr); gap: 1rem; border-radius: 1.5rem; background: #f8fafc; padding: 1.5rem; }
.release-entry.is-latest { background: linear-gradient(135deg,#e8f4ff,#effbf6); }
.release-marker { width: .8rem; height: .8rem; margin-top: .45rem; border: 3px solid #fff; border-radius: 999px; background: #268cff; box-shadow: 0 0 0 2px #9dccff; }
.release-date { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; margin: 0 !important; color: #64748b !important; font-size: .78rem; font-weight: 800; }
.release-date span { border-radius: 999px; background: #1473e6; padding: .3rem .55rem; color: #fff; text-transform: uppercase; letter-spacing: .06em; }
.release-date .release-classic-badge { border: 1px solid #c4b5fd; background: #f3efff; color: #65409b; }
.release-entry-classic { border: 1px solid #eee9f8; }
.release-entry.is-notarized { overflow: hidden; padding-right: 8rem; }
.release-notarized-ribbon { position: absolute; top: 0; right: 0; display: inline-flex; align-items: center; gap: .35rem; border-bottom: 1px solid #a7f3d0; border-left: 1px solid #a7f3d0; border-radius: 0 1.5rem 0 1rem; background: #e8fff6; padding: .55rem .75rem; color: #08745c; font-size: .62rem; font-weight: 900; letter-spacing: .045em; line-height: 1; text-transform: uppercase; }
.release-notarized-ribbon svg { width: .9rem; height: .9rem; }
.release-notary-legend { display: flex; align-items: center; gap: .75rem; margin-top: 1rem; color: #64748b; font-size: .72rem; }
.release-notary-legend > span { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .35rem; border: 1px solid #a7f3d0; border-radius: 999px; background: #e8fff6; padding: .4rem .6rem; color: #08745c; font-size: .6rem; font-weight: 900; letter-spacing: .045em; line-height: 1; text-transform: uppercase; }
.release-notary-legend svg { width: .85rem; height: .85rem; }
.release-notary-legend p { margin: 0; }
@media (max-width: 560px) { .release-entry.is-notarized { padding-right: 1.5rem; padding-top: 3.25rem; } .release-notarized-ribbon { right: auto; left: 1.5rem; border: 1px solid #a7f3d0; border-radius: 999px; } }
.classic-cta { position: relative; left: 50%; width: 100vw; margin: 3.5rem 0 0 -50vw; border-block: 1px solid #d8ccf0; background: linear-gradient(105deg,#f3efff 0%,#faf7ff 45%,#fff4d8 100%); }
.classic-cta-flush { margin-top: 0; }
.classic-cta-inner { display: grid; max-width: 72rem; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 1.75rem; margin: 0 auto; padding: 2rem 1.25rem; }
.classic-cta-inner > span { display: grid; width: 4.5rem; height: 4.5rem; place-items: center; }
.classic-cta-inner > span img { display: block; width: 4.5rem; height: 4.5rem; }
.classic-cta svg { width: 1.25rem; height: 1.25rem; }
.classic-cta p { margin: 0; color: #5f6474; line-height: 1.55; }
.classic-cta-inner > div > p:first-child { color: #6d48a8; font-size: .7rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.classic-cta h2 { margin: .25rem 0 .35rem; color: #171126; font-size: clamp(1.4rem,3vw,2rem); font-weight: 900; letter-spacing: -.025em; }
.classic-cta a { display: inline-flex; align-items: center; gap: .55rem; border-radius: 999px; background: #171126; padding: .85rem 1.15rem; color: #fff; font-weight: 900; white-space: nowrap; }
@media (max-width: 760px) { .classic-cta-inner { grid-template-columns: auto 1fr; } .classic-cta a { grid-column: 1 / -1; justify-content: center; } }
@media (min-width: 640px) { .classic-cta-inner { padding-inline: 2rem; } }
.classic-help-identity { display: flex; align-items: center; gap: 1.25rem; margin-bottom: 2rem; border: 1px solid #ddd6fe; border-radius: 1.5rem; background: linear-gradient(135deg,#faf7ff,#fff); padding: 1.25rem; }
.classic-help-identity img { width: 6rem; height: 6rem; flex: 0 0 6rem; }
.classic-help-identity span, .classic-help-identity strong { display: block; }
.classic-help-identity span { color: #6d48a8; font-size: .7rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.classic-help-identity strong { margin-top: .35rem; color: #171126; font-size: 1.3rem; line-height: 1.25; }
@media (max-width: 520px) { .classic-help-identity { align-items: flex-start; } .classic-help-identity img { width: 4.5rem; height: 4.5rem; flex-basis: 4.5rem; } }
.release-entry h3 { margin-top: .35rem; font-size: 1.35rem; }
.release-os { display: flex; align-items: center; gap: .5rem; margin-top: .35rem !important; color: #526175 !important; font-size: .76rem; font-weight: 800; }
.release-os em { border-radius: 999px; background: #fff0ca; padding: .22rem .45rem; color: #8a5b00; font-size: .6rem; font-style: normal; letter-spacing: .05em; text-transform: uppercase; }
.release-entry ul { margin-top: .75rem; }
.release-download { display: inline-flex; align-items: center; gap: .55rem; margin-top: 1rem; border: 1px solid #c4b5fd; border-radius: 999px; background: #f3efff; padding: .7rem 1rem; color: #65409b !important; font-size: .78rem; font-weight: 900 !important; text-decoration: none !important; transition: background .2s ease, transform .2s ease; }
.release-download:hover { background: #e8ddff; transform: translateY(-1px); }
.release-download svg { width: 1rem; height: 1rem; }
.classic-download-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .75rem; margin-top: 1.25rem; }
.classic-download-grid a { position: relative; display: flex; align-items: flex-start; gap: .7rem; min-height: 6.25rem; border: 1px solid #ddd6fe; border-radius: 1rem; background: #faf7ff; padding: 1rem 1rem 2.65rem; color: #4c1d95 !important; text-decoration: none !important; transition: background .2s ease, transform .2s ease; }
.classic-download-grid a:hover { background: #f1eafe; transform: translateY(-1px); }
.classic-download-grid svg { width: 1.15rem; height: 1.15rem; flex: 0 0 1.15rem; }
.classic-download-grid span, .classic-download-grid strong, .classic-download-grid small { display: block; }
.classic-download-copy { min-width: 0; }
.classic-download-grid small { margin-top: .2rem; color: #7c6b91; font-size: .68rem; font-weight: 800; }
.classic-download-grid .classic-architecture-pill { position: absolute; right: .75rem; bottom: .7rem; border: 1px solid #c4b5fd; border-radius: 999px; background: #f0eaff; padding: .28rem .55rem; color: #65409b; font-size: .6rem; font-weight: 900; letter-spacing: .03em; line-height: 1; text-transform: uppercase; }
@media (max-width: 760px) { .classic-download-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 480px) { .classic-download-grid { grid-template-columns: 1fr; } }
.release-archive-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin-top: 1.5rem; }
.release-archive-grid > article { border: 1px solid #e2e8f0; border-radius: 1.5rem; background: #fff; padding: 1.35rem; }
.release-archive-grid h3 { margin-top: .55rem; font-size: 1rem; line-height: 1.5; }
.release-version-pills { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.release-version-pills span { display: flex; flex-direction: column; border-radius: .8rem; background: #f1f5f9; padding: .55rem .7rem; }
.release-version-pills small { color: #64748b; font-size: .65rem; }
.release-source-links { display: grid; gap: .75rem; margin-top: 1.25rem; }
.release-source-links a { display: grid; grid-template-columns: 7rem minmax(0,1fr) 1.2rem; align-items: center; gap: 1rem; border: 1px solid #dbe5e2; border-radius: 1rem; padding: 1rem; text-decoration: none; }
.release-source-links a:hover { background: #effbf6; }
.release-source-links span { color: #64748b; font-size: .75rem; font-weight: 900; text-transform: uppercase; }
@media (max-width: 640px) { .release-archive-grid { grid-template-columns: 1fr; } .release-source-links a { grid-template-columns: 1fr 1.2rem; } .release-source-links span { grid-column: 1 / -1; } }
.compatibility-card { border: 1px solid #dbeafe; border-radius: 2rem; background: #fff; padding: 2rem; box-shadow: 0 18px 50px rgba(15,23,42,.08); }
.compatibility-card > svg { width: 2rem; height: 2rem; color: #1473e6; }
.compatibility-card h2 { margin-top: .7rem; color: #0f172a; font-size: 1.6rem; font-weight: 900; }
.compatibility-card p:not(.eyebrow) { margin-top: .7rem; color: #475569; line-height: 1.65; }
.compatibility-card small { display: block; margin-top: 1rem; color: #64748b; line-height: 1.5; }
.requirement-card { display: flex; gap: 1rem; border: 1px solid #e2e8f0; border-radius: 1.5rem; background: #fff; padding: 1.35rem; }
.requirement-card > svg { width: 1.5rem; height: 1.5rem; flex: 0 0 1.5rem; color: #1473e6; }
.requirement-card h3 { color: #0f172a; font-weight: 900; }
.requirement-card p { margin-top: .35rem; color: #64748b; line-height: 1.55; }
.legal-page h1 { margin-top: 1rem; color: #0f172a; font-size: clamp(2.6rem,7vw,4.25rem); font-weight: 900; letter-spacing: -.045em; line-height: 1; }
.legal-lead { margin-top: 1.5rem; color: #475569; font-size: 1.2rem; line-height: 1.8; }
.legal-page h2 { scroll-margin-top: 2rem; margin-top: 2.75rem; color: #0f172a; font-size: 1.55rem; font-weight: 900; }
.legal-page p, .legal-page ul { margin-top: 1rem; color: #526175; line-height: 1.8; }
.legal-page ul { list-style: disc; padding-left: 1.4rem; }
.legal-page a { color: #0d6ac6; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.legal-review { margin-top: 2rem; border: 1px solid #f4c96b; border-radius: 1.25rem; background: #fff8d8; padding: 1.25rem; color: #713f12; }
.legal-review p { margin-top: .4rem; color: #854d0e; line-height: 1.65; }
.help-prose h3 { margin-top: 1.75rem; font-size: 1.15rem; font-weight: 800; color: #173f3a; }
.help-prose p, .help-prose ul, .help-prose ol { margin-top: 1rem; line-height: 1.8; color: #52635f; }
.help-prose .help-intro { color: #334155; font-size: 1.2rem; line-height: 1.8; }
.help-prose ul { list-style: disc; padding-left: 1.25rem; }
.help-prose ol { display: grid; list-style: none; padding: 0; counter-reset: help-steps; gap: .8rem; }
.help-prose ol li { position: relative; min-height: 2.5rem; padding: .5rem 0 .5rem 3.2rem; counter-increment: help-steps; }
.help-prose ol li::before { position: absolute; left: 0; top: .25rem; display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border-radius: .8rem; background: #e8f4ff; color: #1473e6; content: counter(help-steps); font-weight: 900; }
.help-prose a { color: #0d7464; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.help-beta-pill { display: inline-flex; margin-left: .3rem; border-radius: 999px; background: #fff0ed; padding: .2rem .45rem; color: #c94338; font-size: .6rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; vertical-align: middle; }
.help-table-note { margin-top: .75rem !important; color: #71807d !important; font-size: .76rem; line-height: 1.6 !important; }
.help-choice-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin-top: 1.5rem; }
.help-choice-card { position: relative; overflow: hidden; min-height: 12rem; border: 1px solid #dbe7e4; border-radius: 1.35rem; padding: 1.25rem; background: #fff; box-shadow: 0 14px 30px rgba(15,23,42,.055); }
.help-choice-card::after { position: absolute; right: -2.25rem; bottom: -2.5rem; width: 7.5rem; aspect-ratio: 1; border: 1.15rem solid rgba(255,255,255,.42); border-radius: 50%; content: ""; }
.help-choice-card > * { position: relative; z-index: 1; }
.help-choice-card > div { display: grid; gap: .1rem; margin-top: 1.05rem; }
.help-choice-card strong { color: #101827; font-size: 1.3rem; font-weight: 900; letter-spacing: -.025em; }
.help-choice-card div span { color: #48625d; font-size: .72rem; font-weight: 850; letter-spacing: .045em; text-transform: uppercase; }
.help-choice-card p { margin-top: .7rem !important; color: #425a56 !important; font-size: .88rem; line-height: 1.55 !important; }
.help-choice-card small { display: block; margin-top: .8rem; color: #64748b; font-size: .72rem; line-height: 1.5; }
.help-choice-icon { display: grid; width: 2.55rem; height: 2.55rem; place-items: center; border-radius: .85rem; background: rgba(255,255,255,.72); color: #176ed0; }
.help-choice-icon svg { width: 1.15rem; height: 1.15rem; stroke-width: 2; }
.help-choice-card.is-blue { background: #eaf5ff; }
.help-choice-card.is-mint { background: #e8f8f2; }
.help-choice-card.is-yellow { background: #fff6d6; }
.help-choice-card.is-coral { background: #ffebe7; }
.help-choice-card.is-lavender { background: #f1ebff; }
.help-provider-grid .help-choice-card { min-height: 15rem; }
@media (max-width: 680px) { .help-choice-grid { grid-template-columns: 1fr; } .help-choice-card { min-height: 0; } }
.help-source-links { margin-top: 2rem !important; border-top: 1px solid #e2e8f0; padding-top: 1rem; font-size: .82rem; }
.help-terminal { overflow-x: auto; margin-top: 1.25rem; border: 1px solid #263449; border-radius: 1.1rem; background: #0f172a; box-shadow: 0 18px 38px rgba(15,23,42,.16); }
.help-terminal pre { min-width: max-content; margin: 0; padding: 1.25rem 1.4rem; }
.help-terminal code { color: #d8f8ec; font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace; font-size: .8rem; line-height: 1.9; }
.ios-delete-illustration { margin-top: 2.5rem; }
.ios-delete-art { position: relative; display: flex; min-height: 28rem; align-items: flex-end; justify-content: center; gap: clamp(1rem,4vw,3rem); overflow: hidden; border: 1px solid #cfe1f3; border-radius: 1.75rem; background: radial-gradient(circle at 18% 20%,rgba(120,239,195,.6),transparent 23%),radial-gradient(circle at 85% 78%,rgba(255,217,92,.58),transparent 24%),linear-gradient(135deg,#eef7ff,#fff2ef); padding: 3rem 2rem 0; }
.ios-delete-device { position: relative; flex: 0 0 auto; border: 7px solid #111827; background: #111827; box-shadow: 0 28px 55px rgba(15,23,42,.2); }
.ios-delete-ipad { width: min(52%,22rem); aspect-ratio: 4 / 5; border-radius: 2rem; transform: rotate(-2deg) translateY(.35rem); }
.ios-delete-iphone { z-index: 2; width: min(29%,11.5rem); aspect-ratio: 1179 / 2556; border-radius: 2.4rem; transform: rotate(3deg); }
.ios-delete-screen { display: grid; height: 100%; grid-template-columns: repeat(3,minmax(0,1fr)); align-content: start; border-radius: inherit; background: linear-gradient(160deg,#d9efff,#f8fbff 54%,#e8f7f1); }
.ios-delete-ipad .ios-delete-screen { gap: 1rem .7rem; padding: 3rem 1rem 1rem; }
.ios-delete-iphone .ios-delete-screen { gap: .72rem .48rem; padding: 2.55rem .7rem .8rem; }
.ios-delete-screen > span:not(.ios-delete-app) { display: block; aspect-ratio: 1; border-radius: 22%; background: rgba(255,255,255,.72); box-shadow: 0 5px 14px rgba(71,85,105,.08); }
.ios-delete-app { display: grid; min-width: 0; justify-items: center; align-content: start; gap: .3rem; color: #334155; font-size: .55rem; line-height: 1.1; text-align: center; }
.ios-delete-app img { display: block; width: 100%; aspect-ratio: 1; border-radius: 23%; box-shadow: 0 5px 14px rgba(15,23,42,.14); }
.ios-delete-app b { font-weight: 800; }
.ios-delete-iphone .ios-delete-app { gap: .2rem; font-size: .48rem; }
.ios-delete-island { position: absolute; z-index: 3; top: .65rem; left: 50%; width: 34%; height: .65rem; border-radius: 999px; background: #111827; transform: translateX(-50%); }
.ios-delete-camera { position: absolute; z-index: 3; top: .75rem; left: 50%; width: .38rem; height: .38rem; border-radius: 999px; background: #526175; transform: translateX(-50%); }
.ios-delete-menu { position: absolute; z-index: 4; right: 4%; bottom: 7%; display: grid; width: min(15rem,42%); overflow: hidden; border: 1px solid rgba(255,255,255,.8); border-radius: 1.25rem; background: rgba(255,255,255,.9); box-shadow: 0 22px 45px rgba(15,23,42,.18); backdrop-filter: blur(12px); transform: rotate(-3deg); }
.ios-delete-menu span,.ios-delete-menu strong { display: flex; align-items: center; gap: .65rem; padding: .9rem 1rem; }
.ios-delete-menu strong { border-top: 1px solid #e2e8f0; color: #e5484d; }
.ios-delete-menu svg { width: 1.05rem; height: 1.05rem; }
.ios-delete-illustration figcaption { margin-top: .8rem; color: #64748b; font-size: .82rem; line-height: 1.6; text-align: center; }
@media (max-width: 640px) { .ios-delete-art { min-height: 21rem; padding-inline: .75rem; } .ios-delete-ipad { width: 62%; } .ios-delete-iphone { width: 37%; } .ios-delete-menu { right: 3%; bottom: 5%; width: 55%; } .ios-delete-menu span,.ios-delete-menu strong { padding: .7rem; font-size: .72rem; } }
.help-callout { display: flex; align-items: flex-start; gap: 1rem; margin-top: 2.25rem; border-radius: 1.25rem; background: #e8f4ff; padding: 1.25rem; color: #115bb7; }
.help-callout > span { display: grid; width: 2.5rem; height: 2.5rem; flex: 0 0 2.5rem; place-items: center; border-radius: .8rem; background: #fff; font-size: 1.2rem; }
.help-callout strong { color: #0f172a; }
.help-callout p { margin-top: .25rem; font-size: .93rem; line-height: 1.6; }
.help-callout-coral { background: #fff0ed; color: #d7473b; }
.help-callout-sun { background: #fff8d8; color: #9a6700; }
.help-media { margin: 2.5rem 0 0; }
.help-media figcaption { margin-top: .75rem; color: #84908d; font-size: .82rem; line-height: 1.55; text-align: center; }
.help-video-frame, .help-image-frame { position: relative; min-height: 21rem; overflow: hidden; border: 1px solid #dce7e4; border-radius: 1.5rem; background: #f5f8f7; }
.help-video-frame { display: grid; place-items: center; background: radial-gradient(circle at 70% 30%, rgba(255, 113, 99, .45), transparent 25%), radial-gradient(circle at 25% 75%, rgba(120, 239, 195, .6), transparent 28%), linear-gradient(135deg, #e8f4ff, #f6f2ff); }
.help-play-button { display: grid; width: 5rem; height: 5rem; place-items: center; border-radius: 999px; background: #fff; color: #1473e6; font-size: 1.35rem; box-shadow: 0 18px 40px rgba(15, 23, 42, .14); text-indent: .2rem; }
.help-media-label { position: absolute; left: 1rem; bottom: 1rem; border-radius: 999px; background: rgba(15, 23, 42, .78); padding: .45rem .75rem; color: #fff; font-size: .7rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.help-image-frame { padding: 1rem; background: linear-gradient(135deg, #eef7ff, #fff8ed); }
.help-image-toolbar { display: flex; gap: .35rem; padding: .4rem .4rem .8rem; }
.help-image-toolbar span { width: .65rem; height: .65rem; border-radius: 999px; background: #ff7163; }
.help-image-toolbar span:nth-child(2) { background: #ffd95c; }
.help-image-toolbar span:nth-child(3) { background: #78efc3; }
.help-image-mockup { display: grid; min-height: 16.5rem; grid-template-columns: 25% 1fr; overflow: hidden; border-radius: 1rem; background: #fff; box-shadow: 0 15px 35px rgba(15, 23, 42, .1); }
.help-image-sidebar { background: #173f3a; }
.help-image-content { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; padding: 1.25rem; }
.help-image-content span { border-radius: .9rem; background: #e8f4ff; }
.help-image-content span:nth-child(2) { background: #fff0ed; }
.help-image-content span:nth-child(3) { background: #fff8d8; }
.help-image-content span:nth-child(4) { background: #e8f7f1; }
.classic-help-screenshot-stage { position: relative; display: grid; min-height: 24rem; place-items: center; overflow: hidden; border: 1px solid #d7e4ef; border-radius: 1.65rem; background-color: #d9efff; background-image: linear-gradient(rgba(228,245,255,.3),rgba(228,245,255,.3)),url('../images/macOS/wallpaper.jpg'); background-position: center; background-size: cover; padding: clamp(1.25rem,4vw,3.25rem); isolation: isolate; }
.classic-help-screenshot-stage::after { position: absolute; inset: 0; z-index: 0; background: linear-gradient(135deg,rgba(255,255,255,.36),transparent 48%,rgba(109,72,168,.12)); content: ''; }
.classic-help-screenshot-stage img { position: relative; z-index: 2; display: block; width: 100%; height: auto; filter: drop-shadow(0 24px 35px rgba(15,23,42,.24)); }
.classic-help-screenshot-shape { position: absolute; z-index: 1; border-radius: 999px; opacity: .8; }
.classic-help-screenshot-shape-one { top: -3rem; right: -2rem; width: 10rem; height: 10rem; border: 1.8rem solid rgba(255,217,92,.62); }
.classic-help-screenshot-shape-two { bottom: -4rem; left: -2rem; width: 11rem; height: 11rem; background: rgba(120,239,195,.42); }
.classic-help-screenshot-compact .classic-help-screenshot-stage { min-height: 20rem; }
@media (max-width: 640px) { .classic-help-screenshot-stage { min-height: 15rem; border-radius: 1.25rem; padding: .85rem; } .classic-help-screenshot-shape { transform: scale(.7); } }
.report-promise { display: grid; gap: .75rem; margin-top: 2rem; grid-template-columns: repeat(3, 1fr); }
.report-promise > div { display: grid; border-radius: 1.1rem; background: #f8fafc; padding: 1rem; }
.report-promise span { font-size: 1.25rem; color: #1473e6; }
.report-promise strong { margin-top: .55rem; color: #0f172a; font-size: .88rem; }
.report-promise small { margin-top: .2rem; color: #64748b; font-size: .72rem; line-height: 1.45; }
.report-form { margin-top: 2.5rem; }
.report-section { margin: 0; border: 0; border-top: 1px solid #e2e8f0; padding: 2.5rem 0 0; }
.report-section + .report-section, .report-section + .report-dynamic, .report-dynamic + .report-section, .report-dynamic + .report-dynamic { margin-top: 2.5rem; }
.report-section legend { display: flex; align-items: center; gap: .75rem; color: #0f172a; font-size: 1.25rem; font-weight: 900; }
.report-section legend span { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: .7rem; background: #1473e6; color: #fff; font-size: .8rem; }
.report-help { margin-top: .6rem !important; color: #64748b !important; font-size: .82rem; }
.report-type-grid { display: grid; gap: .75rem; margin-top: 1.4rem; grid-template-columns: repeat(3, 1fr); }
.report-type-grid label { cursor: pointer; }
.report-type-grid input { position: absolute; opacity: 0; pointer-events: none; }
.report-type-grid label > span { display: flex; min-height: 10rem; flex-direction: column; border: 2px solid #e2e8f0; border-radius: 1.25rem; background: #fff; padding: 1.15rem; transition: border-color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease; }
.report-type-grid label:hover > span { transform: translateY(-2px); border-color: #93c5fd; box-shadow: 0 12px 25px rgba(15, 23, 42, .06); }
.report-type-grid input:checked + span { border-color: #268cff; background: #eef7ff; box-shadow: 0 12px 25px rgba(38, 140, 255, .1); }
.report-type-grid input:focus-visible + span { outline: 3px solid rgba(38, 140, 255, .3); outline-offset: 3px; }
.report-type-grid b { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border-radius: .8rem; background: #eef7ff; color: #1473e6; font-style: normal; }
.report-type-grid strong { margin-top: .8rem; color: #0f172a; font-size: .9rem; }
.report-type-grid small { margin-top: .3rem; color: #64748b; font-size: .72rem; line-height: 1.45; }
.report-section-accent { border: 0; border-radius: 1.5rem; background: linear-gradient(135deg, #f8fbff, #fff8ed); padding: 1.5rem; }
.report-fields { display: grid; gap: 1rem; margin-top: 1.3rem; }
.report-fields.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.report-fields label > span, .report-section > label:not(.report-upload):not(.report-consent) > span { display: block; margin-bottom: .45rem; color: #334155; font-size: .8rem; font-weight: 800; }
.report-form label > span small { color: #94a3b8; font-weight: 600; }
.report-form input[type="text"], .report-form input[type="email"], .report-form input[type="datetime-local"], .report-form select, .report-form textarea { width: 100%; border: 1px solid #dbe4e2; border-radius: .9rem; background: #fff; padding: .85rem 1rem; color: #0f172a; font: inherit; font-size: .9rem; outline: none; transition: border-color .2s ease, box-shadow .2s ease; }
.report-form textarea { resize: vertical; }
.report-form input:focus, .report-form select:focus, .report-form textarea:focus { border-color: #268cff; box-shadow: 0 0 0 3px rgba(38, 140, 255, .12); }
.report-section > label { display: block; margin-top: 1.25rem; }
.report-upload-grid { display: grid; gap: 1rem; margin-top: 1.35rem; grid-template-columns: repeat(2, 1fr); }
.report-upload { position: relative; display: flex; min-height: 13rem; cursor: pointer; flex-direction: column; align-items: center; justify-content: center; border: 2px dashed #93c5fd; border-radius: 1.25rem; background: #eef7ff; padding: 1.25rem; text-align: center; transition: transform .2s ease, border-color .2s ease; }
.report-upload:hover { transform: translateY(-2px); border-color: #268cff; }
.report-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.report-upload-icon { display: grid; width: 3rem; height: 3rem; place-items: center; border-radius: 1rem; background: #fff; color: #1473e6; font-size: 1.25rem; box-shadow: 0 8px 20px rgba(15,23,42,.07); }
.report-upload strong { margin-top: .8rem; color: #0f172a; }
.report-upload em { margin-left: .3rem; border-radius: 999px; background: #1473e6; padding: .2rem .4rem; color: #fff; font-size: .55rem; font-style: normal; letter-spacing: .05em; text-transform: uppercase; }
.report-upload small { margin-top: .25rem; color: #64748b; font-size: .7rem; }
.report-upload output { margin-top: .7rem; color: #1473e6; font-size: .72rem; font-weight: 800; }
.report-upload-video { border-color: #fdba74; background: #fff8ed; }
.report-upload-video .report-upload-icon { color: #d7473b; }
.report-upload-video em { background: #ff7163; }
.report-upload-video output { color: #d7473b; }
.report-consent { display: flex !important; align-items: center; gap: .65rem; margin-top: 1.2rem; }
.report-consent input { width: 1.1rem; height: 1.1rem; accent-color: #1473e6; }
.report-consent span { margin: 0 !important; }
.report-submit { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 2.5rem; border-radius: 1.5rem; background: #0f172a; padding: 1.5rem; color: #fff; }
.report-submit strong { font-size: 1.1rem; }
.report-submit p { margin: .25rem 0 0; color: #cbd5e1; font-size: .8rem; }
.report-submit button { flex: 0 0 auto; border: 0; border-radius: 999px; background: #78efc3; padding: .9rem 1.25rem; color: #0f172a; font: inherit; font-weight: 900; transition: transform .2s ease, background .2s ease; }
.report-submit button:hover { transform: translateY(-2px); background: #fff; }
.report-submit button:disabled { cursor: wait; opacity: .65; transform: none; }
.report-form-status { min-height: 1.2em; color: #fff !important; font-weight: 700; }
.cf-turnstile { margin-top: 1rem; }
.report-modal-open { overflow: hidden; }
.report-success-modal { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 1.25rem; }
.report-success-modal[hidden] { display: none; }
.report-success-backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, .56); backdrop-filter: blur(8px); }
.report-success-dialog { position: relative; width: min(100%, 34rem); overflow: hidden; border: 1px solid #c7ddff; border-radius: 2rem; background: #fff; padding: clamp(2rem, 5vw, 3rem); box-shadow: 0 30px 90px rgba(15, 23, 42, .28); text-align: center; }
.report-success-dialog::before { content: ''; position: absolute; width: 12rem; height: 12rem; right: -5rem; top: -6rem; border-radius: 999px; background: #d9fff0; }
.report-success-icon { position: relative; display: grid; place-items: center; width: 4.25rem; height: 4.25rem; margin: 0 auto 1.25rem; border-radius: 1.35rem; background: #1677ed; box-shadow: .55rem .55rem 0 #ffe088; color: #fff; font-size: 2rem; font-weight: 900; transform: rotate(-4deg); }
.report-success-kicker { position: relative; margin: 0 0 .5rem !important; color: #087b61 !important; font-size: .75rem !important; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.report-success-dialog h2 { position: relative; margin: 0; color: #071026; font-size: clamp(1.75rem, 4vw, 2.35rem); line-height: 1.05; }
.report-success-dialog > p:not(.report-success-kicker) { position: relative; margin: 1rem auto 0; max-width: 27rem; color: #52637c; line-height: 1.65; }
.report-success-reference { position: relative; display: grid; gap: .35rem; margin: 1.5rem 0; border-radius: 1rem; background: #f2f7fd; padding: 1rem; }
.report-success-reference span { color: #63748e; font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.report-success-reference strong { overflow-wrap: anywhere; color: #17233a; font-size: .9rem; }
.report-success-dialog button { position: relative; border: 0; border-radius: 999px; background: #071026; padding: .9rem 2rem; color: #fff; font: inherit; font-weight: 900; cursor: pointer; }
.report-success-dialog button:hover { background: #1677ed; }
.report-setup-note { margin-top: 1rem !important; border-radius: .8rem; background: #fff8d8; padding: .75rem; color: #7c5b00 !important; font-size: .75rem; text-align: center; }
@media (min-width: 768px) and (max-width: 1100px) {
  .feature-deck { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ios-story-layout { grid-template-columns: minmax(20rem, 1fr) minmax(18rem, .8fr); gap: 3rem; }
  .ios-story-phone { width: min(68%, 20rem); }
  .mac-story-layout { grid-template-columns: minmax(29rem,1fr) minmax(0,1.08fr); gap: 2rem; }
  .mac-story-device { width: 72vw; transform: translateX(0); }
}
@media (max-width: 767px) {
  .site-nav { display: none; position: absolute; top: 72px; left: 1rem; right: 1rem; flex-direction: column; align-items: stretch; padding: 1rem; border: 1px solid #e2e8f0; border-radius: 1.25rem; background: white; box-shadow: 0 18px 50px rgba(15,23,42,.12); }
  .site-nav.is-open { display: flex; }
  .site-nav a { padding: .65rem .8rem; }
  .device-stage { min-height: 35rem; }
  .mac-device { left: -9%; top: 13rem; width: 108%; }
  .phone-shell { width: 52%; border-width: 7px; border-radius: 2.35rem; }
  .phone-island { top: .4rem; height: .75rem; }
  .ios-story { padding: 5rem 0 2rem; }
  .ios-story-intro { text-align: left; }
  .ios-story-intro h2 { margin-left: 0; font-size: 3rem; }
  .ios-story-intro > p:last-child { margin-left: 0; }
  .ios-story-layout { display: block; margin-top: 3rem; }
  .ios-story-visual { display: none; }
  .ios-story-steps { padding: 0; }
  .ios-story-step { min-height: auto; padding: 1.25rem 0 5rem; opacity: 1; transform: none; }
  .ios-story-mobile { display: block; width: min(76vw, 19rem); aspect-ratio: 1179 / 2556; overflow: hidden; margin: 0 auto 2.5rem; border: 7px solid #0f172a; border-radius: 2.75rem; background: #f2f2f7; box-shadow: 0 28px 65px rgba(15,23,42,.18); }
  .ios-story-mobile img { width: 100%; height: 100%; object-fit: cover; }
  .ios-story-step h3 { max-width: 11ch; font-size: 2.55rem; }
  .mac-story { padding: 5.5rem 0 2rem; }
  .mac-story-intro { text-align: left; }
  .mac-story-intro h2 { margin-left: 0; font-size: 3rem; }
  .mac-story-intro > p:last-child { margin-left: 0; }
  .mac-story-layout { display: block; margin-top: 3rem; }
  .mac-story-visual { display: none; }
  .mac-story-steps { padding: 0 1.25rem; }
  .mac-story-step { min-height: auto; padding: 1rem 0 5.5rem; opacity: 1; transform: none; }
  .mac-story-mobile { position: relative; display: block; width: calc(100vw - 2.5rem); aspect-ratio: 16 / 10; overflow: hidden; margin: 0 auto 2.5rem; border: 6px solid #101827; border-radius: 1.35rem; background-image: var(--mac-shot), url('../images/macOS/wallpaper.jpg'); background-position: center, center; background-repeat: no-repeat; background-size: 88% auto, cover; box-shadow: 0 25px 60px rgba(0,0,0,.32); }
  .mac-story-step h3 { max-width: 11ch; font-size: 2.55rem; }
  .help-article-hero { min-height: 25rem; align-items: flex-start; padding: 2.5rem 1.5rem; }
  .help-article-hero h1 { max-width: 11ch; font-size: 2.6rem; }
  .help-article-description { max-width: 24rem; font-size: 1rem; }
  .help-hero-art { transform: translateY(6rem) scale(.78); transform-origin: right bottom; }
  .help-video-frame, .help-image-frame { min-height: 16rem; }
  .help-image-mockup { min-height: 12rem; }
  .feature-filter { display: flex; width: 100%; overflow-x: auto; border-radius: 1.2rem; scrollbar-width: none; }
  .feature-filter::-webkit-scrollbar { display: none; }
  .feature-filter-pill { flex: 0 0 auto; }
  .feature-deck { grid-template-columns: 1fr; }
  .feature-card { min-height: 15rem; }
  .feature-card h3 { font-size: 1.45rem; }
  .report-promise, .report-type-grid, .report-fields.two-columns, .report-upload-grid { grid-template-columns: 1fr; }
  .report-promise { grid-template-columns: repeat(3, 1fr); }
  .report-promise > div { padding: .7rem; }
  .report-promise small { display: none; }
  .report-type-grid label > span { min-height: auto; }
  .report-submit { align-items: stretch; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto !important; } *, *::before, *::after { transition-duration: .01ms !important; } }
