/* site-v43: the two redesigned sections (#general, #files). Loads after home.css (v41, unchanged); same kit, same units:
 * build.py turns "calc(var(--u)*12)" into calc(var(--u)*12). */

/* ── shared: both sections are plain stages, like plan and Plays ── */
.sec-files{padding-block:0}
.st-f43{margin-top:0}

/* ── #general: one window, read twice ── */
.w-gen{--dw:1000;--dh:720}
.w-gen .w-tb{display:flex}
.w-gen .sl{position:relative;transition:opacity var(--motion-medium) var(--ease-out),box-shadow var(--motion-medium) var(--ease-out)}
.w-gen[data-state="1"] .sl:not(.gb),.w-gen[data-state="2"] .sl:not(.gy){opacity:.22}
.w-gen[data-state="1"] .gb{box-shadow:0 0 0 1.5px rgba(95,214,189,.8)}
.w-gen[data-state="2"] .gy{box-shadow:0 0 0 1.5px rgba(245,245,245,.85)}
.w-gen .gl,.w-gen .gn{position:absolute;z-index:3;top:0;transform:translateY(-55%);display:none;align-items:center;gap:calc(var(--u)*5);padding:calc(var(--u)*2) calc(var(--u)*8) calc(var(--u)*3);border-radius:calc(var(--u)*999);font-size:calc(var(--u)*10.5);font-weight:600;font-style:normal;line-height:1.2;white-space:nowrap;pointer-events:none}
.w-gen .gl{right:calc(var(--u)*10);background:#15201d;border:1px solid rgba(95,214,189,.7);color:var(--teal-hi)}
.w-gen .gn{left:calc(var(--u)*10);background:var(--ink);color:#1a1a1a}
.w-gen .gn b{width:calc(var(--u)*15);height:calc(var(--u)*15);border-radius:50%;display:grid;place-items:center;background:#1a1a1a;color:var(--ink);font-size:calc(var(--u)*9.5)}
.w-gen[data-state="1"] .gl,.w-gen[data-state="2"] .gn{display:inline-flex}
.w-gen .w-thread{justify-content:flex-start;gap:calc(var(--u)*16);padding-top:calc(var(--u)*22)}
.w-gen .g-team{padding:calc(var(--u)*2) calc(var(--u)*6);margin:calc(var(--u)*-2) calc(var(--u)*-6);border-radius:calc(var(--u)*7)}
.w-gen .w-you,.w-gen .w-qq,.w-gen .w-done{border-radius:calc(var(--u)*12)}
.w-gen .gy>.w-you{margin:0}
.w-gen .g-q .q-opt{margin-top:calc(var(--u)*4)}
.w-appr{max-width:calc(var(--u)*560);border:1px solid var(--edge);border-radius:calc(var(--u)*12);background:#292929}
.w-appr header{display:flex;align-items:center;gap:calc(var(--u)*10);padding:calc(var(--u)*10) calc(var(--u)*12) calc(var(--u)*6)}
.w-appr header strong{display:block;font-size:calc(var(--u)*13);font-weight:600}
.w-appr header small{display:block;font-size:calc(var(--u)*11.5);color:var(--dim)}
.w-appr>p{padding:0 calc(var(--u)*14) calc(var(--u)*10) calc(var(--u)*50);font-size:calc(var(--u)*13);line-height:1.5}
.w-appr footer{display:flex;gap:calc(var(--u)*8);padding:calc(var(--u)*10) calc(var(--u)*12) calc(var(--u)*12);border-top:1px solid #454545}
.w-appr footer span{position:relative;display:inline-flex;align-items:center;height:calc(var(--u)*30);padding:0 calc(var(--u)*12);border:1px solid var(--edge);border-radius:calc(var(--u)*8);font-size:calc(var(--u)*12);color:var(--sub)}
.w-appr footer .ap-yes{background:var(--app-btn);border-color:var(--app-btn);color:var(--app-btn-ink);font-weight:600}
.w-gen[data-state="1"] .w-appr header,.w-gen[data-state="1"] .w-appr>p,.w-gen[data-state="1"] .w-appr footer span,
.w-gen[data-state="2"] .w-appr header,.w-gen[data-state="2"] .w-appr>p,.w-gen[data-state="2"] .w-appr footer span:not(.gy),
.w-gen[data-state="1"] .w-tb,.w-gen[data-state="2"] .w-tb,.w-gen[data-state="1"] .p-head,.w-gen[data-state="2"] .p-head,
.w-gen[data-state="1"] .g-needs>small,.w-gen[data-state="2"] .g-needs>small,.w-gen[data-state="1"] .p-foot>span:first-child,.w-gen[data-state="2"] .p-foot>span:first-child,
.w-gen[data-state="1"] .p-lock,.w-gen[data-state="1"] .w-top>.w-build,.w-gen[data-state="2"] .w-top>.w-build,.w-gen[data-state="1"] .w-seg-client,.w-gen[data-state="2"] .w-seg-client,
.w-gen[data-state="1"] .w-scope>i,.w-gen[data-state="2"] .w-scope>i,.w-gen[data-state="1"] .w-addp,.w-gen[data-state="2"] .w-addp,.w-gen[data-state="2"] .g-team{opacity:.22;transition:opacity var(--motion-medium) var(--ease-out)}
.w-gen[data-state="1"] .w-appr,.w-gen[data-state="2"] .w-appr{border-color:#454545}
.g-amber{background:rgba(245,158,11,.14)!important;color:#f5b454!important}
.w-gen .p-steps{flex:none;display:grid;overflow:visible;gap:calc(var(--u)*5);padding:calc(var(--u)*12) calc(var(--u)*14) calc(var(--u)*10);margin:calc(var(--u)*10) calc(var(--u)*8) 0;border-radius:calc(var(--u)*12)}
.w-gen .p-step{padding:calc(var(--u)*6) calc(var(--u)*10) calc(var(--u)*7)}
.w-gen .p-step p{margin-bottom:calc(var(--u)*3);font-size:calc(var(--u)*12.5)}
.w-gen .g-st .ic{width:calc(var(--u)*17);height:calc(var(--u)*17);margin-top:calc(var(--u)*2)}
.w-gen .g-done .p-num{background:var(--teal);color:var(--teal-ink)}
.w-gen .g-run{border-color:#2f5d8f;background:#262d36}
.g-needs{padding:calc(var(--u)*8) calc(var(--u)*22) calc(var(--u)*8)}
.g-needs>small{display:block;margin:calc(var(--u)*4) 0 calc(var(--u)*6);font:600 calc(var(--u)*10)/1 var(--sans);letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
.g-needs p{display:flex;align-items:center;gap:calc(var(--u)*8);font-size:calc(var(--u)*12.5);padding:calc(var(--u)*3) 0}
.g-prof,.g-data{padding:calc(var(--u)*4) calc(var(--u)*8);margin:0 calc(var(--u)*-8);border-radius:calc(var(--u)*8)}
.g-prof{margin-bottom:calc(var(--u)*10)}
.g-dot{width:calc(var(--u)*8);height:calc(var(--u)*8);flex:none;border-radius:50%;background:var(--teal)}
.w-gen .p-foot{margin-top:auto}
.w-gen .p-lock{position:relative}
.g-built .g-list{margin:10px 0 18px;display:grid;gap:2px}
.g-built .g-list li{font-size:15.5px;line-height:1.5;color:inherit}
.g-built .g-list li::before{content:"";display:inline-block;width:6px;height:6px;margin:0 10px 2px 2px;border-radius:50%;background:var(--teal)}
html.js .stage .blocks .g-built{color:var(--sub);transition:color var(--motion-medium) var(--ease-out)}
html.js .stage .blocks .g-built.on{color:var(--ink)}
.g-built p{color:inherit!important;font-size:clamp(17px,1.3vw,19px);line-height:1.55;max-width:34em}
.blocks>.g-built{margin-top:16px}
.blocks .g-fair{font-size:15.5px!important}

/* ── #files: one deliverable's life ── */
.w-life{--dw:1000;--dh:660}
.w-life .w-chat{--d:flex}
.w-life .w-url{--d:flex} /* v52: the address bar is not drawn (shared/site.css §9) */
.w-life .f-rv{color:var(--teal-hi)}
.rv-top{--d:flex;flex:none;align-items:center;gap:calc(var(--u)*10);height:calc(var(--u)*48);padding:0 calc(var(--u)*18);border-bottom:1px solid #454545;font-size:calc(var(--u)*12.5)}
.rv-top img{width:calc(var(--u)*18);height:calc(var(--u)*18)}
.rv-top strong{font-weight:600}
.rv-top small{font-size:calc(var(--u)*11.5);color:var(--dim)}
.rv-top span{margin-left:auto;padding:calc(var(--u)*2) calc(var(--u)*9);border:1px solid var(--edge);border-radius:calc(var(--u)*999);font-size:calc(var(--u)*11);color:var(--sub)}
.w-life .w-thread{gap:calc(var(--u)*12)}
.w-life .w-agent>*+*{margin-top:calc(var(--u)*8)}
.w-life .f-canvas{position:relative}
.w-life[data-state="3"] .f-canvas{width:100%;border-left:0;background:#212121}
.w-life[data-state="3"] .c-paper{width:calc(var(--u)*620);flex:1;align-self:flex-start;margin:calc(var(--u)*22) 0 calc(var(--u)*22) calc(var(--u)*70);position:relative;overflow:visible}
.w-life .c-paper p[data-s]{--d:block}
.w-life .w-toolline{display:inline-flex}
.w-life .c-paper s[data-s],.w-life .c-paper ins[data-s],.w-life .c-paper span[data-s]{--d:inline}
.w-life .c-paper s{color:var(--dim)}
.w-life .c-paper ins{text-decoration:none;padding:0 calc(var(--u)*2);border-radius:calc(var(--u)*4);background:rgba(33,173,143,.16);color:var(--ink)}
.c-hl2{transition:background-color var(--motion-medium) var(--ease-out)}
.c-hl2.f-on{background:rgba(245,158,11,.22)}
.f-comment{--d:block;position:absolute;left:calc(100% + calc(var(--u)*18));top:calc(var(--u)*40);width:calc(var(--u)*210);padding:calc(var(--u)*10) calc(var(--u)*12);border:1px solid #5a4a26;border-radius:calc(var(--u)*10);background:#2b2720;font-size:calc(var(--u)*12.5);line-height:1.45}
.f-comment strong{display:block;margin-bottom:calc(var(--u)*3);font-size:calc(var(--u)*11);color:#f5b454}
.f-comment span{display:block;margin-top:calc(var(--u)*8);font-size:calc(var(--u)*11);color:var(--dim)}
.w-life .c-btns span{transition:background-color var(--motion-base) var(--ease-out),color var(--motion-base) var(--ease-out)}
.w-life .d-hist.f-on{background:#333333;color:var(--ink)}
.w-life .d-pub.f-on{box-shadow:0 0 0 calc(var(--u)*2) rgba(33,173,143,.35)}
.f-pop{--d:grid;position:absolute;z-index:5;top:calc(var(--u)*86);width:calc(var(--u)*260);padding:calc(var(--u)*6);background:#303030;border:1px solid #454545;border-radius:calc(var(--u)*10);box-shadow:0 calc(var(--u)*14) calc(var(--u)*30) rgba(0,0,0,.45)}
.f-hist{left:calc(var(--u)*14)}
.f-pub{right:calc(var(--u)*14)}
.f-pop small{padding:calc(var(--u)*4) calc(var(--u)*8) calc(var(--u)*5);font:600 calc(var(--u)*10)/1.2 var(--sans);letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
.f-pop>span{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:calc(var(--u)*2) calc(var(--u)*9);padding:calc(var(--u)*7) calc(var(--u)*9);border-radius:calc(var(--u)*7);font-size:calc(var(--u)*12.5);color:var(--ink)}
.f-pop>span .ic{grid-row:span 2;color:var(--teal)}
.f-pop>span em{grid-column:2;font-style:normal;font-size:calc(var(--u)*11);color:var(--dim)}
.f-hist>span{grid-template-columns:1fr}
.f-hist>span b{font-weight:600}
.f-hist>span{color:var(--sub);font-size:calc(var(--u)*11.5)}
.f-pop>span.on,.f-pop>span.pm-blog{background:#333333}

@media (max-width:899px){
  .w-gen{--dw:430;--dh:1020}
  .w-gen .w-appr>p,.w-gen .w-appr header small,.w-gen .g-needs>small{display:none}
  .w-gen .w-appr footer{border-top:0;padding-top:calc(var(--u)*4)}
  .w-gen .g-prof{margin-bottom:calc(var(--u)*4)}
  .w-gen .p-head{padding-block:calc(var(--u)*8)}
  .w-gen .w-cols{flex-direction:column}
  .w-gen .w-planp{position:static;width:100%;border-left:0;border-top:1px solid #454545}
  .w-gen .w-tb{display:none}
  .w-gen .w-thread{padding:calc(var(--u)*18) calc(var(--u)*14) calc(var(--u)*12);gap:calc(var(--u)*14);flex:none}
  .w-gen .p-step p{display:none}
  .w-gen .p-steps{grid-template-columns:repeat(2,minmax(0,1fr));padding:calc(var(--u)*12) calc(var(--u)*12) calc(var(--u)*6)}
  .w-gen .p-step{padding:calc(var(--u)*6) calc(var(--u)*8);grid-template-columns:calc(var(--u)*20) minmax(0,1fr) calc(var(--u)*16);gap:calc(var(--u)*6)}
  .w-gen .p-head,.w-gen .g-needs,.w-gen .p-foot{padding-inline:calc(var(--u)*12)}
  .w-gen .w-appr>p{padding-left:calc(var(--u)*14)}
  .w-gen .w-appr footer span:last-child{display:none}
  .w-life{--dw:430;--dh:680}
  .w-life[data-state="3"] .c-paper{width:auto;margin:calc(var(--u)*14)}
  .f-comment{position:static;width:auto;margin-top:calc(var(--u)*12)}
  .rv-top small{display:none}
  /* the canvas covers the chat on a phone: hide the chat underneath so nothing crushed shows while the canvas enters */
  .w-life:not([data-state="0"]) .w-chat{visibility:hidden}
}