.product-locked .proto-header,.product-locked #view-certs,.product-locked .proto-notice{display:none}.product-login{max-width:450px;margin:8vh auto;padding:28px;background:var(--so-panel);border:1px solid var(--so-line);border-radius:18px}.product-login h1{font-size:32px;line-height:1.15}.product-login label{display:block;margin:18px 0;font-weight:600}.product-login input{display:block;width:100%;box-sizing:border-box;margin-top:8px;height:46px;border:1px solid var(--so-line);border-radius:8px;padding:10px}body:not(.bw-world):not(.so-shell) .product-record-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 20px;background:var(--so-accent);border-bottom:1px solid #bca04e;font-size:13px}.product-record-bar .btn{min-height:40px}#save-state{cursor:pointer}#save-state[data-state=conflict],#save-state[data-state=pending]{color:var(--so-accent)}#save-state[data-state=offline]{color:#f6ca92}#product-auth-error{color:#df5f57}/* R8: the record bar and save chip are recomposed by board-workspace.css inside
   the certificate workspace; `body:not(.bw-world):not(.so-shell)` keeps this exactly as it was
   for every other surface. Their warm #ffd500 fill is the "warm-cream control
   amid cool grey panels" the direction rules out, so the workspace owns them. */
@media(max-width:650px){.product-login{margin:30px 12px;padding:22px}body:not(.bw-world):not(.so-shell) .product-record-bar{padding:10px;gap:8px}body:not(.bw-world):not(.so-shell) .product-record-bar .btn{min-height:44px}body:not(.bw-world):not(.so-shell) #save-state{max-width:130px;white-space:normal!important;font-size:11px}}

/* Hide prototype creation controls until authenticated workspace bootstrap settles. */
#product-startup{display:none}
.product-startup{max-width:620px;margin:12vh auto;padding:24px}
.product-starting #product-startup{display:block}
.product-starting .proto-header,.product-starting #view-certs,.product-starting .proto-notice,.product-starting #proto-dialog{display:none}
.job-loading-status{display:flex;align-items:center;gap:14px}
.job-loading-spinner{display:inline-block;width:28px;height:28px;flex:0 0 28px;border:3px solid var(--so-line);border-top-color:var(--so-accent);border-radius:50%;animation:job-loading-spin 900ms linear infinite}
@keyframes job-loading-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.job-loading-spinner{animation:none}}
.certificate-address{grid-column:1/-1;min-width:0;margin:14px 0 0;padding:0;border:0}
.certificate-address legend{padding:0;margin-bottom:12px;font-weight:700;color:var(--so-text);font-size:16px}
.certificate-address-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}
.certificate-address-grid label{display:flex;flex-direction:column;gap:6px;min-width:0;margin:0;color:var(--so-text);font-size:14px;font-weight:650}
.certificate-address-grid input,.certificate-address-grid textarea{width:100%;min-width:0;min-height:48px;box-sizing:border-box;padding:10px 12px;border:1px solid var(--so-line);border-radius:8px;background:var(--so-panel);color:var(--so-text);font:inherit;font-size:16px;font-weight:400}
.certificate-address-grid textarea{resize:vertical}
.certificate-address-street,.certificate-address-houseName,.certificate-address-additional,.certificate-address-more{grid-column:1/-1}
.certificate-address-hint{margin:0 0 14px;font-size:14px;line-height:1.5;color:var(--so-text)}
.certificate-address-more summary{padding:8px 0;cursor:pointer;font-size:14px;color:var(--so-text)}
.certificate-address :focus-visible{outline:3px solid #4795eb;outline-offset:2px}
.certificate-address[disabled]{opacity:.7}
@media(max-width:480px){.certificate-address-grid{grid-template-columns:minmax(0,1fr)}}
.product-scan-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product-scan-fields input{width:100%;min-width:0;box-sizing:border-box}.product-scan-row{border-bottom:1px solid var(--so-line);padding-bottom:18px}

.product-actions-trigger{margin-left:auto;border-radius:7px!important;background:transparent!important;font-size:12px}.product-action-list{display:grid;gap:0;border-top:1px solid var(--so-line)}.product-action-list .proto-row{border-radius:0;border:0;border-bottom:1px solid var(--so-line);min-height:50px;padding:13px 3px;background:transparent;text-align:left;box-shadow:none}.product-action-list .proto-row:disabled{opacity:.5}body:not(.bw-world):not(.so-shell) .proto-phone .product-record-bar{padding:8px 14px}body:not(.bw-world):not(.so-shell) .proto-phone .product-record-bar .product-actions-trigger{min-height:40px}
/* Make the actionable sync/recovery message readable and touchable on a phone.
   R8: RETIRED INSIDE THE CERTIFICATE WORKSPACE (`body.bw-world`). This rule is
   why the brand bar was 108px tall — it grew the header to make room for a save
   message absolutely positioned at 58px inside it. In the workspace the same
   #save-state node is moved out of the header and into the chrome's context
   strip (board-workspace.js), beside the revision it describes, where it is a
   normal 44px-tall inline chip and needs no reserved space above. Everywhere
   else — the drafts list, settings, account pages — this behaviour is
   unchanged. */
@media(max-width:650px){body:not(.bw-world):not(.so-shell) .proto-phone .proto-header{height:108px!important}body:not(.bw-world):not(.so-shell) .proto-phone #save-state{top:58px;left:12px;right:12px;max-width:none;min-height:44px;display:flex!important;align-items:center;line-height:1.3;font-size:11px!important;white-space:normal!important;overflow-wrap:anywhere}}

/* Primary navigation and creation follow the settings control hierarchy. */
.proto-header>.btn,.proto-home-head>.btn{border-radius:7px!important;min-height:44px}.proto-home-head>.btn.btn-amber,.proto-switch button.active{background:var(--so-accent)!important;color:var(--so-accent-ink)!important;border-color:var(--so-line)!important}

/* Shared account forms, including standalone emailed action pages. */
[hidden]{display:none!important}
.product-login{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5}
.product-login input,.product-login select,.product-login button,.product-login>a{box-sizing:border-box;min-height:44px;font:inherit}
.product-login button,.product-login>a{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:7px}
.product-login button{border:1px solid var(--so-line-strong);background:var(--so-panel);color:#aee0c5;cursor:pointer}
.product-login button:disabled{opacity:.6;cursor:default}
.product-login :focus-visible,.btn:focus-visible{outline:3px solid #4795eb;outline-offset:3px}
#proto-dialog #account-lifecycle-view .btn.btn-danger{background:#e45a61;color:var(--so-text);border:2px solid #e45a61}
#proto-dialog #account-lifecycle-view .btn.btn-danger:hover{background:#ea7e84;border-color:#ea7e84}
#proto-dialog #account-lifecycle-view .btn.btn-danger:disabled{opacity:.5}

#product-auth #personal-account-view{border-radius:10px}
#product-auth #personal-account-view .btn{border-radius:7px;min-height:44px;white-space:normal;text-align:left}
#product-auth #personal-account-view>button,#product-auth #personal-workspaces .btn{display:block;width:100%;margin:8px 0}

.account-action-page{margin:0;background:#bcac4e;color:var(--so-text)}.account-action-page .product-login{border-radius:10px}.account-action-page #action-submit{background:var(--so-accent);color:var(--so-accent-ink);border-color:var(--so-line)}.account-action-page .product-login>a{color:var(--so-text);border:1px solid var(--so-line);text-decoration:none;background:var(--so-panel)}.account-action-page #action-result{margin-top:18px}#deletion-restart{margin-top:12px}

#billing-view .wf-section{margin:14px 0;padding:14px;border:1px solid var(--so-line);border-radius:9px}#billing-view .btn{min-height:44px;margin:6px 8px 6px 0;border-radius:7px}#billing-view a.btn{display:inline-flex;align-items:center;text-decoration:none}#billing-view .wf-check{display:flex;align-items:center;gap:10px;min-height:44px}#billing-view input[type=checkbox]{width:22px;height:22px;flex:0 0 22px}#billing-view{overflow-wrap:anywhere}

#wye-bridge-view .btn{min-height:44px;margin:6px 8px 6px 0}#wye-bridge-view input[type="text"],#wye-job-id{min-height:44px;width:100%;box-sizing:border-box}#wye-bridge-view .wf-check{min-height:44px}


/* ServiceM8 job chooser (job-launch.js) — same grouped-row language as the New certificate page. */
.jl-page{overflow-wrap:anywhere}
.jl-page .job-loading-status{margin:0 2px 16px;font-size:15px;line-height:1.4;color:var(--so-muted)}
.jl-page .job-loading-status.jl-quiet{font-size:13.5px}
.jl-page .job-loading-status.jl-error{color:var(--so-bad)}
.jl-facts{padding:6px 16px 10px}
.jl-fact{padding:10px 0;border-top:1px solid var(--so-line)}
.jl-fact:first-child{border-top:0}
.jl-fact small{display:block;font-size:13px;font-weight:600;color:var(--so-label);margin-bottom:3px}
.jl-fact span{display:block;font-size:17px;font-weight:600;line-height:1.3;color:var(--so-text)}
.jl-notes{margin:6px 0 4px;background:transparent;border:0;box-shadow:none;border-radius:0}
.jl-notes summary{font-size:14px;font-weight:600;color:var(--so-accent);padding:8px 0;cursor:pointer}
.jl-notes p{margin:4px 0 8px;font-size:14px;line-height:1.5;color:var(--so-muted);white-space:pre-wrap}
.jl-page .so-row.jl-primary strong{font-size:18px}
.jl-page .so-row .so-ico{color:var(--so-accent)}
.jl-more{margin:0 0 16px;background:transparent;border:0;box-shadow:none;border-radius:0}
.jl-more summary{font-size:14px;font-weight:600;color:var(--so-muted);padding:6px 2px 10px;cursor:pointer}
.jl-more .so-group{margin-top:4px}
.jl-page .wf-actions{margin-top:8px}
.jl-page .wf-actions .btn{min-height:48px}