/* Additions to the original W&Y visual language. No external fonts or trackers. */
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid #2085c2; outline-offset: 4px; }
.skip-link { position: absolute; top: -80px; background: white; padding: 12px; z-index: 99; }
.skip-link:focus { top: 0; }
.global-nav { gap: 21px; font-size: .91rem; }
.global-nav [aria-current=page] { color: var(--primary); }
.global-nav [aria-current=page]::after { width: 100%; }
.insight-hero { background: #f1f5f8; border-bottom: 1px solid #d8e2e9; padding: 28px 0 62px; }
.breadcrumb { display: flex; gap: 14px; color: #657285; font-size: .8rem; margin-bottom: 40px; }
.insight-hero .eyebrow { color: #745d10; font-size: .78rem; }
.insight-hero h1 { color: #0b365f; font-size: clamp(2rem, 4.7vw, 3.35rem); letter-spacing: .025em; line-height: 1.5; }
.intro { color: #475667; margin: 20px 0; max-width: 760px; }
.small-label { font-size: .76rem; color: #617284; letter-spacing: .03em; }
.tool-section { padding: 42px 0 70px; background: #fafbfc; }
.tool-layout { display: grid; grid-template-columns: 310px minmax(0,1fr); gap: 34px; align-items: start; }
.analysis-input { background: white; border: 1px solid var(--line); padding: 25px; border-radius: 12px; }
.analysis-input .eyebrow, .result-heading .eyebrow { font-size: .7rem; color: #826719; }
.analysis-input h2 { font-size: 1.3rem; margin-bottom: 18px; }
.analysis-input label { display: block; font-weight: 700; font-size: .87rem; margin: 20px 0 6px; }
.analysis-input input, .analysis-input select, .analysis-input textarea, .news-filters input, .news-filters select { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #b5c2cc; border-radius: 6px; background: #fff; color: #24374b; }
.analysis-input textarea { resize: vertical; line-height: 1.65; }
.analysis-input input[type=file] { min-height: 0; padding: 9px; font-size: .75rem; }
.analysis-input select { font-size: .81rem; }
.field-help { color: #647384; font-size: .75rem; line-height: 1.7; margin: 7px 0 0; }
.advanced { border-top: 1px solid var(--line); margin: 24px 0; padding-top: 16px; }
summary { cursor: pointer; font-weight: 700; font-size: .87rem; }
.full-width { width: 100%; justify-content: space-between; font-size: .88rem; padding: 12px 19px; }
.text-button { width: 100%; background: none; border: none; padding: 14px 0; color: var(--primary); text-decoration: underline; text-underline-offset: 4px; font-size: .82rem; }
.inline-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.check-field { display: flex !important; gap: 9px; align-items: flex-start; font-weight: 400 !important; line-height: 1.55; }
.check-field input { width: 18px; min-height: 18px; margin-top: 3px; flex: 0 0 auto; }
.privacy-banner { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 15px 18px; margin-bottom: 22px; background: #eaf5f2; border: 1px solid #bcdcd2; border-radius: 8px; color: #245b4e; font-size: .83rem; }
.button:disabled { opacity: .6; cursor: wait; }
.analysis-output { min-width: 0; }
.empty-state { min-height: 570px; padding: 54px 38px; background: #fff; border: 1px solid var(--line); border-radius: 12px; display: flex; flex-direction: column; justify-content: center; }
.empty-number { font-size: 3.4rem; color: #d4e2ec; font-family: Georgia,serif; font-style: italic; }
.empty-state h2 { font-size: 1.55rem; color: #123e64; margin: 18px 0; }
.empty-state p { font-size: .9rem; }
.example-equation { margin: 26px 0; display: flex; align-items: center; gap: 12px; font-size: .7rem; color: #5c6d7c; }
.example-equation strong { display: block; font-size: 1.7rem; color: #0f4c81; font-variant-numeric: tabular-nums; }
#status:not(:empty) { padding: 18px; border-radius: 8px; margin-bottom: 20px; background: #edf4fa; color: #174a72; font-size: .9rem; }
#status.error { background: #fff0ea; color: #8f3527; border: 1px solid #edcbbf; }
.result-heading { display: flex; gap: 12px; justify-content: space-between; align-items: start; margin-bottom: 22px; }
.result-heading h2 { font-size: 1.35rem; }
.result-heading .note { margin: 8px 0 0; font-size: .8rem; }
.pill { display: inline-block; border: 1px solid #d2dfe8; padding: 4px 10px; border-radius: 4px; font-size: .7rem; color: #456278; white-space: nowrap; }
.pill.demo { color: #845100; border-color: #dcc384; background: #fff7df; }
.metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-bottom: 22px; }
.metric { background: white; border: 1px solid var(--line); border-radius: 8px; padding: 17px 14px; }
.metric span { font-size: .78rem; color: #526577; }
.metric strong { display: block; font-size: clamp(1.5rem,2.7vw,2.1rem); font-variant-numeric: tabular-nums; color: #0e4c7f; margin: 10px 0 5px; }
.metric small { font-size: .65rem; color: #667686; }
.comparison-panel { background: white; border: 1px solid var(--line); border-radius: 12px; padding: 18px 22px; margin-bottom: 22px; }
.comparison-heading h3 { color: #123e64; font-size: 1rem; margin: 0 0 4px; }
.comparison-panel .table-scroll { margin-top: 10px; }
.comparison-table { min-width: 620px; }
.comparison-table td:first-child,.comparison-table th:first-child { text-align: left; }
.comparison-select { border: 0; background: none; color: #0f4c81; text-decoration: underline; text-underline-offset: 3px; padding: 3px 0; text-align: left; font-size: inherit; }
.comparison-table tr.selected-comparison { background: #fff6dc; }
.comparison-table tr.selected-comparison .comparison-select { font-weight: 700; text-decoration: none; color: #533d00; }
.chart-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 22px; }
.chart-tabs { display: flex; gap: 8px; border-bottom: 1px solid var(--line); margin-bottom: 16px; }
.chart-tabs button { padding: 9px 12px 14px; border: 0; background: none; font-size: .85rem; color: #526577; border-bottom: 3px solid transparent; }
.chart-tabs .selected { border-bottom-color: #0f4c81; color: #0f4c81; font-weight: 700; }
.chart-card .note { font-size: .75rem; }
.chart svg { width: 100%; height: auto; display: block; }
.chart-legend { font-size: .7rem; color: #647384; margin: 10px 0; }
.download-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.button.outline { min-height: 38px; padding: 7px 14px; border-radius: 5px; border: 1px solid #b8cad8; color: #174a72; background: white; font-size: .78rem; }
.result-notes p { margin: 14px 0 0; color: #78561a; font-size: .79rem; }
.data-details { margin-top: 24px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.table-scroll { overflow-x: auto; margin-top: 15px; }
.data-table { width: 100%; border-collapse: collapse; font-size: .75rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.data-table caption { text-align: left; font-size: .7rem; white-space: normal; padding: 10px 0; color: #647384; }
.data-table th, .data-table td { padding: 10px; text-align: right; border-bottom: 1px solid #e0e7ed; }
.data-table th { background: #edf3f7; }
.data-table tr.event-row { background: #fff6dc; }
.conditions { font-size: .78rem; display: grid; grid-template-columns: 140px minmax(0,1fr); gap: 8px 12px; margin-top: 20px; }
.conditions dt { color: #607484; }.conditions dd { margin: 0; overflow-wrap: anywhere; }
.analysis-disclaimer { font-size: .76rem; color: #637080; line-height: 1.8; margin: 20px 0 0; }
.review-layout { display: grid; grid-template-columns: 340px minmax(0,1fr); gap: 34px; align-items: start; }
.review-empty { min-height: 540px; }
.score-hero { display: grid; grid-template-columns: minmax(0,1fr) 120px minmax(160px,.6fr); gap: 22px; align-items: center; margin-bottom: 22px; padding: 24px; background: white; border: 1px solid var(--line); border-radius: 12px; }
.score-hero h2 { color: #123e64; font-size: 1.35rem; }
.score-ring { width: 110px; height: 110px; border: 9px solid #dce9f1; border-top-color: #0f4c81; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #607184; }
.score-ring strong { color: #0f4c81; font-size: 2.25rem; line-height: 1; }
.axis-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.axis-item { background: white; border: 1px solid var(--line); border-radius: 8px; padding: 17px; }
.axis-item > div:first-child { display: flex; justify-content: space-between; gap: 12px; }
.axis-item h3 { font-size: .88rem; margin: 0; }
.axis-item strong { color: #0f4c81; white-space: nowrap; font-size: .85rem; }
.score-track { height: 7px; border-radius: 8px; background: #e8eef2; margin: 13px 0 8px; overflow: hidden; }
.score-track span { height: 100%; display: block; background: #0f6a91; }
.review-panel { margin-top: 22px; padding: 24px; background: white; border: 1px solid var(--line); border-radius: 12px; }
.review-panel h2 { font-size: 1.2rem; color: #123e64; }
.suggestion-list { display: grid; gap: 14px; margin-top: 17px; }
.suggestion-card { border-top: 1px solid var(--line); padding-top: 17px; }
.suggestion-card h3 { display: inline; margin-left: 10px; font-size: 1rem; }
.suggestion-card > p { font-size: .82rem; }
.example-before,.example-after { padding: 11px 13px; border-radius: 5px; margin: 8px 0; }
.example-before { background: #f3f5f6; color: #5d6a74; }
.example-after { background: #edf5f9; color: #183f5d; }
.example-before strong,.example-after strong { display: block; margin-bottom: 4px; font-size: .72rem; }
.evidence-list details { border-top: 1px solid var(--line); padding: 13px 0; }
.evidence-list blockquote { margin: 12px 0 0; padding: 10px 14px; border-left: 3px solid #c9a227; color: #465b6b; font-size: .8rem; background: #faf9f4; }
.explain-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 36px; margin-top: 30px; }
.step-number { color: #826719; font-family: Georgia,serif; font-size: 1.3rem; }
.explain-grid h3 { font-size: 1.08rem; margin: 14px 0; }
.explain-grid p { font-size: .88rem; color: #526374; }
.method-details { margin-top: 25px; padding: 22px; background: white; border: 1px solid var(--line); border-radius: 8px; }
.method-details p { font-size: .84rem; margin: 15px 0; }
.news-section { padding: 46px 0 76px; }
.news-filters { display: flex; gap: 16px; margin-bottom: 32px; max-width: 690px; }
.news-filters label:first-child { flex: 1; }.news-filters label { font-size: .8rem; }
.news-filters input,.news-filters select { margin-top: 6px; }
.news-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.news-card { padding: 30px; border: 1px solid #dfe5eb; border-top: 3px solid #0f4c81; background: #fff; border-radius: 3px 3px 10px 10px; display: flex; flex-direction: column; }
.news-meta { display: flex; align-items: center; gap: 12px; font-size: .76rem; color: #637383; margin-bottom: 20px; flex-wrap: wrap; }
.news-card h2 { font-size: 1.5rem; line-height: 1.6; color: #113f65; }
.news-card .news-lead { font-size: .9rem; color: #546373; margin: 17px 0 24px; }
.read-more { margin-top: auto; color: #0f4c81; font-size: .85rem; font-weight: 700; }
.read-more span { margin-left: 15px; }
.news-card a:hover { text-decoration: underline; text-underline-offset: 4px; }
.editorial-policy { border-left: 3px solid #c9a227; padding: 8px 0 8px 24px; margin-top: 44px; color: #546373; font-size: .85rem; }
.article-wrap { max-width: 780px; margin: 0 auto; padding: 40px 20px 70px; }
.article-wrap h1 { font-size: clamp(1.9rem,4vw,2.7rem); color: #0e3b62; line-height: 1.55; margin: 22px 0; }
.article-lead { color: #4c6172; font-size: 1.12rem; border-bottom: 1px solid var(--line); padding-bottom: 30px; margin-bottom: 30px; }
.article-body p { font-size: 1.01rem; line-height: 2.15; margin: 0 0 24px; }
.japan-note { background: #f1f5f8; border-top: 3px solid #c9a227; padding: 28px; margin: 36px 0; }
.japan-note h2 { font-size: 1.18rem; color: #0f4c81; margin-bottom: 14px; }
.japan-note p { margin: 0; line-height: 2; }
.source-box { font-size: .82rem; color: #536575; border-top: 1px solid var(--line); padding-top: 25px; overflow-wrap: anywhere; }
.source-box a, .editorial-policy a { color: #0f4c81; text-decoration: underline; text-underline-offset: 3px; }
.share-actions { display: flex; gap: 15px; flex-wrap: wrap; margin: 30px 0; }
.home-insights { background: #f2f6f9; }
.home-insights .two-column { grid-template-columns: repeat(3,1fr); }
.home-insights .service-card p { color: #526374; }
.home-insights .service-card { box-shadow: none; border-radius: 12px; }
@media (max-width: 1050px) { .global-nav { gap: 12px; font-size: .8rem; }.tool-layout { grid-template-columns: 280px minmax(0,1fr); gap: 20px; }.chart-card { padding: 15px; } }
@media (max-width: 820px) { .global-nav { font-size: .95rem; }.tool-layout,.review-layout { grid-template-columns: 1fr; }.analysis-input { padding: 24px; }.empty-state { min-height: 350px; padding: 30px; }.explain-grid,.news-grid,.home-insights .two-column { grid-template-columns: 1fr; }.insight-hero { padding-bottom: 40px; }.breadcrumb { margin-bottom: 25px; }.metrics { gap: 8px; }.metric { padding: 12px 9px; }.metric span { font-size: .72rem; }.desktop-only { display: none; }.news-card { padding: 24px; }.news-filters { flex-direction: column; gap: 8px; }.score-hero { grid-template-columns: minmax(0,1fr) 110px; }.score-hero > :last-child { grid-column: 1 / -1; }.axis-list { grid-template-columns: 1fr; } }
@media (max-width: 430px) { .container { width: calc(100% - 28px); }.chart-card,.review-panel,.comparison-panel { padding: 10px; }.chart-tabs button { padding: 8px; }.metrics { grid-template-columns: 1fr 1fr; }.metric:last-child { grid-column: 1 / -1; display: flex; gap: 12px; align-items: baseline; }.metric:last-child strong { font-size: 1.3rem; margin: 0; }.example-equation { gap: 8px; }.example-equation strong { font-size: 1.3rem; }.conditions { grid-template-columns: 1fr; gap: 4px; }.conditions dd { margin-bottom: 10px; }.score-hero { grid-template-columns: 1fr; padding: 18px; }.score-ring { width: 95px; height: 95px; }.score-hero > :last-child { grid-column: auto; }.inline-actions { grid-template-columns: 1fr; } }
@media print { .site-header,.site-footer,.analysis-input,.privacy-banner,.download-actions,.insight-hero { display: none !important; }.review-layout { display: block; }.tool-section { padding: 0; }.analysis-output { width: 100%; }.review-panel,.score-hero,.axis-item { break-inside: avoid; box-shadow: none; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }