.sf-demo{--ink:#1c1a17;--ink-soft:#6b6459;--gold:#c8a24b;--gold-deep:#a9843a;--paper:#faf7f2;--line:#e4dccb;--white:#fff}.sf-eyebrow{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-deep);font-weight:700;display:flex;align-items:center;gap:8px}.sf-eyebrow:before{content:"";width:16px;height:2px;background:var(--gold);display:inline-block}.sf-demo .sf-h1{font-size:clamp(22px,3.2vw,30px);font-weight:700;margin-top:8px;letter-spacing:-.01em;color:var(--ink);line-height:1.15}.sf-demo .sf-sub{color:var(--ink-soft);font-size:14px;margin-top:8px;max-width:760px;line-height:1.55}.sf-demo .scenario-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0 10px}@media(max-width:820px){.sf-demo .scenario-bar{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.sf-demo .scenario-bar{grid-template-columns:1fr}}.sf-demo .scn{display:flex;align-items:center;gap:12px;text-align:left;cursor:pointer;padding:13px 15px;border-radius:12px;background:var(--white);border:1px solid var(--line);transition:all .18s;font-family:inherit}.sf-demo .scn:hover{border-color:var(--gold);transform:translateY(-1px);box-shadow:0 8px 20px -12px #a9843a59}.sf-demo .scn.on{border-color:var(--gold);background:#fbf3df;box-shadow:0 8px 22px -14px #a9843a80}.sf-demo .scn-ic{flex:none;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--paper);color:var(--gold-deep);font-size:18px;border:1px solid var(--line)}.sf-demo .scn.on .scn-ic{background:var(--gold);color:#fff;border-color:var(--gold)}.sf-demo .scn-txt{display:flex;flex-direction:column;line-height:1.25}.sf-demo .scn-txt b{font-size:13.5px;color:var(--ink);font-weight:700}.sf-demo .scn-txt em{font-size:11.5px;color:var(--ink-soft);font-style:normal;margin-top:2px}.sf-demo .toolbar{display:flex;gap:10px;margin:10px 0;flex-wrap:wrap;align-items:center;background:var(--white);padding:12px 14px;border-radius:12px;border:1px solid var(--line)}.sf-demo .status-panel{flex:1;min-width:240px;padding:8px 14px;border-radius:10px;background:var(--paper);border:1px solid var(--line);font-size:13px;line-height:1.4}.sf-demo .status-panel .label{color:var(--ink-soft);font-size:10px;text-transform:uppercase;letter-spacing:1px;font-weight:700}.sf-demo .status-panel .value{font-weight:600;color:var(--ink)}.sf-demo .btn{padding:9px 15px;border-radius:999px;background:var(--paper);border:1px solid var(--line);color:var(--ink);cursor:pointer;font-size:13px;font-weight:600;transition:all .15s;font-family:inherit}.sf-demo .btn:hover{border-color:var(--gold)}.sf-demo .btn.edit.active{background:var(--gold);border-color:var(--gold);color:var(--ink)}.sf-demo .sf-scrollhint{color:var(--gold-deep);font-size:12px;font-weight:600;margin:2px 2px 6px}.sf-demo .stage{background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden}.sf-demo .sf-board-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.sf-demo svg.board{width:100%;min-width:720px;height:auto;display:block}.sf-demo .tier-label{font-size:11px;font-weight:700;fill:var(--gold-deep);letter-spacing:2px;text-transform:uppercase}.sf-demo .tier-divider{stroke:var(--line);stroke-width:1;stroke-dasharray:2 7}.sf-demo .node rect.case{fill:var(--white);stroke:var(--line);stroke-width:1.6;transition:stroke .3s,filter .3s,opacity .3s}.sf-demo .node.powered rect.case{stroke:var(--gold);filter:drop-shadow(0 6px 16px rgba(169,132,58,.22))}.sf-demo .node.off rect.case{opacity:.5}.sf-demo .node.off .icon-art{opacity:.4}.sf-demo .node text{fill:var(--ink);text-anchor:middle;pointer-events:none}.sf-demo .node .title{font-size:14px;font-weight:700}.sf-demo .node .sub{font-size:10.5px;fill:var(--ink-soft);font-weight:400}.sf-demo .ln{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.sf-demo .ln-thin{fill:none;stroke:var(--ink-soft);stroke-width:1.4;stroke-linecap:round}.sf-demo .fill-gold{fill:var(--gold)}.sf-demo .stroke-gold{fill:none;stroke:var(--gold-deep);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.sf-demo .lbl{font-size:12px;font-weight:700;fill:var(--ink-soft);text-anchor:middle}.sf-demo .lbl-sm{font-size:9.5px;fill:var(--ink-soft);text-anchor:middle}.sf-demo .node.has-image .icon-art{display:none}.sf-demo .node:not(.has-image) .user-img{display:none}.sf-demo.edit-mode .node{cursor:pointer}.sf-demo.edit-mode .node rect.case{stroke-dasharray:6 4;stroke:var(--gold-deep)}.sf-demo .edit-hint{display:none;fill:var(--gold-deep);font-size:11px;font-weight:700;text-anchor:middle;pointer-events:none}.sf-demo.edit-mode .edit-hint{display:block}.sf-demo .node.drag-over rect.case{stroke:var(--gold)!important;stroke-width:3!important}.sf-demo .wire{fill:none;stroke:#e0d6c2;stroke-width:3;stroke-linejoin:round;stroke-linecap:round}.sf-demo .wire.active{stroke:var(--gold);stroke-width:4;stroke-dasharray:16 11;animation:sfflow .8s linear infinite;filter:drop-shadow(0 0 4px rgba(200,162,75,.55))}.sf-demo .wire.reverse.active{animation:sfflowR .8s linear infinite}.sf-demo .wire.charge{stroke-dasharray:4 8;stroke:#e6ddca;stroke-width:2.5}@keyframes sfflow{to{stroke-dashoffset:-27}}@keyframes sfflowR{to{stroke-dashoffset:27}}.sf-demo .particle{pointer-events:none}.sf-demo .sf-wind path{animation:sfwind 1.5s ease-in-out infinite}@keyframes sfwind{0%,to{opacity:.15}50%{opacity:1}}.sf-demo .instructions{margin-top:16px;padding:16px 20px;background:#fbf3df;border:1px solid var(--gold);border-radius:12px;font-size:13px;line-height:1.7;color:var(--ink)}.sf-demo .instructions h3{color:var(--gold-deep);margin-bottom:8px;font-size:13px;letter-spacing:.4px}