#cycle-reading{color-scheme:light;--paper:#f8f5ed;--ink:#304d3e;--muted:#707367;--line:#dcd7c8;--wood:#537860;--fire:#b66451;--earth:#957453;--water:#507f99;--metal:#a9813f;--space:28px;background:var(--paper);color:var(--ink);font:15px/1.65 Arial,"PingFang SC","Microsoft YaHei",sans-serif;padding:32px;max-width:850px;margin:auto;box-sizing:border-box}
    #cycle-reading *{box-sizing:border-box}
    #cycle-reading h1,#cycle-reading h2,#cycle-reading h3,#cycle-reading p{margin:0}
    #cycle-reading .eyebrow{font-size:11px;letter-spacing:.15em;color:#8b7149}
    #cycle-reading h1{font:32px/1.3 Georgia,"Songti SC",serif;margin:10px 0}
    #cycle-reading .identity{font-size:13px;color:var(--muted);margin-bottom:28px}
    #cycle-reading .identity span{white-space:nowrap}
    #cycle-reading .chapter{border-top:1px solid var(--line);padding-top:var(--space)}
    #cycle-reading .period-head{display:flex;justify-content:space-between;align-items:center;gap:16px}
    #cycle-reading h2{font:28px/1.3 Georgia,"Songti SC",serif;letter-spacing:.04em}
    #cycle-reading .quiet{font-size:12px;color:var(--muted)}
    #cycle-reading .badge{display:inline-block;border:1px solid #d8cbb8;padding:4px 10px;color:#846842;font-size:12px;border-radius:20px;white-space:nowrap}
    #cycle-reading .timeline{position:relative;height:110px;margin:22px 0 4px;font-size:12px;color:var(--muted)}
    #cycle-reading .origin{margin:0 0 20px;font-size:14px;color:var(--ink)}
    #cycle-reading .voyage{position:relative;margin:0 16px 28px}
    #cycle-reading .sea{position:absolute;top:44px;left:0;width:100%;height:32px;overflow:visible;z-index:1;pointer-events:none}
    #cycle-reading .sea-base{stroke:#aaa998;fill:none;stroke-width:1.2;vector-effect:non-scaling-stroke}
    #cycle-reading .sea-current{stroke:var(--wood);fill:none;stroke-width:2;vector-effect:non-scaling-stroke}
    #cycle-reading .boat{position:absolute;left:66.6%;top:7px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--wood);z-index:2}
    #cycle-reading .boat-label{font-size:11px;line-height:16px;white-space:nowrap}
    #cycle-reading .boat svg{width:32px!important;height:32px!important;stroke-width:1.5;background:var(--paper)}
    #cycle-reading .decades{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
    #cycle-reading .decades li{position:relative;padding:106px 0 12px;text-align:center;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
    #cycle-reading .decades li>span{position:absolute;top:74px;left:0;transform:translateX(-50%)}
    #cycle-reading .decades li>span.end-year{left:100%}
    #cycle-reading .decades li:before,#cycle-reading .decades .end-dot{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:#a99b7f;top:56px;left:-4px;z-index:2}
    #cycle-reading .decades .end-dot{left:auto;right:-4px}
    #cycle-reading .decades strong{font:22px/1.3 "Songti SC",Georgia,serif;color:var(--muted)}
    #cycle-reading .decades li.current{background:linear-gradient(to bottom,transparent 60px,#e6eadf 60px);color:var(--wood)}
    #cycle-reading .decades li.current strong{color:var(--wood)}
    #cycle-reading .decades li.current:before,#cycle-reading .decades li.current+li:before{background:var(--wood);width:10px;height:10px;top:55px;left:-5px}
    #cycle-reading .start{position:absolute;left:0;top:0}
    #cycle-reading .end{position:absolute;right:0;top:0;text-align:right}
    #cycle-reading .track{position:absolute;top:53px;left:5px;right:5px;height:2px;background:#d9d2bf}
    #cycle-reading .track:before,#cycle-reading .track:after{content:"";position:absolute;top:-3px;width:8px;height:8px;background:#a08a5c;border-radius:50%}
    #cycle-reading .track:before{left:0}#cycle-reading .track:after{right:0}
    #cycle-reading .tick{position:absolute;top:53px;color:var(--fire);width:1px}
    #cycle-reading .tick:before{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:currentColor;left:-4px;top:-4px}
    #cycle-reading .tick span{position:absolute;white-space:nowrap;transform:translateX(-50%);font-size:12px}
    #cycle-reading .this{left:30%}#cycle-reading .this span{bottom:12px}
    #cycle-reading .next{left:40%;color:var(--earth)}#cycle-reading .next span{top:15px}
    #cycle-reading .period-body{background:#eeeee3;border-radius:3px;padding:24px}
    #cycle-reading .period-body h3{font:22px/1.4 "Songti SC",Georgia,serif;text-align:center}
    #cycle-reading .flow{display:grid;grid-template-columns:1fr 42px 1fr 42px 1fr;align-items:center;max-width:440px;margin:24px auto 12px}
    #cycle-reading .node{display:flex;flex-direction:column;align-items:center;gap:8px;position:relative;min-width:0}
    #cycle-reading .orb{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;background:var(--tint);color:var(--tone)}
    #cycle-reading .orb svg{width:28px!important;height:28px!important;stroke-width:1.8}
    #cycle-reading .node .name{font-size:13px;color:var(--tone)}
    #cycle-reading .wood{--tone:var(--wood);--tint:#dce5d6}
    #cycle-reading .fire{--tone:var(--fire);--tint:#eed7cc}
    #cycle-reading .earth{--tone:var(--earth);--tint:#e6dbcd}
    #cycle-reading .water{--tone:var(--water);--tint:#d7e4e9}
    #cycle-reading .metal{--tone:var(--metal);--tint:#eee3cc}
    #cycle-reading .period-elements{display:flex;gap:22px;margin-top:18px;flex-wrap:wrap}
    #cycle-reading .period-element{display:flex;align-items:center;gap:10px;color:var(--tone);font-size:14px}
    #cycle-reading .period-element .orb{width:42px;height:42px}
    #cycle-reading .period-element .orb svg{width:22px!important;height:22px!important}
    #cycle-reading .reading{margin-top:26px;padding-top:24px;border-top:1px solid var(--line)}
    #cycle-reading .reading h3,#cycle-reading .support h3{font:22px/1.4 "Songti SC",Georgia,serif}
    #cycle-reading .reading-intro{font-size:13px;color:var(--muted);margin:8px 0 20px}
    #cycle-reading .chart-compare{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;text-align:center;margin:20px 0 12px}
    #cycle-reading .chart-compare th{font-weight:400;font-size:12px;color:var(--muted);padding:8px 0}
    #cycle-reading .chart-compare .group-title{font-size:13px;color:var(--ink);border-bottom:1px solid var(--line);padding:0 0 12px}
    #cycle-reading .chart-compare td{padding:10px 0;vertical-align:top}
    #cycle-reading .chart-compare .incoming{background:#e6eadf}
    #cycle-reading .chart-compare .you{background:#f1e6dc}
    #cycle-reading .chart-char{display:block;font:26px/1.3 "Songti SC",Georgia,serif;color:var(--tone)}
    #cycle-reading .chart-element{display:flex;align-items:center;justify-content:center;gap:3px;font-size:11px;color:var(--tone);margin-top:6px}
    #cycle-reading .chart-element svg{width:13px!important;height:13px!important}
    #cycle-reading .chart-note{font-size:12px;color:var(--muted);margin-bottom:22px}
    #cycle-reading .chart-note strong{font-weight:500;color:var(--fire)}
    #cycle-reading .period-body .plain-summary{max-width:520px;margin:12px auto 0;text-align:center;font-size:14px}
    #cycle-reading .flow-kicker{text-align:center;font-size:12px;color:var(--wood);margin-bottom:8px}
    #cycle-reading .flow-panel{background:linear-gradient(135deg,#eaf0e8,#f4f0e3 70%,#f5e8dc);overflow:hidden}
    #cycle-reading .flow-scene{position:relative;height:258px;max-width:570px;margin:18px auto 8px;isolation:isolate}
    #cycle-reading .flow-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
    #cycle-reading .element-choice{position:absolute;appearance:none;border:0;background:transparent;padding:8px 0;color:var(--tone);font:inherit;display:flex;align-items:center;flex-direction:column;gap:10px;width:76px;min-width:0;border-radius:8px;transform:translateX(-50%);z-index:2}
    #cycle-reading .element-choice.water{left:12%;top:128px}
    #cycle-reading .element-choice.wood{left:50%;top:35px}
    #cycle-reading .element-choice.fire{left:88%;top:128px}
    #cycle-reading .element-choice .orb{width:72px;height:72px;position:relative;background:radial-gradient(ellipse at center,var(--tint),transparent 72%);border-radius:0}
    #cycle-reading .element-choice .orb svg{width:44px!important;height:44px!important;stroke-width:1.3;transform-origin:50% 90%}
    #cycle-reading .element-choice .name{font-size:13px}
    #cycle-reading .element-choice[aria-pressed="true"] .name{text-decoration:underline;text-decoration-color:var(--tone);text-underline-offset:6px}
    #cycle-reading .scene-leaf{position:absolute;left:50%;top:70px;color:var(--wood);opacity:0;z-index:1;pointer-events:none}
    #cycle-reading .scene-leaf svg{width:23px!important;height:23px!important;stroke-width:1.3}
    #cycle-reading .scene-leaf.leaf-a{--leaf-x:-44px;--leaf-y:-28px;--leaf-angle:-36deg}
    #cycle-reading .scene-leaf.leaf-b{--leaf-x:30px;--leaf-y:-40px;--leaf-angle:26deg}
    #cycle-reading .scene-leaf.leaf-c{--leaf-x:48px;--leaf-y:0px;--leaf-angle:56deg}
    #cycle-reading .flow-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px;padding-top:14px;border-top:1px solid #d8dccd}
    #cycle-reading .flow-caveat{font-size:12px;color:var(--water)}
    #cycle-reading .flow-replay{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:8px 12px;border:1px solid #c7cdbd;border-radius:22px;background:#f8f5ed;color:var(--ink);font:12px/1.4 Arial,"PingFang SC",sans-serif}
    #cycle-reading .flow-replay svg{width:14px!important;height:14px!important}
    #cycle-reading .flow-replay:disabled{opacity:.6}
    #cycle-reading .flow-panel.is-playing .water .orb svg{animation:ef-water-drop 1.6s ease-in-out both}
    #cycle-reading .flow-panel.is-playing .wood .orb svg{animation:ef-leaf-unfold 3.4s 1.3s ease-in-out both}
    #cycle-reading .flow-panel.is-playing .scene-leaf{animation:ef-leaves-open 4.2s 1.6s ease-out both}
    #cycle-reading .flow-panel.is-playing .leaf-b{animation-delay:1.85s}
    #cycle-reading .flow-panel.is-playing .leaf-c{animation-delay:2.1s}
    #cycle-reading .flow-panel.is-playing .fire .orb svg{animation:ef-fire-dance 2.7s 3.4s ease-in-out both}
    @keyframes ef-water-drop{0%,100%{transform:translateY(0)}25%{transform:translateY(-17px) rotate(-8deg)}50%{transform:translateY(4px) scale(.94,1.04)}70%{transform:translateY(-5px)}}
    @keyframes ef-leaf-unfold{0%,100%{transform:rotate(0)}20%{transform:rotate(-18deg) scale(.92)}50%{transform:rotate(12deg) scale(1.1)}75%{transform:rotate(-5deg)}}
    @keyframes ef-leaves-open{0%{opacity:0;transform:translate(-12px,0) scale(.15) rotate(0)}28%,65%{opacity:.65;transform:translate(var(--leaf-x),var(--leaf-y)) scale(1) rotate(var(--leaf-angle))}100%{opacity:0;transform:translate(var(--leaf-x),calc(var(--leaf-y) - 15px)) scale(.8) rotate(var(--leaf-angle))}}
    @keyframes ef-fire-dance{0%,100%{transform:scale(1);filter:drop-shadow(0 0 0 transparent)}20%{transform:scale(1.12,.95) rotate(-7deg)}40%{transform:scale(.94,1.2) rotate(5deg);filter:drop-shadow(0 0 12px #d69b67)}60%{transform:scale(1.08,1.04) rotate(-4deg)}80%{transform:scale(.98,1.12) rotate(3deg)}}
    @media(max-width:420px){#cycle-reading .flow-scene{height:238px}#cycle-reading .element-choice{width:60px}#cycle-reading .element-choice .orb{width:56px;height:64px}#cycle-reading .element-choice .orb svg{width:38px!important;height:38px!important}}
    @media(prefers-reduced-motion:reduce){#cycle-reading .flow-panel.is-playing .orb svg,#cycle-reading .flow-panel.is-playing .scene-leaf{animation:none!important}}
    #cycle-reading .support{margin-top:26px;padding-top:24px;border-top:1px solid var(--line)}
    #cycle-reading .support-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
    #cycle-reading .rating-pending{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
    #cycle-reading .rating-pending svg{width:18px!important;height:18px!important}
    #cycle-reading .support p{font-size:13px;color:var(--muted);margin-top:10px}
    #cycle-reading .focus .orb{outline:1px solid var(--tone);outline-offset:5px}
    #cycle-reading .arrow{color:#8a917b;text-align:center;font:24px/1 Georgia,serif;position:relative;padding-bottom:22px}
    #cycle-reading .arrow small{position:absolute;top:22px;left:50%;transform:translateX(-50%);font:11px/1.3 Arial,"PingFang SC",sans-serif;white-space:nowrap}
    #cycle-reading .caption{text-align:center;font-size:13px;color:var(--muted)}
    #cycle-reading .relation{margin:16px auto 0;display:flex;justify-content:center;gap:8px;align-items:center;font-size:12px;color:var(--water)}
    #cycle-reading .relation .rule{height:1px;width:38px;background:currentColor}
    #cycle-reading .years{display:grid;grid-template-columns:1fr;gap:24px;margin-top:32px}
    #cycle-reading .year{padding-top:20px;border-top:2px solid var(--tone)}
    #cycle-reading .year-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
    #cycle-reading .year-num{font:30px/1.2 Georgia,serif;color:var(--tone)}
    #cycle-reading .year h3{font:22px/1.4 "Songti SC",Georgia,serif;margin-bottom:4px}
    #cycle-reading .annual-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(120px,.8fr);gap:24px;align-items:center;padding:8px 0 26px}
    #cycle-reading .annual-year{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}
    #cycle-reading .annual-hero h3{font-size:34px;margin:0 0 16px;color:var(--ink)}
    #cycle-reading .annual-elements{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
    #cycle-reading .annual-element{display:inline-flex;align-items:center;gap:6px;background:#eed7cc80;color:var(--fire);padding:6px 10px;border-radius:18px;font-size:13px;white-space:nowrap}
    #cycle-reading .annual-element svg{width:18px;height:18px;flex-shrink:0}
    #cycle-reading .zodiac-art{margin:0;text-align:center;min-width:0}
    #cycle-reading .zodiac-art .zodiac-window{display:block;width:100%;max-width:150px;margin:auto;aspect-ratio:1;background-size:400% 300%;background-position:66.6666667% 50%;background-repeat:no-repeat}
    #cycle-reading .zodiac-art figcaption{margin-top:8px;color:var(--fire);font-size:13px}
    #cycle-reading .annual-reading{padding-top:22px;border-top:1px solid var(--line)}
    @media(max-width:460px){#cycle-reading .annual-hero{grid-template-columns:minmax(0,1fr) 96px;gap:12px}#cycle-reading .annual-hero h3{font-size:28px}#cycle-reading .annual-element{padding:5px 8px}#cycle-reading .annual-elements{gap:6px}}
    #cycle-reading .year .flow{grid-template-columns:1fr 24px 1fr 24px 1fr;max-width:440px;margin:26px auto 18px}
    #cycle-reading .year .orb{width:52px;height:52px}
    #cycle-reading .year .orb svg{width:24px!important;height:24px!important}
    #cycle-reading .year .name{font-size:12px}
    #cycle-reading .year .arrow{font-size:20px}
    #cycle-reading .year .summary{font-size:13px;color:var(--muted);min-height:44px}
    #cycle-reading .tag{font-size:11px;color:var(--tone);white-space:nowrap}
    #cycle-reading details{margin-top:16px;font-size:12px;color:var(--muted)}
    #cycle-reading summary{color:var(--ink);padding:8px 0;min-height:40px}
    #cycle-reading details p{padding:8px 0}
    #cycle-reading .foot{margin-top:26px;padding-top:16px;border-top:1px solid var(--line);font-size:11px;color:var(--muted)}
    @media(max-width:580px){#cycle-reading{padding:24px 18px}#cycle-reading h1{font-size:27px}#cycle-reading .years{grid-template-columns:1fr;gap:26px}#cycle-reading .period-body{padding:22px 14px}#cycle-reading .flow{grid-template-columns:1fr 26px 1fr 26px 1fr}#cycle-reading .orb{width:58px;height:58px}#cycle-reading .year .flow{max-width:340px}#cycle-reading .year .summary{min-height:0}}
    #cycle-reading .period-head{align-items:flex-start;flex-wrap:wrap;row-gap:8px}
    #cycle-reading .period-head .quiet{letter-spacing:.03em}
    #cycle-reading .cycle-han{font-size:22px;color:var(--muted);margin-left:8px}
    #cycle-reading .decades strong small{display:block;font:11px/1.4 Arial,sans-serif;margin-top:5px;white-space:nowrap}
    #cycle-reading .chart-pronunciation{display:block;font-size:11px;color:var(--muted);margin-top:3px}
    #cycle-reading .chart-element{flex-wrap:wrap;gap:3px}
    #cycle-reading .chart-compare th{overflow-wrap:normal;padding-left:2px;padding-right:2px}
    #cycle-reading .annual-hero .annual-year{flex-wrap:wrap;gap:4px 10px}
    #cycle-reading .annual-han{display:block;font-size:22px;color:var(--fire);margin-top:4px}
    #cycle-reading .flow-footer{align-items:center}
    #cycle-reading .element-choice .name{font-size:12px;line-height:1.4}
    #cycle-reading .year .flow{grid-template-columns:1fr 32px 1fr 32px 1fr}
    #cycle-reading .year .arrow small{font-size:11px;line-height:1.2}
    #cycle-reading .year .name{text-align:center;line-height:1.4}
    #cycle-reading .year .summary{min-height:0}
    @media(max-width:420px){#cycle-reading .flow-scene{height:252px}#cycle-reading .support-heading h3{width:100%}#cycle-reading .chart-element{flex-direction:column;gap:4px}#cycle-reading .period-elements{gap:14px}#cycle-reading .period-element{font-size:13px}#cycle-reading .annual-hero h3{font-size:27px}}
/* voyage-refinement:start */
    #cycle-reading .voyage{--voyage-tone:var(--wood);margin:8px 16px 30px;isolation:isolate}
    #cycle-reading .sea{top:44px;z-index:1}
    #cycle-reading .sea-base{stroke:#b8b7a8;stroke-width:1;stroke-linecap:round}
    #cycle-reading .sea-current{stroke:var(--voyage-tone);stroke-width:1.5;stroke-linecap:round}
    #cycle-reading .boat{top:55px;transform:translate(-50%,-100%);display:block;width:26px;height:26px;color:var(--voyage-tone);z-index:3}
    #cycle-reading .boat-label{position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);font:11px/14px Arial,sans-serif;letter-spacing:.04em;white-space:nowrap;color:var(--voyage-tone)}
    #cycle-reading .boat svg{display:block;width:26px!important;height:26px!important;stroke-width:1.35;background:transparent}
    #cycle-reading .decades li{padding:103px 0 15px;isolation:isolate;font-size:11px}
    #cycle-reading .decades li>span{top:73px;z-index:2;letter-spacing:.025em}
    #cycle-reading .decades strong{position:relative;z-index:2;display:block;font-size:20px;line-height:1.35;color:#7a7f72;font-weight:400}
    #cycle-reading .decades strong small{margin-top:5px;font-size:11px;line-height:1.4;letter-spacing:.01em}
    #cycle-reading .decades li:before,#cycle-reading .decades .end-dot{width:5px;height:5px;top:57.5px;left:-2.5px;background:#aaa58e}
    #cycle-reading .decades .end-dot{left:auto;right:-2.5px}
    #cycle-reading .decades li.current{background:none;color:var(--voyage-tone)}
    #cycle-reading .decades li.current:after{content:"";position:absolute;z-index:0;pointer-events:none;top:44px;bottom:-5px;left:-8px;right:-8px;background:linear-gradient(to bottom,color-mix(in srgb,var(--voyage-tone) 28%,transparent) 17px,color-mix(in srgb,var(--voyage-tone) 9%,transparent) calc(92% + 1.36px),transparent 100%);clip-path:polygon(0 16px,calc(0% + 8px) 16px,calc(1.5625% + 7.75px) 15.334px,calc(3.125% + 7.5px) 14.7109px,calc(4.6875% + 7.25px) 14.1309px,calc(6.25% + 7px) 13.5938px,calc(7.8125% + 6.75px) 13.0996px,calc(9.375% + 6.5px) 12.6484px,calc(10.9375% + 6.25px) 12.2402px,calc(12.5% + 6px) 11.875px,calc(14.0625% + 5.75px) 11.5527px,calc(15.625% + 5.5px) 11.2734px,calc(17.1875% + 5.25px) 11.0371px,calc(18.75% + 5px) 10.8438px,calc(20.3125% + 4.75px) 10.6934px,calc(21.875% + 4.5px) 10.5859px,calc(23.4375% + 4.25px) 10.5215px,calc(25% + 4px) 10.5px,calc(26.5625% + 3.75px) 10.5215px,calc(28.125% + 3.5px) 10.5859px,calc(29.6875% + 3.25px) 10.6934px,calc(31.25% + 3px) 10.8438px,calc(32.8125% + 2.75px) 11.0371px,calc(34.375% + 2.5px) 11.2734px,calc(35.9375% + 2.25px) 11.5527px,calc(37.5% + 2px) 11.875px,calc(39.0625% + 1.75px) 12.2402px,calc(40.625% + 1.5px) 12.6484px,calc(42.1875% + 1.25px) 13.0996px,calc(43.75% + 1px) 13.5938px,calc(45.3125% + 0.75px) 14.1309px,calc(46.875% + 0.5px) 14.7109px,calc(48.4375% + 0.25px) 15.334px,calc(50% + 0px) 16px,calc(51.5625% - 0.25px) 16.666px,calc(53.125% - 0.5px) 17.2891px,calc(54.6875% - 0.75px) 17.8691px,calc(56.25% - 1px) 18.4062px,calc(57.8125% - 1.25px) 18.9004px,calc(59.375% - 1.5px) 19.3516px,calc(60.9375% - 1.75px) 19.7598px,calc(62.5% - 2px) 20.125px,calc(64.0625% - 2.25px) 20.4473px,calc(65.625% - 2.5px) 20.7266px,calc(67.1875% - 2.75px) 20.9629px,calc(68.75% - 3px) 21.1562px,calc(70.3125% - 3.25px) 21.3066px,calc(71.875% - 3.5px) 21.4141px,calc(73.4375% - 3.75px) 21.4785px,calc(75% - 4px) 21.5px,calc(76.5625% - 4.25px) 21.4785px,calc(78.125% - 4.5px) 21.4141px,calc(79.6875% - 4.75px) 21.3066px,calc(81.25% - 5px) 21.1562px,calc(82.8125% - 5.25px) 20.9629px,calc(84.375% - 5.5px) 20.7266px,calc(85.9375% - 5.75px) 20.4473px,calc(87.5% - 6px) 20.125px,calc(89.0625% - 6.25px) 19.7598px,calc(90.625% - 6.5px) 19.3516px,calc(92.1875% - 6.75px) 18.9004px,calc(93.75% - 7px) 18.4062px,calc(95.3125% - 7.25px) 17.8691px,calc(96.875% - 7.5px) 17.2891px,calc(98.4375% - 7.75px) 16.666px,calc(100% - 8px) 16px,100% 16px,100% 100%,0 100%);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
    #cycle-reading .decades li.current strong{color:var(--voyage-tone)}
    #cycle-reading .decades li.current:before,#cycle-reading .decades li.current+li:before{width:6px;height:6px;top:57px;left:-3px;background:var(--voyage-tone)}
    #cycle-reading .decades li.current+li>span:not(.end-year){color:var(--voyage-tone)}
    @media(max-width:420px){#cycle-reading .voyage{margin-left:13px;margin-right:13px}#cycle-reading .decades strong{font-size:18px}#cycle-reading .boat{width:24px;height:24px}#cycle-reading .boat svg{width:24px!important;height:24px!important}#cycle-reading .boat-label{bottom:calc(100% + 6px)}}
/* voyage-refinement:end */
/* decade-reading-standard:start */
    #cycle-reading .chapter{container-type:inline-size}
    #cycle-reading .voyage-verse{margin:2px 0 30px;text-align:center;font-family:Baskerville,"Palatino Linotype","Book Antiqua",Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(13px,4cqw,27px);line-height:1.55;letter-spacing:.005em;color:var(--ink);text-rendering:optimizeLegibility}
    #cycle-reading .voyage-verse>span{display:block;white-space:nowrap}
    #cycle-reading .voyage-verse>span+span{margin-top:3px}
    #cycle-reading .period-body .life-note{font-size:14px;line-height:1.8;max-width:500px;margin:20px auto 0;text-align:center;color:var(--ink)}
    #cycle-reading .period-body h3{font:22px/1.4 Georgia,"Songti SC",serif;max-width:500px;margin-left:auto;margin-right:auto}
    #cycle-reading .decade-reading{padding:24px}
    #cycle-reading .decade-reading .flow{margin-top:28px;margin-bottom:28px}
    #cycle-reading .decade-reading .eyebrow{font:12px/1.6 Arial,sans-serif;letter-spacing:.04em;margin-bottom:8px;color:var(--earth)}
    #cycle-reading .support{margin-top:26px;padding-top:24px}
    #cycle-reading .support h3{font:22px/1.4 Georgia,"Songti SC",serif}
    #cycle-reading .support p{max-width:620px}
    @media(max-width:580px){#cycle-reading .decade-reading{padding:22px 14px}#cycle-reading .period-body .life-note{font-size:13px}}
/* decade-reading-standard:end */
  /* Application integration: shared dynamic geometry, isolated from homepage styles. */
#cycles{max-width:1000px;margin:0 auto;padding:32px 16px 70px}
#cycles[hidden]{display:none!important}
.cycle-toolbar{display:flex;justify-content:space-between;gap:12px;margin:0 auto 22px;max-width:850px}
.cycle-toolbar button{min-height:44px;border:0;background:#304d3e;color:#faf7ef;transition:background-color .18s ease}
.cycle-toolbar button:hover{background:#244133}
.cycle-toolbar button[data-stage="begin"]{background:#e2dccb;color:#304d3e}
.cycle-toolbar button[data-stage="begin"]:hover{background:#d6ceb9}
.cycle-toolbar button:focus-visible{outline:2px solid #8b7046;outline-offset:4px}
#cycle-reading{width:100%;max-width:850px}
#cycle-reading header{display:block;position:static;background:transparent;border:0;padding:0;min-height:0}
#cycle-reading .voyage{color:var(--voyage-tone)}
#cycle-reading .cycle-sea{height:150px;color:var(--voyage-tone)}
#cycle-reading .decades li.current:after{display:none}
#cycle-reading .decades{min-height:194px}
#cycle-reading .decades strong{font-weight:400}
#cycle-reading .origin{text-align:center;font-size:12px;color:var(--muted);margin-bottom:8px}
#cycle-reading .chart-compare{margin-top:20px}
#cycle-reading .period-body .flow-kicker{font-size:11px;letter-spacing:.08em}
#cycle-reading .element-choice{cursor:pointer;box-shadow:none;line-height:1.4;min-height:44px;transition:none}
#cycle-reading .element-choice:hover{background:transparent;filter:brightness(.93)}
#cycle-reading button:focus-visible,#cycle-reading summary:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
#cycle-reading .element-choice .name{max-width:98px;text-align:center}
#cycle-reading .element-choice .orb{background:radial-gradient(ellipse at center,var(--tint),transparent 72%)}
#cycle-reading .relation-lines{overflow:visible}
#cycle-reading .flow-link,#cycle-reading .flow-travel{fill:none;stroke:var(--edge-tone);stroke-width:1.4;stroke-linecap:round}
#cycle-reading .flow-link{opacity:.24}
#cycle-reading .flow-link.constraint{stroke-dasharray:4 5}
#cycle-reading .flow-travel{stroke-width:3;opacity:0;stroke-dasharray:6 94;stroke-dashoffset:6}
#cycle-reading .is-playing .flow-travel{animation:cycle-flow-travel 3.3s var(--delay) ease-in-out both}
#cycle-reading .is-playing .element-choice .orb svg{animation:cycle-node-breathe 6.5s ease-in-out both}
#cycle-reading .flow-panel{margin-top:22px}
#cycle-reading .flow-panel[data-profile="wu-ji-chou"]{background:linear-gradient(135deg,#f3e8dc,#eeeadf 65%,#e9e2d4)}
#cycle-reading .flow-scene{height:260px}
#cycle-reading .flow-footer{border-top:1px solid var(--line)}
#cycle-reading .flow-caveat{font-size:12px;max-width:330px}
#cycle-reading .annual-reading{padding:24px;border-top:0}
#cycle-reading .annual-hero h3{font:34px/1.3 Georgia,serif}
#cycle-reading .annual-han{color:var(--tone)}
#cycle-reading .annual-elements{display:flex;gap:12px}
#cycle-reading .annual-elements .period-element{font-size:13px}
#cycle-reading .annual-elements .orb{width:28px;height:28px}
#cycle-reading .annual-elements .orb svg{width:18px!important;height:18px!important}
#cycle-reading .cycle-empty{padding:26px 0;border-top:1px solid var(--line)}
#cycle-reading .cycle-empty p{margin:16px 0 22px}
#cycle-reading .sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
#cycle-reading .foot{font-size:11px}
@keyframes cycle-flow-travel{0%{opacity:0;stroke-dashoffset:6}15%{opacity:.7}85%{opacity:.7}100%{opacity:0;stroke-dashoffset:-100}}
@keyframes cycle-node-breathe{0%,100%{transform:scale(1)}30%,65%{transform:scale(1.1) translateY(-3px)}}
@media(max-width:580px){#cycles{padding:20px 8px 40px}.cycle-toolbar{padding:0 10px}.cycle-toolbar button{font-size:12px;padding:9px 11px}#cycle-reading{padding:24px 12px}#cycle-reading .annual-reading{padding:22px 14px}#cycle-reading .period-body h3{font-size:21px}#cycle-reading .flow-caveat{max-width:100%}#cycle-reading .flow-footer{align-items:flex-start}#cycle-reading .flow-replay{margin-left:auto}#cycle-reading .period-elements{gap:12px}}
@media(max-width:360px){#cycle-reading .decades strong small{font-size:9px}#cycle-reading .decades li>span{font-size:10px}#cycle-reading .annual-hero{grid-template-columns:minmax(0,1fr) 82px}#cycle-reading .annual-elements .period-element{font-size:12px}#cycle-reading .chart-compare th{font-size:10px}#cycle-reading .chart-char{font-size:23px}}
@media(prefers-reduced-motion:reduce){#cycle-reading .is-playing .flow-travel,#cycle-reading .is-playing .element-choice .orb svg{animation:none!important}}

#cycle-reading h1,#cycle-reading h2,#cycle-reading h3{color:var(--ink)}
#cycle-reading .year .element-choice .orb{width:72px;height:72px}
#cycle-reading .year .element-choice .orb svg{width:44px!important;height:44px!important}
@media(max-width:420px){#cycle-reading .year .element-choice .orb{width:56px;height:64px}#cycle-reading .year .element-choice .orb svg{width:38px!important;height:38px!important}}

#cycle-reading .rating-confirmed{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:#8b6a35;font:14px/1.5 Arial,sans-serif}
#cycle-reading .rating-confirmed>span:first-child{font-size:22px;letter-spacing:2px}
#cycle-reading .rating-empty{color:#aaa18c}

/* Static visual grammar: a connecting bridge versus same-element accumulation. */
#cycle-reading .static-connection{background:#eef2e9}
#cycle-reading .static-accumulation{background:#eee5d8}
#cycle-reading .static-accumulation .flow-kicker{color:#87694c}
#cycle-reading .static-diagram{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1.2fr) 28px minmax(0,1fr);align-items:center;max-width:550px;gap:12px;margin:42px auto 32px;text-align:center;min-height:160px}
#cycle-reading .diagram-node{display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--tone);min-width:0}
#cycle-reading .diagram-icon{display:grid;place-items:center;width:72px;height:72px}
#cycle-reading .diagram-icon svg{width:46px!important;height:46px!important}
#cycle-reading .diagram-label{font:13px/1.4 Arial,sans-serif}
#cycle-reading .bridge-node{padding:22px 8px 16px;border:1px solid #91aa8e;border-radius:50px 50px 12px 12px;background:#dce7d6}
#cycle-reading .bridge-label{display:block;font:9px/1.5 Arial,sans-serif;letter-spacing:.12em;color:#537860;margin-top:10px}
#cycle-reading .connection-arrow{font:28px/1 Georgia,serif;color:#78927b}
#cycle-reading .supported-node .diagram-icon{background:#f2dfd1;border:1px solid #cba58e;border-radius:50%}
#cycle-reading .addition-sign{font:26px/1 Georgia,serif;color:#9b8062;padding-bottom:30px}
#cycle-reading .earth-layers{position:relative;isolation:isolate;width:98px;height:102px;display:grid;place-items:center}
#cycle-reading .earth-layers i,#cycle-reading .earth-layers .diagram-icon{position:absolute;width:78px;height:62px;border:1px solid #a78965;border-radius:9px;background:#d5bfa0;transform:skewY(-8deg)}
#cycle-reading .earth-layers i:first-child{top:39px;background:#c7ad88}
#cycle-reading .earth-layers i:nth-child(2){top:22px;background:#d6bf9e}
#cycle-reading .earth-layers .diagram-icon{top:5px;background:#ead8bb}
#cycle-reading .earth-layers svg{transform:skewY(8deg)}
#cycle-reading .static-context{font:12px/1.5 Arial,sans-serif;text-align:center;color:#87694c;margin:-10px auto 24px}
#cycle-reading .static-panel .element-choice{cursor:default}
#cycle-reading .static-panel .flow-link{stroke-dasharray:none;opacity:.65}
@media(max-width:580px){
 #cycle-reading .static-diagram{gap:5px;grid-template-columns:minmax(0,1fr) 18px minmax(0,1.15fr) 18px minmax(0,1fr);margin:28px auto 24px}
 #cycle-reading .diagram-icon{width:48px;height:58px}
 #cycle-reading .diagram-icon svg{width:36px!important;height:36px!important}
 #cycle-reading .diagram-label{font-size:11px}
 #cycle-reading .bridge-node{padding:15px 3px 12px}
 #cycle-reading .connection-arrow,#cycle-reading .addition-sign{font-size:22px}
 #cycle-reading .earth-layers{width:66px;height:88px}
 #cycle-reading .earth-layers i,#cycle-reading .earth-layers .diagram-icon{width:56px;height:48px}
 #cycle-reading .static-context{font-size:11px}
}

/* Automatic, neutral relationship illustrations. These shapes never imply a rating. */
#cycle-reading .relation-lane{display:grid;grid-template-columns:minmax(0,1fr) 110px minmax(0,1fr);align-items:center;gap:20px;max-width:530px;min-height:180px;margin:28px auto;text-align:center}
#cycle-reading .relation-direction{display:flex;flex-direction:column;gap:8px;align-items:center;color:#7b8876}
#cycle-reading .relation-track{font:48px/1 Georgia,serif}
#cycle-reading .relation-verb{font:10px/1.4 Arial,sans-serif;letter-spacing:.08em}
#cycle-reading .lane-nourishment .lane-target .diagram-icon{border:1px solid var(--tone);border-radius:50%;background:var(--tint)}
#cycle-reading .lane-outlet .lane-source .diagram-icon{border:1px solid var(--tone);border-radius:14px;background:var(--tint)}
#cycle-reading .lane-outlet .relation-direction{border-bottom:1px solid #a6b3a1;padding-bottom:12px}
#cycle-reading .lane-restraint .lane-target .diagram-icon{border-left:3px solid var(--tone);border-radius:0;background:var(--tint)}
#cycle-reading .lane-restraint .relation-direction{color:#8c725c}
#cycle-reading .static-nourishment{background:#eef2e9}
#cycle-reading .static-outlet{background:#edf0ed}
#cycle-reading .static-restraint{background:#eee9e0}
#cycle-reading .static-mixed{background:#f1eee5}
#cycle-reading .mixed-relations{max-width:560px;margin:24px auto}
#cycle-reading .mixed-lane{padding:14px 10px;background:#ffffff55;border:1px solid #d6d2c5;border-radius:8px}
#cycle-reading .mixed-lane+.mixed-lane{margin-top:12px}
#cycle-reading .mixed-lane .relation-lane,#cycle-reading .mixed-lane .static-diagram{min-height:110px;margin:0 auto}
#cycle-reading .element-layers i,#cycle-reading .element-layers .diagram-icon{border-color:var(--tone);background:var(--tint)}
#cycle-reading .element-layers i:first-child{background:color-mix(in srgb,var(--tone) 45%,#f8f4eb)}
#cycle-reading .element-layers i:nth-child(2){background:color-mix(in srgb,var(--tone) 27%,#f8f4eb)}
@media(max-width:580px){
 #cycle-reading .relation-lane{grid-template-columns:minmax(0,1fr) 78px minmax(0,1fr);gap:6px;min-height:150px;margin:24px auto}
 #cycle-reading .relation-track{font-size:36px}
 #cycle-reading .relation-verb{font-size:9px;letter-spacing:.03em}
 #cycle-reading .mixed-lane{padding:12px 6px}
 #cycle-reading .mixed-lane .static-diagram{grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 12px minmax(0,1fr);gap:2px}
 #cycle-reading .compact-addition .earth-layers{width:54px}
 #cycle-reading .compact-addition .earth-layers i,#cycle-reading .compact-addition .earth-layers .diagram-icon{width:48px}
}

#cycle-reading .rating-trial{display:inline-block;font:10px/1.4 Arial,sans-serif;letter-spacing:.1em;vertical-align:middle;padding:4px 7px;background:#e9e3d3;color:#685c43;margin-left:6px}