/* Two material palettes, one hierarchy: cool archival ink / warm retail stone. */
.contract-case,#flow-dialog[data-case-kind=contract]{--case-accent:#b5b2dd;--case-surface:#191922;--case-line:#3d3b4d;--lime:#b5b2dd}
.sd-cover,#flow-dialog[data-case-kind=shopping]{--case-accent:#d4bc99;--case-surface:#211e1a;--case-line:#514638;--lime:#d4bc99}
.contract-case:has(.cw-preview),.sd-cover{border-radius:18px;box-shadow:inset 0 1px 0 #ffffff08,0 16px 48px #00000020}
.contract-case:has(.cw-preview){background:linear-gradient(135deg,#20202c,#14151c 65%);border-color:#484455}
.sd-cover{background:linear-gradient(135deg,#28231e,#181715 65%);border-color:#504638}
.contract-case .case-top,.contract-case .case-disclosure{color:#a6a2b8}.contract-case .case-open{border-color:#50495f;color:#d4cde9}
.contract-case .contract-evidence b{color:#e1ddeb}.contract-case .contract-evidence>span{color:#a6a2b8}
.cw-preview{border-radius:10px}.cw-preview-head{color:#b9b3cf}.cw-preview>strong{letter-spacing:-.02em}.cw-preview-bottom{line-height:1.7}
#flow-dialog.case-dialog[data-case-kind]{border-radius:18px;border-color:var(--case-line);box-shadow:0 32px 100px #0008,inset 0 1px 0 #ffffff08;scrollbar-color:var(--case-line) transparent}
#flow-dialog.case-dialog[data-case-kind=contract]{background:#111218}
#flow-dialog.case-dialog[data-case-kind=shopping]{background:#141311}
#flow-dialog.case-dialog[data-case-kind] #flow-title{font-size:12px;line-height:1.6;letter-spacing:.08em;font-weight:500;color:#aaa5b4;margin:0 60px 22px 0;padding:0;min-height:22px}
#flow-dialog.case-dialog[data-case-kind=shopping] #flow-title{color:#b7a995}
#flow-dialog.case-dialog::backdrop{background:#07080cc7;backdrop-filter:blur(14px)}
#flow-dialog.case-dialog .dialog-close{display:grid;place-items:center;box-sizing:border-box;padding:0;line-height:1;right:0;top:0;min-width:44px;min-height:44px;border:1px solid var(--case-line);background:var(--case-surface);color:#eeeaf2}
.dialog-close svg,.cw-zoom svg{display:block;flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#flow-dialog .dialog-close:focus-visible{outline:2px solid var(--case-accent);outline-offset:3px}
.cw .cw-zoom button{display:inline-grid;place-items:center;min-width:40px;min-height:40px;padding:0 10px;border-radius:8px;line-height:1}
.cw .cw-zoom [data-cw-action=fit]{min-width:76px;font-size:12px}
.cw .cw-orbit i,.cw .cw-ai .cw-orbit i,.cw .cw-human .cw-orbit i,.cw .cw-tool .cw-orbit i{width:58%;height:58%;padding:0;margin:0;display:grid;place-items:center;border-radius:0;background:none;color:inherit;line-height:0}
.cw-orbit i svg{display:block;width:100%;height:100%;overflow:visible;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;fill:none}
.cw-ai .cw-orbit i svg circle,.cw-process .cw-orbit i svg circle{fill:currentColor;stroke:none}
.cw .cw-human .cw-orbit{background:#262332;color:#cec8ef}.cw .cw-human[aria-pressed=true] .cw-orbit i{color:#e1dbff}
.cw-tool .cw-orbit{border-radius:7px}.cw-orbit:after{pointer-events:none}
.cw-node[aria-pressed=true] .cw-orbit{box-shadow:0 0 0 5px #b5b2dd12,0 0 22px #b5b2dd1c}
.cw-node[aria-pressed=true] .cw-orbit{border-color:#ddd4ff;background:#252132;box-shadow:0 0 0 5px #b5b2dd15,0 0 24px #b5b2dd3b,inset 0 0 10px #cfc2ff17}
.cw-click-light{position:absolute;inset:-3px;border:1px solid #dbceff;border-radius:inherit;background:radial-gradient(circle,#cbbbff18 30%,#cbbbff33 70%,transparent 72%);box-shadow:0 0 14px #c6b5ff60;opacity:0;pointer-events:none;transform:scale(.95)}
.cw-viewport{border-radius:10px;background-size:28px 28px}.cw-canvas{background:radial-gradient(ellipse at 50% 60%,#b5b2dd08,transparent 65%)}
.cw-scenarios button[aria-pressed=true]{background:#b5b2dd12;border-color:#8881a857}
.cw-play-actions button{border-radius:8px}.cw-play-actions button:first-child{background:#b5b2dd;color:#211e2d}
.cw-io{border-radius:0 10px 10px 0;background:#b5b2dd08}.cw-detail-number{color:#a19ab8}.cw-preview-phases small{color:#b1a8c9}
#flow-dialog[data-case-kind=contract] .case-tabs{gap:28px;margin-bottom:24px;border-color:#35323f}
#flow-dialog[data-case-kind=contract] .case-tabs button{position:relative;border:0;color:#aca7ba;padding:12px 2px}
#flow-dialog[data-case-kind=contract] .case-tabs button:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--case-accent);transform:scaleX(0);transform-origin:left;transition:transform 180ms var(--ease)}
#flow-dialog[data-case-kind=contract] .case-tabs button[aria-selected=true]{color:#e6e0f2}
#flow-dialog[data-case-kind=contract] .case-tabs button[aria-selected=true]:after{transform:scaleX(1)}
#flow-dialog .case-stat-row b{font-weight:500;letter-spacing:-.045em;color:#c7bddf}
.sd-mini-products img{box-shadow:0 2px 10px #0002}.sd-mini-inbox b,.sd-avatar{background:#d4bc99;color:#302619}
.sd-scenarios button[aria-pressed=true]{box-shadow:inset 0 1px 0 #e8d4b617}.sd-demo .sd-primary{background:#d4bc99;color:#302519}
.sd-work{box-shadow:0 8px 24px #0002}.sd-message{box-shadow:0 4px 14px #0001}.sd-receipt{font-variant-numeric:tabular-nums}
.sd-product.chosen{box-shadow:inset 0 0 0 1px #d4bc9920}.sd-demo :is(input,select,textarea){accent-color:#d4bc99}
/* No shifting while typing or using keyboard navigation. */
html[data-case-input=pointer] :is(.cw-scenarios button,.cw-play-actions button,.cw-zoom button,.sd-scenarios button,.sd-subtle,.sd-primary,.sd-product,.dialog-close,.case-open){transition:transform 160ms var(--ease),background-color 180ms ease,border-color 180ms ease}
html[data-case-input=pointer] :is(.cw-scenarios button,.cw-play-actions button,.cw-zoom button,.sd-scenarios button,.sd-subtle,.sd-primary,.sd-product,.dialog-close,.case-open):active{transform:scale(.98)}
.cw-orbit{transition:transform 180ms var(--ease),box-shadow 180ms ease,border-color 180ms ease}
.sd-cover-demo{transition:transform 220ms var(--ease),border-color 180ms ease}
#flow-dialog.case-dialog[data-pointer-motion=true]{transition:opacity 220ms var(--ease),transform 220ms var(--ease),display 220ms allow-discrete,overlay 220ms allow-discrete}
#flow-dialog.case-dialog[data-pointer-motion=true]:not([open]){opacity:0;transform:translateY(8px) scale(.985)}
#flow-dialog.case-dialog[data-pointer-motion=true][open]{opacity:1;transform:none}
#flow-dialog.case-dialog[data-pointer-motion=true]::backdrop{opacity:0;transition:opacity 220ms var(--ease),display 220ms allow-discrete,overlay 220ms allow-discrete}
#flow-dialog.case-dialog[data-pointer-motion=true][open]::backdrop{opacity:1}
@starting-style{#flow-dialog.case-dialog[data-pointer-motion=true][open]{opacity:0;transform:translateY(8px) scale(.985)}}
@starting-style{#flow-dialog.case-dialog[data-pointer-motion=true][open]::backdrop{opacity:0}}
@media(hover:hover) and (pointer:fine){
 .cw-node:hover .cw-orbit{transform:scale(1.08)}
 .sd-product:not(:disabled):hover{border-color:#b99e7b}.sd-cover-demo:hover{transform:translateY(-2px);border-color:#b99e7b}
 #flow-dialog .dialog-close:hover{background:var(--case-line)}.cw-preview:hover{border-color:#a59ac4}
 .sd-cover-cta:hover{color:#fff5e7}
}
@media(hover:none){.sd-cover-demo:hover{transform:none}}
html[data-case-input=keyboard] :is(.cw-orbit,.case-tabs button:after){transition:none}
html[data-case-input=keyboard] #flow-dialog.case-dialog,html[data-case-input=keyboard] #flow-dialog.case-dialog::backdrop{transition:none}
@media(max-width:650px){#flow-dialog.case-dialog[data-case-kind]{border-radius:14px}.cw-zoom{gap:4px}.cw .cw-zoom button{min-width:44px;min-height:44px}.sd-cover-cta{line-height:1.8}.cw-map-footer{line-height:1.8}}
@media(prefers-reduced-motion:reduce){
 #flow-dialog.case-dialog[data-pointer-motion=true],#flow-dialog.case-dialog[data-pointer-motion=true]::backdrop{transition:none}
 #flow-dialog.case-dialog[data-pointer-motion=true][open]{transform:none;opacity:1}
 .cw-orbit,.sd-cover-demo,.case-tabs button:after,html[data-case-input=pointer] :is(.cw-scenarios button,.cw-play-actions button,.cw-zoom button,.sd-scenarios button,.sd-subtle,.sd-primary,.sd-product,.dialog-close,.case-open){transition:none!important}
 .cw-node:hover .cw-orbit,.sd-cover-demo:hover,html[data-case-input=pointer] :is(.cw-scenarios button,.cw-play-actions button,.cw-zoom button,.sd-scenarios button,.sd-subtle,.sd-primary,.sd-product,.dialog-close,.case-open):active{transform:none}
 @starting-style{#flow-dialog.case-dialog[data-pointer-motion=true][open]{opacity:1;transform:none}}
}