/* Local explanatory diagrams for the Software Engineering perspective. */
.sew-widget{--sew-blue:#1b17ff;--sew-ink:#262626;--sew-muted:#666;box-sizing:border-box;width:100%;min-width:0;margin:36px 0;padding:clamp(20px,3vw,40px);border:1px solid #ddd;background:#fff;color:var(--sew-ink);overflow-wrap:anywhere}
.sew-widget *,.sew-widget *:before,.sew-widget *:after{box-sizing:border-box}
.sew-widget [hidden]{display:none!important}
.sew-widget .sew-kicker{display:block;color:var(--sew-muted);font-size:10px;line-height:1.6;letter-spacing:.07em;text-transform:uppercase;margin:0 0 14px}
.sew-widget .sew-heading h3{font-size:clamp(25px,2.5vw,34px);font-weight:450;line-height:1.2;letter-spacing:-.025em;margin:0 0 15px}
.sew-widget .sew-heading>p{font-size:15px;line-height:1.8;color:var(--sew-muted);margin:0 0 28px}
.sew-widget h4{font-size:23px;line-height:1.4;letter-spacing:-.02em;font-weight:450;margin:0 0 14px}
.sew-widget p{font-size:14px;line-height:1.8;margin:0 0 16px}
.sew-widget button{font:inherit;font-size:13px;line-height:1.5;text-align:left;cursor:pointer;color:var(--sew-ink);background:white;border:1px solid #ccc;border-radius:0;min-height:44px;padding:11px 15px;transition:background-color .18s,border-color .18s}
.sew-widget button:hover,.sew-widget button[aria-pressed=true]{border-color:var(--sew-blue);color:var(--sew-blue);background:#f6f5ff}
.sew-widget button:focus-visible,.sew-widget input:focus-visible,.sew-widget summary:focus-visible{outline:2px solid var(--sew-blue);outline-offset:4px}
.sew-widget .sew-choices{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.sew-widget .sew-note{font-size:12px;line-height:1.8;color:#666;margin:24px 0 0}
.sew-widget .sew-architecture-panel+.sew-architecture-panel{margin-top:36px}
.sew-widget[data-sew-ready=true] .sew-architecture-panel{margin-top:0}
.sew-widget .sew-diagram{background:#f7f7f7;border:1px solid #e6e6e6;padding:26px;margin:0 0 28px}
.sew-widget .sew-deploy{border:1px solid #a8a8a8;background:#fff;padding:22px;position:relative}
.sew-widget .sew-boundary{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.04em;line-height:1.6;color:#6b6b6b;margin-bottom:16px}
.sew-widget .sew-portal{display:block;margin:0 auto;text-align:center;background:#262626;color:#fff;padding:15px 20px;font-size:14px;line-height:1.5;font-weight:500;width:75%;max-width:310px}
.sew-widget .sew-bus{height:32px;width:66.666%;margin:auto;position:relative;border-bottom:1px solid #b2b2b2}
.sew-widget .sew-bus:before{content:'';position:absolute;left:50%;top:0;bottom:0;border-left:1px solid #b2b2b2}
.sew-widget .sew-modules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}
.sew-widget .sew-module{position:relative;display:flex;align-items:center;flex-direction:column;gap:10px;padding:12px 8px;text-align:center;min-width:0}
.sew-widget .sew-module:before{content:'';height:18px;border-left:1px solid #b2b2b2;position:absolute;left:50%;top:-19px}
.sew-widget .sew-module strong,.sew-widget .sew-service-deploy>strong{font-size:14px;line-height:1.5;font-weight:500}
.sew-widget .sew-node{display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;border-radius:50%;background:radial-gradient(circle at 30% 25%,#8c89ff,#1b17ff 80%);color:#fff;font-size:11px}
.sew-widget .sew-modules-shared{border:1px solid #e0e0e0;background:#fafafa;gap:0}
.sew-widget .sew-module-bounded{border:1px dashed #aaa;background:#fafafa;padding:18px 8px 15px}
.sew-widget .sew-interface{font-size:10px;color:#666;line-height:1.5}
.sew-widget .sew-connection{text-align:center;position:relative;font-size:10px;line-height:1.7;color:#666;padding:17px 6px;margin:0}
.sew-widget .sew-connection:before,.sew-widget .sew-connection:after{content:'';display:block;width:1px;height:8px;background:#b2b2b2;margin:0 auto 7px}
.sew-widget .sew-connection:after{margin:7px auto 0}
.sew-widget .sew-database{border:1px solid #aaa;background:#f7f7f7;padding:14px;text-align:center;font-size:12px;line-height:1.6}
.sew-widget .sew-data-partitioned{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:0}
.sew-widget .sew-data-partitioned>span{padding:12px 4px;font-size:11px}
.sew-widget .sew-data-partitioned>span+span{border-left:1px solid #ccc}
.sew-widget .sew-data-partitioned small{grid-column:1/-1;border-top:1px solid #ccc;font-size:10px;padding:9px;line-height:1.7;color:#666}
.sew-widget .sew-micro-top{border:1px solid #aaa;padding:17px;background:#fff}
.sew-widget .sew-micro-top .sew-boundary{margin-bottom:10px}
.sew-widget .sew-services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.sew-widget .sew-service-deploy{display:flex;flex-direction:column;align-items:center;gap:13px;min-width:0;border:1px solid var(--sew-blue);background:#fff;padding:16px 10px}
.sew-widget .sew-service-deploy .sew-boundary{font-size:9px;margin:0;align-self:flex-start;color:var(--sew-blue)}
.sew-widget .sew-service-data{font-size:11px;padding:11px 6px;width:100%;border:1px solid #ccc;background:#fafafa;text-align:center;line-height:1.5;margin-top:3px}
.sew-widget .sew-explanation>p{color:#555}
.sew-widget .sew-facts{display:grid;grid-template-columns:1fr 1fr;gap:20px 26px;margin:24px 0 0}
.sew-widget .sew-facts>div{border-top:1px solid #ddd;padding-top:15px}
.sew-widget dt{font-size:10px;line-height:1.7;color:#666;letter-spacing:.04em;text-transform:uppercase;margin:0 0 8px}
.sew-widget dd{font-size:13px;line-height:1.8;margin:0}
.sew-widget .sew-fault{padding:24px;background:#f7f7f7;border-left:2px solid #262626;margin-bottom:24px}
.sew-widget .sew-fault p{color:#555;margin:0}
.sew-widget .sew-checks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:26px 0}
.sew-widget .sew-checks button{display:flex;flex-direction:column;gap:9px;padding:15px 12px;min-width:0}
.sew-widget .sew-checks button>span{font-size:10px;color:#777}
.sew-widget .sew-checks strong{font-size:13px;font-weight:500;line-height:1.5}
.sew-widget .sew-checks small{font-size:10px;line-height:1.6;color:#666}
.sew-widget .sew-test-result{padding:25px;border:1px solid #d3d3d3;border-top:3px solid var(--sew-blue);background:#fafafa}
.sew-widget .sew-test-result[data-sew-detected=false]{border-top-color:#888}
.sew-widget .sew-result-status{display:block;font-size:10px;line-height:1.7;letter-spacing:.03em;text-transform:uppercase;color:var(--sew-blue);margin-bottom:16px}
.sew-widget .sew-test-result[data-sew-detected=false] .sew-result-status{color:#555}
.sew-widget .sew-test-limit{border-top:1px solid #ddd;padding-top:17px;margin-top:20px}
.sew-widget .sew-test-limit>strong{font-size:12px;line-height:1.5;font-weight:500}
.sew-widget .sew-test-limit>p{font-size:13px;color:#666;margin:8px 0 0}
.sew-widget .sew-budget-assumptions{padding:22px;border:1px solid #ddd;background:#fafafa;margin-bottom:28px}
.sew-widget .sew-inputs{display:grid;grid-template-columns:1fr 1fr;gap:20px 26px}
.sew-widget .sew-inputs label{display:grid;grid-template-columns:minmax(0,1fr) 95px;gap:7px 15px;align-items:center;min-width:0}
.sew-widget .sew-inputs label>span{font-size:12px;line-height:1.6}
.sew-widget .sew-inputs input{font:inherit;font-size:16px;min-width:0;width:100%;min-height:44px;border:1px solid #bbb;border-radius:0;background:#fff;color:#262626;padding:10px}
.sew-widget .sew-inputs small{font-size:9px;line-height:1.3;color:#777;grid-column:2}
.sew-widget .sew-inputs input[aria-invalid=true]{border-color:#762b26;background:#fff8f7}
.sew-widget .sew-error{font-size:13px;line-height:1.6;border-left:2px solid #762b26;color:#762b26;background:#fff8f7;padding:14px}
.sew-widget .sew-bar-row{margin:23px 0}
.sew-widget .sew-bar-row>div:first-child{display:flex;justify-content:space-between;gap:15px;font-size:13px;line-height:1.6;margin-bottom:10px}
.sew-widget .sew-bar-row strong{font-weight:500;white-space:nowrap}
.sew-widget .sew-stacked-bar{height:25px;width:100%;background:#f0f0f0;display:flex;overflow:hidden}
.sew-widget .sew-stacked-bar>span{height:100%;width:var(--sew-share);flex-shrink:0;border-right:2px solid #fff;transition:width .18s}
.sew-widget [data-sew-phase=discovery],.sew-widget [data-sew-legend=discovery]{background:#404040}
.sew-widget [data-sew-phase=build],.sew-widget [data-sew-legend=build]{background:#1b17ff}
.sew-widget [data-sew-phase=integration],.sew-widget [data-sew-legend=integration]{background:#777}
.sew-widget [data-sew-phase=quality],.sew-widget [data-sew-legend=quality]{background:#aaa}
.sew-widget [data-sew-phase=rollout],.sew-widget [data-sew-legend=rollout]{background:#d4d4d4}
.sew-widget [data-sew-phase=review],.sew-widget [data-sew-legend=review]{background:repeating-linear-gradient(135deg,#b4b2ff 0 3px,#e7e7ff 3px 6px)}
.sew-widget .sew-legend{display:flex;flex-wrap:wrap;gap:10px 18px;margin:18px 0 28px}
.sew-widget .sew-legend>span{display:flex;gap:7px;align-items:center;font-size:10px;line-height:1.5;color:#666}
.sew-widget .sew-legend i{display:block;width:10px;height:10px;flex-shrink:0}
.sew-widget .sew-budget-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:25px 0}
.sew-widget .sew-budget-metrics>div{border-top:1px solid #ddd;padding-top:18px;min-width:0}
.sew-widget .sew-budget-metrics dd{font-size:clamp(22px,2.2vw,30px);line-height:1.35;letter-spacing:-.035em;color:var(--sew-blue)}
.sew-widget[data-sew-negative=true] [data-sew-budget=difference]{color:#262626}
.sew-widget .sew-budget-live{border-left:2px solid var(--sew-blue);padding:14px 18px;background:#f7f7f7;font-size:13px;line-height:1.7;margin:24px 0}
.sew-widget .sew-running{border-block:1px solid #ddd;padding:20px 0;margin:24px 0}
.sew-widget .sew-running>div{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:14px;line-height:1.6}
.sew-widget .sew-running strong{font-size:22px;font-weight:450;line-height:1.5;white-space:nowrap}
.sew-widget .sew-running p{font-size:12px;color:#666;margin:10px 0 0}
.sew-widget .sew-calculation summary{font-size:13px;line-height:1.6;cursor:pointer}
.sew-widget .sew-calculation p{font-size:12px;color:#666;margin:18px 0 0}
.sew-widget .sew-phase-table{overflow-x:auto;margin:18px 0}
.sew-widget .sew-phase-table table{width:100%;border-collapse:collapse;min-width:270px;font-size:12px;line-height:1.6;text-align:left}
.sew-widget .sew-phase-table th,.sew-widget .sew-phase-table td{border-bottom:1px solid #ddd;padding:10px 8px;font-weight:400}
.sew-widget .sew-phase-table thead th{color:#666;font-size:10px}
.sew-widget .sew-phase-table td{white-space:nowrap}
.sew-widget .sew-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
@media(max-width:1100px){.sew-widget .sew-inputs label{grid-template-columns:1fr}.sew-widget .sew-inputs small{grid-column:1}.sew-widget .sew-inputs input{max-width:180px}}
@media(max-width:650px){
 .sew-widget{margin:28px 0;padding:20px}.sew-widget .sew-heading>p{font-size:14px}.sew-widget h4{font-size:21px}
 .sew-widget .sew-choices{flex-direction:column}.sew-widget .sew-choices button{width:100%;font-size:12px}
 .sew-widget .sew-facts{grid-template-columns:1fr;gap:18px}.sew-widget .sew-diagram{padding:16px}.sew-widget .sew-deploy{padding:14px}
 .sew-widget .sew-checks{grid-template-columns:1fr 1fr}.sew-widget .sew-checks strong{font-size:12px}.sew-widget .sew-fault,.sew-widget .sew-test-result{padding:18px}
 .sew-widget .sew-inputs{grid-template-columns:1fr;gap:16px}.sew-widget .sew-inputs input{max-width:none}.sew-widget .sew-budget-assumptions{padding:16px}
 .sew-widget .sew-budget-metrics{grid-template-columns:1fr;gap:18px}.sew-widget .sew-budget-metrics dd{font-size:30px}.sew-widget .sew-running>div{align-items:flex-start;flex-direction:column;gap:5px}
}
@media(max-width:560px){
 .sew-widget .sew-portal{width:100%;font-size:12px;padding:12px 8px}.sew-widget .sew-bus{width:1px;height:22px;border-bottom:0;border-left:1px solid #b2b2b2}.sew-widget .sew-bus:before{display:none}
 .sew-widget .sew-modules{grid-template-columns:1fr;gap:10px;margin-top:0}.sew-widget .sew-module{display:grid;grid-template-columns:36px minmax(0,1fr);text-align:left;gap:3px 10px;padding:12px}
 .sew-widget .sew-module:before{display:none}.sew-widget .sew-node{width:36px;height:36px;grid-row:1/3;font-size:10px}.sew-widget .sew-module strong{font-size:12px}.sew-widget .sew-module .sew-interface{font-size:9px}
 .sew-widget .sew-modules-shared{gap:0}.sew-widget .sew-modules-shared .sew-module+.sew-module{border-top:1px solid #ddd}.sew-widget .sew-data-partitioned{grid-template-columns:1fr}.sew-widget .sew-data-partitioned>span{padding:8px}
 .sew-widget .sew-data-partitioned>span+span{border-left:0;border-top:1px solid #ccc}.sew-widget .sew-services{grid-template-columns:1fr;gap:12px}.sew-widget .sew-service-deploy{display:grid;grid-template-columns:36px minmax(0,1fr);gap:10px;text-align:left;padding:14px}
 .sew-widget .sew-service-deploy .sew-boundary{grid-column:1/-1}.sew-widget .sew-service-deploy .sew-node{grid-row:2}.sew-widget .sew-service-deploy .sew-service-data{grid-column:1/-1}.sew-widget .sew-service-deploy>strong{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.sew-widget button,.sew-widget .sew-stacked-bar>span{transition:none}}
