/* Trackly's approved neutral website style, baseline 171715e (2026-10-21).
   Scope the page with .trackly-style. Brand/highlight tokens belong to the
   parent project and are intentionally neither declared nor overwritten. */
.trackly-style {
  --trackly-ink: #000000;
  --trackly-muted: #666666;
  --trackly-paper: #ffffff;
  --trackly-soft: #f5f6f7;
  --trackly-line: rgba(0, 0, 0, .1);
  --trackly-record-surface: #f2f2f7;
  --trackly-record-muted: #8e8e93;
  --trackly-record-outline: #d3d3d8;
  --trackly-max: 1160px;
  --trackly-reading-max: 720px;
  --trackly-gutter: 24px;
  --trackly-display: ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  --trackly-body: "Inter Tight", Inter, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  --trackly-reading: -apple-system, BlinkMacSystemFont, "PingFang TC", "PingFang SC", "Microsoft YaHei", sans-serif;
  margin: 0;
  background: var(--trackly-paper);
  color: var(--trackly-ink);
  color-scheme: light;
  font: 16px/1.75 var(--trackly-body);
  font-synthesis: none;
}
.trackly-style, .trackly-style * { box-sizing: border-box; }
.trackly-style :where(h1, h2, h3, p, figure) { margin: 0; }
.trackly-style img { display: block; max-width: 100%; height: auto; }
.trackly-style a { color: inherit; text-underline-offset: 5px; }
.trackly-style :is(button, summary) { font: inherit; }
.trackly-style :is(a, button, summary):focus-visible { outline: 2px solid var(--trackly-ink); outline-offset: 4px; }
.trackly-style :is(h1, h2, h3) { font-family: var(--trackly-display); }
.trackly-style h1 { font-size: clamp(36px, 4.1vw, 56px); line-height: 1.32; font-weight: 750; letter-spacing: -.045em; }
.trackly-style h2 { font-size: clamp(30px, 3.4vw, 44px); line-height: 1.36; font-weight: 720; letter-spacing: -.035em; }
.trackly-style h3 { font-size: 18px; line-height: 1.5; font-weight: 650; }
.trackly-style .trackly-wrap { width: min(calc(100% - 2 * var(--trackly-gutter)), var(--trackly-max)); margin-inline: auto; }
.trackly-style .trackly-header { display: grid; grid-template-columns: 48px 1fr 48px; min-height: 88px; align-items: center; gap: 24px; }
.trackly-style .trackly-header::after { content: ""; width: 48px; height: 48px; }
.trackly-style .trackly-brand { display: inline-flex; align-items: center; text-decoration: none; }
.trackly-style .trackly-brand img { width: 48px; height: 48px; }
.trackly-style .trackly-nav { display: flex; align-items: center; justify-content: center; gap: 32px; }
.trackly-style .trackly-nav a { color: var(--trackly-muted); font-size: 14px; text-decoration: none; white-space: nowrap; }
.trackly-style .trackly-nav a[aria-current="page"] { color: var(--trackly-ink); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 8px; }
.trackly-style .trackly-hero, .trackly-style .trackly-split, .trackly-style .trackly-setup { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 90px; }
.trackly-style .trackly-hero, .trackly-style .trackly-split, .trackly-style .trackly-setup, .trackly-style .trackly-finish, .trackly-style .trackly-faq { font-family: var(--trackly-display); }
.trackly-style .trackly-hero { min-height: 720px; padding-block: 34px 88px; }
.trackly-style .trackly-copy, .trackly-style .trackly-demo { min-width: 0; }
.trackly-style .trackly-demo { width: 100%; }
.trackly-style .trackly-lede { margin-top: 24px; max-width: 480px; font-size: 18px; line-height: 1.85; color: var(--trackly-muted); }
.trackly-style .trackly-prerequisites { margin-top: 22px; font-size: 12px; color: var(--trackly-muted); }
.trackly-style .trackly-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 26px; }
.trackly-style .trackly-text-link { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; }
.trackly-style .trackly-button { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; gap: 16px; padding: 10px 22px; border: 1px solid var(--trackly-ink); border-radius: 100px; background: var(--trackly-ink); color: var(--trackly-paper); font-size: 15px; font-weight: 600; line-height: 1.6; text-decoration: none; }
.trackly-style .trackly-badge { display: inline-flex; align-items: center; min-height: 54px; }
.trackly-style .trackly-badge img { width: auto; height: 54px; }
.trackly-style .trackly-section { padding-block: 88px; border-top: 1px solid var(--trackly-line); scroll-margin-top: 24px; }
.trackly-style .trackly-benefits { display: grid; gap: 15px; margin: 28px 0 0; padding: 0; list-style: none; font-size: 16px; }
.trackly-style .trackly-benefits li { display: flex; align-items: center; gap: 12px; }
.trackly-style .trackly-benefits li > span { display: grid; place-items: center; flex: 0 0 22px; height: 22px; border-radius: 50%; background: var(--trackly-soft); color: var(--trackly-ink); font-size: 12px; }
.trackly-style .trackly-note { margin-top: 32px; color: var(--trackly-muted); font-size: 13px; }
.trackly-style .trackly-setup { align-items: start; padding-block: 96px; border-top: 1px solid var(--trackly-line); scroll-margin-top: 24px; }
.trackly-style .trackly-checklist { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.trackly-style .trackly-checklist li { display: flex; gap: 17px; padding: 23px 24px; border-radius: 20px; background: var(--trackly-soft); }
.trackly-style .trackly-number { display: grid; place-items: center; flex: 0 0 26px; height: 26px; margin-top: 1px; border-radius: 50%; background: var(--trackly-paper); font-size: 12px; font-weight: 650; }
.trackly-style .trackly-checklist p { margin-top: 6px; color: var(--trackly-muted); font-size: 14px; }
.trackly-style .trackly-setup-links { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 13px; font-size: 13px; font-weight: 550; }
.trackly-style .trackly-optional { margin: 19px 8px 0; color: var(--trackly-muted); font-size: 13px; line-height: 1.85; }
.trackly-style .trackly-demo figcaption { display: grid; gap: 6px; color: var(--trackly-muted); font-size: 12px; line-height: 1.6; text-align: center; }
.trackly-style .trackly-demo figcaption > span { min-height: 20px; }
.trackly-style .trackly-demo figcaption small { font-size: 10px; }
.trackly-style .trackly-finish { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding-block: 64px 42px; border-top: 1px solid var(--trackly-line); }
.trackly-style .trackly-finish h2 { font-size: clamp(28px, 3vw, 36px); }
.trackly-style .trackly-finish p { margin-top: 14px; color: var(--trackly-muted); font-size: 13px; }
.trackly-style .trackly-faq { padding-bottom: 80px; }
.trackly-style .trackly-faq details { padding: 19px 0; border-top: 1px solid var(--trackly-line); }
.trackly-style .trackly-faq details:last-child { border-bottom: 1px solid var(--trackly-line); }
.trackly-style .trackly-faq summary { font-size: 15px; font-weight: 600; cursor: pointer; }
.trackly-style .trackly-faq p { margin: 15px 0 4px; color: var(--trackly-muted); font-size: 14px; }
.trackly-style .trackly-footer { display: grid; grid-template-columns: 1.2fr 1fr; align-items: start; gap: 35px; padding-block: 45px 36px; border-top: 1px solid var(--trackly-line); }
.trackly-style .trackly-footer .trackly-nav { justify-content: flex-end; gap: 23px; }
.trackly-style .trackly-footer p { margin-top: 16px; max-width: 520px; color: var(--trackly-muted); font-size: 13px; }
.trackly-style .trackly-article { max-width: var(--trackly-reading-max); padding-bottom: 64px; font-family: var(--trackly-reading); }
.trackly-style .trackly-article-header { padding-block: 44px 0; }
.trackly-style .trackly-article h1 { font-family: inherit; font-size: 32px; line-height: 1.45; font-weight: 600; letter-spacing: 0; }
.trackly-style .trackly-article-intro { margin-top: 14px; color: var(--trackly-muted); font-size: 16px; }
.trackly-style .trackly-article-meta { margin-top: 16px; color: var(--trackly-muted); font-size: 13px; }
.trackly-style .trackly-prose { margin: 28px 0 40px; font-size: 17px; line-height: 1.9; overflow-wrap: anywhere; }
.trackly-style .trackly-prose :is(p, ul, ol, blockquote, figure, aside) { margin-block: 20px; }
.trackly-style .trackly-prose > :first-child { margin-top: 0; }
.trackly-style .trackly-prose h2 { margin: 36px 0 16px; font-family: inherit; font-size: 24px; line-height: 1.5; font-weight: 600; letter-spacing: 0; }
.trackly-style .trackly-prose h3 { margin: 28px 0 12px; font-family: inherit; font-size: 20px; line-height: 1.5; font-weight: 700; }
.trackly-style .trackly-prose :is(ul, ol) { padding-inline-start: 1.5em; }
.trackly-style .trackly-prose li { margin-block: 6px; }
.trackly-style .trackly-prose .trackly-callout { padding: 0; background: transparent; border: 0; border-radius: 0; }
.trackly-style .trackly-prose figure img { width: 100%; }
.trackly-style .trackly-prose figcaption { margin-top: 10px; color: var(--trackly-muted); font-size: 13px; }
.trackly-style .trackly-prose details { padding: 16px 0; border-top: 1px solid var(--trackly-line); }
.trackly-style .trackly-prose summary { font-weight: 600; cursor: pointer; }
.trackly-style .trackly-article-footer { display: flex; flex-wrap: wrap; gap: 20px; padding-top: 20px; border-top: 1px solid var(--trackly-line); font-size: 14px; }

@media (min-width: 1400px) {
  .trackly-style .trackly-hero { gap: 100px; }
}
@media (max-width: 1080px) {
  .trackly-style .trackly-hero, .trackly-style .trackly-split, .trackly-style .trackly-setup { gap: 44px; }
  .trackly-style h1 { font-size: 42px; }
  .trackly-style h2 { font-size: 35px; }
  .trackly-style .trackly-lede { font-size: 17px; }
  .trackly-style .trackly-footer .trackly-nav { flex-wrap: wrap; gap: 18px; }
}
@media (max-width: 760px) {
  .trackly-style { --trackly-gutter: 18px; }
  .trackly-style .trackly-header { grid-template-columns: 48px 1fr; min-height: auto; gap: 15px; padding-block: 19px; }
  .trackly-style .trackly-header::after { display: none; }
  .trackly-style .trackly-header .trackly-nav { justify-content: flex-end; flex-wrap: wrap; gap: 8px 14px; }
  .trackly-style .trackly-nav a { font-size: 13px; }
  .trackly-style .trackly-hero, .trackly-style .trackly-split, .trackly-style .trackly-setup { grid-template-columns: minmax(0, 1fr); }
  .trackly-style .trackly-hero { min-height: auto; padding-block: 24px 48px; gap: 24px; }
  .trackly-style .trackly-hero > .trackly-copy, .trackly-style .trackly-tutorial > .trackly-copy { grid-row: 1; }
  .trackly-style h1 { font-size: clamp(32px, 8.2vw, 45px); }
  .trackly-style h2 { font-size: clamp(28px, 7.4vw, 35px); }
  .trackly-style h3 { font-size: 17px; }
  .trackly-style .trackly-lede { margin-top: 18px; font-size: 16px; }
  .trackly-style .trackly-prerequisites { margin-top: 17px; font-size: 11px; }
  .trackly-style .trackly-actions { margin-top: 22px; gap: 20px; }
  .trackly-style .trackly-badge, .trackly-style .trackly-badge img { height: 48px; min-height: 48px; }
  .trackly-style .trackly-hero .trackly-badge img { height: 46px; min-height: 0; }
  .trackly-style .trackly-section, .trackly-style .trackly-setup { padding-block: 54px; gap: 28px; }
  .trackly-style .trackly-checklist li { padding: 20px; border-radius: 17px; }
  .trackly-style .trackly-benefits { margin-top: 24px; gap: 12px; font-size: 15px; }
  .trackly-style .trackly-note { margin-top: 23px; font-size: 12px; }
  .trackly-style .trackly-finish { display: grid; padding-block: 42px 30px; gap: 24px; }
  .trackly-style .trackly-faq { padding-bottom: 46px; }
  .trackly-style .trackly-footer { grid-template-columns: 1fr; gap: 25px; padding-block: 32px; }
  .trackly-style .trackly-footer .trackly-nav { justify-content: flex-start; flex-wrap: wrap; gap: 23px; }
  .trackly-style .trackly-article-header { padding-top: 28px; }
  .trackly-style .trackly-article h1 { font-size: 28px; }
  .trackly-style .trackly-prose { margin-block: 24px 36px; font-size: 16px; }
  .trackly-style .trackly-prose h2 { font-size: 22px; }
  .trackly-style .trackly-prose h3 { font-size: 19px; }
  .trackly-style .trackly-article-footer { gap: 16px; }
}

/* Project-specific composition on the approved Trackly neutral base.
   Brand colours belong to the App; no accent/highlight token is introduced. */
.trackly-style { --trackly-display: ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"PingFang TC","Microsoft JhengHei",sans-serif; --trackly-body: -apple-system,BlinkMacSystemFont,"PingFang TC","Microsoft JhengHei",sans-serif; }
.skip-link { position:absolute; top:10px; left:16px; z-index:10; padding:10px 18px; background:#000; color:#fff !important; transform:translateY(-180%); }
.skip-link:focus { transform:translateY(0); }
.preview-bar { text-align:center; font-size:11px; color:#666; padding:5px 18px; border-bottom:1px solid var(--trackly-line); letter-spacing:.08em; }
.arrow { width:20px; height:20px; flex:none; }
.trackly-style .trackly-header .trackly-nav a { padding-block:10px; }
.trackly-style .trackly-button:hover { background:#262626; }
.trackly-style .trackly-text-link:hover { text-decoration-thickness:2px; }
.trackly-style .trackly-hero { min-height:660px; }
.trackly-style .trackly-footer .footer-note { grid-column:1/-1; margin-top:0; font-size:11px; }
.demo-stage { min-height:350px; display:grid; align-items:center; }
.device { position:relative; width:100%; padding:9px 12px; border-radius:26px; background:#202124; border:1px solid #4d4d4d; box-shadow:0 16px 32px -24px #0006; }
.device-camera { position:absolute; width:5px; height:5px; left:4px; top:calc(50% - 2.5px); border-radius:50%; background:#080909; }
.demo-screen { position:relative; overflow:hidden; aspect-ratio:2560/1316; background:#000; color:#f3f3ee; border-radius:17px; font-family:-apple-system,BlinkMacSystemFont,"PingFang TC",sans-serif; container-type:inline-size; }
.screen-heading,.screen-bottom { position:absolute; display:flex; justify-content:space-between; align-items:center; left:4%; right:4%; }
.screen-heading { top:7%; font-size:2.5cqw; line-height:1.5; }
.screen-heading small { display:block; color:#858585; font-size:1.6cqw; }
.screen-heading [data-state] { color:#999; font-size:1.7cqw; letter-spacing:.04em; }
.screen-bottom { bottom:7%; color:#888; font-size:1.4cqw; letter-spacing:.07em; }
.demo-lyrics { position:absolute; left:6%; top:37%; width:64%; font-size:3.7cqw; line-height:1.85; font-weight:550; letter-spacing:.015em; }
.demo-lyrics p { opacity:.38; white-space:nowrap; }
.demo-lyrics p:nth-child(2) { opacity:1; }
.demo-face { position:absolute; width:32%; height:auto; top:30%; left:64%; }
.trackly-style .product-demo figcaption { margin-top:7px; }
.demo-controls { display:flex; align-items:center; justify-content:center; gap:16px; margin-top:12px; min-height:36px; }
.demo-controls[hidden] { display:none; }
.demo-controls button { display:inline-flex; align-items:center; gap:6px; border:0; padding:7px 10px; border-radius:6px; min-height:36px; background:transparent; color:#666; font:500 11px/1.5 var(--trackly-body); cursor:pointer; }
.demo-controls button:hover { background:#f5f6f7; color:#000; }
.demo-controls svg { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.demo-controls button:disabled { cursor:default; color:#888; }
.trackly-style .real-capture img,.trackly-style .privacy-capture img { width:100%; border-radius:16px; }
.trackly-style .real-capture figcaption,.trackly-style .privacy-capture figcaption { margin-top:20px; }
.privacy-detail { margin-block:18px 25px !important; color:#666; font-size:14px; }
.trackly-style .trackly-finish { scroll-margin-top:32px; }
.trackly-style .trackly-finish p { line-height:1.9; }
.page-header { padding-block:64px 62px; }
.page-header p { margin-top:20px; max-width:620px; color:#666; font-size:18px; }
.blog-empty { padding-block:56px 120px; border-top:1px solid var(--trackly-line); }
.trackly-style .blog-empty h2 { font-size:26px; }
.blog-empty p { margin-block:18px 28px; color:#666; }
.releases { padding-bottom:100px; }
.release { display:grid; grid-template-columns:240px minmax(0,1fr); gap:40px; padding-block:40px; border-top:1px solid var(--trackly-line); }
.release-meta p { font-size:18px; font-weight:650; }
.release-meta time,.release-meta span { display:block; color:#666; font-size:13px; margin-top:10px; }
.trackly-style .release-content h2 { font-size:26px; letter-spacing:-.02em; }
.trackly-style .release-content h3 { margin-top:28px; font-size:17px; }
.release-content ul { margin:12px 0 0; padding-left:1.3em; color:#666; font-size:15px; }
.release-content li+li { margin-top:10px; }
.support-topics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 70px; }
.support-topics section { border-top:1px solid var(--trackly-line); padding-block:28px 44px; }
.trackly-style .support-topics h2 { font-size:23px; letter-spacing:-.02em; }
.support-topics p { color:#666; margin-block:16px; font-size:15px; }
.support-contact { display:flex; align-items:center; justify-content:space-between; gap:32px; padding-block:45px 80px; border-top:1px solid var(--trackly-line); }
.trackly-style .support-contact h2 { font-size:28px; }
.support-contact p { color:#666; font-size:14px; margin-top:20px; }
.support-contact>a { flex-shrink:0; }
.policy-languages { display:flex; gap:24px; margin-top:24px; font-size:14px; }
.policy>section+section { margin-top:56px; padding-top:28px; border-top:1px solid var(--trackly-line); }
.policy section { scroll-margin-top:24px; }
.trackly-style .policy section h2 { font-size:26px; }
.trackly-style .policy section h3 { font-size:22px; font-weight:600; }
.website-privacy { border-top:1px solid var(--trackly-line); padding-top:28px; }
.website-privacy :is(h3,p) { scroll-margin-top:24px; }
.testing-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:90px; align-items:start; padding-bottom:72px; }
.trackly-style .testing-layout h2,.trackly-style .testing-process h2 { font-size:28px; letter-spacing:-.025em; }
.testing-requirements>section { margin-top:28px; }
.testing-layout p,.testing-process p { color:#666; font-size:15px; line-height:1.9; }
.testing-requirements p { margin-top:10px; }
.testing-application { background:var(--trackly-soft); padding:30px; border-radius:20px; }
.testing-application>p { margin-top:18px; }
.testing-application .trackly-button { margin-top:24px; }
.testing-application .application-account { color:#000; font-weight:550; }
.testing-application .application-data,.testing-application .application-help { font-size:12px; }
.testing-process { border-top:1px solid var(--trackly-line); padding-block:54px 80px; }
.testing-process ol { list-style:none; padding:0; margin:32px 0 0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; }
.testing-process li { display:flex; align-items:start; gap:14px; }
.testing-process .trackly-number { background:var(--trackly-soft); }
.testing-process li p { margin-top:12px; font-size:14px; }
.testing-process .testing-payment { font-size:13px; margin-top:32px; }
@media(max-width:1080px) { .testing-layout { gap:44px; } }
@media(max-width:760px) {
  .testing-layout { grid-template-columns:1fr; gap:38px; padding-bottom:46px; }
  .testing-application { grid-row:1; padding:24px; border-radius:17px; }
  .testing-application .trackly-button { font-size:14px; padding-inline:18px; }
  .trackly-style .testing-layout h2,.trackly-style .testing-process h2 { font-size:24px; }
  .testing-process { padding-block:40px 52px; }
  .testing-process ol { grid-template-columns:1fr; gap:26px; }
}
@media(max-width:1080px) { .trackly-style .trackly-hero { min-height:580px; } .demo-stage { min-height:300px; } }
@media(max-width:760px) {
  .trackly-style .trackly-header { gap:10px; }
  .trackly-style .trackly-header .trackly-nav { gap:0 16px; }
  .trackly-style .trackly-hero { min-height:0; }
  .demo-stage { min-height:0; padding-block:24px; }
  .device { border-radius:20px; padding:7px 10px; }
  .demo-screen { border-radius:12px; }
  .trackly-style .product-demo figcaption { margin-top:0; }
  .trackly-style .product-demo figcaption small { font-size:10px; }
  .page-header { padding-block:30px 36px; }
  .page-header p { font-size:16px; }
  .blog-empty { padding-block:35px 70px; }
  .release { grid-template-columns:1fr; gap:22px; padding-block:28px; }
  .release-meta { display:flex; flex-wrap:wrap; gap:8px 20px; align-items:baseline; }
  .release-meta time,.release-meta span { margin:0; }
  .release-meta span { flex-basis:100%; }
  .trackly-style .release-content h2 { font-size:23px; }
  .releases { padding-bottom:60px; }
  .support-topics { grid-template-columns:1fr; }
  .support-topics section { padding-bottom:28px; }
  .support-contact { display:grid; padding-block:35px 60px; }
  .trackly-style .trackly-footer .trackly-nav { gap:18px; }
}