.feature-symbol{width:34px;height:34px;fill:none;stroke:var(--green);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.feature-item>.feature-symbol{display:block;margin-bottom:12px}.demo-section{background:#f6f7f3}.demo-selectors{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:28px}.demo-selectors button{border:1px solid var(--line);background:transparent;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 8px;border-radius:10px;font-size:13px;transition:background .2s,box-shadow .2s}.demo-selectors button[aria-selected=true]{background:white;color:var(--ink);border-color:#a3b2a2;box-shadow:0 4px 18px #2334260c}.demo-selectors button[aria-selected=true] .feature-symbol{stroke:var(--orange-dark)}.demo-panel{display:grid;grid-template-columns:280px minmax(0,1fr);gap:35px;align-items:center}.demo-panel[hidden]{display:none}.demo-explanation h3{font-size:29px;margin-bottom:18px}.demo-explanation>p{font-size:14px;color:var(--muted)}.demo-explanation ul{list-style:none;padding:0;font-size:12px;color:var(--green);margin-top:22px}.demo-explanation li{margin-block:7px}.demo-explanation li:before{content:'✓';margin-right:10px}.demo-panel figure{margin:0;min-width:0;background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden}.demo-panel .screen-button img{height:auto;aspect-ratio:16/9;object-fit:contain}.demo-panel figcaption{padding:12px 16px;font-size:11px;color:var(--muted)}.need-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.need-card{position:relative;text-align:left;padding:30px;background:white;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;align-items:flex-start;transition:background .2s,border-color .2s}.need-card strong{font-size:21px;line-height:1.5;margin:23px 0 12px}.need-card>span:not(.need-check){color:var(--muted);font-size:14px}.need-card small{margin-top:22px;color:var(--green);font-size:12px}.need-check{position:absolute;right:24px;top:24px;border-radius:50%;background:var(--soft);width:28px;height:28px;text-align:center;line-height:28px}.need-card[aria-pressed=true]{background:#f0f5ed;border-color:var(--green)}.need-card[aria-pressed=true] .need-check{background:var(--green);color:white;transform:rotate(45deg)}.need-result{display:flex;justify-content:space-between;gap:28px;align-items:center;background:var(--soft);border-radius:10px;padding:22px 26px;margin-top:22px}.need-result p{font-size:14px;max-width:750px;color:var(--muted)}.workflow-section{border-bottom:1px solid var(--line)}.workflow-stack{margin-top:48px}.workflow-lane{display:grid;grid-template-columns:240px 1fr;gap:40px;border-top:1px solid var(--line);padding:36px 0}.workflow-intro h3{font-size:23px;margin-bottom:14px}.workflow-intro p{font-size:13px;color:var(--muted)}.workflow-map{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;list-style:none;margin:0;padding:0}.workflow-map li{position:relative}.workflow-map li:not(:last-child):after{content:'→';position:absolute;right:-16px;top:14px;color:#abb9a6}.workflow-node{display:flex;align-items:center;gap:10px;padding-bottom:17px;border-bottom:1px solid var(--line)}.workflow-node span{font:12px ui-monospace,monospace;color:var(--orange-dark)}.workflow-map h4{font-size:15px;margin:18px 0 10px;line-height:1.5}.workflow-map p{font-size:12px;color:var(--muted);line-height:1.9}@media(max-width:1000px){.workflow-lane{grid-template-columns:1fr}.workflow-intro p{max-width:650px}.demo-panel{grid-template-columns:220px minmax(0,1fr);gap:24px}.need-card{padding:24px}}@media(max-width:760px){.demo-selectors{grid-template-columns:repeat(3,1fr);gap:8px}.demo-selectors button{padding:12px 5px;font-size:12px}.demo-selectors .feature-symbol{width:26px;height:26px}.demo-panel{grid-template-columns:1fr;gap:22px}.demo-explanation h3{font-size:25px}.demo-explanation ul{display:flex;flex-wrap:wrap;gap:6px 16px;margin-bottom:0}.need-grid{grid-template-columns:1fr;gap:12px}.need-card{padding:22px}.need-card strong{font-size:20px;margin-top:16px}.need-result{display:block;padding:22px}.need-result a{margin-top:18px}.workflow-map{grid-template-columns:repeat(2,1fr);gap:28px 24px}.workflow-map li:nth-child(2):after{display:none}.workflow-lane{gap:25px;padding-block:30px}.workflow-map p{font-size:13px}.workflow-intro p{font-size:14px}.workflow-stack{margin-top:30px}}@media(prefers-reduced-motion:reduce){.demo-selectors button,.need-card{transition:none}}

.feature-points{list-style:none;padding:0;font-size:13px;color:var(--green);margin:18px 0 0}.feature-points li{margin:7px 0}.feature-points li:before{content:"✓";margin-right:10px}