.scm {
  --sm-paper:#faf9fc; --sm-surface:#fff; --sm-cover:#f1edf7; --sm-ink:#14172a; --sm-text:#525b70; --sm-line:#d9dbe6; --sm-accent:#493eb1;
  color:var(--sm-ink); background:var(--sm-paper); font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif; line-height:1.65; isolation:isolate;
}
html[data-winkdom-color-mode="dark"] .scm { --sm-paper:#111320; --sm-surface:#191c2a; --sm-cover:#19192b; --sm-ink:#f4f4fb; --sm-text:#bac1d3; --sm-line:#3a3d50; --sm-accent:#b3a8ff; }
@media (prefers-color-scheme:dark) {html:not([data-winkdom-color-mode]) .scm { --sm-paper:#111320; --sm-surface:#191c2a; --sm-cover:#19192b; --sm-ink:#f4f4fb; --sm-text:#bac1d3; --sm-line:#3a3d50; --sm-accent:#b3a8ff; }}
.scm,.scm * {box-sizing:border-box;}
.scm :where(p,h1,h2,h3,ol,dl,dd,figure,summary) {margin:0;}
.scm .sm-wrap {width:min(100%,1320px);margin-inline:auto;padding-inline:clamp(20px,5vw,75px);}
.scm h1,.scm h2,.scm h3 {color:var(--sm-ink)!important;font-family:inherit;font-weight:620;line-height:1.08;letter-spacing:-.05em;text-wrap:balance;}
.scm h1 {font-size:clamp(60px,6.4vw,94px);font-weight:560;line-height:.98;letter-spacing:-.07em;}
.scm h1 em {font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.06em;color:var(--sm-accent);}
.scm h2 {font-size:clamp(32px,3.8vw,54px);}
.scm h3 {font-size:clamp(21px,2vw,28px);}
.scm p,.scm dd {color:var(--sm-text)!important;font-size:16px;line-height:1.7;}
.scm a {color:var(--sm-accent)!important;font-weight:610;text-underline-offset:4px;}
.scm a:focus-visible,.scm summary:focus-visible {outline:3px solid var(--sm-accent);outline-offset:4px;}
.scm [id] {scroll-margin-top:110px;}
.scm p.sm-label,.scm p.sm-status {color:var(--sm-accent)!important;font-size:13px;font-weight:620;line-height:1.5;letter-spacing:.025em;}
.scm p.sm-label {margin-bottom:18px!important;}
.scm .sm-cover {background:var(--sm-cover);padding-block:clamp(38px,5.3vw,76px)!important;}
.scm .sm-split {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(30px,6vw,90px);}
.scm .sm-lead {font-size:clamp(16px,1.4vw,20px);max-width:44ch;margin:24px 0!important;}
.scm a.sm-button {display:inline-flex;align-items:center;justify-content:space-between;gap:22px;min-height:48px;padding:12px 21px;border-radius:7px;background:var(--sm-ink);color:var(--sm-paper)!important;font-size:14px;text-decoration:none;}
.scm .sm-section {padding-block:clamp(48px,6.1vw,88px)!important;}
.scm .sm-three {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,44px);margin-top:36px;}
.scm .sm-three article {border-top:2px solid var(--sm-line);padding-top:18px;}
.scm .sm-three article:first-child {border-top-color:var(--sm-accent);}
.scm .sm-three h3,.scm .sm-dest h3 {margin:12px 0!important;}
.scm .sm-three article p:not(.sm-status),.scm .sm-dest p:not(.sm-status),.scm .sm-ledger dd {font-size:15px;}
.scm .sm-aside {display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,90px);align-items:start;}
.scm .sm-aside h2+p,.scm .sm-head h2+p {margin-top:20px!important;max-width:43ch;}
.scm .sm-routes {background:#11162b;--sm-ink:#faf9ff;--sm-text:#c2c8dc;--sm-line:#424760;--sm-accent:#c2b6ff;}
.scm .sm-accordion details {border-top:1px solid var(--sm-line);}
.scm .sm-accordion details:last-child {border-bottom:1px solid var(--sm-line);}
.scm .sm-accordion summary {list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--sm-ink)!important;padding:19px 0;font-size:clamp(20px,2vw,27px);letter-spacing:-.03em;font-weight:620;}
.scm summary::-webkit-details-marker {display:none;}
.scm .sm-accordion summary::after {content:"+";color:var(--sm-accent);font-weight:400;font-size:24px;}
.scm .sm-accordion details[open] summary::after {content:"−";}
.scm .sm-dest {border-left:2px solid #655ab5;padding-left:18px;margin:9px 0 25px;}
.scm .sm-dest h3 {font-size:20px;}
.scm .sm-dest a,.scm .sm-note a {display:inline-block;margin-top:9px;font-size:14px;}
.scm .sm-head {display:flex;align-items:flex-end;justify-content:space-between;gap:35px;}
.scm .sm-head>p {max-width:41ch;}
.scm .sm-ledger {margin:32px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 45px;}
.scm .sm-ledger>div {padding:20px 0;border-top:1px solid var(--sm-line);}
.scm .sm-ledger dt {font-weight:650;color:var(--sm-ink);font-size:18px;letter-spacing:-.025em;}
.scm .sm-ledger dd {margin:6px 0 0;}
.scm .sm-note {background:var(--sm-cover);padding:clamp(20px,3vw,35px);border-radius:13px;}
.scm .sm-note p {max-width:82ch;margin:10px 0 0!important;}
.scm .sm-example {background:var(--sm-surface);}
.scm .sm-steps {padding-left:27px;}
.scm .sm-steps li {padding:0 0 20px 8px;}
.scm .sm-steps li+li {padding-top:18px;border-top:1px solid var(--sm-line);}
.scm .sm-steps li::marker {color:var(--sm-accent);font-weight:650;}
.scm .sm-steps h3 {font-size:21px;}
.scm .sm-steps p {font-size:15px;margin:8px 0 0!important;}
.scm .sm-close {background:var(--sm-cover);}
.scm .sm-close .sm-button {flex-shrink:0;}
body.winkdom-app-shell:has(.scm) .winkdom-route-titlebar {display:none;}
body.winkdom-app-shell:has(.scm) .winkdom-page-frame {padding:0;max-width:none;width:100%;}
body.winkdom-app-shell:has(.scm) .winkdom-shell-logo {content:url("https://shopichain.com/wp-content/uploads/2026/11/shopichain-logo-light.png");width:190px;height:50px;max-width:none;max-height:none;object-fit:contain;border-radius:0;}
html[data-winkdom-color-mode="dark"] body:has(.scm) .winkdom-shell-logo {content:url("https://shopichain.com/wp-content/uploads/2026/11/shopichain-logo-dark.png");}
@media(max-width:800px) {
  .scm .sm-split {gap:25px;} .scm h1 {font-size:clamp(48px,8vw,66px);}
  .scm .sm-three {gap:20px;} .scm .sm-three p {font-size:14px;}
  .scm .sm-aside {grid-template-columns:minmax(0,1fr);gap:26px;}
}
@media(max-width:620px) {
  .scm .sm-split,.scm .sm-three,.scm .sm-ledger {grid-template-columns:minmax(0,1fr);}
  .scm .sm-head {display:grid;gap:16px;}
  .scm .sm-close .sm-button {justify-self:start;}
  .scm .sm-ledger {margin-block:22px;}
  body.winkdom-app-shell:has(.scm) .winkdom-shell-logo {width:154px;height:40px;}
}

/* ShopiChain editorial illustrations */
.scx-hero-art svg,.scx-eco-art svg,.scx-scenes svg,.scx-route svg {display:block;width:100%;height:auto;max-width:none}
.scx-hero-art,.scx-eco-art,.scx-route {box-sizing:border-box}
@media (prefers-reduced-motion:no-preference) {
  .scx-flow {animation:scx-signal 4.6s ease-out 1}
  .scx-packets {animation:scx-transfer 2.7s ease-out 1}
  .scx-scene {animation:scx-scene-in .32s ease-out both}
  .scx-disc-turn {transform-origin:320px 126px;animation:scx-vinyl 3.7s cubic-bezier(.2,.5,.35,1) 1}
  .scx-audio-bars {transform-origin:240px 120px;animation:scx-wave .65s ease-in-out 4 alternate}
  @keyframes scx-signal {from {stroke-dashoffset:248} to {stroke-dashoffset:0}}
  @keyframes scx-transfer {from {stroke-dashoffset:81} to {stroke-dashoffset:0}}
  @keyframes scx-scene-in {from {opacity:.5;transform:translateY(4px)} to {opacity:1;transform:none}}
  @keyframes scx-vinyl {from {transform:rotate(-55deg)} to {transform:rotate(0)}}
  @keyframes scx-wave {from {transform:scaleY(.68)} to {transform:scaleY(1)}}
}


.scm .sm-cover .scx-route {border:1px solid var(--sm-line);border-radius:18px;background:var(--sm-surface);box-shadow:0 16px 36px #241c5011;padding:clamp(12px,1.8vw,24px);margin:0}
.scm .scx-routing-art {background:radial-gradient(ellipse at 48% 65%,#a591ff22,transparent 66%),radial-gradient(#9285bc40 .8px,transparent .9px);background-size:auto,14px 14px;border-radius:9px}
.scm .scx-route figcaption {display:flex;justify-content:space-between;gap:8px;margin-top:5px;padding:14px 6px 3px;border-top:1px solid var(--sm-line);color:var(--sm-text)!important;font-family:inherit;font-size:clamp(12px,1.1vw,15px);line-height:1.4;font-weight:600}
/* Editorial headings and illustration playback */
.sch {--pr-ink:var(--sch-ink);--pr-accent:var(--sch-brand);--pr-line:var(--sch-line);--pr-panel:var(--sch-surface);--pr-muted:var(--sch-muted)}
.sc-solutions {--pr-ink:var(--ink);--pr-accent:var(--accent);--pr-line:var(--line);--pr-panel:var(--surface);--pr-muted:var(--text)}
.scm {--pr-ink:var(--sm-ink);--pr-accent:var(--sm-accent);--pr-line:var(--sm-line);--pr-panel:var(--sm-surface);--pr-muted:var(--sm-text)}
.sch .sc-studio,.sch .sch-technology,.sc-solutions .cs-dark,.scm .sm-routes {--pr-accent:#cfc3ff;--pr-ink:#f6f4ff;--pr-line:#554d71;--pr-panel:#25243b;--pr-muted:#d2cdde}
:is(.sch,.sc-solutions,.scm) p.pr-badge {display:inline-flex;align-items:center;align-self:start;gap:8px;width:fit-content;max-width:100%;margin:0 0 15px!important;padding:5px 10px;border-radius:99px;border:1px solid color-mix(in srgb,var(--pr-accent) 35%,transparent);background:color-mix(in srgb,var(--pr-accent) 7%,transparent);color:var(--pr-accent)!important;font:600 11px/1.4 system-ui,sans-serif;letter-spacing:.04em}
:is(.sch,.sc-solutions,.scm) p.pr-badge::before {content:"";display:block;flex:0 0 7px;height:7px;border:1.5px solid currentColor;border-radius:2px;transform:rotate(-12deg);box-sizing:border-box}
:is(.sch,.sc-solutions,.scm) .pr-motion-panel {display:grid;min-width:0;align-content:center;justify-items:stretch;gap:4px}
:is(.sch,.sc-solutions,.scm) .pr-pause {position:relative;display:none;justify-self:end;align-items:center;cursor:pointer;min-height:32px;max-width:100%;margin:0;color:var(--pr-muted);font:550 11px/1.2 system-ui,sans-serif;letter-spacing:.015em}
.pr-pause input {position:absolute;opacity:0;width:1px;height:1px}
.pr-pause-look {display:inline-flex;align-items:center;gap:7px;padding:6px 8px;border-radius:5px}
.pr-pause input:focus-visible+.pr-pause-look {outline:2px solid var(--pr-accent);outline-offset:2px}
.pr-pause-look i {width:8px;height:8px;border-left:2px solid currentColor;border-right:2px solid currentColor;box-sizing:border-box}
.pr-pause .pr-stopped,.pr-pause:has(input:checked) .pr-running {display:none}
.pr-pause:has(input:checked) .pr-stopped {display:inline}
.pr-pause:has(input:checked) i {height:0;width:0;border:4px solid transparent;border-right:0;border-left:6px solid currentColor}
@media(prefers-reduced-motion:no-preference) {
  :is(.sch,.sc-solutions,.scm) .pr-pause {display:inline-flex}
  .scx-flow {animation:pr-order-flow 12s linear infinite}
  .scx-flow:nth-of-type(even) {animation-delay:-3s}
  .scx-packets {animation:pr-file-flow 9s linear infinite}
  .scx-disc-turn {transform-origin:320px 126px;animation:pr-turn 28s linear infinite}
  .scx-audio-bars {transform-origin:240px 120px;animation:pr-meter 5s ease-in-out infinite}
  .scx-eco-art svg>path:first-of-type {animation:pr-link 12s linear infinite}
  .pr-ticket-scan {animation:pr-scan 8s ease-in-out infinite}
  @keyframes pr-order-flow {0%,25% {stroke-dashoffset:248} 75%,100% {stroke-dashoffset:0}}
  @keyframes pr-file-flow {0%,35% {stroke-dashoffset:54} 80%,100% {stroke-dashoffset:0}}
  @keyframes pr-turn {to {transform:rotate(1turn)}}
  @keyframes pr-meter {0%,30%,100% {transform:scaleY(.88)} 56% {transform:scaleY(1)} 70% {transform:scaleY(.92)}}
  @keyframes pr-link {to {stroke-dashoffset:-48}}
  @keyframes pr-scan {0%,32%,100% {opacity:0;transform:translateX(0)} 42% {opacity:.7} 68% {opacity:.7;transform:translateX(42px)} 76% {opacity:0;transform:translateX(42px)}}
}
:is(.sch,.sc-solutions,.scm):has(.pr-pause input:checked) :is(.scx-flow,.scx-packets,.scx-disc-turn,.scx-audio-bars,.pr-ticket-scan,.sch-connection>span,.scx-eco-art path,.scx-scene) {animation-play-state:paused!important}

.scm .sm-three {gap:clamp(14px,2vw,24px)}
.scm .sm-three article {min-width:0;position:relative;border:1px solid var(--sm-line);border-radius:16px;padding:clamp(18px,2.05vw,30px);background:linear-gradient(135deg,color-mix(in srgb,var(--sm-accent) 5%,var(--sm-surface)),var(--sm-surface))}
.scm .sm-three article:first-child {border-color:color-mix(in srgb,var(--sm-accent) 42%,var(--sm-line))}
.scm .pr-platform-icon {display:block;width:34px;height:34px;color:var(--sm-accent);margin-bottom:20px}
.scm .sm-note {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.88fr);align-items:center;gap:clamp(22px,4vw,58px);border:1px solid var(--sm-line)}
.scm table.pr-receipt {display:table;table-layout:auto;width:100%;border:1px solid var(--sm-line);border-collapse:separate;border-spacing:0;background:var(--sm-surface);color:var(--sm-ink);border-radius:10px;margin:0;font-size:14px;line-height:1.45;font-variant-numeric:tabular-nums;overflow:hidden}
.scm .pr-receipt caption {text-align:start;padding:0 0 9px;font-weight:650;letter-spacing:-.01em;color:var(--sm-ink)}
.scm .pr-receipt :is(th,td) {border:0;border-bottom:1px solid var(--sm-line);padding:9px 12px;text-align:right;white-space:nowrap;color:var(--sm-ink);background:transparent}
.scm .pr-receipt th:first-child {text-align:left}
.scm .pr-receipt thead th {font-size:12px;color:var(--sm-text)}
.scm .pr-receipt tbody th {font-weight:500}
.scm .pr-receipt tr:last-child :is(th,td) {font-weight:650}
.scm .pr-receipt tbody tr:last-child :is(th,td) {border-bottom:0;background:color-mix(in srgb,var(--sm-accent) 7%,var(--sm-surface))}
.scm .sm-steps {list-style:none;margin:0;padding:0}
.scm .sm-steps li,.scm .sm-steps li+li {position:relative;padding:0 0 30px 58px;border:0;margin:0}
.scm .sm-steps li:not(:last-child)::before {content:"";position:absolute;left:18px;top:33px;bottom:0;width:1px;background:var(--sm-line)}
.scm .sm-steps li:last-child {padding-bottom:0}
.scm .pr-step-mark {position:absolute;left:0;top:0;width:37px;height:37px;padding:8px;border:1px solid var(--sm-line);border-radius:10px;background:var(--sm-cover);color:var(--sm-accent)}
@media(max-width:760px){.scm .sm-note {grid-template-columns:minmax(0,1fr)}}
@media(max-width:480px){.scm .pr-receipt :is(th,td) {padding:9px 6px;font-size:12px}.scm .sm-steps li,.scm .sm-steps li+li {padding-left:48px}}