/* Portal additions on top of the opsoes.com stylesheet. Same tokens, same header, same cards. */
body{ font-weight:500; }
.portal-main{ min-height: 60vh; }
.nav-company{ font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color: var(--gold); margin-left:6px; }
.nav-signout{ opacity:.7; }
@media (max-width:1100px){ .brand-text .full-name{ display:none; } }

/* page hero (dark band like the site's stat strip) */
.page-band{ background: var(--ink); color: var(--white); border-bottom:1px solid var(--line); }
.page-band .wrap{ padding: 34px 28px; display:flex; flex-wrap:wrap; gap:18px 32px; align-items:flex-end; justify-content:space-between; }
.page-band h1{ color: var(--white); font-size: clamp(26px, 3vw, 40px); font-weight:600; }
.page-band h1 em{ font-style:normal; color: var(--gold); }
.page-band .meta{ font-family: var(--font-mono); font-size:12.5px; letter-spacing:.04em; color: rgba(247,246,242,0.7); margin-top:8px; }
.page-band .viewing{ font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color: var(--ink); background: var(--gold); padding:6px 12px; }

/* stat strip reused for the project summary */
.stat-strip .wrap{ grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); }
.stat .num.good{ color:#4FAE82; } .stat .num.warn{ color:#E0A055; } .stat .num.bad{ color:#E0716D; }

/* sections */
.section{ padding: 34px 0; }
.section + .section{ border-top:1px solid var(--line-dark); }
.section-title{ display:flex; align-items:baseline; gap:14px; margin-bottom:16px; flex-wrap:wrap; }
.section-title h2{ font-size: 22px; font-weight:700; }
.section-title .eyebrow{ font-family: var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color: var(--brass); font-weight:800; }
.headline{ background: var(--white); border:1px solid var(--line-dark); border-left:4px solid var(--gold); padding:14px 18px; font-weight:600; margin-bottom:18px; }

/* project cards on the home page: the site's svc-card */
.svc-card.project{ align-items:flex-start; text-align:left; }
.svc-card.project h3{ font-size:20px; }
.svc-card.project .idx{ font-size:12px; }
.svc-card.project p{ color: rgba(20,34,46,0.72); }
.svc-card .project-meta{ font-family: var(--font-mono); font-size:11.5px; letter-spacing:.04em; color: rgba(20,34,46,0.6); }

/* work order cards */
.wo-grid{ display:flex; flex-wrap:wrap; gap:1px; background: var(--line-dark); border:1px solid var(--line-dark); }
.wo{ background: var(--white); flex:1 1 300px; padding: 20px 22px; min-width:0; }
.wo .top{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-bottom:6px; }
.wo .top b{ font-family: var(--font-display); font-size:19px; font-weight:700; }
.wo dl{ display:grid; grid-template-columns:auto 1fr; gap:4px 12px; margin:10px 0 0; font-size:13.5px; }
.wo dt{ font-family: var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color: rgba(20,34,46,0.55); line-height:20px; }
.wo dd{ margin:0; min-width:0; }
.wo .links{ margin-top:12px; border-top:1px solid var(--line-dark); padding-top:8px; font-size:13px; }
.wo .links div{ display:flex; gap:8px; margin-top:3px; }
.wo .links .who{ flex:0 0 80px; font-family: var(--font-mono); font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color: rgba(20,34,46,0.55); line-height:18px; }

/* status chips */
.chip{ display:inline-block; font-family: var(--font-mono); font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:3px 9px; white-space:nowrap; }
.chip.good{ color:#2E7D5B; background:#E1F0E7; } .chip.warn{ color:#B4691F; background:#F7E7D2; } .chip.bad{ color:#B0413E; background:#F6DEDD; } .chip.pending, .chip.neutral{ color:#5B6675; background:#E4E9EE; }

/* tables */
.tablewrap{ overflow-x:auto; background: var(--white); border:1px solid var(--line-dark); }
table.pt{ border-collapse:collapse; width:100%; min-width:640px; }
table.pt th{ font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; text-align:left; padding:10px 12px; background: var(--ink); color: rgba(247,246,242,0.85); }
table.pt td{ padding:10px 12px; border-bottom:1px solid var(--line-dark); vertical-align:top; font-size:14px; line-height:20px; font-weight:500; }
table.pt tr:last-child td{ border-bottom:0; }
table.pt td.mono{ font-family: var(--font-mono); white-space:nowrap; }
table.pt .dim{ display:block; color: rgba(20,34,46,0.62); font-size:12.5px; margin-top:2px; }

/* documents */
.docs{ background: var(--white); border:1px solid var(--line-dark); }
.doc-row{ display:flex; gap:14px; align-items:center; padding:10px 14px; border-bottom:1px solid var(--line-dark); }
.doc-row:last-child{ border-bottom:0; }
.doc-row .folder{ flex:0 0 230px; font-family: var(--font-mono); font-size:11px; letter-spacing:.03em; color: rgba(20,34,46,0.6); overflow-wrap:anywhere; }
.doc-row .name{ flex:1; min-width:0; }
.doc-row .name .dim{ display:block; font-size:12px; color: rgba(20,34,46,0.6); }
.doc-row .new{ background: var(--gold); color: var(--ink); font-family: var(--font-mono); font-size:10px; font-weight:800; letter-spacing:.06em; padding:2px 6px; margin-left:6px; }
.btn--small{ padding: 8px 14px; font-size:12px; }
.btn--brass:visited{ color: var(--ink); }
.doc-folder-head{ background: var(--paper); padding:8px 14px; font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; font-weight:800; color: var(--brass); border-bottom:1px solid var(--line-dark); }
@media (max-width:640px){ .doc-row{ flex-wrap:wrap; } .doc-row .folder{ flex-basis:100%; } }

/* forms */
.form{ background: var(--white); border:1px solid var(--line-dark); padding:22px 24px; max-width:560px; }
.form label{ display:block; font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color: rgba(20,34,46,0.65); margin:12px 0 5px; }
.form input[type=text], .form input[type=email], .form input[type=password], .form select, .form textarea{ width:100%; font: 500 15px/22px var(--font-body); padding:10px 12px; border:1px solid var(--line-dark); background: var(--paper); color: var(--ink-text); }
.form input[type=file]{ font: 500 14px var(--font-body); }
.form .row{ display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; }
.form .row > div{ flex:1 1 180px; }
.form .actions{ margin-top:18px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.form .err{ color:#8B0000; font-weight:600; margin-top:12px; }
.form .ok{ color:#2E7D5B; font-weight:600; margin-top:12px; }
.upload-box{ background: var(--ink); color: var(--white); padding:22px 24px; margin-top:18px; }
.upload-box h3{ color: var(--gold); font-size:16px; margin-bottom:8px; }
.upload-box p{ color: rgba(247,246,242,0.75); font-size:14px; margin-bottom:12px; }
.upload-box input[type=file]{ color: var(--white); }
.upload-box input[type=text]{ font: 500 14px var(--font-body); padding:8px 10px; border:1px solid var(--line); background: var(--steel); color: var(--white); width:100%; max-width:420px; }
.upload-box .actions{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:10px; }
.flash{ background: var(--gold); color: var(--ink); padding:12px 18px; margin-top:18px; font-weight:700; }

/* login */
.login-wrap{ max-width:460px; margin:48px auto; }
.login-wrap .tag{ margin-bottom:18px; }
.login-wrap h1{ font-size:28px; margin-bottom:10px; }
.login-wrap p.lead{ color: rgba(20,34,46,0.68); margin-bottom:18px; }

/* timeline and log */
.tl{ border-left:2px solid var(--line-dark); margin-left:6px; }
.tl li{ position:relative; padding:0 0 12px 18px; }
.tl li::before{ content:""; position:absolute; left:-7px; top:6px; width:12px; height:12px; border-radius:50%; background: var(--gold); border:2px solid var(--paper); }
.tl .d{ font-family: var(--font-mono); font-size:11.5px; letter-spacing:.04em; color: rgba(20,34,46,0.6); }
.contacts{ display:flex; flex-wrap:wrap; gap:1px; background: var(--line-dark); border:1px solid var(--line-dark); }
.contacts .c{ background: var(--white); flex:1 1 240px; padding:16px 18px; }
.contacts .c b{ display:block; font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color: var(--brass); margin-bottom:8px; }
.contacts .p{ margin:6px 0; font-size:14px; }
.contacts .p .r{ display:block; font-size:12.5px; color: rgba(20,34,46,0.6); }
.contacts .p .e{ font-family: var(--font-mono); font-size:12.5px; user-select:all; }

.site-footer{ background: var(--ink); color: rgba(247,246,242,0.75); margin-top:40px; }
.footer-grid{ display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; padding:26px 28px; font-size:13px; }
.footer-note{ max-width:520px; }
.admin-table td form{ display:inline; }
.checks{ display:flex; gap:12px; flex-wrap:wrap; font-size:13px; }
.checks label{ display:inline-flex; align-items:center; gap:6px; margin:0; text-transform:none; letter-spacing:0; font: 500 13px var(--font-body); color: var(--ink-text); }
.vis-form{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.project-grid{ display:flex; flex-wrap:wrap; gap:1px; background: var(--line-dark); border:1px solid var(--line-dark); justify-content:flex-start; }
.project-grid > .svc-card{ flex: 0 1 calc(33.333% - 1px); max-width: calc(33.333% - 1px); min-width:280px; }
@media (max-width: 860px){ .project-grid > .svc-card{ flex: 1 1 100%; max-width:100%; } }

/* IADC member logo sits in the header, before the nav links */
.header-iadc{ margin-right:14px; }
.header-iadc img{ height:30px; }
@media (max-width:1100px){ .site-header .header-iadc{ display:inline-flex; } }
@media (max-width:900px){ .site-header .header-iadc{ display:none; } }

/* ---- workflow (build 2026-10-01) ---- */
.flash.soft{ background: var(--paper); color: var(--ink-text); border-left:4px solid var(--gold); font-weight:600; }
.two-col{ display:flex; flex-wrap:wrap; gap:1px; background: var(--line-dark); border:1px solid var(--line-dark); }
.panel{ background: var(--white); flex:1 1 320px; padding:16px 18px; min-width:0; }
.panel h3{ font-size:15px; margin-bottom:10px; }
.act{ display:block; padding:8px 10px; margin:0 -10px; border-bottom:1px solid var(--line-dark); color: var(--ink-text); text-decoration:none; font-size:14px; }
.act:hover{ background: var(--paper); }
.act .o, .steps .o{ font-family: var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color: var(--brass); margin-left:6px; }
.dim{ color: rgba(20,34,46,0.62); font-size:13px; }
.warn-t{ color:#B4691F; display:block; margin-bottom:6px; }
.rec{ background: var(--white); border:1px solid var(--line-dark); margin-bottom:18px; scroll-margin-top:90px; }
.rec > header{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; padding:14px 18px; border-bottom:1px solid var(--line-dark); background: var(--paper); }
.rec > header h3{ font-size:20px; font-weight:700; margin-right:auto; }
.rec .facts{ display:grid; grid-template-columns:auto 1fr; gap:4px 14px; padding:12px 18px 0; margin:0; font-size:14px; }
.rec .facts dt{ font-family: var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color: rgba(20,34,46,0.55); line-height:20px; }
.rec .facts dd{ margin:0; min-width:0; overflow-wrap:anywhere; }
.rec-body{ display:flex; flex-wrap:wrap; gap:18px; padding:14px 18px; }
.rec-body > .steps{ flex:1 1 380px; }
.rec-side{ flex:1 1 320px; min-width:0; display:flex; flex-direction:column; gap:12px; }
.steps{ list-style:none; margin:0; padding:0; counter-reset:none; }
.steps li{ display:flex; gap:10px; padding:6px 0; border-bottom:1px dashed var(--line-dark); font-size:13.5px; }
.steps li:last-child{ border-bottom:0; }
.steps .n{ flex:0 0 24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-family: var(--font-mono); font-size:11px; font-weight:800; background:#E4E9EE; color:#5B6675; }
.steps .st-done .n{ background:#2E7D5B; color:#fff; }
.steps .st-open .n{ background: var(--gold); color: var(--ink); }
.steps .st-pending{ opacity:.55; }
.steps .t{ flex:1; min-width:0; }
.steps .w{ display:block; font-size:12px; color: rgba(20,34,46,0.62); }
.steps .w.now{ color:#B4691F; font-weight:700; }
.rec-docs{ border:0; border-top:1px solid var(--line-dark); }
.doc-actions{ display:flex; gap:6px; flex-wrap:wrap; align-items:flex-start; justify-content:flex-end; }
.doc-actions form{ display:inline; }
.doc-dim{ opacity:.6; }
.reject-reason{ color:#B0413E !important; }
details.reject{ position:relative; }
details.reject summary{ list-style:none; cursor:pointer; }
details.reject form{ position:absolute; right:0; z-index:5; width:320px; background: var(--white); border:1px solid var(--line-dark); padding:10px; box-shadow:0 6px 20px rgba(0,0,0,.12); display:flex; flex-direction:column; gap:8px; }
details.reject textarea, .say textarea, .draft textarea, .form textarea{ width:100%; font: 500 14px/20px var(--font-body); padding:8px 10px; border:1px solid var(--line-dark); background: var(--paper); color: var(--ink-text); }
.btn--danger{ background:#B0413E; color:#fff; border:0; }
.btn--danger:hover{ background:#8E2F2C; }
.btn--plain{ background:transparent; color: var(--ink); border:1px solid var(--line-dark); }
.act-form{ display:flex; flex-direction:column; gap:6px; align-items:flex-start; }
.act-form summary{ cursor:pointer; list-style:none; }
.form.wide{ max-width:none; }
.form.act-form{ max-width:none; width:100%; padding:14px 16px; }
.mini-upload{ display:flex; flex-direction:column; gap:6px; background: var(--paper); border:1px solid var(--line-dark); padding:12px 14px; }
.mini-upload select, .mini-upload input[type=text]{ font: 500 14px var(--font-body); padding:7px 9px; border:1px solid var(--line-dark); background: var(--white); }
.inline-form{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.inline-form select{ font: 500 13px var(--font-body); padding:5px 7px; }
.checklist{ display:flex; flex-wrap:wrap; gap:6px; padding:10px 18px 0; }
.ck{ font-family: var(--font-mono); font-size:11px; padding:3px 8px; letter-spacing:.02em; }
.ck.ok{ background:#E1F0E7; color:#2E7D5B; } .ck.no{ background:#F6DEDD; color:#B0413E; }
.newbox{ margin-bottom:18px; } .newbox summary{ list-style:none; cursor:pointer; display:inline-block; margin-bottom:10px; }
.threads{ display:flex; flex-wrap:wrap; gap:18px; }
.thread{ flex:1 1 380px; background: var(--white); border:1px solid var(--line-dark); padding:14px 16px; min-width:0; }
.thread h3{ font-size:15px; margin-bottom:10px; }
.msgs{ max-height:420px; overflow-y:auto; display:flex; flex-direction:column; gap:8px; margin-bottom:12px; }
.msg{ background: var(--paper); padding:8px 12px; border-left:3px solid var(--line-dark); max-width:92%; }
.msg.mine{ align-self:flex-end; border-left-color: var(--gold); background:#FBF6EA; }
.msg .h{ font-family: var(--font-mono); font-size:10.5px; letter-spacing:.04em; color: rgba(20,34,46,0.6); margin-bottom:3px; }
.msg .b{ white-space:pre-wrap; font-size:14px; }
.say, .draft{ display:flex; flex-direction:column; gap:6px; align-items:flex-start; }
.draft{ background:#FBF6EA; border:1px dashed var(--gold); padding:10px; margin-bottom:6px; }
.claude-checks{ display:flex; flex-direction:column; gap:6px; }
.cc{ font-size:13px; padding:8px 10px; border-left:4px solid #5B6675; background:#EEF1F4; }
.cc.ok{ border-left-color:#2E7D5B; background:#E1F0E7; } .cc.warn{ border-left-color:#B4691F; background:#F7E7D2; } .cc.problem{ border-left-color:#B0413E; background:#F6DEDD; }
.cc b, .cc .tgt{ font-family: var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; margin-right:6px; }
.viewer{ display:flex; flex-direction:column; gap:14px; align-items:center; }
.viewer img{ max-width:100%; border:1px solid var(--line-dark); box-shadow:0 2px 10px rgba(0,0,0,.08); }
.mailbody{ white-space:pre-wrap; font-size:12px; background: var(--paper); padding:8px; }
.admin-vis{ padding:4px 14px 10px; border-bottom:1px solid var(--line-dark); background: var(--white); }
summary.section-title{ cursor:pointer; list-style:none; }
@media (max-width:640px){ .doc-actions{ justify-content:flex-start; } details.reject form{ position:static; width:100%; } }

/* ---- layout round 2 (build 2026-10-01b) ---- */
.nav-account{ display:inline-flex !important; flex-direction:column; line-height:1.15; }
.nav-who{ font-family: var(--font-mono); font-size:10px; letter-spacing:.04em; color: var(--gold); font-weight:600; }
.projectbar{ position:sticky; top:97px; z-index:40; background: var(--steel); border-bottom:1px solid var(--line); }
.projectbar .wrap{ display:flex; gap:4px 18px; align-items:center; padding:8px 28px; overflow-x:auto; white-space:nowrap; }
.projectbar a{ color: rgba(247,246,242,0.85); font-family: var(--font-mono); font-size:12px; letter-spacing:.04em; text-transform:uppercase; font-weight:700; padding:4px 0; }
.projectbar a:hover{ color: var(--gold); }
.projectbar .pb-name{ color: var(--gold); margin-right:10px; text-transform:none; font-family: var(--font-body); font-size:14px; }
.crumbs{ font-family: var(--font-mono); font-size:12px; letter-spacing:.03em; padding:14px 0 0; color: rgba(20,34,46,0.6); }
.crumbs a{ color: var(--brass); font-weight:700; } .crumbs .sep{ margin:0 8px; }
.band-chips{ display:flex; gap:8px; flex-wrap:wrap; }
.viewing.done{ background:#2E7D5B; color:#fff; }
table.pt.waiting tr.mine td{ background:#FBF6EA; font-weight:700; }
table.pt.waiting td a{ color: var(--ink-text); }
table.pt.waiting td a:hover{ color: var(--brass); }
.card-cols{ display:flex; flex-wrap:wrap; gap:1px; background: var(--line-dark); border-top:1px solid var(--line-dark); }
.card-cols > .col{ flex:1 1 420px; min-width:0; background: var(--white); padding:14px 18px; display:flex; flex-direction:column; gap:12px; }
.card-cols h4{ font-family: var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color: var(--brass); font-weight:800; }
.steps li{ border-bottom:0; padding:5px 8px; margin-bottom:3px; border-left:4px solid; }
.steps li.st-done{ background:#E1F0E7; border-left-color:#2E7D5B; }
.steps li.st-todo{ background:#FBF3DA; border-left-color: var(--gold); }
.steps li.st-todo .n{ background: var(--gold); color: var(--ink); }
.steps li.st-done .n{ background:#2E7D5B; color:#fff; }
.steps li.now{ box-shadow: inset 0 0 0 1px var(--gold); }
.steps li.now .lbl{ font-weight:800; }
.steps .st-pending{ opacity:1; }
.pkg{ border:1px solid var(--line-dark); padding:12px 14px; background: var(--paper); display:flex; flex-direction:column; gap:10px; scroll-margin-top:110px; }
.pkg + .pkg{ margin-top:10px; }
.pkg-head{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.pkg .facts{ padding:0; }
.pkg .checklist{ padding:0; }
.docs.in-card{ border:1px solid var(--line-dark); }
details.rec.done{ background: var(--white); border:1px solid var(--line-dark); }
details.rec.done > summary{ list-style:none; cursor:pointer; padding:12px 18px; display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; }
details.rec.done > summary .tick{ color:#2E7D5B; font-weight:800; font-size:18px; }
details.rec.done[open] > summary{ border-bottom:1px solid var(--line-dark); background:#E1F0E7; }
.rec{ scroll-margin-top:110px; }
.card-notices{ padding:10px 18px 0; display:flex; flex-direction:column; gap:4px; }
.cn{ font-size:13px; padding:5px 10px; background:#EEF1F4; border-left:4px solid #5B6675; color: var(--ink-text); }
.cn.due{ background:#FBF3DA; border-left-color: var(--gold); }
.doc-row{ align-items:flex-start; }
.doc-main{ flex:1; min-width:0; }
.doc-title{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.doc-title .kind{ font-family: var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color: rgba(20,34,46,0.6); }
.doc-title .name{ font-weight:700; overflow-wrap:anywhere; }
.doc-meta{ font-size:12.5px; color: rgba(20,34,46,0.66); margin-top:3px; line-height:1.5; }
.doc-meta .od{ font-family: var(--font-mono); font-size:11px; overflow-wrap:anywhere; }
.linkbtn{ background:none; border:0; color: var(--brass); font-weight:700; cursor:pointer; font-size:12px; padding:0; text-decoration:underline; }
details.pop{ position:relative; }
details.pop summary{ list-style:none; cursor:pointer; }
details.pop form{ position:absolute; right:0; z-index:30; width:340px; background: var(--white); border:1px solid var(--line-dark); padding:12px; box-shadow:0 6px 20px rgba(0,0,0,.14); display:flex; flex-direction:column; gap:8px; }
details.pop form b{ font-family: var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color: var(--brass); }
details.pop textarea{ width:100%; font: 500 14px/20px var(--font-body); padding:8px 10px; border:1px solid var(--line-dark); background: var(--paper); }
.docsec{ margin-bottom:16px; }
.docsec .doc-folder-head{ border:1px solid var(--line-dark); border-bottom:0; }
.docsec .count{ background: var(--brass); color:#fff; padding:1px 7px; margin-left:6px; font-size:10px; }
.docsec .empty{ border:1px solid var(--line-dark); background: var(--white); padding:8px 14px; margin:0; }
.notices{ display:flex; flex-direction:column; gap:12px; }
.notice{ background: var(--white); border:1px solid var(--line-dark); border-left:5px solid #2E7D5B; padding:14px 18px; scroll-margin-top:110px; }
.notice.due{ border-left-color: var(--gold); } .notice.draft{ border-left-color:#5B6675; background: var(--paper); }
.notice .nh{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; } .notice .nh b{ font-family: var(--font-mono); }
.notice .ns{ font-weight:800; font-size:16px; margin:6px 0 2px; }
.notice .nm{ font-size:12.5px; color: rgba(20,34,46,0.66); }
.notice .nm.ack{ color:#2E7D5B; font-weight:700; margin-top:4px; }
.notice .nt{ white-space:pre-wrap; margin:8px 0; font-size:14px; }
.notice .na{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.notice .na form{ display:inline-flex; gap:6px; }
.ackf input{ font: 500 13px var(--font-body); padding:6px 8px; border:1px solid var(--line-dark); min-width:220px; }
.pcards{ display:grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap:18px; }
.pcard{ display:flex; flex-direction:column; gap:8px; background: var(--white); border:3px solid var(--ink); border-top:8px solid var(--gold); padding:22px 24px; color: var(--ink-text); transition: transform .12s ease, box-shadow .12s ease; }
.pcard:hover{ transform: translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.12); }
.pcard h3{ font-size:21px; font-weight:800; } .pcard .idx{ font-family: var(--font-mono); font-size:12px; color: var(--brass); font-weight:800; letter-spacing:.05em; }
.pcard p{ color: rgba(20,34,46,0.72); margin:0; } .pcard .chip{ align-self:flex-start; }
.pcards.small .pcard{ border-width:2px; border-top-width:5px; border-top-color:#2E7D5B; padding:14px 18px; }
.pcards.small .pcard h3{ font-size:16px; }
@media (max-width:900px){ .projectbar .wrap{ padding:8px 16px; } details.pop form{ position:static; width:100%; } .card-cols > .col{ flex-basis:100%; } }
@media (max-width:1180px){ .projectbar{ top:81px; } }
.rec, .pkg, .notice{ scroll-margin-top:150px; }

/* ---- simple layout (build 2026-10-02) ---- */
h2.big{ font-size: clamp(26px, 2.6vw, 34px); font-weight:800; margin-bottom:16px; }
table.plain{ width:100%; border-collapse:collapse; background: var(--white); border:2px solid var(--ink); }
table.plain th{ text-align:left; background: var(--ink); color: var(--white); font-size:15px; padding:10px 14px; }
table.plain td{ padding:12px 14px; border-top:1px solid var(--line-dark); font-size:16px; font-weight:600; vertical-align:top; }
table.plain.waiting td.who{ width:130px; font-weight:800; }
table.plain.waiting td.since{ width:130px; white-space:nowrap; color: rgba(20,34,46,0.7); }
table.plain.waiting tr.mine td{ background:#FBF3DA; }
table.plain.waiting td a{ color: var(--ink-text); }
table.plain.waiting td a:hover{ color: var(--brass); text-decoration:underline; }
.claude-line{ margin-top:12px; display:flex; flex-direction:column; gap:4px; }
.claude-line .cc{ font-size:14px; }
.rec{ border:2px solid var(--ink); }
.wo-title{ font-size:28px; font-weight:800; padding:16px 18px 6px; }
.facts2{ display:flex; flex-wrap:wrap; gap:10px; padding:6px 18px 16px; }
.facts2 .f{ flex:1 1 180px; border:2px solid var(--ink); background: var(--white); padding:8px 12px; font-size:16px; font-weight:700; }
.facts2 .f.wide{ flex-basis:100%; }
.facts2 .f span{ display:block; font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color: var(--brass); font-weight:800; margin-bottom:2px; }
.card-cols h4, .sendbox h4{ font-size:18px; font-weight:800; letter-spacing:0; text-transform:none; color: var(--ink-text); font-family: var(--font-body); }
ul.steps2{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
ul.steps2 li{ display:flex; gap:10px; align-items:center; font-size:16px; font-weight:800; padding:6px 10px; }
ul.steps2 li .mk{ font-size:18px; width:22px; text-align:center; }
ul.steps2 li.ok{ background:#E1F0E7; } ul.steps2 li.ok .mk{ color:#2E7D5B; }
ul.steps2 li.no{ background:#F6DEDD; } ul.steps2 li.no .mk{ color:#B0413E; }
.pkg{ background: var(--white); border:1px solid var(--line-dark); padding:12px; }
.pkg-head{ font-size:15px; font-weight:800; }
details.docbox > summary{ cursor:pointer; font-weight:700; color: var(--brass); padding:6px 0; }
.sendbox{ border-top:2px solid var(--ink); padding:16px 18px; background: var(--paper); display:flex; flex-direction:column; gap:12px; align-items:flex-start; }
table.plain.send td.lbl{ width:42%; }
table.plain.send td.st{ width:22%; font-size:14px; }
table.plain.send .ok{ color:#2E7D5B; font-weight:800; }
table.plain.send input[type=text]{ margin-top:6px; font: 600 14px var(--font-body); padding:6px 8px; border:1px solid var(--line-dark); width:100%; max-width:260px; display:block; }
table.plain.send .also{ display:block; margin-top:6px; font-size:13px; font-weight:600; }
table.plain.send .also label{ margin-left:8px; }
.card-msgs{ padding:10px 18px 14px; border-top:1px solid var(--line-dark); display:flex; flex-direction:column; gap:4px; }
.card-msgs a{ font-size:14px; color: var(--ink-text); }
.board{ display:flex; flex-direction:column; gap:10px; margin-bottom:16px; max-height:640px; overflow-y:auto; }
.board .msg{ max-width:88%; background: var(--white); border:1px solid var(--line-dark); border-left:4px solid var(--line-dark); padding:10px 14px; scroll-margin-top:150px; }
.board .msg.mine{ align-self:flex-end; border-left-color: var(--gold); background:#FBF6EA; }
.board .msg.imp{ border-left-color:#B0413E; }
.board .msg .h{ font-size:13px; color: rgba(20,34,46,0.7); margin-bottom:4px; }
.board .msg .b{ white-space:pre-wrap; font-size:16px; }
.board .msg .f{ margin-top:6px; font-weight:700; }
.board .msg .seen{ margin-top:8px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; font-size:13px; color:#2E7D5B; font-weight:700; }
.impt{ color:#B0413E; font-weight:800; }
label.tick{ display:inline-flex; gap:8px; align-items:center; text-transform:none; letter-spacing:0; font: 600 14px var(--font-body); color: var(--ink-text); margin:0; }
.howto .howsec{ background: var(--white); border:2px solid var(--ink); padding:18px 22px; margin-bottom:16px; }
.howto h2{ font-size:22px; font-weight:800; margin-bottom:10px; }
.howto li{ font-size:16px; line-height:1.55; margin:6px 0 6px 22px; }
.howto ol{ list-style:decimal; } .howto ul{ list-style:disc; }
.btn--plain.light{ color: var(--white); border-color: rgba(247,246,242,0.5); }
@media (max-width:700px){ table.plain.waiting td.since{ display:none; } table.plain.send td{ display:block; width:auto !important; } }

.cstat{ display:flex; flex-direction:column; gap:6px; margin-top:6px; }
.cstat > div{ display:flex; justify-content:space-between; gap:10px; padding:8px 12px; font-size:15px; font-weight:700; border-left:5px solid; }
.cstat .warn{ background:#FBF3DA; border-left-color: var(--gold); }
.cstat .good{ background:#E1F0E7; border-left-color:#2E7D5B; }
.cstat span{ font-weight:600; }

.fix{ background:#FBF3DA; border-left:5px solid var(--gold); padding:8px 12px; font-size:15px; font-weight:600; white-space:pre-line; }
.fix.small{ margin-top:6px; font-size:14px; }
.fixform{ flex-direction:column; align-items:flex-start; margin-top:6px; }
.fixform textarea{ width:100%; min-width:280px; font: 500 14px var(--font-body); padding:8px; border:1px solid var(--line-dark); }

/* ---- one field style on every page (build 2026-10-03) ----
   Every field: the same thin navy border, square corners, white inside.
   Sizes follow importance: page title > section title > card band > column title > field value > field label. */
:root{ --fb: 1.5px solid #14293C; --navy: #0A2A52; --ok-bg:#E1F0E7; --ok:#2E7D5B; --todo-bg:#FBF3DA; --todo:#B4691F; }

/* 1 page title, 2 section title, 4 column title, 6 label */
.page-band h1{ font-size: clamp(28px, 3.2vw, 42px); font-weight:800; }
h2.big{ font-size: clamp(26px, 2.6vw, 32px); font-weight:800; }
.section-title .eyebrow{ font-family: var(--font-body); font-size:21px; letter-spacing:0; text-transform:none; color: var(--ink-text); font-weight:800; }
.section-title h2{ font-size:15px; font-weight:600; color: rgba(20,34,46,0.7); }
.card-cols h4, .sendbox h4{ font-size:18px; font-weight:800; }

/* 3 the work order band */
.wo-band{ background: var(--navy); padding:14px 18px; display:flex; gap:10px 16px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.wo-band h3{ color: var(--gold); font-size:22px; font-weight:800; line-height:1.25; margin:0; }
.wo-band .band-note{ background: var(--gold); color: var(--ink); font-size:12px; font-weight:800; padding:4px 10px; }
.wo-band .band-tick{ color:#9FDDBB; font-weight:800; font-size:14px; }
.rec{ border:2px solid var(--navy); }
details.rec.done > summary.wo-band{ padding:14px 18px; list-style:none; cursor:pointer; }
details.rec.done > summary.wo-band::-webkit-details-marker{ display:none; }
details.rec.done[open] > summary.wo-band{ background: var(--navy); border-bottom:0; }
.facts2{ padding:14px 18px 16px; }

/* fields */
.facts2 .f, .pkg, .headline, .form, .fix, .sigfile, .signers .signer, .contacts .p, .board .msg, .doc-row, .howto .howsec, .cstat > div, .docsec .empty{ border: var(--fb); }
.facts2 .f{ background: var(--white); font-size:16px; font-weight:600; }
.facts2 .f span, .form label, .sigfile .lbl{ font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color: rgba(20,34,46,0.62); font-weight:700; }
.form input[type=text], .form input[type=email], .form input[type=password], .form select, .form textarea,
details.pop textarea, .fixform textarea, table.plain.send input[type=text], .upload-box input[type=text]{ border: var(--fb); background:#fff; color: var(--ink-text); }
.fix{ border-left:6px solid var(--gold); }
.headline{ border-left:6px solid var(--gold); }

/* steps: the mark in its own box, the words beside it */
.steps3{ display:flex; flex-direction:column; gap:6px; }
.steps3 .srow{ display:flex; align-items:stretch; }
.steps3 .mk{ flex:0 0 44px; display:flex; align-items:center; justify-content:center; font-size:19px; font-weight:800; border: var(--fb); }
.steps3 .tx{ flex:1; min-width:0; border: var(--fb); border-left:0; padding:8px 12px; font-size:15.5px; font-weight:700; background:#fff; }
.steps3 .ok .mk{ background: var(--ok-bg); color: var(--ok); }
.steps3 .no .mk{ background: var(--todo-bg); color: var(--todo); }

/* tables: every cell a bordered field */
table.plain, table.pt{ border-collapse:collapse; border: var(--fb); }
table.plain th, table.pt th{ background: var(--navy); color: var(--white); border: var(--fb); font-family: var(--font-mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; }
table.plain td, table.pt td{ border: var(--fb); background:#fff; }
.tablewrap{ border:0; background:none; }

/* documents, contacts, messages, cards */
.docs{ border:0; background:none; display:flex; flex-direction:column; gap:6px; }
.doc-row{ background:#fff; border-bottom: var(--fb); }
.doc-row:last-child{ border-bottom: var(--fb); }
.docsec .doc-folder-head{ background: var(--navy); color: var(--gold); border: var(--fb); font-size:12px; margin-bottom:6px; }
.contacts{ background:none; border:0; gap:14px; }
.contacts .c{ background:none; padding:0; }
.contacts .c b{ font-family: var(--font-body); font-size:18px; letter-spacing:0; text-transform:none; color: var(--ink-text); font-weight:800; }
.contacts .p{ background:#fff; padding:8px 12px; margin:6px 0; }
.board .msg{ border-left-width:6px; }
.pkg{ background: var(--paper); }
.pkg-head{ font-size:16px; }
.cstat > div{ border-left-width:6px; }
.pcard{ border:3px solid var(--navy); border-top:8px solid var(--gold); }
.howto .howsec{ padding:0; background:#fff; }
.howto .howsec h2{ background: var(--navy); color: var(--gold); font-size:20px; padding:12px 18px; margin:0; }
.howto .howsec ol, .howto .howsec ul{ padding:12px 22px 14px; margin:0; }

/* signatures and stamp on file */
.sigfile{ display:flex; gap:14px; align-items:center; background:#fff; padding:10px 12px; margin-bottom:12px; }
.sigthumb{ display:block; max-height:56px; max-width:180px; background:#fff; border: var(--fb); padding:4px 6px; }
.sigthumb.stamp{ max-height:84px; }
.none{ font-size:13px; color:#B4691F; font-weight:700; }
.signers{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
.signers .signer{ background:#fff; padding:10px 12px; display:flex; flex-direction:column; gap:6px; min-width:200px; }
.admin-table td .dim{ display:block; margin-top:4px; }

/* sign as, sign out box */
.signas{ display:inline-flex; gap:8px; align-items:center; font-size:13px; font-weight:700; }
.signas select{ font: 600 13px var(--font-body); padding:6px 8px; border: var(--fb); background:#fff; }
dialog.confirm{ border: var(--fb); border-top:6px solid var(--gold); padding:22px 24px; max-width:380px; }
dialog.confirm::backdrop{ background: rgba(11,22,32,.55); }
dialog.confirm p{ font-size:18px; font-weight:800; margin:0 0 16px; color: var(--ink-text); }
dialog.confirm .actions{ display:flex; gap:10px; }
.login-wrap .actions .linkbtn{ font-size:14px; }

/* ---- project financials (build 2026-10-04) ---- */
.fin-tiles{ display:flex; gap:10px; flex-wrap:wrap; margin:10px 0 16px; }
.fin-tiles .ft{ flex:1 1 220px; border: var(--fb); background:#fff; padding:10px 14px; font-size:19px; font-weight:800; }
.fin-tiles .ft span{ display:block; font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color: rgba(20,34,46,0.62); font-weight:700; margin-bottom:4px; }
.fin-tiles .ft.good{ border-left:6px solid var(--ok); } .fin-tiles .ft.warn{ border-left:6px solid var(--gold); background: var(--todo-bg); }
table.plain.fin td{ font-size:14.5px; white-space:nowrap; }
table.plain.fin td.lbl{ white-space:normal; min-width:220px; }
table.plain.fin tr.strong td{ font-weight:800; }
table.plain.fin td.tot{ background:#F4F1E8; font-weight:800; }
.okt{ color: var(--ok); font-size:12.5px; } .warnt{ color: var(--todo); font-size:12.5px; }
h3.sub{ font-size:21px; font-weight:800; margin:20px 0 8px; }
.fin-tax{ padding:0; } .fin-tax small{ font-size:12.5px; font-weight:600; color: rgba(20,34,46,0.7); }
.finedit{ margin-top:14px; } .finedit .form{ margin-top:10px; }

/* ---- OPS-OES in the middle; review before release; View as greyed out (build 2026-10-04) ---- */
fieldset.viewas-fs{ border:0; padding:0; margin:0; min-width:0; }
fieldset.viewas-fs input, fieldset.viewas-fs select, fieldset.viewas-fs textarea, fieldset.viewas-fs button{ opacity:.45; cursor:not-allowed; }
.board .msg .held{ color: var(--todo); font-weight:800; }
.board .msg form.share{ margin-top:6px; }
.ok-line{ color: var(--ok); font-weight:700; }
.sendnote{ font: 600 14px var(--font-body); padding:6px 8px; border: var(--fb); width:100%; max-width:420px; }
label.tick.light{ color: var(--white); }
details.pop form .signas{ font-size:12px; }
.facts2 .f.wo-status{ border-left-width:6px; }
.facts2 .f.wo-status.warn{ border-left-color: var(--gold); background: var(--todo-bg); }
.facts2 .f.wo-status.good{ border-left-color: var(--ok); background: var(--ok-bg); }
.facts2 .f.wo-status .si{ font-size:15.5px; margin-top:3px; }
table.plain.waiting td.wo{ width:120px; white-space:nowrap; font-weight:800; }
@media (max-width:700px){ table.plain.waiting td.wo{ white-space:normal; width:auto; } }
/* work order badge in the heading: Not commenced yellow, Completed green, Ongoing red (Mike, 1 Oct 2026) */
.wo-band .band-right{ display:flex; gap:10px; align-items:center; margin-left:auto; }
.wo-band .phase{ font-size:14px; font-weight:800; padding:6px 14px; border:2px solid #fff; white-space:nowrap; }
.wo-band .phase.not-commenced{ background: var(--gold); color: var(--ink); }
.wo-band .phase.completed{ background: var(--ok); color:#fff; }
.wo-band .phase.ongoing{ background:#B0413E; color:#fff; }
details.rec.done > summary.wo-band .phase{ margin-left:auto; }
/* work orders at a glance, above What is waiting */
.glance{ display:grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap:10px; }
.glance .g{ display:flex; flex-direction:column; gap:4px; border: var(--fb); background:#fff; padding:10px 12px; color: var(--ink-text); border-left:8px solid; }
.glance .g b{ font-size:18px; font-weight:800; }
.glance .g .t{ font-size:13.5px; font-weight:600; color: rgba(20,34,46,0.75); }
.glance .g .ph{ align-self:flex-start; font-size:12.5px; font-weight:800; padding:3px 10px; margin-top:4px; }
.glance .g.not-commenced{ border-left-color: var(--gold); } .glance .g.not-commenced .ph{ background: var(--gold); color: var(--ink); }
.glance .g.ongoing{ border-left-color:#B0413E; } .glance .g.ongoing .ph{ background:#B0413E; color:#fff; }
.glance .g.completed{ border-left-color: var(--ok); } .glance .g.completed .ph{ background: var(--ok); color:#fff; }
.glance .g:hover{ box-shadow:0 4px 14px rgba(0,0,0,.12); }
.glance-sec + .section{ border-top:0; }
.glance{ grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.glance .g{ flex-direction:row; align-items:center; justify-content:space-between; gap:8px; }
.glance .g .ph{ margin-top:0; }
/* table headings: same gold bold lettering as the work order band */
table.plain th, table.pt th{ color: var(--gold); font-family: var(--font-body); font-size:17px; font-weight:800; letter-spacing:0; text-transform:none; }
.glance{ grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.glance .g b, .glance .g .ph{ white-space:nowrap; align-self:center; }
/* project bar links as bordered fields (Mike, 1 Oct 2026) */
.projectbar .wrap{ gap:6px 8px; padding:8px 28px; }
.projectbar a:not(.pb-name){ background:#23466B; border:1.5px solid var(--gold); color: var(--white); padding:5px 12px; }
.projectbar a:not(.pb-name):hover{ background: var(--gold); color: var(--ink); }
/* jump links land with the work order heading in view, below the sticky header and project bar */
[id], .rec, .pkg{ scroll-margin-top:175px; }
@media (max-width:1180px){ [id], .rec, .pkg{ scroll-margin-top:165px; } }
/* a step you must do links to where you do it */
.steps3 a.tx.go{ color: var(--ink-text); text-decoration:none; background: var(--todo-bg); }
.steps3 a.tx.go:hover{ background: var(--gold); }
.steps3 a.tx.go .arrow{ display:block; font-size:12.5px; color: var(--todo); font-weight:800; margin-top:2px; }
.steps3 a.tx.go:hover .arrow{ color: var(--ink); }
tr:target td, form:target, details:target{ outline:3px solid var(--gold); outline-offset:2px; background: var(--todo-bg); }
