:root {
            --bg: #f2f2f2;
            --board: #ececec;
            --card: #ffffff;
            --ink: #3a3a3a;
            --muted: #9a9a9a;
            --line: #d8d8d8;
            --coral: #e88b7a;
            --coral-soft: #f7e3df;
            --coral-border: #efb3a7;
            --up: #5a9a6a;
            --down: #c45a4a;
            --danger: #c45a4a;
            --seasonal: #3b6ea8;
            --growing-bg: #edf4ee;
            --declining-bg: #f8ecea;
            --seasonal-bg: #eaf0f7;
            --stable-bg: #f3f3f3;
            --cooling: #b45309;
            --cooling-bg: #f8efe6;
        }

        * { box-sizing: border-box; }

        body {
            margin: 0;
            min-height: 100vh;
            font-family: "Montserrat", sans-serif;
            color: var(--ink);
            background: var(--bg);
        }

        .topbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            padding: 1.1rem 1.5rem 0.9rem;
            border-bottom: 1px solid var(--line);
            background: #f7f7f7;
        }

        .logo {
            margin: 0;
            display: inline-flex;
            align-items: center;
            gap: 0.1rem;
            text-decoration: none;
            color: var(--ink);
        }

        .logo img {
            display: block;
            height: 32px;
            width: auto;
        }

        .logo-word {
            font-size: 1.63rem;
            font-weight: 700;
            letter-spacing: -0.03em;
            line-height: 1;
        }

        .top-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 0.45rem;
            justify-content: flex-end;
        }

        .top-btn {
            appearance: none;
            border: 1px solid var(--line);
            background: #fff;
            color: #8a8a8a;
            font: inherit;
            font-size: 0.68rem;
            font-weight: 600;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            padding: 0.55rem 0.8rem;
            border-radius: 4px;
            cursor: default;
            text-decoration: none;
        }

        .top-actions form { margin: 0; }

        a.top-btn,
        button.top-btn { cursor: pointer; }

        a.top-btn:hover,
        button.top-btn:hover {
            border-color: var(--coral-border);
            background: var(--coral-soft);
            color: var(--coral);
        }

        .top-btn.active {
            border-color: var(--coral-border);
            background: var(--coral-soft);
            color: var(--coral);
        }

        .board {
            display: grid;
            grid-template-columns: 25% 1fr 25%;
            min-height: calc(100vh - 64px);
        }

        .col {
            padding: 1.1rem 1rem 2rem;
            border-right: 1px solid var(--line);
            background: var(--board);
        }

        .col:last-child { border-right: none; }

        .col-head {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 0.45rem;
            margin-bottom: 0.9rem;
            min-height: 28px;
        }

        .col-title {
            margin: 0;
            font-size: 0.78rem;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--coral);
        }

        .col-count {
            color: var(--muted);
            font-size: 0.78rem;
            font-weight: 600;
        }

        .col-note {
            display: block;
            color: var(--muted);
            font-size: 0.68rem;
            font-weight: 500;
            letter-spacing: 0.02em;
            line-height: 1.35;
        }

        .col-spacer { flex: 1; }

        form { display: grid; gap: 0.7rem; }

        .form-actions {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 0.5rem;
        }

        .form-actions .submit,
        .form-actions .ghost {
            justify-self: unset;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 2.55rem;
            padding-top: 0;
            padding-bottom: 0;
        }

        .form-price-hint {
            margin-left: auto;
            font-size: 0.82rem;
            line-height: 1;
            white-space: nowrap;
        }

        .form-price-hint-sum {
            color: var(--coral);
            font-size: 1.15em;
            font-weight: 700;
        }

        .form-price-hint-unit {
            color: var(--muted);
            font-weight: 400;
        }

        .form-price-card {
            margin-top: -0.15rem;
            padding: 0.45rem 0.65rem;
            border: 1px solid #ececec;
            border-radius: 8px;
            background: #f7f7f7;
            font-size: 0.72rem;
            line-height: 1.45;
            color: #8a8a8a;
        }

        .form-price-card strong {
            color: var(--ink);
            font-weight: 700;
        }

        .region-row {
            display: grid;
            gap: 0.28rem;
        }

        .region-k {
            font-size: 0.58rem;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--muted);
            line-height: 1;
        }

        .region-field {
            position: relative;
            display: flex;
            align-items: center;
            width: 100%;
            min-width: 0;
        }

        .region-field select,
        .region-input {
            width: 100%;
            border: 1px solid var(--line);
            border-radius: 4px;
            background: #fff;
            color: var(--ink);
            font: inherit;
            font-size: 0.72rem;
            font-weight: 600;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            padding: 0.7rem 0.7rem;
            outline: none;
        }

        .region-field select:focus,
        .region-input:focus {
            border-color: var(--coral-border);
        }

        .region-suggest {
            position: absolute;
            top: calc(100% + 4px);
            right: 0;
            left: 0;
            z-index: 20;
            margin: 0;
            padding: 0.25rem 0;
            list-style: none;
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 4px;
            max-height: 16rem;
            overflow: auto;
        }

        .region-suggest button {
            display: block;
            width: 100%;
            border: 0;
            background: transparent;
            color: var(--ink);
            font: inherit;
            font-size: 0.72rem;
            font-weight: 600;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            text-align: left;
            padding: 0.45rem 0.7rem;
            cursor: pointer;
        }

        .region-suggest button:hover {
            background: var(--coral-soft);
            color: var(--coral);
        }

        textarea {
            width: 100%;
            min-height: 180px;
            resize: vertical;
            border: 1px solid var(--line);
            border-radius: 4px;
            background: var(--card);
            color: var(--ink);
            font: inherit;
            font-size: 0.9rem;
            line-height: 1.45;
            padding: 0.85rem 0.9rem;
            outline: none;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
        }

        textarea:focus { border-color: var(--coral-border); }

        .tips-box {
            display: grid;
            gap: 0.5rem;
        }

        .tips-box[hidden] {
            display: none;
        }

        .tips-box .col-head {
            margin-bottom: 0;
            flex-wrap: wrap;
            row-gap: 0.35rem;
        }

        .tips-box textarea {
            min-height: 160px;
        }

        .tips-status {
            margin: 0;
            min-height: 0;
        }

        .meta.tips-status:empty {
            display: none;
        }

        .tips-status.is-error {
            color: var(--danger);
        }

        .submit {
            justify-self: start;
            border: 1px solid var(--coral);
            background: var(--coral);
            color: #fff;
            font: inherit;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            padding: 0.7rem 1rem;
            border-radius: 4px;
            cursor: pointer;
        }

        .submit:hover { filter: brightness(1.03); }

        .meta {
            margin-top: 0.85rem;
            color: var(--muted);
            font-size: 0.75rem;
            line-height: 1.45;
        }

        .analysis-status {
            margin: 0 0 0.45rem;
            color: var(--muted);
            font-size: 0.75rem;
            line-height: 1.4;
        }

        .analysis-track {
            height: 3px;
            margin: 0 0 0.75rem;
            background: #ececec;
            border-radius: 2px;
            overflow: hidden;
        }

        .analysis-track-bar {
            display: block;
            height: 100%;
            width: 0;
            background: var(--coral);
            transition: width 0.2s ease;
        }

        .card.is-pending {
            opacity: 0.72;
        }

        .pending-note {
            margin: 0.45rem 0 0;
            color: var(--muted);
            font-size: 0.75rem;
        }

        .cards { display: grid; gap: 0.65rem; }

        .card {
            background: var(--card);
            border: 1px solid #e6e6e6;
            border-radius: 4px;
            padding: 0.85rem 0.9rem;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
        }

        .card.mark-green {
            border-left: 3px solid #5a9a6a;
        }

        .card.mark-forecast-high {
            border-left: 3px solid #5a9a6a;
            background: #f3f8f4;
        }

        .card.mark-forecast-medium {
            border-left: 3px solid #d4a017;
            background: #fbf6e8;
        }

        .results-head {
            align-items: flex-start;
            justify-content: space-between;
            flex-wrap: nowrap;
            gap: 0.75rem 1rem;
        }

        .results-head-copy {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 0.28rem;
            min-width: 0;
            flex: 1 1 auto;
        }

        .results-head-title {
            display: flex;
            align-items: center;
            gap: 0.45rem;
        }

        .results-head .col-note {
            max-width: 10.5rem;
        }

        .results-filters {
            display: flex;
            flex-wrap: nowrap;
            align-items: flex-end;
            gap: 0.45rem 0.55rem;
            margin: 0 0 0 auto;
            flex: 0 0 auto;
        }

        .select-field {
            display: grid;
            gap: 0.22rem;
            min-width: 8.6rem;
        }

        .select-k {
            font-size: 0.58rem;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--muted);
            line-height: 1;
        }

        .select-ctl {
            position: relative;
        }

        .select-ctl::after {
            content: "";
            position: absolute;
            right: 0.75rem;
            top: 50%;
            width: 0.36rem;
            height: 0.36rem;
            border-right: 1.5px solid #9a9a9a;
            border-bottom: 1.5px solid #9a9a9a;
            transform: translateY(-70%) rotate(45deg);
            pointer-events: none;
        }

        .select-ctl select {
            appearance: none;
            width: 100%;
            border: 1px solid var(--line);
            border-radius: 6px;
            background: #fff;
            color: var(--ink);
            font: inherit;
            font-size: 0.66rem;
            font-weight: 600;
            letter-spacing: 0.01em;
            padding: 0.52rem 1.75rem 0.52rem 0.75rem;
            outline: none;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
            cursor: pointer;
        }

        .select-ctl select:hover {
            border-color: var(--coral-border);
        }

        .select-field:focus-within .select-ctl select {
            border-color: var(--coral);
            box-shadow: 0 0 0 3px var(--coral-soft);
        }

        .select-field:focus-within .select-ctl::after,
        .select-field.is-set .select-ctl::after {
            border-color: var(--coral);
        }

        .select-field.is-set .select-ctl select {
            border-color: var(--coral-border);
            background: #fffdfc;
            color: var(--coral);
        }

        .filter-reset {
            appearance: none;
            border: 0;
            background: none;
            color: var(--muted);
            font: inherit;
            font-size: 0.62rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            padding: 0.55rem 0.1rem;
            cursor: pointer;
        }

        .filter-reset:hover {
            color: var(--coral);
        }

        .card-top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
        }

        .card-top > div:first-child {
            min-width: 0;
            flex: 1;
        }

        .card-meta {
            display: flex;
            align-items: center;
            gap: 0.65rem;
            margin-bottom: 0.5rem;
            min-width: 0;
        }

        .card-actions {
            display: flex;
            align-items: center;
            gap: 0.35rem;
            flex: 0 0 auto;
        }

        .card-meta .growth {
            flex: 0 0 auto;
        }

        .card-date {
            margin-left: auto;
            color: var(--muted);
            font-size: 0.75rem;
            white-space: nowrap;
        }

        .rubric {
            margin-bottom: 0.85rem;
            border: 1px solid #e0e0e0;
            border-radius: 4px;
            background: rgba(255, 255, 255, 0.45);
            padding: 0.55rem;
        }

        .rubric.drag-over {
            border-color: var(--coral-border);
            background: var(--coral-soft);
        }

        .rubric-head {
            display: flex;
            align-items: center;
            gap: 0.4rem;
            margin-bottom: 0.5rem;
            min-height: 22px;
            cursor: pointer;
            user-select: none;
        }

        .rubric.collapsed .rubric-head {
            margin-bottom: 0;
        }

        .rubric-toggle {
            flex: 0 0 auto;
            width: 18px;
            height: 18px;
            padding: 0;
            border: none;
            background: transparent;
            color: var(--coral);
            cursor: pointer;
            display: grid;
            place-items: center;
        }

        .rubric-toggle svg {
            width: 12px;
            height: 12px;
            display: block;
            transition: transform 0.15s ease;
        }

        .rubric.collapsed .rubric-toggle svg {
            transform: rotate(-90deg);
        }

        .rubric-title {
            margin: 0;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--coral);
        }

        .rubric-count {
            color: var(--muted);
            font-size: 0.72rem;
            font-weight: 600;
        }

        .rubric-cards {
            display: grid;
            gap: 0.55rem;
            min-height: 36px;
        }

        .rubric.collapsed .rubric-cards {
            display: none;
        }

        .rubric-empty {
            color: var(--muted);
            font-size: 0.75rem;
            padding: 0.35rem 0.15rem;
        }

        .card[draggable="true"] {
            cursor: grab;
        }

        .card.dragging {
            opacity: 0.45;
            cursor: grabbing;
        }

        .rubric-create {
            display: flex;
            gap: 0.4rem;
            margin-bottom: 0.75rem;
        }

        .rubric-create input {
            flex: 1;
            min-width: 0;
            border: 1px solid var(--line);
            border-radius: 4px;
            background: #fff;
            color: var(--ink);
            font: inherit;
            font-size: 0.8rem;
            padding: 0.45rem 0.6rem;
            outline: none;
        }

        .rubric-create input:focus {
            border-color: var(--coral-border);
        }

        .phrase-row {
            display: flex;
            align-items: center;
            gap: 0.4rem;
            min-width: 0;
            width: fit-content;
            max-width: 100%;
        }

        .phrase {
            margin: 0;
            font-size: 0.95rem;
            font-weight: 600;
            color: #333;
            line-height: 1.3;
            word-break: break-word;
        }

        .phrase-row .phrase {
            width: auto;
            flex: 0 1 auto;
        }

        .icon-btn {
            flex: 0 0 auto;
            width: 22px;
            height: 22px;
            padding: 0;
            border-radius: 3px;
            border: 1px solid var(--coral-border);
            background: #fff;
            color: var(--coral);
            cursor: pointer;
            display: grid;
            place-items: center;
            font-size: 14px;
            line-height: 1;
            font-weight: 600;
        }

        .icon-btn:hover { background: var(--coral-soft); }
        .icon-btn:disabled {
            opacity: 0.55;
            cursor: default;
        }

        .icon-btn.saved {
            background: var(--coral);
            border-color: var(--coral);
            color: #fff;
        }

        .icon-btn.muted {
            border-color: var(--line);
            color: var(--muted);
        }

        .icon-btn.muted:hover {
            color: var(--coral);
            border-color: var(--coral-border);
            background: #fff;
        }

        .icon-btn svg {
            width: 12px;
            height: 12px;
            display: block;
        }

        .icon-btn-lg {
            width: 32px;
            height: 32px;
        }

        .icon-btn-lg svg {
            width: 18px;
            height: 18px;
        }

        .growth {
            font-size: 0.95rem;
            font-weight: 700;
            white-space: nowrap;
            color: var(--muted);
        }

        .growth.up { color: var(--up); }
        .growth.down { color: var(--down); }
        .growth.neutral { color: var(--muted); }

        .card-side {
            display: flex;
            align-items: center;
            gap: 0.7rem;
            flex: 0 0 auto;
            margin: -0.85rem -0.9rem -0.85rem 0;
            padding: 0.85rem 0.9rem;
            align-self: stretch;
            background: #f4f0ea;
            border-left: 1px solid #e4ddd3;
            border-radius: 0 4px 4px 0;
        }

        .freq-unit {
            font-size: 0.58rem;
            font-weight: 700;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            color: #8a8074;
            line-height: 1;
        }

        .card-top > .growth,
        .card-side .growth {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            justify-content: center;
            gap: 0.12rem;
            flex: 0 0 auto;
            color: inherit;
        }

        .median {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 0.28rem;
            width: 5.8rem;
            height: 5.8rem;
            box-sizing: border-box;
            border: 1px solid var(--line);
            border-radius: 4px;
            background: #fff;
            padding: 0.4rem 0.35rem;
            text-align: center;
        }

        .median-label {
            font-size: 0.58rem;
            font-weight: 600;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: var(--muted);
            line-height: 1;
        }

        .median-value {
            font-size: 1.05rem;
            font-weight: 700;
            line-height: 1.05;
            font-variant-numeric: tabular-nums;
            color: var(--ink);
        }

        .freq-box {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 0.3rem;
        }

        .freq-box .metrics {
            margin-top: 0;
            justify-content: center;
            text-align: center;
            gap: 0.15rem 0;
            flex-direction: column;
        }

        .growth-label {
            font-size: 0.62rem;
            font-weight: 600;
            letter-spacing: 0.02em;
            color: var(--muted);
            line-height: 1;
        }

        .growth-value {
            font-size: 1.65rem;
            font-weight: 700;
            line-height: 1.05;
            font-variant-numeric: tabular-nums;
        }

        .growth.up .growth-value { color: var(--up); }
        .growth.down .growth-value { color: var(--down); }
        .growth.neutral .growth-value { color: var(--muted); }

        .trend-block {
            margin-top: 0.7rem;
            width: 100%;
            max-width: 560px;
        }

        .trend-metrics {
            display: grid;
            grid-template-columns: minmax(0, 2fr) minmax(110px, 1fr);
            gap: 0.42rem;
            align-items: stretch;
        }

        .trend-badges {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 0.42rem;
        }

        .trend-badges-side {
            grid-template-columns: 1fr;
        }

        .trend-stat {
            position: relative;
            overflow: hidden;
            background: #fff;
            border: 1px solid rgba(0, 0, 0, 0.07);
            border-radius: 7px;
            padding: 0.52rem 0.62rem 0.5rem 0.72rem;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
            min-width: 0;
        }

        .trend-stat::before {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 3px;
            background: #ddd;
        }

        .trend-stat.tone-positive::before { background: var(--up); }
        .trend-stat.tone-negative::before { background: var(--down); }
        .trend-stat.tone-seasonal::before { background: var(--seasonal); }
        .trend-stat.tone-neutral::before { background: #ccc; }

        .trend-stat-k {
            font-size: 0.56rem;
            font-weight: 700;
            letter-spacing: 0.07em;
            text-transform: uppercase;
            color: #9a9a9a;
            line-height: 1.15;
        }

        .trend-stat-v {
            margin-top: 0.22rem;
            font-size: 0.88rem;
            font-weight: 700;
            line-height: 1.15;
            color: var(--ink);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .trend-stat.tone-positive .trend-stat-v { color: var(--up); }
        .trend-stat.tone-negative .trend-stat-v { color: var(--down); }
        .trend-stat.tone-seasonal .trend-stat-v { color: var(--seasonal); }
        .trend-stat.tone-neutral .trend-stat-v { color: var(--ink); }

        .trend-stat.has-hint,
        .ig-stat.has-hint {
            overflow: visible;
            z-index: 3;
        }

        .stat-v-why {
            display: flex;
            align-items: center;
            gap: 0.32rem;
            overflow: visible;
            white-space: nowrap;
        }

        .stat-why {
            position: relative;
            display: inline-flex;
            flex: 0 0 auto;
        }

        .stat-why-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 1.05rem;
            height: 1.05rem;
            border: 1px solid #d2d2d2;
            border-radius: 99px;
            background: #fff;
            color: #8a8a8a;
            font-size: 0.68rem;
            font-weight: 700;
            line-height: 1;
            cursor: help;
        }

        .stat-why-pop {
            display: none;
            position: absolute;
            right: 0;
            bottom: calc(100% + 8px);
            width: min(280px, 68vw);
            padding: 0.65rem 0.75rem;
            background: #fff;
            border: 1px solid #e8e8e8;
            border-radius: 10px;
            box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
            color: #555;
            font-size: 0.76rem;
            font-weight: 400;
            line-height: 1.45;
            white-space: pre-wrap;
            z-index: 30;
        }

        .stat-why:hover .stat-why-pop,
        .stat-why:focus-within .stat-why-pop {
            display: block;
        }

        .badge-item {
            display: grid;
            gap: 0.18rem;
        }

        .trend-badges .badge-item {
            min-width: 0;
        }

        .ig-hero-badges {
            display: flex;
            flex-wrap: wrap;
            gap: 0.45rem 0.7rem;
            align-items: flex-end;
        }

        .badge-k {
            font-size: 0.58rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--muted);
            line-height: 1;
        }

        .badge {
            display: inline-flex;
            align-items: center;
            border-radius: 999px;
            padding: 3px 10px;
            font-size: 0.7rem;
            font-weight: 700;
            letter-spacing: 0.02em;
            white-space: nowrap;
        }

        .trend-badges .kind-positive,
        .trend-badges .kind-up,
        .trend-badges .kind-growing {
            background: #e8f5ea;
            color: #2f8a44;
        }

        .trend-badges .kind-negative,
        .trend-badges .kind-down,
        .trend-badges .kind-declining {
            background: #fbe8e5;
            color: #c44c3d;
        }

        .kind-growing { background: var(--growing-bg); color: var(--up); }
        .kind-declining { background: var(--declining-bg); color: var(--down); }
        .kind-cooling { background: var(--cooling-bg); color: var(--cooling); }
        .kind-seasonal { background: var(--seasonal-bg); color: var(--seasonal); }
        .kind-stable { background: var(--stable-bg); color: var(--muted); }
        .kind-positive { background: var(--growing-bg); color: var(--up); }
        .kind-negative { background: var(--declining-bg); color: var(--down); }
        .kind-warning { background: var(--cooling-bg); color: var(--cooling); }
        .kind-neutral { background: var(--stable-bg); color: var(--muted); }

        .card.tone-positive {
            border-left: 3px solid #5a9a6a;
            background: #f3f8f4;
        }
        .card.tone-negative {
            border-left: 3px solid #c45a4a;
            background: #fbf4f2;
        }
        .card.tone-warning {
            border-left: 3px solid #d4a017;
            background: #fbf6e8;
        }
        .card.tone-neutral {
            border-left: 3px solid #c8c8c8;
        }

        .trend-metrics {
            display: flex;
            flex-wrap: wrap;
            gap: 0.25rem 0.85rem;
            font-size: 0.75rem;
            font-variant-numeric: tabular-nums;
        }

        .trend-metrics .num { white-space: nowrap; }
        .trend-metrics .pos { color: var(--up); }
        .trend-metrics .neg { color: var(--down); }

        .trend-phase {
            color: var(--muted);
            font-size: 0.72rem;
            line-height: 1.35;
        }

        .trend-headline {
            color: var(--ink);
            font-size: 0.78rem;
            font-weight: 500;
        }

        .trend-spike,
        .ig-spike {
            margin: 0.55rem 0 0;
            padding: 0.65rem 0.75rem;
            border-radius: 8px;
            background: #fbf6e8;
            border: 1px solid #ecd9a8;
            font-size: 0.78rem;
            line-height: 1.45;
            font-weight: 600;
            color: #7a5a10;
        }

        .ig-spike {
            margin-top: 0.65rem;
        }

        .ig {
            display: grid;
            gap: 1.35rem;
        }

        .ig-head {
            display: flex;
            flex-direction: column;
            gap: 0.75rem;
            align-items: stretch;
        }

        .ig-chart-box {
            height: 190px;
            min-width: 0;
            padding: 0.45rem 0.5rem 0.35rem;
            border: 1px solid #ececec;
            border-radius: 12px;
            background: #fafafa;
        }

        .ig-chart-box-wide {
            width: 100%;
            height: 220px;
        }

        .forecast-disclaimer {
            margin: 0.4rem 0 0;
            font-size: 0.68rem;
            line-height: 1.35;
            color: #9a9a9a;
        }

        .ig-details-chart {
            display: block;
            width: 100% !important;
            height: 100% !important;
        }

        .ig-head .ig-query {
            margin: 0;
            padding-right: 0;
        }

        .ig-section-metrics {
            margin-top: 0;
        }

        .ig-panel {
            background: #f7f7f7;
            border: 1px solid #ececec;
            border-radius: 12px;
            padding: 0.55rem;
        }

        .ig-section + .ig-section {
            border-top: 1px solid #efefef;
            padding-top: 1.15rem;
        }

        .ig-hero {
            padding: 0.9rem 1rem;
            border-radius: 10px;
            background: linear-gradient(180deg, #fbf8f7 0%, #fff 100%);
            border: 1px solid #f0e6e3;
        }

        .ig-hero-badges {
            display: flex;
            flex-wrap: wrap;
            gap: 0.45rem 0.7rem;
            align-items: flex-end;
            margin-bottom: 0.45rem;
        }

        .ig-lead {
            margin: 0;
            font-size: 0.92rem;
            line-height: 1.45;
            font-weight: 500;
            color: var(--ink);
        }

        .ig-section h4 {
            margin: 0 0 0.65rem;
            font-size: 0.64rem;
            font-weight: 700;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            color: #aaa;
        }

        .ig-stats {
            display: grid;
            gap: 0.45rem;
        }

        .ig-metrics-row {
            display: grid;
            grid-template-columns: minmax(0, 2fr) minmax(140px, 1fr);
            gap: 0.45rem;
            align-items: stretch;
        }

        .ig-stats-1 { grid-template-columns: 1fr; }
        .ig-stats-2 { grid-template-columns: 1fr 1fr; }
        .ig-stats-3 { grid-template-columns: 1fr 1fr 1fr; }
        .ig-stats-4 { grid-template-columns: 1fr 1fr 1fr 1fr; }

        .ig-stat {
            position: relative;
            overflow: hidden;
            background: #fff;
            border: 1px solid rgba(0, 0, 0, 0.06);
            border-radius: 9px;
            padding: 0.8rem 0.85rem 0.75rem 0.95rem;
            min-width: 0;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
        }

        .ig-panel .ig-stat {
            border-color: transparent;
            box-shadow: none;
        }

        .ig-stat::before {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 3px;
            background: #ddd;
        }

        .ig-stat.tone-positive::before { background: var(--up); }
        .ig-stat.tone-negative::before { background: var(--down); }
        .ig-stat.tone-seasonal::before { background: var(--seasonal); }
        .ig-stat.tone-neutral::before { background: #ccc; }

        .ig-stat-k {
            font-size: 0.6rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: #9a9a9a;
        }

        .ig-stat-v {
            margin-top: 0.28rem;
            font-size: 1.28rem;
            font-weight: 700;
            line-height: 1.1;
            font-variant-numeric: tabular-nums;
            color: var(--ink);
        }

        .ig-stat.tone-positive .ig-stat-v { color: var(--up); }
        .ig-stat.tone-negative .ig-stat-v { color: var(--down); }
        .ig-stat.tone-seasonal .ig-stat-v { color: var(--seasonal); }
        .ig-stat.tone-neutral .ig-stat-v { color: var(--ink); }

        .ig-prose {
            margin: 0;
            padding: 0.15rem 0 0.15rem 0.85rem;
            border-left: 3px solid #e8e8e8;
            font-size: 0.84rem;
            line-height: 1.62;
            color: #484848;
            white-space: pre-wrap;
            word-break: break-word;
        }

        .ig-section-text .ig-prose {
            border-left-color: #ececec;
        }

        .ig-stat.llm-report-row {
            display: grid;
            grid-template-columns: minmax(190px, 0.8fr) minmax(0, 1.2fr);
            gap: 0.75rem;
            align-items: start;
            padding-top: 0.6rem;
            padding-bottom: 0.6rem;
        }

        .ig-stat.llm-report-row.llm-report-text {
            grid-template-columns: 1fr;
        }

        .ig-query {
            margin: 0 0 0.15rem;
            font-size: 1.42rem;
            line-height: 1.22;
            font-weight: 700;
            color: var(--ink);
            letter-spacing: -0.02em;
        }

        @media (max-width: 720px) {
            .ig-chart-box-wide {
                height: 190px;
            }
        }

        .llm-report-name {
            font-size: 0.95rem;
            font-weight: 700;
            line-height: 1.25;
            color: var(--ink);
        }

        .llm-report-comment {
            font-size: 0.78rem;
            line-height: 1.45;
            color: #666;
            white-space: pre-wrap;
            word-break: break-word;
        }

        .ig-gauge {
            display: flex;
            gap: 4px;
            margin-top: 0.7rem;
        }

        .ig-gauge i {
            flex: 1;
            height: 8px;
            border-radius: 99px;
            background: #e4e4e4;
        }

        .ig-gauge.tone-up i.on { background: #c5ddc9; }
        .ig-gauge.tone-up i.current { background: var(--up); }
        .ig-gauge.tone-down i.on { background: #ecc9c4; }
        .ig-gauge.tone-down i.current { background: var(--down); }

        .ig-peak { margin-top: 0.7rem; }

        .ig-peak-track {
            position: relative;
            height: 8px;
            border-radius: 99px;
            background: #e8e8e8;
            overflow: visible;
        }

        .ig-peak-fill {
            display: block;
            height: 100%;
            width: var(--peak, 0%);
            border-radius: 99px;
            background: var(--seasonal);
            opacity: 0.35;
        }

        .ig-peak-dot {
            position: absolute;
            top: 50%;
            left: var(--peak, 0%);
            width: 12px;
            height: 12px;
            margin: -6px 0 0 -6px;
            border-radius: 50%;
            background: var(--seasonal);
            box-shadow: 0 0 0 3px #fff;
        }

        .ig-peak-labels {
            display: flex;
            justify-content: space-between;
            margin-top: 0.4rem;
            font-size: 0.62rem;
            font-weight: 700;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .ig-forecast {
            margin-top: 0.7rem;
            background: #f6f6f6;
            border-radius: 10px;
            padding: 0.8rem 0.85rem 0.85rem;
        }

        .ig-forecast-k {
            font-size: 0.62rem;
            font-weight: 700;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .ig-forecast-pills {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 0.4rem;
            margin-top: 0.55rem;
        }

        .ig-forecast-label {
            margin-right: 0.15rem;
            font-size: 0.82rem;
            font-weight: 600;
            color: var(--ink);
        }

        .ig-forecast-dots {
            color: var(--muted);
            font-size: 1.05rem;
            font-weight: 700;
            letter-spacing: 0.08em;
        }

        .ig-forecast .badge {
            font-variant-numeric: tabular-nums;
            font-size: 1.15rem;
            font-weight: 700;
            padding: 0.4rem 0.75rem;
        }

        .ig-range {
            margin-top: 0.7rem;
            background: #f6f6f6;
            border-radius: 10px;
            padding: 0.75rem 0.85rem 0.8rem;
        }

        .ig-range-k {
            font-size: 0.62rem;
            font-weight: 700;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .ig-range-sub {
            margin-top: 0.15rem;
            font-size: 0.72rem;
            color: var(--muted);
        }

        .ig-hbar {
            display: flex;
            align-items: stretch;
            gap: 0.65rem;
            margin-top: 0.65rem;
            min-height: 2.6rem;
        }

        .ig-hbar-now {
            display: flex;
            align-items: center;
            flex: 0 0 auto;
            font-size: 0.62rem;
            font-weight: 700;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .ig-hbar-track {
            position: relative;
            flex: 1;
            min-width: 0;
            border-radius: 6px;
            background: #ececec;
            overflow: hidden;
        }

        .ig-hbar-fill {
            position: absolute;
            inset: 0;
        }

        .ig-hbar-fill.up {
            background: var(--up);
            clip-path: polygon(0 100%, 100% 0, 100% 100%);
        }

        .ig-hbar-fill.down {
            background: var(--down);
            clip-path: polygon(0 0, 0 100%, 100% 100%);
        }

        .ig-hbar-val {
            display: flex;
            align-items: center;
            flex: 0 0 auto;
            max-width: 42%;
            font-size: 0.92rem;
            font-weight: 700;
            font-variant-numeric: tabular-nums;
            line-height: 1.15;
            text-align: right;
        }

        .ig-range.tone-positive .ig-hbar-val { color: var(--up); }
        .ig-range.tone-negative .ig-hbar-val { color: var(--down); }

        .ig-signed {
            display: grid;
            grid-template-columns: 1fr 2px 1fr;
            align-items: stretch;
            height: 6px;
            margin-top: 0.65rem;
        }

        .ig-signed-neg,
        .ig-signed-pos {
            background: #e8e8e8;
            overflow: hidden;
        }

        .ig-signed-neg {
            display: flex;
            justify-content: flex-end;
            border-radius: 99px 0 0 99px;
        }

        .ig-signed-pos { border-radius: 0 99px 99px 0; }

        .ig-signed-neg span,
        .ig-signed-pos span {
            display: block;
            height: 100%;
        }

        .ig-signed-neg span { background: var(--down); border-radius: 99px 0 0 99px; }
        .ig-signed-pos span { background: var(--up); border-radius: 0 99px 99px 0; }

        .ig-signed i {
            width: 2px;
            background: #c4c4c4;
        }

        .ig-level {
            height: 6px;
            margin-top: 0.65rem;
            border-radius: 99px;
            background: #e8e8e8;
            overflow: hidden;
        }

        .ig-level span {
            display: block;
            height: 100%;
            border-radius: 99px;
            background: var(--coral);
        }

        .ig-span span { background: var(--seasonal); }

        .ig-span-labels {
            grid-template-columns: auto 1fr;
        }

        .ig-span-labels span:first-child {
            color: var(--muted);
            font-weight: 500;
            font-size: 0.62rem;
            letter-spacing: 0.02em;
            text-transform: uppercase;
        }

        .ig-span-labels span:nth-child(2),
        .ig-span-labels span:last-child {
            text-align: right;
            color: var(--seasonal);
            font-weight: 600;
            font-size: 0.68rem;
            text-transform: none;
            letter-spacing: 0;
        }

        .ig-horizon {
            list-style: none;
            margin: 0;
            padding: 0.35rem 0 0.15rem;
            display: grid;
            gap: 0.4rem;
            position: relative;
        }

        .ig-horizon-1 { grid-template-columns: 1fr; }
        .ig-horizon-2 { grid-template-columns: 1fr 1fr; }
        .ig-horizon-3 { grid-template-columns: repeat(3, 1fr); }
        .ig-horizon-4 { grid-template-columns: repeat(4, 1fr); }
        .ig-horizon-1::before { display: none; }

        .ig-horizon li {
            display: grid;
            justify-items: center;
            gap: 0.4rem;
            text-align: center;
            position: relative;
            z-index: 1;
        }

        .ig-horizon::before {
            content: "";
            position: absolute;
            left: 12%;
            right: 12%;
            top: 2.05rem;
            height: 2px;
            background: #ececec;
        }

        .ig-horizon-period {
            font-size: 0.62rem;
            font-weight: 700;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .ig-horizon-mark {
            width: 32px;
            height: 32px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            font-size: 0.95rem;
            font-weight: 700;
            background: #f3f3f3;
            color: var(--muted);
            box-shadow: 0 0 0 4px #fff;
        }

        .ig-horizon li.tone-positive .ig-horizon-mark {
            background: var(--growing-bg);
            color: var(--up);
        }
        .ig-horizon li.tone-negative .ig-horizon-mark {
            background: var(--declining-bg);
            color: var(--down);
        }
        .ig-horizon li.tone-warning .ig-horizon-mark {
            background: var(--cooling-bg);
            color: var(--cooling);
        }
        .ig-horizon li.tone-neutral .ig-horizon-mark {
            background: var(--stable-bg);
            color: #7a7a7a;
        }

        .ig-horizon-result {
            font-size: 0.68rem;
            line-height: 1.25;
            font-weight: 600;
            color: var(--ink);
            max-width: 9.5rem;
        }

        .ig-season-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
        }

        .ig-segs {
            display: flex;
            gap: 3px;
            flex: 0 0 auto;
        }

        .ig-segs i {
            width: 18px;
            height: 6px;
            border-radius: 99px;
            background: #e4e4e4;
        }

        .ig-segs i.on { background: #b9c9dc; }
        .ig-segs i.current { background: var(--seasonal); }

        .ig-swing { margin-top: 0.75rem; }

        .ig-swing-track {
            display: grid;
            grid-template-columns: 1fr 2px 1fr;
            height: 10px;
            align-items: stretch;
        }

        .ig-swing-half {
            background: #eef2f6;
            overflow: hidden;
        }

        .ig-swing-half.left {
            display: flex;
            justify-content: flex-end;
            border-radius: 99px 0 0 99px;
        }

        .ig-swing-half.right { border-radius: 0 99px 99px 0; }

        .ig-swing-half span {
            display: block;
            height: 100%;
            background: var(--seasonal);
            opacity: 0.85;
        }

        .ig-swing-track b {
            width: 2px;
            background: #8aa0b8;
        }

        .ig-swing-labels {
            display: grid;
            grid-template-columns: 1fr auto 1fr;
            gap: 0.35rem;
            margin-top: 0.35rem;
            font-size: 0.68rem;
            font-variant-numeric: tabular-nums;
            color: var(--seasonal);
            font-weight: 600;
        }

        .ig-swing-labels span:nth-child(2) {
            color: var(--muted);
            font-weight: 500;
            font-size: 0.62rem;
            letter-spacing: 0.02em;
            text-transform: uppercase;
        }

        .ig-swing-labels span:first-child { text-align: left; }
        .ig-swing-labels span:last-child { text-align: right; }

        .ig-meter {
            list-style: none;
            margin: 0;
            padding: 0.2rem 0 0;
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            position: relative;
        }

        .ig-meter::before {
            content: "";
            position: absolute;
            left: 16%;
            right: 16%;
            top: 0.72rem;
            height: 2px;
            background: #ececec;
        }

        .ig-meter li {
            display: grid;
            justify-items: center;
            gap: 0.4rem;
            position: relative;
            z-index: 1;
            text-align: center;
        }

        .ig-meter-dot {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background: #e4e4e4;
            box-shadow: 0 0 0 4px #fff;
        }

        .ig-meter li.reached .ig-meter-dot { background: #c5c5c5; }
        .ig-meter li.current .ig-meter-dot {
            background: var(--coral);
            box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--coral-soft);
        }

        .ig-meter-label {
            font-size: 0.62rem;
            font-weight: 600;
            color: var(--muted);
            line-height: 1.25;
        }

        .ig-meter li.current .ig-meter-label { color: var(--ink); }

        @media (max-width: 620px) {
            .ig-metrics-row,
            .trend-metrics {
                grid-template-columns: 1fr;
            }

            .ig-stats-2,
            .ig-stats-3,
            .ig-stats-4 { grid-template-columns: 1fr; }
            .ig-stat.llm-report-row { grid-template-columns: 1fr; }
            .ig-horizon-3,
            .ig-horizon-4 { grid-template-columns: 1fr 1fr; }
            .ig-horizon::before { display: none; }
            .ig-hbar { flex-wrap: wrap; }
            .ig-hbar-track { min-width: 46%; min-height: 2.2rem; }
            .ig-hbar-val { max-width: none; margin-left: auto; }
        }

        .metrics {
            margin-top: 0.45rem;
            color: var(--muted);
            font-size: 0.75rem;
            display: flex;
            flex-wrap: wrap;
            gap: 0.35rem 0.85rem;
        }

        .error {
            margin-top: 0.45rem;
            color: var(--danger);
            font-size: 0.78rem;
        }

        .modal {
            position: fixed;
            inset: 0;
            z-index: 40;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 1rem;
        }

        .modal.open { display: flex; }

        .modal-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(80, 80, 80, 0.28);
        }

        .modal-dialog {
            position: relative;
            z-index: 1;
            width: min(960px, 100%);
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 4px;
            padding: 1rem 1.1rem 1rem;
            box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
        }

        .modal-dialog.details-dialog {
            position: relative;
            width: min(780px, 96vw);
            max-height: min(88vh, 860px);
            display: flex;
            flex-direction: column;
            padding: 1.35rem 1.35rem 1.25rem;
            border-radius: 14px;
            border: 1px solid #e4e4e4;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.16);
        }

        .details-body {
            overflow: auto;
            padding-right: 0.1rem;
        }

        .details-modal-head {
            position: absolute;
            top: 0.85rem;
            right: 0.85rem;
            z-index: 2;
            margin: 0;
            min-height: 0;
        }

        .details-modal-head .modal-close {
            width: 30px;
            height: 30px;
            border-radius: 8px;
            border-color: #e8e8e8;
            font-size: 1.25rem;
            color: #aaa;
            background: #fafafa;
        }

        .details-modal-head .modal-close:hover {
            color: var(--coral);
            border-color: var(--coral-border);
            background: #fff;
        }

        .modal-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 1rem;
            margin-bottom: 0.85rem;
        }

        .modal-title {
            margin: 0;
            font-size: 0.95rem;
            font-weight: 600;
            color: #333;
        }

        .modal-close {
            width: 26px;
            height: 26px;
            padding: 0;
            border-radius: 3px;
            border: 1px solid var(--line);
            background: #fff;
            color: var(--muted);
            cursor: pointer;
            font-size: 1.1rem;
            line-height: 1;
        }

        .modal-close:hover {
            color: var(--coral);
            border-color: var(--coral-border);
        }

        .chart-box {
            position: relative;
            height: min(400px, 56vh);
        }

        body.modal-open { overflow: hidden; }

        @media (max-width: 1100px) {
            .board { grid-template-columns: 1fr; }
            .col { border-right: none; border-bottom: 1px solid var(--line); }
            .topbar { align-items: flex-start; flex-direction: column; }
            .results-head { flex-wrap: wrap; }
        }

        .topbar-left {
            display: flex;
            align-items: center;
            gap: 1.25rem;
            flex-wrap: wrap;
        }

        .tabs {
            display: flex;
            gap: 0.4rem;
        }

        a.tab {
            text-decoration: none;
            border: 1px solid var(--line);
            background: #fff;
            color: #8a8a8a;
            font-size: 0.68rem;
            font-weight: 600;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            padding: 0.55rem 0.8rem;
            border-radius: 4px;
        }

        a.tab:hover { color: var(--coral); border-color: var(--coral-border); }

        a.tab.active {
            border-color: var(--coral-border);
            background: var(--coral-soft);
            color: var(--coral);
        }

        .board.board-2 {
            grid-template-columns: minmax(280px, 360px) 1fr;
        }

        .tips-toolbar {
            display: flex;
            flex-wrap: wrap;
            gap: 0.45rem;
            margin-bottom: 0.75rem;
        }

        .tips-toolbar .submit,
        .tips-toolbar .ghost {
            justify-self: unset;
        }

        .ghost {
            border: 1px solid var(--line);
            background: #fff;
            color: var(--coral);
            font: inherit;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            padding: 0.7rem 0.9rem;
            border-radius: 4px;
            cursor: pointer;
        }

        .ghost:hover { border-color: var(--coral-border); background: var(--coral-soft); }

        .ghost.compact {
            font-size: 0.62rem;
            padding: 0.35rem 0.55rem;
        }

        .ghost:disabled,
        .submit:disabled {
            opacity: 0.55;
            cursor: default;
        }

        .tip-item {
            display: flex;
            align-items: flex-start;
            gap: 0.65rem;
            background: var(--card);
            border: 1px solid #e6e6e6;
            border-radius: 4px;
            padding: 0.7rem 0.85rem;
            box-shadow: 0 1px 2px rgba(0,0,0,0.03);
        }

        .tip-item label {
            display: flex;
            gap: 0.65rem;
            align-items: flex-start;
            cursor: pointer;
            width: 100%;
            font-size: 0.9rem;
            line-height: 1.35;
            color: #333;
        }

        .tip-item input {
            margin-top: 0.15rem;
            accent-color: var(--coral);
        }

        .copy-toast {
            position: fixed;
            right: 1rem;
            bottom: 1rem;
            background: #fff;
            border: 1px solid var(--coral-border);
            color: var(--coral);
            padding: 0.65rem 0.9rem;
            border-radius: 4px;
            font-size: 0.78rem;
            font-weight: 600;
            box-shadow: 0 8px 24px rgba(0,0,0,0.08);
            display: none;
            z-index: 50;
        }

        .copy-toast.show { display: block; }