:root { color-scheme:dark; --ink:#f2f7f4; --muted:#a9b4b0; --line:#303938; --teal:#00fe7a; --teal-dark:#80f5b9; --mint:#102b21; --surface:#0c1115; --page-bg:#03070b; --card-bg:#171e23; }
    * { box-sizing:border-box; letter-spacing:0; }
    html { scroll-behavior:smooth; scroll-padding-top:96px; }
    body { margin:0; color:var(--ink); background:var(--page-bg); font-family:"Segoe UI",Arial,sans-serif; font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased; }
    button,select { font:inherit; }
    a { color:inherit; text-decoration:none; }
    button,a { -webkit-tap-highlight-color:transparent; }
    button { cursor:pointer; }
    img { max-width:100%; display:block; }
    h1,h2,h3,p { margin:0; }
    h1,h2,h3 { font-weight:650; }
    .wrap { width:calc(100% - 96px); max-width:1248px; margin-inline:auto; }
    .icon { width:20px; height:20px; flex:none; stroke-width:1.8; }
    .skip { position:fixed; left:16px; top:-80px; z-index:100; padding:12px 20px; background:var(--card-bg); }
    .skip:focus { top:12px; }
    :focus-visible { outline:3px solid var(--teal); outline-offset:4px; }
    .site-header { background:var(--page-bg); color:var(--ink); position:sticky; top:0; z-index:20; border-bottom:1px solid var(--line); }
    .header-inner { display:flex; align-items:center; justify-content:space-between; gap:30px; height:80px; }
    .brand { display:inline-flex; gap:12px; align-items:center; font-family:"JetBrains Mono","Cascadia Code",Consolas,monospace; font-size:24px; font-weight:650; white-space:nowrap; }
    .brand img { width:52px; height:52px; object-fit:contain; flex:none; border-radius:6px; }
    .nav { display:flex; gap:32px; margin-left:auto; margin-right:28px; font-size:14px; color:#cdd7d4; }
    .nav a:hover { color:white; }
    .button { min-height:48px; border-radius:6px; padding:12px 20px; display:inline-flex; align-items:center; justify-content:center; gap:10px; font-weight:600; font-size:14px; border:1px solid transparent; transition:background .16s,border-color .16s; text-align:center; }
    .button-primary { background:var(--teal); color:#03100a; }
    .button-primary:hover { background:#60ffa6; }
    .button-outline { border-color:var(--line); background:var(--card-bg); color:var(--ink); }
    .button-outline:hover { border-color:var(--teal); background:var(--mint); }
    .button-header { background:var(--card-bg); border-color:var(--line); color:var(--ink); min-height:42px; padding:9px 16px; }
    .button-header:hover { background:#26332d; border-color:var(--teal); }
    .hero { position:relative; min-height:336px; background:#344943; color:white; overflow:hidden; isolation:isolate; }
    .hero-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 48%; z-index:-2; }
    .hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(3,7,11,.96) 0%,rgba(3,7,11,.83) 31%,rgba(3,7,11,.26) 70%,rgba(3,7,11,.12) 100%); }
    .hero-inner { padding-block:38px 42px; }
    .eyebrow { font-size:12px; font-weight:650; text-transform:uppercase; display:flex; align-items:center; gap:10px; }
    .hero .eyebrow { color:#d1e8e1; }
    .eyebrow::before { content:""; display:block; width:22px; height:2px; background:currentColor; }
    h1 { font-family:"JetBrains Mono","Cascadia Code",Consolas,monospace; color:var(--teal); font-size:72px; line-height:1.1; margin:10px 0 12px; }
    .hero-lead { max-width:500px; font-size:18px; line-height:1.55; color:#f0f5f3; }
    .hero-actions { display:flex; align-items:center; gap:20px; margin-top:24px; }
    .hero-detail { color:#d4ded8; font-size:13px; margin-top:13px; }
    .hero-pricing-link { color:white; font-size:14px; display:inline-flex; align-items:center; gap:8px; font-weight:600; }
    .hero-pricing-link:hover { text-decoration:underline; text-underline-offset:4px; }
    .section { padding-block:48px; }
    .section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:25px; }
    .section-kicker { color:var(--teal); font-size:12px; font-weight:650; margin-bottom:5px; }
    h2 { font-size:30px; line-height:1.25; }
    .section-desc { font-size:14px; color:var(--muted); margin-top:9px; }
    .platforms { display:flex; padding:4px; background:var(--surface); border:1px solid var(--line); border-radius:6px; gap:3px; flex-shrink:0; }
    .platforms button { min-height:38px; min-width:90px; display:flex; align-items:center; justify-content:center; gap:7px; padding:7px 11px; border:1px solid transparent; background:transparent; border-radius:4px; color:var(--muted); font-size:13px; }
    .platforms .icon { width:16px; height:16px; }
    .platforms button[aria-selected="true"] { color:var(--teal); background:var(--mint); border-color:#2a5340; font-weight:600; }
    .app-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
    .app-card { border:1px solid var(--line); border-radius:8px; padding:24px; display:grid; grid-template-columns:60px 1fr; column-gap:18px; background:var(--card-bg); }
    .app-icon { width:60px; height:60px; object-fit:contain; border-radius:12px; }
    .app-icon.happ { padding:12px; background:#222; border-radius:12px; }
    .app-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
    .app-heading h3 { font-size:25px; line-height:1.25; }
    .app-platform { display:block; font-size:12px; color:var(--muted); margin-top:4px; }
    .app-body { grid-column:1/-1; }
    .app-description { color:var(--muted); font-size:14px; margin-top:18px; min-height:42px; max-width:470px; }
    .app-actions { display:flex; gap:16px; align-items:center; margin-top:20px; }
    .download-button { min-width:209px; }
    .text-link { color:var(--teal-dark); font-size:13px; font-weight:600; display:inline-flex; gap:6px; align-items:center; }
    .text-link .icon { width:16px; height:16px; }
    .text-link:hover { text-decoration:underline; text-underline-offset:4px; }
    .platform-note { color:var(--muted); font-size:12px; margin-top:16px; }
    .plans-section { background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
    .plans-section .section-head { margin-bottom:26px; }
    .plans-hint { color:var(--muted); font-size:13px; max-width:300px; text-align:right; }
    .plans-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
    .plan { background:var(--card-bg); border:1px solid var(--line); border-radius:8px; padding:28px; position:relative; }
    .plan-featured { border:1.5px solid var(--teal); }
    .plan-top { display:flex; justify-content:space-between; align-items:center; min-height:28px; gap:10px; }
    .plan-top h3 { font-size:22px; }
    .plan-price { display:flex; align-items:baseline; gap:9px; margin-top:20px; }
    .amount { font-size:48px; font-weight:650; line-height:1.1; }
    .currency { font-size:25px; font-weight:500; }
    .period { margin-left:3px; font-size:13px; color:var(--muted); }
    .plan-details { list-style:none; margin:21px 0 23px; padding:0; display:flex; gap:24px; flex-wrap:wrap; font-size:13px; }
    .plan-details li { display:flex; align-items:center; gap:8px; }
    .plan-details .icon { width:17px; height:17px; color:var(--teal); }
    .plan .button { width:100%; }
    .trial-section { background:#0c2118; border-block:1px solid #31523f; padding-block:34px; }
    .trial-inner { display:grid; grid-template-columns:155px minmax(0,1fr) auto; gap:34px; align-items:center; }
    .trial-duration { color:var(--teal); line-height:1; display:flex; align-items:baseline; gap:11px; }
    .trial-duration strong { font-size:76px; font-weight:600; }
    .trial-duration span { font-size:23px; }
    .trial-copy { border-left:1px solid #31523f; padding-left:34px; }
    .trial-copy .section-kicker { color:#a9d9bc; }
    .trial-copy h2 { font-size:26px; }
    .trial-copy p:last-child { margin-top:9px; font-size:14px; color:#b5c7bd; max-width:480px; }
    .trial-action { text-align:center; }
    .trial-action p { color:#b5c7bd; font-size:11px; margin-top:9px; }
    .guide-tabs { display:flex; gap:24px; border-bottom:1px solid var(--line); margin-top:8px; }
    .guide-tabs button { display:flex; align-items:center; justify-content:center; gap:8px; padding:12px 2px 14px; min-width:80px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); font-size:14px; }
    .guide-tabs img { width:22px; height:22px; border-radius:5px; object-fit:contain; }
    .guide-tabs .mini-happ { background:#222; padding:4px; }
    .guide-tabs button[aria-selected="true"] { color:var(--teal-dark); border-bottom-color:var(--teal); font-weight:650; }
    .steps { list-style:none; padding:0; margin:30px 0 0; display:grid; grid-template-columns:repeat(4,1fr); gap:30px; }
    .step-number { font-size:13px; font-weight:650; color:var(--teal); margin-bottom:15px; display:flex; align-items:center; gap:12px; }
    .step-number::after { content:""; height:1px; flex:1; background:var(--line); }
    .steps li:last-child .step-number::after { display:none; }
    .steps h3 { font-size:17px; line-height:1.4; margin-bottom:8px; }
    .steps p { font-size:13px; color:var(--muted); line-height:1.65; }
    .steps p a { color:var(--teal-dark); text-decoration:underline; text-underline-offset:3px; }
    .help-strip { margin-top:30px; border-top:1px solid var(--line); padding-top:20px; display:flex; justify-content:space-between; align-items:center; gap:20px; }
    .help-strip p { font-size:13px; color:var(--muted); }
    .help-strip strong { color:var(--ink); font-weight:600; }
    footer { background:var(--surface); border-top:1px solid var(--line); color:#b9c6c0; padding-block:28px; font-size:12px; }
    .footer-inner { display:flex; gap:24px; align-items:center; justify-content:space-between; }
    footer .brand { color:white; font-size:19px; gap:10px; }
    footer .brand img { width:40px; height:40px; }
    .footer-links { display:flex; gap:26px; }
    .footer-links a:hover { color:white; }
    [hidden] { display:none !important; }
    @media (min-width:1700px) { .wrap { max-width:1376px; } .hero { min-height:354px; } .hero-inner { padding-block:44px; } }
    @media (max-width:1000px) {
      .wrap { width:calc(100% - 48px); }
      .nav { display:none; }
      .header-inner { gap:24px; }
      .section-head { align-items:flex-start; flex-direction:column; gap:18px; }
      .plans-section .section-head { flex-direction:row; }
      .plans-grid { gap:16px; }
      .plan { padding:22px; }
      .plan-price { flex-wrap:wrap; }
      .period { flex-basis:100%; margin:2px 0 0; }
      .app-actions { gap:12px; flex-wrap:wrap; }
      .trial-inner { grid-template-columns:125px minmax(0,1fr); gap:24px; }
      .trial-copy { padding-left:24px; }
      .trial-action { grid-column:2; justify-self:start; text-align:left; padding-left:24px; }
      .steps { gap:24px; }
    }
    @media (max-width:700px) {
      html { scroll-padding-top:82px; }
      .wrap { width:calc(100% - 40px); }
      .header-inner { height:68px; gap:12px; }
      .brand { font-size:20px; gap:9px; }
      .brand img { width:40px; height:40px; }
      .nav { display:none; }
      .button-header { padding:9px 12px; font-size:12px; min-height:40px; gap:7px; }
      .button-header .icon { width:16px; height:16px; }
      .hero { min-height:306px; }
      .hero-inner { padding-block:29px 31px; }
      .hero-photo { object-position:60% center; }
      .hero::before { background:rgba(3,7,11,.79); }
      .hero .eyebrow { font-size:11px; }
      h1 { font-size:48px; margin:12px 0 14px; }
      .hero-lead { font-size:16px; max-width:380px; }
      .hero-actions { gap:14px; flex-wrap:wrap; margin-top:24px; }
      .hero-actions .button { padding-inline:16px; }
      .hero-detail { font-size:12px; }
      .hero-pricing-link { font-size:12px; }
      .section { padding-block:34px; }
      h2 { font-size:26px; }
      .section-head { margin-bottom:21px; gap:19px; }
      .section-desc { font-size:13px; max-width:340px; }
      .platforms { width:100%; gap:1px; }
      .platforms button { min-width:0; flex:1; padding:8px 5px; gap:5px; font-size:12px; }
      .platforms .icon { width:14px; height:14px; }
      .app-grid,.plans-grid { grid-template-columns:1fr; gap:16px; }
      .app-card { padding:20px; grid-template-columns:52px 1fr; column-gap:15px; }
      .app-icon { width:52px; height:52px; }
      .app-heading h3 { font-size:23px; }
      .app-description { font-size:13px; min-height:0; margin-top:17px; }
      .app-actions { margin-top:18px; gap:16px; }
      .download-button { min-width:0; flex:1; font-size:12px; padding-inline:12px; }
      .text-link { font-size:12px; }
      .platform-note { font-size:11px; }
      .plans-section .section-head { flex-direction:column; gap:10px; }
      .plans-hint { text-align:left; max-width:none; font-size:12px; }
      .plan { padding:22px; }
      .plan-top h3 { font-size:20px; }
      .amount { font-size:44px; }
      .plan-details { gap:16px; font-size:12px; }
      .trial-section { padding-block:28px; }
      .trial-inner { grid-template-columns:1fr; gap:19px; }
      .trial-duration strong { font-size:52px; }
      .trial-duration span { font-size:22px; }
      .trial-copy { border:0; padding:0; }
      .trial-copy h2 { font-size:24px; }
      .trial-copy p:last-child { font-size:13px; }
      .trial-action { grid-column:1; justify-self:stretch; padding:0; text-align:left; }
      .trial-action .button { width:100%; }
      .steps { grid-template-columns:1fr 1fr; gap:24px 20px; margin-top:24px; }
      .step-number { margin-bottom:10px; }
      .steps h3 { font-size:16px; }
      .steps p { font-size:12px; }
      .help-strip { flex-direction:column; align-items:flex-start; gap:13px; }
      .help-strip p { font-size:12px; }
      .footer-inner { flex-wrap:wrap; gap:18px; }
      .footer-links { margin-left:auto; gap:18px; }
      .copyright { width:100%; order:3; font-size:11px; }
    }
    @media (max-width:370px) {
      .wrap { width:calc(100% - 32px); }
      .brand { font-size:18px; }
      .button-header { padding:8px; font-size:11px; }
      .button-header .icon { display:none; }
      .platforms .icon { display:none; }
      .app-actions { gap:12px; }
    }
    @media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none !important; } }