/* List-only figures. Only the shared controller's active card changes.
   All transitions are entry-only; release removes the transition declaration. */
.color-card-v8{--cv8-ink:#242528;--cv8-guide:#c5c7c0;--cv8-blue:#4261d8;--cv8-amber:#c68a37;display:block;width:100%;height:100%;overflow:hidden;background:transparent;isolation:isolate;filter:none;transition:none}
.color-card-v8 *{box-sizing:border-box}
.catalog .card-art .color-card-v8 :is(.cv8-process,.cv8-tint-plane){display:block;margin:0;transform:none;transition:none}
.color-card-v8 .cv8-stage{position:relative;display:flex;align-items:center;justify-content:center;width:320px;height:180px;padding:15px 32px 32px;color:var(--cv8-ink);font:400 16px/1.3 'Outfit','Pretendard',sans-serif;text-align:center;background:transparent}
.color-card-v8 .cv8-property{position:absolute;left:20px;right:20px;bottom:10px;height:18px;font-size:13px;line-height:18px;white-space:nowrap;color:#60645d}
.color-card-v8 .cv8-property>span{position:absolute;inset:0;display:block}
.color-card-v8 .cv8-after{opacity:0}
.color-card-v8 .cv8-space-pair{display:flex;gap:19px;align-items:center;width:234px}
.color-card-v8 .cv8-equivalent-chip{width:108px;height:108px;flex:none;border-radius:8px;background:rgb(41.587% 50.367% 36.664%)}
.color-card-v8 .cv8-coordinates{position:relative;width:108px;height:96px;text-align:left;font-size:18px;line-height:32px;font-variant-numeric:tabular-nums}
.color-card-v8 .cv8-coordinates>div{position:absolute;inset:0}
.color-card-v8 .cv8-coordinates span{display:block;white-space:nowrap}
.color-card-v8 .cv8-coordinates b{font-weight:500}
.color-card-v8 .cv8-gamut-outer{position:relative;width:232px;height:120px;border:1.2px solid var(--cv8-blue);border-radius:15px;text-align:left}
.color-card-v8 .cv8-gamut-outer>span{position:absolute;left:15px;top:9px;font-size:14px}
.color-card-v8 .cv8-gamut-inner{position:absolute;left:15px;bottom:12px;width:128px;height:69px;border:1.2px solid var(--cv8-amber);border-radius:9px;background:#fff}
.color-card-v8 .cv8-gamut-inner>span{position:absolute;left:12px;top:8px;font-size:14px}
.color-card-v8 .cv8-gamut-inner>i{position:absolute;left:85px;top:23px;width:29px;height:29px;background:var(--cv8-blue);border-radius:50%}
.color-card-v8 .cv8-gamut-extra{position:absolute;right:15px;top:40px;width:48px;height:48px;border-radius:50%;opacity:.15;background:#2aa56f}
.color-card-v8 .cv8-primary-family{display:flex;gap:10px}
.color-card-v8 .cv8-primary-family>i{display:flex;align-items:center;justify-content:center;width:70px;height:100px;border-radius:7px;color:#fff;font-size:27px;font-style:normal;font-weight:500}
.color-card-v8 .cv8-r{background:rgb(255 0 0)}
.color-card-v8 .cv8-g{background:rgb(0 128 0)}
.color-card-v8 .cv8-b{background:rgb(0 0 255)}
.color-card-v8 .cv8-p3-edit-chip{width:112px;height:112px;border-radius:50%;background:#2aa56f}
.color-card-v8 .cv8-p3-support{position:absolute;left:226px;top:63px;width:50px;font-size:12px;line-height:1.5;text-align:left;color:#60645d;word-break:keep-all}
.color-card-v8 .cv8-supported-label{display:none}
.color-card-v8 .cv8-profile-flow{display:flex;gap:10px;align-items:center;width:256px;justify-content:center}
.color-card-v8 .cv8-input-colors{display:flex;gap:5px;background:white;border:1.2px solid var(--cv8-guide);border-radius:5px;width:56px;height:68px;padding:12px 8px}
.color-card-v8 .cv8-mini-blue,.color-card-v8 .cv8-mini-amber{display:block;width:16px;height:32px;border-radius:2px;background:var(--cv8-blue)}
.color-card-v8 .cv8-mini-amber{background:var(--cv8-amber)}
.color-card-v8 .cv8-arrow{font-size:22px;color:var(--cv8-guide)}
.color-card-v8 .cv8-profile-doc{position:relative;width:66px;height:96px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;border:1.2px solid var(--cv8-ink);border-radius:4px 13px 4px 4px;background:#fff}
.color-card-v8 .cv8-profile-doc>span{font-size:24px;font-weight:500}
.color-card-v8 .cv8-profile-doc>i{display:block;width:32px;border-top:1.2px solid var(--cv8-guide)}
.color-card-v8 .cv8-pcs{display:flex;flex-direction:column;gap:7px;justify-content:center;width:64px;height:68px;background:#fff;border:1.2px solid var(--cv8-guide);border-radius:7px;font-size:24px;font-weight:500}
.color-card-v8 .cv8-pcs>span{font-size:11px;font-weight:400}
.color-card-v8 .cv8-process{width:288px;height:128px;max-width:none;overflow:visible;flex:none}
.color-card-v8 .cv8-process text{fill:var(--cv8-ink);font-family:'Outfit','Pretendard',sans-serif;font-size:15px}
.color-card-v8 .cv8-process .cv8-small{font-size:12px}
.color-card-v8 .cv8-process :is(path,rect,circle){vector-effect:non-scaling-stroke}
.color-card-v8 :is(.cv8-guide,.cv8-cmm,.cv8-output,.cv8-proof-paper,.cv8-proof-tag){stroke:var(--cv8-guide);stroke-width:1.2}
.color-card-v8 .cv8-proof-paper{stroke-dasharray:4 3}
.color-card-v8 .cv8-route{stroke:var(--cv8-blue);stroke-width:2.2;opacity:0}
.color-card-v8 .cv8-proof-route{stroke:var(--cv8-blue);stroke-width:1.6;opacity:0}
.color-card-v8 .cv8-proof-tag{opacity:0}
.color-card-v8 text.cv8-proof-tag{stroke:none}
.color-card-v8 .cv8-checker{width:164px;height:118px;padding:12px;border:1.2px solid var(--cv8-guide);border-radius:7px;background-color:#fff;background-image:conic-gradient(#e0e3df 25%,#fff 0 50%,#e0e3df 0 75%,#fff 0);background-size:16px 16px;overflow:hidden}
.color-card-v8 :is(.cv8-opacity-object,.cv8-alpha-object){height:100%;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;background:rgb(66 97 216 / 1);border-radius:4px}
.color-card-v8 :is(.cv8-opacity-object,.cv8-alpha-object)>span{font-size:54px;line-height:1;color:#fff;font-weight:500}
.color-card-v8 :is(.cv8-opacity-object,.cv8-alpha-object)>i{width:57px;height:10px;background:var(--cv8-amber);border-radius:2px}
.color-card-v8 .cv8-alpha-object>span{color:#172336}
.color-card-v8 .cv8-gradient{position:relative;width:232px;height:108px;border-radius:8px;overflow:hidden;background:linear-gradient(90deg,#ed9d42,#4261d8)}
.color-card-v8 .cv8-gradient-oklab{position:absolute;inset:0;opacity:0}
.color-card-v8 .cv8-gradient-marker{position:absolute;left:50%;top:0;bottom:0;border-left:1.2px solid rgb(255 255 255 / .75)}
.color-card-v8 .cv8-interpolation-ok{display:none}
.color-card-v8 .cv8-tint-pair{display:flex;gap:27px;align-items:center}
.color-card-v8 .cv8-tint-plane{width:110px;height:110px;border:1.2px solid var(--cv8-guide);border-radius:2px}
.color-card-v8 .cv8-tint-dot{fill:var(--cv8-blue);transform-box:fill-box;transform-origin:center}
.color-card-v8 .cv8-tint-value{position:relative;width:87px;height:64px;font-size:55px;line-height:64px;font-weight:500;font-variant-numeric:tabular-nums}
.color-card-v8 .cv8-tint-value>span{position:absolute;inset:0}
.color-card-v8 .cv8-tint-value>span>span{font-size:23px;margin-left:2px;font-weight:400}
.color-card-v8 .cv8-contrast-object{position:relative;display:flex;align-items:center;justify-content:center;gap:22px;width:236px;height:110px;background:#fff;border-radius:7px;color:#c68a37}
.color-card-v8 .cv8-contrast-letter{font-size:65px;font-weight:500;line-height:1}
.color-card-v8 .cv8-contrast-value{position:relative;width:93px;height:45px;font-size:32px;font-weight:500;line-height:45px;font-variant-numeric:tabular-nums}
.color-card-v8 .cv8-contrast-value>span{position:absolute;inset:0;white-space:nowrap}
.color-card-v8 .cv8-contrast-value>span>span{font-size:19px;font-weight:400}
.color-card-v8 .cv8-contrast-value .cv8-after{display:none}
.color-card-v8.cv8-contrast .cv8-property .cv8-after{display:none}
.color-card-v8 .cv8-contrast-indicator{position:absolute;left:20px;bottom:9px;width:28px;height:3px;background:currentColor;transform-origin:left}
@supports(background:linear-gradient(90deg in srgb,#ed9d42,#4261d8)) and (background:linear-gradient(90deg in oklab,#ed9d42,#4261d8)){
 .color-card-v8 .cv8-gradient{background:linear-gradient(90deg in srgb,#ed9d42,#4261d8)}
 .color-card-v8 .cv8-gradient-oklab{background:linear-gradient(90deg in oklab,#ed9d42,#4261d8)}
 .color-card-v8 .cv8-interpolation-ok{display:contents}
 .color-card-v8 .cv8-interpolation-fallback{display:none}
}
@supports(color:color(display-p3 0 1 0)){
 @media(color-gamut:p3){
  .color-card-v8 .cv8-p3-chip,.color-card-v8 .cv8-p3-edit-chip{background:color(display-p3 0 1 0)}
  .color-card-v8 .cv8-fallback-label{display:none}
  .color-card-v8 .cv8-supported-label{display:inline}
 }
}
@media(prefers-reduced-motion:no-preference){
 .term-card[data-preview-active="true"] .color-card-v8:not(.cv8-contrast) :is(.cv8-before,.cv8-after,.cv8-gamut-extra,.cv8-route,.cv8-proof-route,.cv8-proof-tag){transition:opacity var(--atlas-preview-duration,220ms) ease}
 .term-card[data-preview-active="true"] .color-card-v8 :is(.cv8-g,.cv8-p3-edit-chip,.cv8-alpha-object){transition:background-color var(--atlas-preview-duration,220ms) ease}
 .term-card[data-preview-active="true"] .color-card-v8 :is(.cv8-profile-doc,.cv8-pcs,.cv8-cmm,.cv8-output,.cv8-proof-paper){transition:border-color var(--atlas-preview-duration,220ms) ease,stroke var(--atlas-preview-duration,220ms) ease}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-opacity-object{transition:opacity var(--atlas-preview-duration,220ms) ease}
 .term-card[data-preview-active="true"] .color-card-v8 :is(.cv8-tint-dot,.cv8-contrast-indicator){transition:transform var(--atlas-preview-duration,220ms) ease}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-before:has(+.cv8-after){opacity:0}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-after{opacity:1}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-gamut-extra{opacity:1}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-g{background:rgb(0 255 0)}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-p3-edit-chip{background:#ed9d42}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-profile-doc,.term-card[data-preview-active="true"] .color-card-v8 .cv8-pcs{border-color:var(--cv8-blue)}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-profile-flow .cv8-arrow{color:var(--cv8-blue)}
 .term-card[data-preview-active="true"] .color-card-v8 :is(.cv8-route,.cv8-proof-route,.cv8-proof-tag){opacity:1}
 .term-card[data-preview-active="true"] .color-card-v8 :is(.cv8-cmm,.cv8-output,.cv8-proof-paper){stroke:var(--cv8-blue)}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-opacity-object{opacity:.4}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-alpha-object{background:rgb(66 97 216 / .4)}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-tint-dot{transform:scale(1.4142135623730951)}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-contrast-object{color:#4261d8}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-contrast-value .cv8-before{display:none}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-contrast-value .cv8-after{display:block}
 .term-card[data-preview-active="true"] .color-card-v8.cv8-contrast .cv8-property .cv8-before{display:none}
 .term-card[data-preview-active="true"] .color-card-v8.cv8-contrast .cv8-property .cv8-after{display:block}
 .term-card[data-preview-active="true"] .color-card-v8 .cv8-contrast-indicator{transform:scaleX(1.8)}
 @supports(background:linear-gradient(90deg in srgb,#ed9d42,#4261d8)) and (background:linear-gradient(90deg in oklab,#ed9d42,#4261d8)){
  .term-card[data-preview-active="true"] .color-card-v8 .cv8-gradient-oklab{opacity:1;transition:opacity var(--atlas-preview-duration,220ms) ease}
 }
 @supports(color:color(display-p3 0 1 0)){
  @media(color-gamut:p3){.term-card[data-preview-active="true"] .color-card-v8 .cv8-p3-edit-chip{background:color(display-p3 1 .5 0)}}
 }
}
@media(prefers-reduced-motion:reduce){.color-card-v8 *{transition:none!important;animation:none!important}}
