/* Native editorial stories: readable without JS, motion, or pointer input. */
.cms-story {
  --story-bg:var(--dx-canvas,var(--bg,#fff));
  --story-surface:var(--dx-panel,var(--surface,#f5f5f5));
  --story-font:var(--aui-font-family-sans,Inter,Pretendard,system-ui,sans-serif);
  --story-ink:var(--dx-text,var(--text,#171717));
  --story-muted:var(--dx-text-secondary,var(--muted,#606060));
  --story-line:var(--dx-border,var(--line,#dedede));
  --story-accent:var(--dx-accent,var(--accent,#174ea6));
  margin:36px 0; color:var(--story-ink); font-family:var(--story-font); overflow-wrap:anywhere;
}
.cms-story:is([data-cms-story=cards],[data-cms-story=diagram]) { --story-accent:var(--story-ink); }
.cms-story>header { padding:24px 0; border-top:2px solid var(--story-ink); }
.cms-story>header h3 { margin:0 0 10px; font-size:clamp(22px,2.5vw,30px); line-height:1.3; letter-spacing:-.035em; }
.cms-story>header p { margin:0; color:var(--story-muted); line-height:1.7; }
.cms-story .cms-story-nav { position:sticky; top:96px; z-index:2; background:var(--story-bg); border-block:1px solid var(--story-line); padding:10px 0; }
.cms-story .cms-story-nav ol { display:flex; flex-wrap:wrap; gap:6px; list-style:none; padding:0; margin:0; }
.cms-story .cms-story-nav li { margin:0; min-width:0; flex:1 1 130px; }
.cms-story .cms-story-nav a { display:flex; gap:8px; align-items:center; height:100%; min-height:44px; padding:9px 12px; border:1px solid transparent; border-radius:8px; font-size:13px; line-height:1.4; text-decoration:none; color:var(--story-ink); }
.cms-story-nav a span { flex-shrink:0; white-space:nowrap; font-variant-numeric:tabular-nums; color:var(--story-muted); font-size:11px; }
.cms-story .cms-story-nav a:hover,.cms-story .cms-story-nav a[aria-current] { background:var(--story-surface); border-color:var(--story-line); }
.cms-story .cms-story-nav a[aria-current] { color:var(--story-accent); font-weight:650; }
.cms-story .cms-story-items { list-style:none; margin:0; padding:0; display:grid; gap:16px; }
.cms-story .cms-story-item { position:relative; margin:0; min-width:0; padding:28px; border:1px solid var(--story-line); border-radius:14px; background:var(--story-bg); scroll-margin-block:190px 32px; }
.cms-story:not([data-cms-story=cards]) .cms-story-item[data-active] { border-color:var(--story-accent); box-shadow:inset 3px 0 0 var(--story-accent); }
.cms-story .cms-story-number { display:block; margin-bottom:20px; color:var(--story-accent); font-size:13px; font-weight:650; font-variant-numeric:tabular-nums; }
.cms-story .cms-story-item h4 { margin:0 0 14px; font-size:22px; font-weight:600; line-height:1.4; letter-spacing:-.025em; }
.cms-story .cms-story-body { font-size:16px; line-height:1.8; }
.cms-story .cms-story-body> :last-child { margin-bottom:0; }
.cms-story .cms-story-body img { display:block; max-width:100%; height:auto; margin-block:20px; }
.cms-story[data-cms-story=steps] .cms-story-items { padding-top:24px; }
.cms-story[data-cms-story=steps] .cms-story-item:not(:last-child)::after { content:''; position:absolute; height:17px; width:1px; background:var(--story-line); left:40px; bottom:-18px; }
.cms-story[data-cms-story=cards] .cms-story-items { grid-template-columns:repeat(3,minmax(0,1fr)); padding-top:16px; }
.cms-story[data-cms-story=cards] .cms-story-nav { position:static; }
.cms-story :is(a,button,[tabindex]):focus-visible { outline:2px solid var(--story-accent); outline-offset:4px; }
/* Media-first layouts. All panels remain readable without enhancement. */
.cms-story[data-cms-story=gallery],.cms-story[data-cms-story=diagram] { margin-block:56px; }
.cms-story[data-cms-story=gallery] .cms-story-nav,.cms-story[data-cms-story=diagram] .cms-story-nav { position:static; border-top:0; }
.cms-story .cms-story-nav a[role=tab][aria-selected=true],.cms-story .cms-story-nav a[role=tab][aria-selected=true]:hover { background:var(--story-ink); color:var(--story-bg); border-color:var(--story-ink); }
.cms-story a[role=tab][aria-selected=true] span { color:inherit; }
.cms-story [role=tabpanel][hidden] { display:none; }
.cms-story .cms-story-item[role=tabpanel],.cms-story .cms-story-item[role=tabpanel][data-active] { padding:28px 0 0; border:0; box-shadow:none; border-radius:0; background:transparent; }
.cms-story [role=tabpanel] .cms-story-number { display:none; }
.cms-story[data-cms-story=gallery] .cms-story-body { display:flex; flex-direction:column; }
.cms-story[data-cms-story=gallery] .cms-story-body img { order:-2; width:100%; max-width:100%; margin:0; border:1px solid var(--story-line); border-radius:12px; background:var(--story-surface); }
/* Theme pairs follow the device, not the DX shell or a stored article choice. */
.cms-story[data-cms-story=theme] .cms-story-item { padding:0; border:0; background:transparent; }
.cms-story[data-cms-story=theme] .cms-story-body { display:flex; flex-direction:column; }
.cms-story[data-cms-story=theme] .cms-story-body img { order:-2; width:100%; margin:0; border:1px solid var(--story-line); border-radius:12px; background:var(--story-surface); }
.cms-story[data-cms-story=theme] [data-story-color-scheme=dark] { display:none; }
@media(prefers-color-scheme:dark) {
  .cms-story[data-cms-story=theme] [data-story-color-scheme=light] { display:none; }
  .cms-story[data-cms-story=theme] [data-story-color-scheme=dark] { display:block; }
}
.cms-story .cms-story-controls { display:flex; gap:6px; align-items:center; justify-content:flex-end; padding-top:14px; }
.cms-story .cms-story-controls button,.cms-story .cms-story-zoom,.cms-story .cms-story-lightbox button { display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px; box-sizing:border-box; width:44px; height:44px; min-width:44px; min-height:44px; max-width:44px; max-height:44px; padding:0; color:var(--story-ink); background:var(--story-bg); border:1px solid var(--story-line); border-radius:50%; font:inherit; line-height:1; cursor:pointer; }
.cms-story :is(.cms-story-controls button,.cms-story-zoom,.cms-story-lightbox button) svg { display:block; width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
.cms-story .cms-story-controls button:disabled { opacity:.45; cursor:default; }
.cms-story .cms-story-status { margin-right:auto; font:500 13px/1.4 var(--story-font); font-variant-numeric:tabular-nums; letter-spacing:.02em; color:var(--story-muted); }
.cms-story .cms-story-controls button:hover:not(:disabled),.cms-story .cms-story-zoom:hover:not(:disabled),.cms-story .cms-story-lightbox button:hover:not(:disabled) { background:var(--story-surface); color:var(--story-ink); border-color:var(--story-muted); }
.cms-story .cms-story-zoom { order:-1; align-self:flex-end; margin-top:8px; }
.cms-story .cms-story-media { position:relative; order:-2; margin:0 0 18px; }
.cms-story .cms-story-media .cms-story-zoom { position:absolute; right:12px; bottom:12px; margin:0; box-shadow:0 2px 12px rgb(0 0 0 / .18); }
.cms-story .cms-story-canvas { background:var(--story-surface); border:1px solid var(--story-line); border-radius:16px; padding:28px 16px; }
.cms-story .cms-story-diagram { display:block; width:100%; height:auto; overflow:visible; }
.cms-story .cms-story-diagram-vertical { display:none; }
.cms-story-nodes a { text-decoration:none; color:var(--story-ink); }
.cms-story-nodes rect { fill:var(--story-bg); stroke:var(--story-line); stroke-width:1.5; }
.cms-story .cms-story-nodes text { fill:var(--story-ink); font:500 14px var(--story-font); }
.cms-story .cms-story-nodes .cms-story-svg-number { fill:var(--story-muted); font:500 12px var(--story-font); font-variant-numeric:tabular-nums; }
.cms-story-nodes [data-active] .cms-story-svg-number { fill:var(--story-accent); }
.cms-story-edges path { fill:none; stroke:var(--story-muted); stroke-width:1.5; }
.cms-story-edges [data-active] { stroke:var(--story-accent); stroke-width:2.5; }
.cms-story-diagram marker path { fill:var(--story-muted); }
.cms-story .cms-story-lightbox { border:0; border-radius:0; background:transparent; color:#fff; padding:0; max-width:calc(100vw - 32px); max-height:calc(100dvh - 32px); width:max-content; overflow:visible; }
.cms-story-lightbox::backdrop { background:rgb(0 0 0 / .82); }
.cms-story .cms-story-lightbox img { display:block; max-width:min(calc(100vw - 32px),1600px); max-height:calc(100dvh - 80px); width:auto; height:auto; margin:0 auto; border:0; border-radius:8px; object-fit:contain; }
.cms-story .cms-story-lightbox button { position:absolute; z-index:1; top:12px; right:12px; margin:0; box-shadow:0 2px 12px rgb(0 0 0 / .18); }
.cms-story .cms-story-lightbox p { margin:10px 0 0; font-size:13px; line-height:1.5; color:rgb(255 255 255 / .8); text-align:center; }
.cms-story .cms-story-chart { margin:0; padding:20px; background:var(--story-surface); border:1px solid var(--story-line); border-radius:16px; }
.cms-story-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.cms-story .cms-story-chart text { fill:var(--story-ink); font:500 14px var(--story-font); }
.cms-story .cms-story-chart .cms-chart-value { font-variant-numeric:tabular-nums; }
.cms-story-chart .cms-chart-track { fill:var(--story-line); }
.cms-story-chart :is(.cms-chart-bar,circle) { fill:var(--story-accent); }
.cms-story-chart .cms-chart-axis { fill:none; stroke:var(--story-muted); }
.cms-story-chart .cms-chart-line { fill:none; stroke:var(--story-accent); stroke-width:3; }
.cms-story-chart figcaption { margin:12px 0; color:var(--story-muted); font-size:13px; }
.cms-story .cms-chart-data { max-width:100%; overflow:auto; }
.cms-story .cms-chart-data table { display:table; width:100%; table-layout:auto; margin:16px 0 0; border-collapse:collapse; font-size:14px; }
.cms-story .cms-chart-data :is(th,td) { border:0; border-bottom:1px solid var(--story-line); padding:10px 8px; text-align:left; min-width:0; background:transparent; font-weight:400; }
.cms-story .cms-chart-data thead th { font-weight:600; }
.cms-story .cms-chart-data caption { text-align:left; font-weight:600; margin-bottom:8px; }
.cms-story:is([data-cms-story=bar],[data-cms-story=line]) .cms-story-nav { position:static; }
.cms-story:is([data-cms-story=bar],[data-cms-story=line]) .cms-story-items { margin-top:20px; grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(prefers-reduced-motion:no-preference) {
  .cms-story-item { transition:border-color .2s,box-shadow .2s; }
  .cms-story-nav a { transition:background-color .2s,color .2s; }
  .cms-story[data-story-motion]:not([data-story-motion=none]) [role=tabpanel]:not([hidden]) { animation:cms-story-enter .3s ease-out; }
  .cms-story[data-playing] .cms-story-edges [data-active] { stroke-dasharray:6 6; animation:cms-story-flow 1.2s linear infinite; }
  .cms-story-nodes rect { transition:stroke .25s; }
  .cms-story [data-story-entered] { animation:cms-story-enter .45s ease-out; }
  .cms-story[data-story-motion=stagger] [data-story-entered] .cms-story-nodes a,
  .cms-story[data-story-motion=stagger] [data-story-entered] .cms-chart-mark { animation:cms-story-enter .5s ease-out backwards; }
  .cms-story [data-story-entered] :is(.cms-story-nodes a,.cms-chart-mark):nth-child(2) { animation-delay:80ms; }
  .cms-story [data-story-entered] :is(.cms-story-nodes a,.cms-chart-mark):nth-child(3) { animation-delay:160ms; }
  .cms-story [data-story-entered] :is(.cms-story-nodes a,.cms-chart-mark):nth-child(n+4) { animation-delay:240ms; }
  .cms-story [data-story-entered] .cms-chart-line { stroke-dasharray:1; animation:cms-chart-draw .7s ease-out; }
}
@keyframes cms-story-enter { from { opacity:.45; } to { opacity:1; } }
@keyframes cms-chart-draw { from { stroke-dashoffset:1; } to { stroke-dashoffset:0; } }
@keyframes cms-story-flow { to { stroke-dashoffset:-24; } }
@media(max-width:800px) {
  .cms-story[data-cms-story=cards] .cms-story-items { grid-template-columns:1fr; }
  .cms-story .cms-story-item { padding:22px; }
  .cms-story .cms-story-nav { position:static; }
}
@media(max-width:540px) {
  .cms-story .cms-story-diagram-wide { display:none; }
  .cms-story .cms-story-diagram-vertical { display:block; max-width:320px; margin:auto; }
  .cms-story .cms-story-canvas { padding:8px; }
  .cms-story .cms-story-chart { padding:12px; }
  .cms-story .cms-story-chart svg { min-width:540px; }
  .cms-story .cms-story-chart { overflow-x:auto; }
  .cms-story:is([data-cms-story=bar],[data-cms-story=line]) .cms-story-items { grid-template-columns:1fr; }
  .cms-story .cms-story-item[role=tabpanel],.cms-story .cms-story-item[role=tabpanel][data-active] { padding:20px 0 0; }
}
@media print {
  .cms-story[data-cms-story=theme] [data-story-color-scheme=light] { display:block; }
  .cms-story[data-cms-story=theme] [data-story-color-scheme=dark] { display:none; }
  .cms-story .cms-story-nav { display:none; }
  .cms-story .cms-story-items { display:block; }
  .cms-story .cms-story-item { break-inside:avoid; box-shadow:none; margin-bottom:16px; }
  .cms-story [role=tabpanel][hidden] { display:block; }
  .cms-story .cms-story-controls,.cms-story .cms-story-zoom,.cms-story .cms-story-lightbox { display:none; }
  .cms-story * { animation:none!important; }
}