:root {
    --ink:#173b44;
    --muted:#547078;
    --accent:#006d80;
    --line:#dfe9eb;
    --wash:#f1f8f9;
    --paper:#fbfaf6;
    font-family:"Inter","PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
    color:var(--ink);
    line-height:1.65;
    background:var(--paper);
    font-synthesis:none;
}

* {
    box-sizing:border-box;
}

body {
    margin:0;
}

a {
    color:var(--accent);
    text-decoration:none;
}

a:hover {
    text-decoration:underline;
}

button,input {
    font:inherit;
}

img {
    max-width:100%;
    height:auto;
}

button,a,input,summary {
    touch-action:manipulation;
}

:focus-visible {
    outline:3px solid #279aac;
    outline-offset:4px;
}

html {
    scroll-padding-top:102px;
}

.wrap {
    max-width:1200px;
    padding:0 32px;
    margin:auto;
}

.skip-link {
    position:fixed;
    top:-80px;
    left:20px;
    z-index:100;
    background:#fff;
    padding:12px;
}

.skip-link:focus {
    top:12px;
}

.site-header {
    position:sticky;
    top:0;
    z-index:20;
    background:rgba(251,250,246,.9);
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(16px);
}

.header-inner {
    min-height:78px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

.brand {
    display:flex;
    align-items:center;
    gap:11px;
    color:var(--ink);
    font-weight:700;
    white-space:nowrap;
    font-size:17px;
    line-height:1.12;
}

.brand img {
    width:36px;
    height:36px;
    border-radius:9px;
}

.brand-mark {
    display:block;
    object-fit:cover;
}

.brand-name {
    font-size:17px;
    font-weight:750;
    line-height:1.12;
}

.brand small {
    font-size:9px;
    letter-spacing:1.65px;
    font-weight:650;
    color:var(--muted);
    display:block;
    line-height:1.1;
}

.top-nav {
    display:flex;
    align-items:center;
    gap:28px;
    font-size:14px;
}

.top-nav a {
    color:var(--muted);
    transition:color 160ms ease;
}

.top-nav a:hover {
    color:var(--accent);
    text-decoration:none;
}

.top-nav a[aria-current] {
    color:var(--accent);
    font-weight:700;
}

.top-nav svg {
    width:13px;
    height:13px;
    vertical-align:middle;
}

.nav-toggle,
.mobile-nav {
    display:none;
}

.eyebrow {
    font-size:12px;
    letter-spacing:2px;
    font-weight:600;
    color:var(--accent);
    margin:0 0 20px;
}

.landing-hero {
    padding:84px 0 0;
    background:linear-gradient(135deg,#f7fbfc,#edf7f8);
    overflow:hidden;
}

.hero-layout {
    display:grid;
    grid-template-columns:1.12fr 1fr;
    gap:68px;
    align-items:center;
}

.hero-copy {
    padding-bottom:74px;
}

h1,h2,h3 {
    line-height:1.35;
    letter-spacing:0;
}

h1 {
    font-size:52px;
    margin:0 0 24px;
    font-weight:750;
}

.hero-copy h1 span {
    color:var(--accent);
}

.intro {
    font-size:17px;
    color:var(--muted);
    max-width:540px;
    margin-bottom:28px;
}

.actions {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:14px;
}

.button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:15px;
    min-height:46px;
    padding:10px 19px;
    border:1px solid var(--line);
    border-radius:7px;
    font-size:13px;
    font-weight:650;
    background:white;
    color:var(--accent);
    cursor:pointer;
    transition:background 160ms ease,color 160ms ease,border-color 160ms ease;
}

.button.primary {
    color:#fff;
    background:var(--accent);
    border-color:var(--accent);
}

.button:hover {
    text-decoration:none;
    filter:brightness(.97);
}

.small-note {
    font-size:12px;
    color:var(--muted);
    margin:18px 0 0;
}

.hero-art {
    position:relative;
    text-align:center;
    align-self:end;
    padding:32px 24px 0;
    background:#e0f0f2;
    border-radius:160px 160px 0 0;
    height:540px;
    overflow:hidden;
}

.hero-art img {
    width:264px;
    border:7px solid #fff;
    border-radius:30px;
    box-shadow:0 18px 60px #173b4420;
}

.hero-art .art-label {
    font-size:12px;
    display:block;
    letter-spacing:3px;
    margin-bottom:20px;
}

.section {
    padding:88px 0;
}

.section-head {
    margin-bottom:36px;
}

.section-head h2 {
    font-size:32px;
    margin:0 0 14px;
}

.section-head p {
    color:var(--muted);
    margin:0;
}

.feature-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}

.feature {
    padding:28px;
    border:1px solid var(--line);
    border-radius:12px;
}

.feature .feature-number {
    color:var(--accent);
    font-size:12px;
    letter-spacing:2px;
}

.feature h3 {
    font-size:19px;
    margin:22px 0 12px;
}

.feature p {
    font-size:14px;
    color:var(--muted);
    margin:0;
}

.tint {
    background:var(--wash);
}

.screens {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:40px;
    max-width:940px;
    margin:auto;
}

.screens figure {
    margin:0;
    text-align:center;
}

.screens img {
    width:248px;
    display:block;
    margin:auto;
    border:6px solid white;
    border-radius:24px;
    box-shadow:0 12px 35px #173b4410;
}

.screens figcaption {
    font-size:14px;
    margin-top:22px;
}

.screens figcaption span {
    display:block;
    font-size:12px;
    color:var(--muted);
}

.flow {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:35px;
    counter-reset:steps;
    list-style:none;
    padding:0;
    margin:35px 0;
}

.flow li {
    counter-increment:steps;
    padding-left:48px;
    position:relative;
}

.flow li::before {
    content:counter(steps,decimal-leading-zero);
    position:absolute;
    left:0;
    top:0;
    color:var(--accent);
    font-size:20px;
    font-weight:600;
}

.flow h3 {
    font-size:18px;
    margin:0 0 10px;
}

.flow p {
    font-size:14px;
    margin:0;
    color:var(--muted);
}

.support-box {
    border:1px solid var(--line);
    border-radius:14px;
    padding:30px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    margin-top:50px;
}

.support-box h3 {
    margin:0 0 8px;
}

.support-box p {
    margin:0;
    color:var(--muted);
    font-size:14px;
}

.site-footer {
    padding:49px 0 21px;
    font-size:10px;
    color:#c5d7d3;
    background:#102d3d;
}

.site-footer .brand {
    color:#fff;
}

.site-footer .brand small {
    color:#a8c1bd;
}

.footer-main {
    display:grid;
    grid-template-columns:1fr 1.25fr;
    align-items:start;
    gap:50px;
    padding-bottom:43px;
}

.footer-brand > p {
    margin-top:16px;
    color:#9cb8b4;
    font-size:12px;
}

.footer-links {
    display:flex;
    justify-content:flex-end;
    gap:12px 24px;
    flex-wrap:wrap;
    padding-top:8px;
    font-size:12px;
}

.footer-links a {
    color:#d2e3df;
}

.footer-links a:hover {
    color:#fff;
    text-decoration:none;
}

.footer-bottom {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px;
    padding-top:16px;
    border-top:1px solid rgba(207,228,223,.17);
    color:#8fa9a5;
    font-size:10px;
}

.records a {
    color:#8fa9a5;
    margin-right:0;
}

.records a:hover {
    color:#fff;
    text-decoration:none;
}

.records img {
    width:16px;
    vertical-align:middle;
    margin-right:4px;
}

.docs-layout {
    display:grid;
    grid-template-columns:238px minmax(0,1fr);
    gap:60px;
    align-items:start;
}

.docs-sidebar {
    position:sticky;
    top:105px;
    max-height:calc(100vh - 125px);
    overflow:auto;
    padding:30px 20px 32px 0;
    border-right:1px solid var(--line);
}

.sidebar-label {
    font-size:11px;
    letter-spacing:1.5px;
    color:var(--muted);
    margin:0 0 14px;
}

.docs-sidebar nav {
    display:grid;
    gap:5px;
}

.docs-sidebar a {
    display:block;
    padding:9px 12px;
    border-radius:6px;
    font-size:14px;
    color:var(--muted);
}

.docs-sidebar a:hover {
    background:var(--wash);
    text-decoration:none;
}

.docs-sidebar a[aria-current] {
    background:#e6f3f5;
    color:var(--accent);
    font-weight:600;
}

.nav-group {
    font-size:11px;
    letter-spacing:1px;
    color:var(--muted);
    margin:24px 12px 6px;
}

.docs-main {
    min-width:0;
    max-width:760px;
    padding:46px 0 70px;
}

.breadcrumb {
    font-size:12px;
    color:var(--muted);
    margin:0 0 22px;
}

.docs-main h1 {
    font-size:36px;
    margin-bottom:16px;
}

.docs-main .lead {
    color:var(--muted);
    font-size:16px;
    margin-bottom:28px;
}

.docs-main h2 {
    font-size:24px;
    margin:40px 0 18px;
    padding-top:10px;
}

.docs-main h3 {
    font-size:17px;
    margin:24px 0 12px;
}

.docs-main p,.docs-main li {
    font-size:15px;
}

.docs-main li {
    margin:8px 0;
}

.docs-main ol,.docs-main ul {
    padding-left:24px;
}

.docs-main section {
    scroll-margin-top:108px;
}

.notice {
    background:var(--wash);
    border-left:3px solid #3a9aaa;
    padding:16px 20px;
    font-size:14px;
    margin:24px 0;
    border-radius:0 8px 8px 0;
}

.notice p {
    font-size:14px;
    margin:0;
}

.quick-links {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin:24px 0;
}

.quick-links a {
    padding:18px 20px;
    border:1px solid var(--line);
    border-radius:8px;
    font-size:14px;
}

.quick-links a span {
    display:block;
    color:var(--muted);
    font-size:12px;
    margin-top:6px;
}

.table-wrap {
    overflow:auto;
}

table {
    width:100%;
    border-collapse:collapse;
    margin:24px 0;
    font-size:14px;
    text-align:left;
}

th,td {
    border-bottom:1px solid var(--line);
    padding:14px 12px;
    vertical-align:top;
}

th {
    background:var(--wash);
    font-weight:600;
}

.search {
    margin-top:24px;
    padding-bottom:24px;
    border-bottom:1px solid var(--line);
}

.search label {
    display:block;
    font-size:13px;
    margin-bottom:8px;
}

.search input {
    width:100%;
    padding:11px 14px;
    border:1px solid #a9c3c9;
    border-radius:7px;
    background:white;
    color:var(--ink);
    font-size:14px;
}

.search-count {
    font-size:12px;
    color:var(--muted);
    min-height:22px;
    margin:8px 0 0;
}

.search-results {
    display:grid;
    gap:8px;
    margin-top:8px;
}

.search-results a {
    padding:12px 14px;
    background:var(--wash);
    border-radius:6px;
}

.search-results small {
    display:block;
    color:var(--muted);
    font-size:12px;
}

.docs-main details {
    border-bottom:1px solid var(--line);
    padding:18px 0;
}

.docs-main summary {
    font-size:15px;
    font-weight:600;
    cursor:pointer;
}

.docs-main details p {
    color:var(--muted);
    margin-bottom:0;
}

.legal-meta {
    font-size:12px;
    color:var(--muted);
    padding-bottom:22px;
    border-bottom:1px solid var(--line);
}

.legal-body p {
    white-space:pre-line;
    overflow-wrap:anywhere;
    line-height:2;
}

.legal-toc {
    padding:18px 22px;
    background:var(--wash);
    border-radius:8px;
    display:flex;
    gap:8px 20px;
    flex-wrap:wrap;
    margin:24px 0;
}

.legal-toc a {
    font-size:12px;
}

.doc-bottom {
    border-top:1px solid var(--line);
    padding-top:22px;
    margin-top:40px;
    font-size:14px;
    display:flex;
    justify-content:space-between;
    gap:20px;
}

.mobile-contents {
    display:none;
}

.doc-image {
    display:block;
    width:220px;
    border:1px solid var(--line);
    border-radius:16px;
    margin:24px auto;
}

.print-only {
    display:none;
}

@media(min-width:1600px) {
    .hero-art {
        height:580px;
    }
}

@media(max-width:900px) {
    .hero-layout {
        gap:24px;
    }
    h1 {
        font-size:40px;
    }
    .hero-art {
        height:470px;
    }
    .hero-art img {
        width:228px;
    }
    .docs-layout {
        grid-template-columns:195px minmax(0,1fr);
        gap:30px;
    }
    .feature-grid {
        gap:14px;
    }
    .feature {
        padding:22px;
    }
    .top-nav {
        display:none;
    }

    .nav-toggle {
        display:grid;
        place-items:center;
        width:38px;
        height:38px;
        margin-left:auto;
        padding:0;
        color:var(--ink);
        background:transparent;
        border:1px solid var(--line);
        border-radius:7px;
        cursor:pointer;
    }

    .nav-toggle svg {
        width:19px;
        height:19px;
    }

    .mobile-nav {
        display:none;
        position:absolute;
        top:100%;
        right:0;
        left:0;
        flex-direction:column;
        gap:3px;
        padding:10px 24px 22px;
        background:var(--paper);
        border-bottom:1px solid var(--line);
        box-shadow:0 15px 20px rgba(23,59,68,.05);
    }

    .mobile-nav.is-open {
        display:flex;
    }

    .mobile-nav a {
        display:flex;
        align-items:center;
        justify-content:space-between;
        min-height:45px;
        padding:0 11px;
        border-radius:6px;
        color:var(--ink);
        font-size:14px;
    }

    .mobile-nav a[aria-current] {
        color:var(--accent);
        background:var(--wash);
        font-weight:650;
    }

    .mobile-nav svg {
        width:15px;
        height:15px;
    }
}

@media(max-width:680px) {
    .wrap {
        padding:0 20px;
    }
    .header-inner {
        min-height:69px;
        gap:12px;
        flex-wrap:wrap;
    }
    .brand {
        font-size:17px;
    }
    .brand img {
        width:32px;
        height:32px;
    }
    .footer-main {
        grid-template-columns:1fr;
        gap:24px;
        padding-bottom:27px;
    }
    .footer-links {
        justify-content:flex-start;
        padding-top:0;
    }
    .footer-bottom {
        display:grid;
        gap:12px;
    }
    .landing-hero {
        padding-top:46px;
    }
    .hero-layout {
        grid-template-columns:1fr;
        gap:10px;
    }
    .hero-copy {
        padding-bottom:26px;
    }
    h1 {
        font-size:38px;
    }
    .intro {
        font-size:15px;
    }
    .hero-art {
        height:370px;
        width:100%;
        max-width:360px;
        margin:auto;
    }
    .hero-art img {
        width:224px;
    }
    .section {
        padding:56px 0;
    }
    .section-head h2 {
        font-size:27px;
    }
    .feature-grid {
        grid-template-columns:1fr;
    }
    .feature h3 {
        margin-top:12px;
    }
    .screens {
        gap:12px;
    }
    .screens img {
        border-width:3px;
        border-radius:12px;
    }
    .screens figcaption {
        font-size:12px;
    }
    .screens figcaption span {
        display:none;
    }
    .flow {
        grid-template-columns:1fr;
        gap:24px;
    }
    .support-box {
        flex-direction:column;
        align-items:flex-start;
        padding:24px;
    }
    .docs-layout {
        display:block;
    }
    .docs-sidebar {
        display:none;
    }
    .docs-main {
        padding-top:24px;
    }
    .docs-main h1 {
        font-size:30px;
    }
    .quick-links {
        grid-template-columns:1fr;
    }
    .mobile-contents {
        display:block;
        margin-top:22px;
        padding:12px 16px;
        border:1px solid var(--line);
        border-radius:8px;
        font-size:14px;
    }
    .mobile-contents summary {
        cursor:pointer;
        font-weight:600;
    }
    .mobile-contents nav {
        display:grid;
        gap:5px;
        padding-top:12px;
    }
    .mobile-contents a {
        padding:7px 0;
    }
    .records a {
        display:inline-block;
        margin-top:6px;
    }
    .docs-main section {
        scroll-margin-top:125px;
    }
    .legal-meta {
        line-height:2;
    }
}

@media(prefers-reduced-motion:reduce) {
    * {
        scroll-behavior:auto!important;
        transition:none!important;
    }
}

@media print {
    .site-header,.docs-sidebar,.site-footer,.mobile-contents,.search,.skip-link,.doc-bottom {
        display:none;
    }
    .docs-layout {
        display:block;
    }
    .docs-main {
        max-width:none;
        padding:0;
    }
    .wrap {
        max-width:none;
        padding:0;
    }
    body {
        color:#000;
    }
    .legal-body h2 {
        break-after:avoid;
    }
    .legal-body p {
        orphans:3;
        widows:3;
    }
    a {
        color:inherit;
    }
    h1 {
        font-size:28px;
    }
}