/* SaidTrace's smoky glass, graphite and silver palette. External provider marks keep their identity. */
:root {
  --ink: #202833;
  --ink-strong: #080c12;
  --ink-muted: #56616b;
  --brand: #566674;
  --brand-deep: #354653;
  --accent-positive: #75838f;
  --accent-positive-on-dark: #e5e9ed;
  --line: #d9dee3;
  --paper: #f8f9fa;
  --site-canvas: #fcfcfd;
  background: var(--site-canvas);
}
body { color: var(--ink); background: var(--site-canvas); }
::selection { color: #080c12; background: #cbd3da; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline-color: var(--brand); }

.header { border-bottom-color: var(--line); background: rgba(252,252,253,.9); }
.wordmark span { color: var(--ink-strong); }
.header-cta, .primary-button { background: #1d2229; }
.header-cta:hover, .primary-button:hover { background: #35404b; }
.header-cta > span, .primary-button > span { color: var(--accent-positive-on-dark); }
.header .desktop-nav, .header-state, .header-language { color: var(--ink-muted); }
.wordmark { font-weight: 700; letter-spacing: -.035em; }
.header-state span { background: var(--brand); box-shadow: 0 0 0 4px #e4e8eb; }

.hero { background: var(--site-canvas); }
.hero-image { opacity: .11; filter: grayscale(1); }
.hero-wash { background: linear-gradient(90deg, var(--site-canvas) 0%, rgba(252,252,253,.93) 42%, rgba(252,252,253,.3) 100%); }
.hero h1 em { color: inherit; }
.hero-benefits li span { color: var(--brand-deep); }
.hero h1 { font-weight: 665; letter-spacing: -.055em; line-height: 1.12; }
html[lang="ja"] .hero h1 { line-height: 1.22; }
html[lang="ja"] .headline-line { display: block; white-space: nowrap; }
html[lang="ja"] .hero-ai-line { white-space: normal; }
html[lang="ja"] .hero-ai-line > span { white-space: nowrap; }
html[lang="ja"] .how-head h2,
html[lang="ja"] .privacy h2,
html[lang="ja"] .pricing h2,
html[lang="ja"] .mcp-copy h2 { font-size: clamp(36px, 3.8vw, 50px); }
.hero-benefits li { color: #414b55; font-weight: 500; }
.hero-benefits li::before { background: #8997a3; }
.hero-benefits li:last-child::before { background: var(--accent-positive); }
.hero-lead { color: #46535f; line-height: 1.6; }
.hero-sub { color: #66737e; }
.hero-actions.hero-download-action { display: flex; }
.hero .hero-download { font: inherit; font-size: 13px; font-weight: 650; text-align: left; border: 0; }
.hero .hero-download:disabled, .hero .hero-download:disabled:hover, .hero .hero-download:disabled:active { background: #3b4651; color: #fff; opacity: .78; cursor: not-allowed; transform: none; }
.hero .hero-download:disabled > span { color: inherit; }
.eyebrow span { background: #8997a3; }
.eyebrow, .section-index, .section-index span, .source-detail-kicker { color: var(--brand); }
.secondary-link { border-color: #cfd7dd; box-shadow: 0 2px 6px #1d22290a; }
.secondary-link:hover { background: #f0f3f5; }

.promise { color: var(--ink); background: var(--site-canvas); }
.promise-row { border-top-color: #d7d8d7; }
.promise-detail p { color: #555968; }
.promise-detail small { color: #747786; }
.product { background: var(--site-canvas); }
.product-window { border-color: #d9dadb; box-shadow: 0 26px 65px #20272d16; }
.window-status i { background: var(--brand); }
.product-notes { background: #d9dadb; }
.product-notes span { color: var(--brand); }
.product-notes p { color: #626673; }

.features, .how, .pricing { border-top-color: var(--line); background: var(--site-canvas); }
.feature-item, .feature-item:nth-child(even), .feature-tail { border-color: var(--line); }
.source-demo { border-color: var(--line); box-shadow: 0 21px 54px #31304410; }
.source-stage, .source-visual { background: #f2f4f6; }
.source-details { border-top-color: var(--line); background: #fafbfc; }
.source-stage-head, .source-details > p:not(.source-detail-kicker), .source-secondary p { color: #5b6772; }
.source-stage-head span { color: var(--brand-deep); }
.source-details h3, .feature-item h3 { color: var(--ink); }
.section-head h2, .privacy h2, .pricing h2, .mcp-copy h2, .last h2 {
  font-weight: 700;
  letter-spacing: -.04em;
  line-height: 1.13;
}
.hero h1, .section-head h2, .privacy h2, .pricing h2,
.mcp-copy h2, .comparison-heading h3, .last h2 { text-wrap: pretty; }
html[lang="ja"] .section-head h2,
html[lang="ja"] .privacy h2,
html[lang="ja"] .pricing h2,
html[lang="ja"] .mcp-copy h2,
html[lang="ja"] .last h2 { line-height: 1.2; }
.section-head > p:last-child, .privacy-intro, .mcp-copy > p:not(.section-index) { line-height: 1.65; }
.source-details h3, .comparison-heading h3 { font-weight: 670; line-height: 1.2; }
.privacy { color: var(--ink); border-top-color: var(--line); background: var(--site-canvas); }
.privacy h2 em { color: inherit; }
.privacy-list span { color: var(--brand-deep); }
.privacy-list, .privacy-list > div, .price-surface, .price-surface > div:first-child,
.price-surface > p, .comparison, .comparison-scroll { border-color: #dcdde5; }
.privacy-intro, .privacy-list p { color: #55616c; }
.price-surface { border-color: #cbd3da; }
.price-surface > div,
.price-surface > div.free-plan:first-child { border-color: #cbd3da; background: #fafbfc; }
.price-surface > div strong { color: var(--ink-strong); }
.comparison-table tbody tr.comparison-own { background: #f0f3f5; }
.comparison-table tbody tr.comparison-candidate { background: #f6f6f5; }
.comparison-table tbody tr.comparison-own strong,
.comparison-table tbody tr.comparison-candidate strong { color: var(--brand-deep); }
.comparison-scroll { scrollbar-color: #aeb4b7 transparent; }
.comparison-source { margin: 16px 0 0; color: #66717a; font-size: 12px; line-height: 1.7; }
.comparison-source a { color: var(--brand-deep); text-decoration: underline; text-underline-offset: 2px; }
.last { border-top-color: var(--line); background: var(--site-canvas); }
.footer, .footer-bottom { border-color: var(--line); background: var(--site-canvas); }
.interior-page { background: var(--site-canvas); }
.interior-hero { background: var(--site-canvas); }
.download-primary { background: #1d2229; }
.download-primary:hover { background: #35404b; }
.download-aside { border-color: var(--line); background: #f8f9fa; }

.journey { background: var(--site-canvas); }
.experience {
  border-top-color: var(--line);
  background: var(--site-canvas);
}
.interactive-frame { border-color: #d9dadb; box-shadow: 0 30px 68px #20272d18; transition: border-color .2s ease, box-shadow .2s ease; }
.interactive-frame:hover, .interactive-frame:focus-within { border-color: #aebbc5; box-shadow: 0 32px 72px #28343f24; }
.interactive-frame-head { color: #66737e; border-bottom-color: #dce2e7; background: #f5f7f8; }
.interactive-frame-head .preview-wave {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 22px;
  height: 14px;
  border-radius: 0;
  background: transparent;
}
.preview-wave b { width: 2px; height: 5px; border-radius: 2px; background: #8596a3; transition: height .2s ease; }
.preview-wave b:nth-child(2), .preview-wave b:nth-child(4) { height: 9px; }
.preview-wave b:nth-child(3) { height: 13px; }
.interactive-frame:hover .preview-wave b:first-child,
.interactive-frame:focus-within .preview-wave b:first-child,
.interactive-frame:hover .preview-wave b:last-child,
.interactive-frame:focus-within .preview-wave b:last-child { height: 10px; }
.interactive-frame:hover .preview-wave b:nth-child(2),
.interactive-frame:focus-within .preview-wave b:nth-child(2),
.interactive-frame:hover .preview-wave b:nth-child(4),
.interactive-frame:focus-within .preview-wave b:nth-child(4) { height: 5px; }
.interior-main.download-layout { padding-bottom: 72px; }
.download-preview { padding: 70px 0 95px; border-top: 1px solid var(--line); background: var(--site-canvas); }
.download-simplified { padding: 68px 0 55px; }
.download-simplified h1 { font-size: clamp(42px, 5vw, 64px); }
.download-simplified .download-hero-actions { margin-top: 25px; }
.download-simplified + .download-preview { padding-top: 50px; }
.download-preview-heading { max-width: 700px; margin-bottom: 30px; }
.download-preview-heading .section-index { margin: 0 0 13px; }
.download-preview-heading h2 { margin: 0; color: var(--ink-strong); font-size: clamp(34px, 4vw, 52px); font-weight: 550; letter-spacing: -.045em; line-height: 1.2; }
.download-preview-heading > p:last-child { margin: 17px 0 0; color: var(--ink-muted); font-size: 15px; line-height: 1.7; }
@media (max-width: 760px) {
  .interior-main.download-layout { padding-bottom: 58px; }
  .download-preview { padding: 57px 0 68px; }
  .download-simplified { padding: 58px 0 45px; }
  .download-simplified + .download-preview { padding-top: 42px; }
  .download-preview-heading > p:last-child { font-size: 13px; }
}
.mcp-section { border-top-color: var(--line); background: var(--site-canvas); }
.mcp-copy h2 { color: var(--ink); }
.mcp-copy > p:not(.section-index), .mcp-visual-caption { color: #606675; }
.mcp-boundary, .mcp-client-note { color: #6c7180; }
.mcp-cli { border-color: #d1d9df; background: #fcfcfd; box-shadow: 0 15px 35px #20272d0d; }
.mcp-cli-bar { border-bottom-color: #d9e0e5; background: #f3f5f7; }
.mcp-cli-clients { border-color: #b8c4cd; background: #f8f9fa; }
.mcp-cli-clients p, .mcp-cli-hint, .mcp-cli-hint strong { color: #65727d; }
.mcp-cli-hint strong { color: var(--brand-deep); }
.mcp-cli-prompt { border-color: #d9dada; color: var(--ink); }
.mcp-answer-art { border-color: #d9dada; box-shadow: 0 15px 35px #20272d0d; }

@media (max-width: 760px) {
  .hero-image { opacity: .07; }
  .hero-wash { background: linear-gradient(180deg, var(--site-canvas) 0%, var(--site-canvas) 46%, rgba(252,252,253,.72) 74%, transparent 100%); }
  html[lang="ja"] .how-head h2,
  html[lang="ja"] .privacy h2,
  html[lang="ja"] .pricing h2,
  html[lang="ja"] .mcp-copy h2 { font-size: clamp(32px, 8vw, 44px); }
}
@media (max-width: 360px) {
  html[lang="ja"] .hero h1 { font-size: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  .interactive-frame, .preview-wave b { transition: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .header { background: #fcfcfd; backdrop-filter: none; -webkit-backdrop-filter: none; }
}
@media (prefers-contrast: more) {
  .hero-lead, .privacy-intro, .privacy-list p, .mcp-copy > p:not(.section-index) { color: #272832; }
  .interactive-frame, .source-demo, .product-window { border-color: #272832; }
  .source-stage, .source-visual, .price-surface > div, .mcp-cli-clients { background: #fff; }
}