@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Noto+Sans+JP:wght@300;400;500;700&display=swap');

        html {
            font-size: var(--pf-fs-base);
        }

        :root {
            --pf-fs-base: 16px;
            --pf-fs-table-mid: 0.86rem;
            --pf-fs-table-small: 0.74rem;
            --pf-lh-table-mobile: 1.35;
            --pf-fs-chart-unit: 0.75rem;
            --pf-fw-chart-unit: 400;
            --pf-lh-chart-unit: 1;
            --pf-fs-card-h3: 0.98rem;
            --pf-lh-card-h3: 1.45;
            --pf-fs-overseas-label: 0.9rem;
            --pf-lh-overseas-label: 1.4;
            --pf-fs-overseas-value: 2.25rem;
            --pf-lh-overseas-value: 1.1;
            --pf-fw-table-head: 600;
            --pf-fw-table-first-col: 600;
            --pf-color-table-first-col: #334155;
            --pf-fs-table-desktop: 1.03rem;
            --pf-fs-note-efficiency: 0.93rem;
            --pf-lh-note-efficiency: 1.75;
            --pf-fs-note-cashflow: 0.86rem;
            --pf-lh-note-cashflow: 1.8;
            --pf-fs-table-compact: 0.75rem;
            --pf-lh-table-compact: 1.3;
            --pf-lh-mobile-heading: 1.35;
            --pf-lh-mobile-heading-alt: 1.4;
            --pf-fs-mobile-legend: 0.78rem;
            --pf-fs-mobile-table-xs: 0.64rem;
            --pf-fs-mobile-table-sm: 0.7rem;
            --pf-lh-mobile-table: 1.25;
            --pf-space-card-gap: 1rem;
            --pf-space-card-padding: 1rem;
            --pf-space-card-padding-compact: 0.88rem;
            --pf-space-card-padding-large-phone: 0.91rem;
            --pf-space-table-wrap-gap-large-phone: 0.85rem;
            --pf-space-panel-pad: 1.5rem;
            --pf-space-panel-pad-tight: 1.25rem;
            --pf-space-panel-pad-lg: 2rem;
            --pf-space-heading-gap-row: 0.5rem;
            --pf-space-heading-gap-col: 0.35rem;
            --pf-space-legend-gap: 0.4rem 0.75rem;
            --pf-space-cell-padding-xs: 0.32rem 0.2rem;
            --pf-space-cell-padding-sm: 0.4rem 0.28rem;
            --pf-space-cell-padding-compact: 0.45rem 0.35rem;
            --pf-size-table-col-first-profitability-mobile: 14%;
            --pf-size-table-col-first-profitability-mobile-min: 2.6rem;
            --pf-size-table-col-first-efficiency-mobile: 18%;
            --pf-size-table-col-rest-efficiency-mobile: 27.3%;
            --pf-size-table-col-first-compact: 20%;
            --pf-size-table-col-rest-compact: 26.6%;
        }

        .performance-page-header-wrap {
            max-width: var(--ir-content-max-width);
            margin-left: auto;
            margin-right: auto;
        }

        @media (min-width: 421px) and (max-width: 767px) {
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table thead th,
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table tbody td:not(:first-child),
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table tbody td:first-child,
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table tbody th:first-child {
                font-size: var(--pf-fs-table-mid);
                line-height: var(--pf-lh-table-mobile);
            }
        }

        @media (max-width: 420px) {
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table thead th,
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table tbody td:not(:first-child),
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table tbody td:first-child,
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table tbody th:first-child {
                font-size: var(--pf-fs-table-small);
                line-height: var(--pf-lh-table-mobile);
            }
        }

        .chart-unit-inline {
            position: absolute;
            top: -0.8rem;
            left: 0.2rem;
            z-index: 2;
            pointer-events: none;
            color: #475569;
            font-size: var(--pf-fs-chart-unit);
            font-weight: var(--pf-fw-chart-unit);
            line-height: var(--pf-lh-chart-unit);
        }

        .performance-segment-panel > h3 {
            font-size: var(--pf-fs-card-h3);
            line-height: var(--pf-lh-card-h3);
        }

        /* Large-phone tuning (e.g. iPhone Pro Max widths) */
        @media (min-width: 421px) and (max-width: 520px) {
            :is(#profitability, #efficiency, #safety, #cashflow, #segment, #per-share) {
                overflow-x: hidden;
            }

            :is(
                .performance-profitability-grid,
                .performance-efficiency-layout,
                .performance-safety-grid,
                .performance-cashflow-grid,
                .performance-per-share-grid,
                .performance-segment-layout
            ) {
                gap: var(--pf-space-card-gap);
            }

            :is(
                #profitability .performance-profitability-card,
                #efficiency .ir-panel,
                #safety .performance-safety-card,
                #safety .performance-safety-table-panel,
                #cashflow .performance-cashflow-card,
                #per-share .performance-per-share-card,
                #per-share .performance-per-share-table-panel,
                #segment .performance-segment-panel
            ) {
                padding: var(--pf-space-card-padding-large-phone);
            }

            #profitability .performance-table-wrap {
                margin-top: var(--pf-space-table-wrap-gap-large-phone);
            }

            #profitability .performance-profitability-card:first-child .data-table {
                table-layout: fixed;
                font-size: 0.75rem;
            }

            #profitability .performance-profitability-card:first-child .data-table th,
            #profitability .performance-profitability-card:first-child .data-table td {
                padding: 0.4rem 0.22rem;
                line-height: 1.3;
            }

            #profitability .performance-profitability-card:first-child .data-table th:first-child,
            #profitability .performance-profitability-card:first-child .data-table td:first-child {
                width: 14%;
                min-width: 2.6rem;
            }

            #profitability canvas {
                max-width: 100%;
            }

            :is(#safety, #per-share) .data-table {
                table-layout: fixed;
                font-size: var(--pf-fs-table-compact);
            }

            :is(#safety, #per-share) .data-table th,
            :is(#safety, #per-share) .data-table td {
                padding: var(--pf-space-cell-padding-compact);
                line-height: var(--pf-lh-table-compact);
            }

            :is(#safety, #per-share) .data-table th:first-child,
            :is(#safety, #per-share) .data-table td:first-child {
                width: var(--pf-size-table-col-first-compact);
            }

            :is(#safety, #per-share) .data-table th:nth-child(2),
            :is(#safety, #per-share) .data-table td:nth-child(2),
            :is(#safety, #per-share) .data-table th:nth-child(3),
            :is(#safety, #per-share) .data-table td:nth-child(3),
            :is(#safety, #per-share) .data-table th:nth-child(4),
            :is(#safety, #per-share) .data-table td:nth-child(4) {
                width: var(--pf-size-table-col-rest-compact);
            }

            #segmentUnitLabel {
                white-space: nowrap;
            }
        }
        :is(
            .performance-profitability-grid,
            .performance-efficiency-layout,
            .performance-safety-grid,
            .performance-cashflow-grid,
            .performance-per-share-grid,
            .performance-segment-layout
        ) {
            display: grid;
            align-items: start;
        }

        .performance-profitability-grid {
            gap: 2rem;
            margin-bottom: 0;
        }

        .performance-quarter-legend {
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-end;
            gap: 0.75rem;
            margin-top: 0.75rem;
            color: #475569;
            font-size: 0.75rem;
            line-height: 1.5;
        }

        .performance-legend-item {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            color: #475569;
        }

        .performance-legend-checkbox {
            width: 1rem;
            height: 1rem;
            margin: 0;
            border: 2px solid #64748b;
            border-radius: 0.25rem;
            accent-color: #334155;
            background: #fff;
            flex-shrink: 0;
        }

        .performance-legend-swatch {
            display: inline-block;
            width: 0.875rem;
            height: 0.875rem;
            border-radius: 9999px;
            background: var(--legend-color, #94a3b8);
            box-shadow: inset 0 0 0 1px #cbd5e1;
            flex-shrink: 0;
        }

        .performance-legend-text {
            white-space: nowrap;
        }

        .performance-table-wrap {
            margin-top: 1rem;
            overflow-x: auto;
        }

        .performance-data-table {
            width: 100%;
            text-align: left;
            font-size: 0.875rem;
            line-height: 1.5;
        }

        .performance-stack {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            min-width: 0;
        }

        #efficiencyMeta.ir-section-meta {
            margin-top: 0.25rem;
        }

        .performance-legend-row {
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-end;
            gap: 0.75rem;
            margin-top: 0.75rem;
            color: #475569;
            font-size: 0.75rem;
            line-height: 1.5;
        }

        .performance-table-scroll {
            overflow-x: auto;
        }

        .performance-table-unit-note {
            margin: 0 0 0.625rem;
            text-align: right;
            color: #64748b;
            font-size: 0.8125rem;
            line-height: 1.5;
        }

        .performance-efficiency-layout,
        .performance-safety-grid,
        .performance-cashflow-grid,
        .performance-per-share-grid {
            gap: 2rem;
        }

        .performance-efficiency-layout,
        .performance-safety-grid,
        .performance-per-share-grid {
            margin-bottom: 2rem;
        }

        .performance-cashflow-grid {
            margin-bottom: 0;
        }

        .performance-segment-layout {
            gap: 1.5rem;
        }

        :is(
            .performance-profitability-card,
            .performance-safety-card,
            .performance-safety-table-panel,
            .performance-cashflow-card,
            .performance-per-share-card,
            .performance-per-share-table-panel,
            .performance-segment-panel,
            .performance-segment-chart
        ) {
            min-width: 0;
        }

        #dividend-trend {
            scroll-margin-top: calc(var(--ir-anchor-target-offset-mobile) + 1.25rem);
        }

        .performance-segment-list {
            display: flex;
            flex-direction: column;
            gap: 0.6875rem;
            font-size: 0.875rem;
            line-height: 1.5;
        }

        #segment .ir-subsection-title--card.ir-subsection-title--rule {
            margin-bottom: 0.625rem;
            padding-bottom: 0.375rem;
            color: #334155;
            border-bottom-color: #e5e7eb;
        }

        .performance-segment-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
        }

        .performance-segment-label {
            display: flex;
            align-items: center;
            min-width: 0;
        }

        .performance-segment-dot {
            width: 0.75rem;
            height: 0.75rem;
            border-radius: 9999px;
            margin-right: 0.5rem;
            flex: 0 0 auto;
            background: var(--segment-color, #94a3b8);
        }

        .performance-segment-value {
            font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
            flex: 0 0 auto;
            color: #0f172a;
        }

        .performance-segment-unit {
            display: inline-block;
            padding: 0.1875rem 0.4375rem;
            border-radius: 0.25rem;
            background-color: #fcfcfd;
            color: #94a3b8;
            font-size: 0.75rem;
            line-height: 1;
            font-weight: 400;
        }

        .performance-chart-frame {
            position: relative;
            height: 16rem;
            margin-top: 0.4rem;
        }

        .performance-panel-pad {
            padding: var(--pf-space-panel-pad);
        }

        .performance-panel-pad-tight {
            padding: var(--pf-space-panel-pad-tight);
        }

        .performance-panel-pad-lg {
            padding: var(--pf-space-panel-pad-lg);
        }

        .performance-panel-strong {
            border-color: #d5dee7;
            background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
            box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
        }

        .performance-panel-strong .ir-subsection-title--card {
            color: #0f172a;
            margin-bottom: 1.35rem;
        }

        .performance-panel-subtle {
            border-color: #e2e8f0;
            background-color: #f8fafc;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
        }

        .performance-panel-subtle .ir-subsection-title--card {
            color: #334155;
            margin-bottom: 0.625rem;
        }

        #cashflow .ir-subsection-title--card {
            color: #0f172a;
            margin-bottom: 1.35rem;
        }

        .performance-panel-muted {
            border: 1px solid #e2e8f0;
            background: linear-gradient(180deg, #fcfcfd 0%, #f8fafc 100%);
            box-shadow: none;
        }

        .performance-main {
            flex-grow: 1;
            padding-top: 1.5rem;
            padding-bottom: 1.5rem;
            background-color: #f8fafc;
        }

        .performance-main-content {
            display: flex;
            flex-direction: column;
            gap: 2rem;
        }

        .performance-main .ir-disclaimer {
            border: 0;
            border-radius: 0;
            background: transparent;
            padding: 0.875rem 0 0;
            color: #64748b;
        }

        .performance-efficiency-note {
            padding: 1rem 1.125rem;
            border: 1px solid #f3e8ff;
            border-radius: 0.5rem;
            background-color: #fdfcff;
        }

        .performance-efficiency-note--inline {
            margin-top: 0.875rem;
            padding: 0.875rem 0 0;
            border: 0;
            border-top: 1px solid #e2e8f0;
            border-radius: 0;
            background: transparent;
        }

        .performance-efficiency-note-title {
            margin: 0 0 0.5rem;
            font-size: 0.875rem;
            line-height: 1.5;
            font-weight: 700;
            color: #7e22ce;
        }

        .performance-overseas-box {
            margin-top: 1rem;
            padding: 0.625rem 0.75rem;
            border: 1px solid #e8eef7;
            border-radius: 0.5rem;
            background-color: #fdfefe;
            text-align: center;
        }

        .performance-overseas-label {
            display: block;
            font-size: 0.8125rem;
            line-height: var(--pf-lh-overseas-label);
            font-weight: 700;
            color: #64748b;
        }

        .performance-overseas-value {
            font-size: 1.75rem;
            line-height: var(--pf-lh-overseas-value);
            font-weight: 700;
            letter-spacing: -0.04em;
            color: #1e40af;
        }

        .performance-overseas-unit {
            font-size: 0.875rem;
            line-height: 1;
        }

        .performance-glossary-section {
            padding-bottom: 2rem;
        }

        .performance-glossary-grid {
            display: grid;
            gap: 0.875rem 2rem;
            font-size: 0.875rem;
            color: #475569;
        }

        .performance-glossary-grid > div {
            padding-bottom: 0.75rem;
            border-bottom: 1px solid #e2e8f0;
        }

        .performance-glossary-term {
            font-weight: 700;
            color: #1f2937;
        }

        .performance-glossary-desc {
            margin-top: 0.25rem;
            color: #475569;
        }

        @media (min-width: 1024px) {
            #dividend-trend {
                scroll-margin-top: var(--ir-anchor-target-offset-desktop);
            }

            .performance-profitability-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .performance-efficiency-layout {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .performance-safety-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .performance-cashflow-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .performance-per-share-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .performance-segment-layout {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 3rem;
                align-items: start;
            }

            .performance-glossary-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (min-width: 640px) {
            .performance-main {
                padding-top: 3rem;
                padding-bottom: 3rem;
            }

            .performance-main-content {
                gap: 4rem;
            }

            .performance-main .ir-disclaimer {
                padding-top: 1rem;
            }
        }
        /* Table Styling */
        .data-table th {
            background-color: #f1f5f9;
            font-weight: var(--pf-fw-table-head);
            color: #475569;
        }

        .data-table tbody td:first-child,
        .data-table tbody th:first-child {
            font-weight: var(--pf-fw-table-first-col);
            color: var(--pf-color-table-first-col);
        }

        .data-table thead th:not(:first-child),
        .data-table tbody td:not(:first-child) {
            font-variant-numeric: tabular-nums;
            font-feature-settings: "tnum" 1;
        }

        .data-table tr:hover {
            background-color: #f8fafc;
        }

        @media (min-width: 768px) {
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table thead th,
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table tbody td:not(:first-child),
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table tbody td:first-child,
            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .data-table tbody th:first-child {
                font-size: var(--pf-fs-table-desktop);
            }
        }
        
        /* Stock Ticker Colors */
        .text-green-custom { color: #16a34a; }
        .text-red-custom { color: #dc2626; }

        .performance-note-efficiency {
            font-size: var(--pf-fs-note-efficiency);
            line-height: var(--pf-lh-note-efficiency);
        }

        .performance-note-cashflow {
            margin-top: 0.75rem;
            color: #64748b;
            font-size: var(--pf-fs-note-cashflow);
            line-height: var(--pf-lh-note-cashflow);
        }

        /* Profitability section mobile optimization (target: 375px) */
        @media (min-width: 768px) {
            .performance-panel-subtle .ir-subsection-title--card {
                margin-bottom: 0.75rem;
            }

            .performance-table-unit-note {
                margin-bottom: 0.75rem;
            }

            :is(.performance-quarter-legend, .performance-legend-row) {
                margin-top: 0.875rem;
            }

            .performance-note-cashflow {
                margin-top: 0.875rem;
            }
        }

        /* Profitability section mobile optimization (target: 375px) */
        @media (max-width: 420px) {
            :is(#profitability, #efficiency, #safety, #per-share, #cashflow, #segment) {
                overflow-x: hidden;
            }

            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) .performance-chart-frame {
                height: 220px;
            }

            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) canvas {
                max-width: 100%;
            }

            :is(#profitability, #efficiency, #safety, #per-share) .data-table {
                width: 100%;
                table-layout: fixed;
            }

            :is(#profitability, #efficiency, #safety, #per-share) .data-table th,
            :is(#profitability, #efficiency, #safety, #per-share) .data-table td {
                white-space: normal;
                word-break: keep-all;
                overflow-wrap: anywhere;
                line-height: var(--pf-lh-mobile-table);
            }

            #profitability .performance-profitability-grid {
                gap: var(--pf-space-card-gap);
            }

            #profitability .performance-profitability-card {
                padding: 1rem 1rem 1.25rem;
                min-width: 0;
            }

            #profitability h3 {
                font-size: 1rem;
            }

            #profitability .chart-unit-inline {
                top: -0.55rem;
                left: 0.2rem;
            }

            :is(#profitability [id^="quarterLegend"], #assetsLegend, #cashflowLegend) {
                justify-content: flex-end;
                gap: var(--pf-space-legend-gap);
                font-size: var(--pf-fs-mobile-legend);
            }

            :is(#profitability [id^="quarterLegend"], #assetsLegend, #cashflowLegend) label {
                font-size: var(--pf-fs-mobile-legend);
                white-space: nowrap;
            }

            :is(#profitability, #efficiency) .data-table {
                font-size: var(--pf-fs-mobile-table-xs);
            }

            :is(#profitability, #efficiency) .data-table th,
            :is(#profitability, #efficiency) .data-table td {
                padding: var(--pf-space-cell-padding-xs);
            }

            /* Keep first column compact for better balance on small screens */
            #profitability .data-table th:first-child,
            #profitability .data-table td:first-child {
                width: var(--pf-size-table-col-first-profitability-mobile);
                min-width: var(--pf-size-table-col-first-profitability-mobile-min);
            }

            .performance-efficiency-layout {
                gap: var(--pf-space-card-gap);
            }

            .performance-stack {
                padding: 0;
                min-width: 0;
            }

            :is(
                .performance-efficiency-layout > .ir-panel,
                .performance-stack > .ir-panel,
                .performance-safety-card,
                .performance-per-share-card,
                .performance-cashflow-card,
                .performance-segment-panel,
                .performance-safety-table-panel,
                .performance-per-share-table-panel
            ) {
                padding: var(--pf-space-card-padding-compact);
            }

            :is(#profitability, #efficiency, #safety, #cashflow, #per-share) h3 {
                display: flex;
            }

            #efficiency h3 {
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                gap: var(--pf-space-heading-gap-col);
                line-height: var(--pf-lh-mobile-heading-alt);
            }

            #efficiency .data-table th:first-child,
            #efficiency .data-table td:first-child {
                width: var(--pf-size-table-col-first-efficiency-mobile);
            }

            #efficiency .data-table th:nth-child(2),
            #efficiency .data-table td:nth-child(2),
            #efficiency .data-table th:nth-child(3),
            #efficiency .data-table td:nth-child(3),
            #efficiency .data-table th:nth-child(4),
            #efficiency .data-table td:nth-child(4) {
                width: var(--pf-size-table-col-rest-efficiency-mobile);
            }

            :is(.performance-safety-grid, .performance-per-share-grid, .performance-cashflow-grid, .performance-segment-layout) {
                gap: var(--pf-space-card-gap);
            }

            :is(#profitability, #safety, #cashflow, #per-share) h3 {
                flex-direction: row;
                align-items: flex-start;
                justify-content: space-between;
                gap: var(--pf-space-heading-gap-row);
                line-height: var(--pf-lh-mobile-heading);
            }

            :is(#safety, #per-share) .data-table { font-size: var(--pf-fs-mobile-table-sm); }

            :is(#safety, #per-share) .data-table th,
            :is(#safety, #per-share) .data-table td {
                padding: var(--pf-space-cell-padding-sm);
            }

            :is(#safety, #per-share) .data-table th:first-child,
            :is(#safety, #per-share) .data-table td:first-child {
                width: var(--pf-size-table-col-first-compact);
            }

            :is(#safety, #per-share) .data-table th:nth-child(2),
            :is(#safety, #per-share) .data-table td:nth-child(2),
            :is(#safety, #per-share) .data-table th:nth-child(3),
            :is(#safety, #per-share) .data-table td:nth-child(3),
            :is(#safety, #per-share) .data-table th:nth-child(4),
            :is(#safety, #per-share) .data-table td:nth-child(4) {
                width: var(--pf-size-table-col-rest-compact);
            }

            :is(#cashflow, #per-share) h3 {
                align-items: center;
            }

            #segmentUnitLabel {
                margin-left: auto;
                white-space: nowrap;
            }

            #segment h3 {
                align-items: center;
                gap: var(--pf-space-heading-gap-row);
            }

        }