.wq-headless-visual { width:100%; height:100%; min-height:240px; padding:28px; display:flex; flex-direction:column; gap:18px; background:#f8faf9; color:#192b29; letter-spacing:0; }
.wq-headless-caption { font:500 12px/1.5 Arial,sans-serif; color:#60706d; }
.wq-headless-route { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; min-width:0; }
.wq-headless-node { width:min(100%,380px); padding:22px; display:flex; align-items:center; gap:16px; background:#fff; border:1px solid #cdd9d6; border-radius:8px; }
.wq-headless-node svg { width:32px; height:32px; flex-shrink:0; color:#376d84; }
.wq-headless-node strong { font-size:20px; line-height:1.4; font-family:inherit; overflow-wrap:anywhere; }
.wq-headless-node-shop { background:#e4f3e9; border-color:#a7cdb5; }
.wq-headless-node-shop svg { color:#206846; }
.wq-headless-connector { display:flex; flex-direction:column; align-items:center; gap:6px; font-size:13px; text-align:center; color:#576963; }
.wq-headless-connector svg { width:22px; height:22px; }
.wq-headless-visual .wq-headless-note { font-size:14px; line-height:1.6; text-align:center; color:#576963; margin:0; }
.wq-headless-overview { min-height:490px; border-radius:20px 20px 0 0; background:#f4f8fb; }
.wq-headless-overview .wq-headless-node { padding:32px; }
.wq-headless-details { border-top:1px solid #cad8d2; }
.wq-headless-details summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:48px; padding:10px 0; font-size:15px; cursor:pointer; list-style:none; }
.wq-headless-details summary::-webkit-details-marker { display:none; }
.wq-headless-details summary svg { width:20px; height:20px; flex-shrink:0; transition:transform .25s; }
.wq-headless-details[open] summary svg { transform:rotate(45deg); }
.wq-headless-details p { font-size:14px; line-height:1.7; color:#465b55; margin:0; }
.wq-headless-details summary:focus-visible { outline:2px solid #277866; outline-offset:4px; }
.weswoo-headless-page .wq-architecture-frame { height:auto; min-height:480px; }
.wq-architecture-frame .wq-headless-visual { min-height:480px; transition:background .3s; }
.wq-architecture-frame:hover .wq-headless-visual { background:#eef6f2; }
.weswoo-headless-page #headless-work-scope { scroll-margin-top:120px; }
.weswoo-headless-layers a > div:first-child { min-width:0; flex:1; }
.weswoo-headless-layers a > div:first-child > div { min-width:0; flex:1; }
.weswoo-headless-layers a > div:last-child { flex-shrink:0; width:36px; height:36px; }
.weswoo-headless-layers a h5 { font-size:20px; line-height:1.35; overflow-wrap:anywhere; }
.weswoo-headless-layers a p { font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.weswoo-headless-page .wq-headless-compact { padding:0; background:transparent; }
.wq-headless-compact .wq-headless-visual { padding:18px; border-radius:8px; }
.wq-headless-compact .wq-headless-node { padding:12px; gap:10px; }
.wq-headless-compact .wq-headless-node strong { font-size:16px; }
.wq-headless-compact .wq-headless-node svg { width:24px; height:24px; }
@media(min-width:1024px) { .wq-headless-gradual .wq-headless-route { flex-direction:row; gap:24px; } .wq-headless-gradual .wq-headless-connector { width:140px; flex-shrink:0; } .wq-headless-gradual .wq-headless-connector svg { transform:rotate(-90deg); } }
@media(max-width:767px) { .wq-headless-visual { padding:22px; } .wq-headless-overview { min-height:390px; } .wq-headless-overview .wq-headless-node { padding:22px; } .wq-headless-node strong { font-size:18px; } .wq-architecture-frame .wq-headless-visual { min-height:430px; } }