/*
 * 财小云动态示意图（Anatomy 风格的等轴机械图）。
 * 线框与明暗规则取自 Anatomy kit 的 iso.css（MIT License, Copyright (c) 2026 Ryan），
 * 颜色换成设计系统 v1.3「晴空」：冷调蓝灰的明暗 + 晴空蓝亮灯。
 */
.cxy-figure {
    --anatomy-page: #F4F7FB; --anatomy-card: #FFFFFF; --anatomy-text: #4A5A70; --anatomy-strong: #0B1F3A;
    --anatomy-paper: #FFFFFF; --anatomy-face: #FFFFFF; --anatomy-top: #FFFFFF;
    --anatomy-shade-0: #D3DDEA; --anatomy-shade-1: #DEE6F0; --anatomy-shade-2: #E8EEF6; --anatomy-shade-3: #F2F6FB;
    --anatomy-lit-top: #FFFFFF; --anatomy-lit-shade: #E6F0FC;
    --anatomy-hi: #0B1F3A; --anatomy-mid: #7D8EA6; --anatomy-lo: #AFBDCE; --anatomy-faint: #D3DDE9; --anatomy-lit: #006ED6;
    --anatomy-halo: #5A7AA8; --anatomy-halo-opacity: .30; --anatomy-dot: #24344D;
    --anatomy-weight: .6px;
    --anatomy-mono: "Space Grotesk", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    display: grid;
    grid-template-columns: minmax(0, 1.9fr) minmax(300px, 1fr);
    gap: clamp(20px, 3vw, 40px);
    align-items: center;
}
.cxy-fig-stage {
    position: relative;
    margin: 0;
    padding: clamp(14px, 2vw, 24px) clamp(10px, 1.6vw, 20px) 52px;
    border: 1px solid var(--ztc-border, #E3E9F1);
    border-radius: var(--cxy-radius-card, 22px);
    background: linear-gradient(180deg, #FFFFFF 0%, #F7FAFE 100%);
    box-shadow: var(--cxy-shadow, 0 12px 32px rgba(11, 31, 58, .06));
    touch-action: pan-y;
    outline: none;
}
.cxy-figure.is-live .cxy-fig-stage { cursor: ew-resize; }
.cxy-fig-stage:focus-visible { box-shadow: 0 0 0 3px rgba(0, 110, 214, .35), var(--cxy-shadow, 0 12px 32px rgba(11, 31, 58, .06)); }
.cxy-fig-stage .iso-svg { display: block; width: 100%; height: auto; overflow: visible; }
.cxy-fig-chip {
    position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%);
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 14px; border-radius: 999px;
    background: rgba(255, 255, 255, .92); border: 1px solid var(--ztc-border, #E3E9F1);
    color: var(--ztc-text-muted, #4A5A70); font-size: 13px; line-height: 1.4; white-space: nowrap;
    pointer-events: none; transition: color .2s ease, border-color .2s ease, background-color .2s ease;
}
.cxy-fig-chip::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ztc-action, #006ED6); opacity: .85; }
.cxy-fig-chip [data-when="manual"] { display: none; }
.cxy-figure.is-manual .cxy-fig-chip { color: var(--ztc-action-hover, #005BB5); border-color: rgba(0, 110, 214, .35); background: #EEF5FF; }
.cxy-figure.is-manual .cxy-fig-chip [data-when="auto"] { display: none; }
.cxy-figure.is-manual .cxy-fig-chip [data-when="manual"] { display: inline; }
.cxy-figure.is-still .cxy-fig-chip [data-when="auto"] { display: none; }
.cxy-figure.is-still .cxy-fig-chip [data-when="still"] { display: inline; }
.cxy-fig-chip [data-when="still"] { display: none; }
.cxy-figure.is-still.is-manual .cxy-fig-chip [data-when="manual"] { display: none; }
.cxy-figure:not(.is-live) .cxy-fig-chip { display: none; }
/* 触屏设备（没有悬停）换成“拖动”的说法 */
.cxy-fig-chip .for-touch { display: none; }
@media (hover: none) {
    .cxy-fig-chip .for-mouse { display: none; }
    .cxy-fig-chip .for-touch { display: inline; }
}

/* 旁边的说明：字号够大、对比度够，随画面同步 */
.cxy-fig-panel { min-width: 0; color: var(--ztc-text, #24344D); }
.cxy-fig-eyebrow { margin: 0 0 6px; color: var(--ztc-text-muted, #4A5A70); font-size: 14px; letter-spacing: .04em; }
.cxy-fig-month { display: flex; align-items: baseline; gap: 6px; margin: 0 0 14px; color: var(--cxy-heading, #0B1F3A); }
.cxy-fig-month b { font-family: var(--ztc-sans, inherit); font-size: clamp(40px, 4.6vw, 56px); line-height: 1; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.cxy-fig-month span { font-size: 20px; font-weight: 600; }
.cxy-fig-month em { margin-left: 8px; padding: 2px 10px; border-radius: 999px; background: #EEF5FF; color: var(--ztc-action-hover, #005BB5); font-size: 13px; font-style: normal; font-weight: 600; align-self: center; }
.cxy-fig-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.cxy-fig-list li {
    display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 2px 12px; align-items: center;
    padding: 12px 14px; border-radius: 14px; border: 1px solid var(--ztc-border, #E3E9F1); background: #FFFFFF;
    color: var(--ztc-text-muted, #4A5A70); transition: color .25s ease, border-color .25s ease, background-color .25s ease, box-shadow .25s ease;
}
.cxy-fig-list li strong { grid-column: 2; font-size: 16px; line-height: 1.45; font-weight: 600; color: inherit; }
.cxy-fig-list li small { grid-column: 2; font-size: 14px; line-height: 1.5; }
.cxy-fig-list li.is-on { color: var(--ztc-text, #24344D); border-color: rgba(0, 110, 214, .32); background: #F5F9FF; box-shadow: 0 6px 18px rgba(0, 110, 214, .08); }
.cxy-fig-list li.is-on strong { color: var(--cxy-heading, #0B1F3A); }
.cxy-fig-dots { grid-row: 1 / span 2; display: inline-flex; gap: 3px; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: #F0F3F8; }
.cxy-fig-dots i { width: 4px; height: 4px; border-radius: 50%; background: #9AA7B8; }
.cxy-fig-list li.is-on .cxy-fig-dots { background: var(--ztc-action, #006ED6); box-shadow: 0 0 0 4px rgba(0, 110, 214, .12); }
.cxy-fig-list li.is-on .cxy-fig-dots i { background: #FFFFFF; }
.cxy-fig-note { margin: 14px 0 0; color: var(--ztc-text-muted, #4A5A70); font-size: 14px; line-height: 1.65; }
.cxy-fig-links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 14px 0 0; font-size: 15px; }

/* 等轴机械图（Anatomy） */
.cxy-figure .iso-svg path, .cxy-figure .iso-svg circle { vector-effect: non-scaling-stroke; }
.cxy-figure .iso-fill { fill: var(--anatomy-paper); stroke: none; }
.cxy-figure .iso-shade, .cxy-figure .iso-top { stroke: none; }
.cxy-figure .iso-shade[data-shade="0"] { fill: var(--anatomy-shade-0); }
.cxy-figure .iso-shade[data-shade="1"] { fill: var(--anatomy-shade-1); }
.cxy-figure .iso-shade[data-shade="2"] { fill: var(--anatomy-shade-2); }
.cxy-figure .iso-shade[data-shade="3"] { fill: var(--anatomy-shade-3); }
.cxy-figure .iso-top { fill: var(--anatomy-top); }
.cxy-figure .iso-solid[data-lit] > .iso-top { fill: var(--anatomy-lit-top); }
.cxy-figure .iso-solid[data-lit] > .iso-shade { fill: var(--anatomy-lit-shade); }
.cxy-figure .iso-solid[data-lit] > .iso-edge { stroke: var(--anatomy-lit); }
.cxy-figure .iso-halo { fill: var(--anatomy-halo); stroke: none; filter: blur(9px); opacity: var(--anatomy-halo-opacity); transform: translateY(3px); }
.cxy-figure .iso-line { fill: none; stroke: var(--anatomy-lo); stroke-width: var(--anatomy-weight); stroke-linecap: round; stroke-linejoin: round; }
.cxy-figure .iso-line[data-tone="hi"] { stroke: var(--anatomy-hi); }
.cxy-figure .iso-line[data-tone="mid"] { stroke: var(--anatomy-mid); }
.cxy-figure .iso-line[data-tone="lo"] { stroke: var(--anatomy-lo); }
.cxy-figure .iso-line[data-tone="faint"] { stroke: var(--anatomy-faint); }
.cxy-figure .iso-line[data-tone="lit"] { stroke: var(--anatomy-lit); }
.cxy-figure .iso-dots circle { fill: var(--anatomy-dot); stroke: none; opacity: .32; }
.cxy-figure .iso-dots[data-tone="hi"] circle { opacity: .85; }
.cxy-figure .iso-dots[data-tone="mid"] circle { opacity: .45; }
.cxy-figure .iso-dots[data-tone="lo"] circle { opacity: .22; }
.cxy-figure .iso-face-text { fill: var(--anatomy-mid); font-family: var(--anatomy-mono); letter-spacing: .04em; }
.cxy-figure .iso-face-text[data-tone="hi"] { fill: var(--anatomy-hi); }
.cxy-figure .iso-face-text[data-tone="lit"] { fill: var(--anatomy-lit); font-weight: 700; }
.cxy-figure [data-lamp] .iso-top, .cxy-figure [data-lamp] .iso-shade { transition: fill .2s ease; }
.cxy-figure [data-lamp][data-state="on"] .iso-top { fill: var(--anatomy-lit); }
.cxy-figure [data-lamp][data-state="on"] .iso-shade { fill: var(--anatomy-lit); opacity: .82; }
.cxy-figure [data-lamp][data-state="on"] .iso-edge { stroke: var(--anatomy-lit); }
.cxy-figure [data-lamp][data-state="on"] { filter: drop-shadow(0 0 2.5px rgba(0, 110, 214, .55)); }

/* 说明栏里的选项（时刻、地区）与步骤；不在当前档位的文字仍用正文色，靠底色与编号区分 */
.cxy-fig-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 16px; }
.cxy-fig-tabs button {
    appearance: none; min-height: 40px; padding: 7px 16px; border: 1px solid var(--ztc-border, #E3E9F1); border-radius: 999px;
    background: #FFFFFF; color: var(--ztc-text, #24344D); font: inherit; font-size: 15px; line-height: 1.4; cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.cxy-fig-tabs button:hover { border-color: rgba(0, 110, 214, .38); color: var(--ztc-action-hover, #005BB5); }
.cxy-fig-tabs button.is-on { background: var(--ztc-action, #006ED6); border-color: var(--ztc-action, #006ED6); color: #FFFFFF; }
.cxy-fig-tabs button:focus-visible { outline: 3px solid rgba(0, 110, 214, .35); outline-offset: 2px; }
.cxy-fig-title { margin: 0 0 4px; color: var(--cxy-heading, #0B1F3A); font-size: 22px; line-height: 1.45; font-weight: 700; }
.cxy-fig-tier { margin: 0 0 14px; color: var(--ztc-action-hover, #005BB5); font-size: 14px; font-weight: 600; }
.cxy-fig-desc { margin: 14px 0 0; color: var(--ztc-text, #24344D); font-size: 15px; line-height: 1.75; }
.cxy-fig-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.cxy-fig-steps li {
    display: grid; gap: 6px; justify-items: start; padding: 12px 12px 12px 14px;
    border: 1px solid var(--ztc-border, #E3E9F1); border-radius: 14px; background: #FFFFFF; color: var(--ztc-text-muted, #4A5A70);
    transition: color .25s ease, border-color .25s ease, background-color .25s ease, box-shadow .25s ease;
}
.cxy-fig-steps li span {
    display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%;
    background: #F0F3F8; color: var(--ztc-text-muted, #4A5A70); font-size: 13px; font-weight: 700;
}
.cxy-fig-steps li strong { font-size: 16px; line-height: 1.4; font-weight: 600; color: inherit; }
.cxy-fig-steps li.is-done span { background: #EEF5FF; color: var(--ztc-action-hover, #005BB5); }
.cxy-fig-steps li.is-on { color: var(--cxy-heading, #0B1F3A); border-color: rgba(0, 110, 214, .32); background: #F5F9FF; box-shadow: 0 6px 18px rgba(0, 110, 214, .08); }
.cxy-fig-steps li.is-on span { background: var(--ztc-action, #006ED6); color: #FFFFFF; }
.cxy-fig-steps--stack { grid-template-columns: minmax(0, 1fr); }
.cxy-fig-steps--stack li { grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 2px 12px; }
.cxy-fig-steps--stack li span { grid-row: 1 / span 2; }
.cxy-fig-steps--stack li small { grid-column: 2; font-size: 14px; line-height: 1.6; color: inherit; }
/* 海外：法定年度事项与职责分工 */
.cxy-fig-sub { margin: 0 0 8px; color: var(--ztc-text-muted, #4A5A70); font-size: 14px; font-weight: 600; letter-spacing: .04em; }
.cxy-fig-must { display: grid; gap: 8px; margin: 0 0 16px; padding: 0; list-style: none; }
.cxy-fig-must li { position: relative; padding: 10px 12px 10px 34px; border: 1px solid var(--ztc-border, #E3E9F1); border-radius: 12px; background: #FFFFFF; font-size: 15px; line-height: 1.65; }
.cxy-fig-must li::before { content: ""; position: absolute; left: 13px; top: 18px; width: 9px; height: 9px; border-radius: 3px; background: var(--ztc-action, #006ED6); box-shadow: 0 0 0 3px rgba(0, 110, 214, .14); }
.cxy-fig-roles { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 12px; margin: 0; font-size: 14px; line-height: 1.65; }
.cxy-fig-roles dt { color: var(--cxy-heading, #0B1F3A); font-weight: 700; white-space: nowrap; }
.cxy-fig-roles dd { margin: 0; color: var(--ztc-text, #24344D); }
/* 税无忧：印记与镜片 */
.cxy-figure [data-seal] { transition: opacity .2s ease; }
.cxy-figure [data-seal] .iso-fill { fill: var(--anatomy-lit); opacity: .9; }
.cxy-figure [data-lens] .iso-top, .cxy-figure [data-lens] .iso-fill { transition: fill .25s ease; }
.cxy-figure [data-lens][data-state="on"] .iso-top, .cxy-figure [data-lens][data-state="on"] .iso-fill { fill: #DCEEFF; }
.cxy-figure [data-lens][data-state="on"] { filter: drop-shadow(0 0 4px rgba(0, 110, 214, .35)); }
/* 深空版（财税 AI）：深色舞台 + 青色亮灯，说明栏仍是浅色 */
.cxy-figure--deep {
    --anatomy-paper: #0A1E3D; --anatomy-face: #0F2747; --anatomy-top: #10294A;
    --anatomy-shade-0: #08182F; --anatomy-shade-1: #0A1C37; --anatomy-shade-2: #0C203D; --anatomy-shade-3: #0E2443;
    --anatomy-lit-top: #10294A; --anatomy-lit-shade: #0F2747;
    --anatomy-hi: #D6E2F2; --anatomy-mid: #6E86A8; --anatomy-lo: #3B5277; --anatomy-faint: #22385C; --anatomy-lit: #4FD1F0;
    --anatomy-halo: #000814; --anatomy-halo-opacity: .55; --anatomy-dot: #DCE8F7;
}
.cxy-figure--deep .cxy-fig-stage { background: linear-gradient(180deg, #0B2245 0%, #061631 100%); border-color: #17305A; box-shadow: 0 18px 40px rgba(6, 22, 49, .28); }
.cxy-figure--deep .cxy-fig-chip { background: rgba(10, 30, 61, .86); border-color: #22385C; color: #B9C7DA; }
.cxy-figure--deep.is-manual .cxy-fig-chip { background: #0F2A52; color: #8BE4F7; border-color: #2A5A8F; }
.cxy-figure--deep [data-lamp][data-state="on"] { filter: drop-shadow(0 0 3px rgba(79, 209, 240, .75)); }
.cxy-figure [data-beam][data-state="on"] .iso-fill, .cxy-figure [data-beam][data-state="on"] .iso-top, .cxy-figure [data-beam][data-state="on"] .iso-shade { fill: var(--anatomy-lit); }
.cxy-figure [data-beam][data-state="on"] { filter: drop-shadow(0 0 3px rgba(79, 209, 240, .7)); }
.cxy-figure [data-drawer].is-hit > .iso-solid:nth-child(2) > .iso-edge { stroke: var(--anatomy-lit); }
.cxy-figure [data-cite] .iso-fill { fill: var(--anatomy-lit); }
.cxy-figure [data-link] { filter: drop-shadow(0 0 2px rgba(79, 209, 240, .8)); transition: opacity .2s ease; }
.cxy-figure .iso-link-end { fill: var(--anatomy-paper); stroke: var(--anatomy-lit); stroke-width: 1; vector-effect: non-scaling-stroke; }
/* 财税 AI：图下知识库本身的两件事 */
.cxy-fig-more { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; margin-top: clamp(20px, 3vw, 32px); }
.cxy-fig-more > div { min-width: 0; padding: 18px 20px; border: 1px solid var(--ztc-border, #E3E9F1); border-radius: 16px; background: #FFFFFF; }
.cxy-fig-more h3 { margin: 0 0 6px; color: var(--cxy-heading, #0B1F3A); font-size: 18px; line-height: 1.45; }
.cxy-fig-more p { margin: 0; color: var(--ztc-text-muted, #4A5A70); font-size: 15px; line-height: 1.75; }

/* 说明栏里各时刻、各地区的内容叠放在同一格：高度按最长的一块，切换时版面不跳（T97）。
   叠放是默认排法，页面一显示就是这样，刷新时不跳（T98）；浏览器不运行脚本时由页头的 noscript 样式改成依次全部显示 */
.cxy-fig-details { display: grid; }
.cxy-fig-details > .cxy-fig-detail { grid-area: 1 / 1; min-width: 0; }
.cxy-fig-details > .cxy-fig-detail:not(.is-on) { visibility: hidden; }
.cxy-fig-detail-name { display: none; margin: 0 0 6px; color: var(--cxy-heading, #0B1F3A); font-size: 18px; line-height: 1.45; font-weight: 700; }
.cxy-fig-steps--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* 深色舞台的键盘焦点框（T97：原来被舞台阴影盖住） */
.cxy-figure--deep .cxy-fig-stage:focus-visible { box-shadow: 0 0 0 3px rgba(79, 209, 240, .65), 0 18px 40px rgba(6, 22, 49, .28); }

@media (max-width: 1023px) {
    .cxy-figure { grid-template-columns: minmax(0, 1fr); }
    .cxy-fig-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .cxy-fig-stage { padding: 8px 4px 46px; border-radius: 18px; }
    .cxy-fig-steps, .cxy-fig-more { grid-template-columns: minmax(0, 1fr); }
    .cxy-fig-steps:not(.cxy-fig-steps--stack) li { grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 2px 12px; }
    .cxy-fig-title { font-size: 20px; }
    .cxy-fig-list { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .cxy-fig-list li { padding: 10px 12px; }
    .cxy-fig-chip { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .cxy-figure [data-lamp] .iso-top, .cxy-figure [data-lamp] .iso-shade, .cxy-fig-list li, .cxy-fig-chip,
    .cxy-fig-tabs button, .cxy-fig-steps li, .cxy-figure [data-seal], .cxy-figure [data-lens] .iso-top, .cxy-figure [data-lens] .iso-fill, .cxy-figure [data-link] { transition: none; }
}
