input[type=email], input[type=url], input[inputmode=numeric], input[type=text], input[type=password] {
  display: block; width: 100%; padding: 12px 13px; margin: 8px 0 0;
  min-height: 46px; color: var(--color-text); background: var(--color-white);
  border: 1px solid var(--color-control-border); border-radius: 5px; font-size: 14px;
}
input::placeholder { color: var(--color-muted); opacity: 1; }
textarea { display: block; width: 100%; padding: 12px 13px; margin: 8px 0 0; min-height: 96px; resize: vertical; color: var(--color-text); background: var(--color-white); border: 1px solid var(--color-control-border); border-radius: 5px; font-size: 14px; }
textarea::placeholder { color: var(--color-muted); }
textarea:disabled { color: var(--color-muted-on-section); background: var(--color-section); }
.optional-label { color: var(--color-muted); font-weight: 400; }
.profile-save { margin-top: 24px; }
input:disabled { color: var(--color-muted-on-section); background: var(--color-section); border-color: var(--color-control-border); }
input:disabled::placeholder { color: var(--color-muted-on-section); }
input:read-only { background: var(--color-section); }
select { min-height: 40px; padding: 7px 12px; border: 1px solid var(--color-control-border); border-radius: 5px; color: var(--color-text); background: var(--color-white); font-size: 14px; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--color-blue); outline-offset: 3px; }
.expiry-row label { margin: 0; }
.file-list { list-style: none; padding: 0; margin: 15px 0; }
.file-list li { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--color-border); overflow-wrap: anywhere; font-size: 14px; }
.file-list small { display: block; margin-top: 4px; color: var(--color-muted); }
.file-list .file-name { min-width: 0; overflow-wrap: anywhere; }
.file-remove { flex: 0 0 auto; padding: 6px 12px; }
.cancel-upload { margin-top: 12px; }
.status-message { margin: 18px 0 0; font-size: 13px; line-height: 1.7; }
.status-message:empty { margin: 0; }
.status-message[data-state=error], [role=status][data-state=error] { color: var(--color-error); padding: 12px 14px; border-left: 3px solid var(--color-error); background: var(--color-error-bg); }
.status-message[data-state=success], [role=status][data-state=success] { color: var(--color-teal); padding: 12px 14px; border-left: 3px solid var(--color-teal); background: var(--color-success-bg); }
.text-button { min-height: 44px; padding: 5px 0; border: 0; font-size: 13px; background: transparent; }
.text-button:hover { background: transparent; text-decoration: underline; }
progress { width: 100%; height: 10px; margin: 16px 0; border: 0; border-radius: 3px; overflow: hidden; accent-color: var(--color-blue); background: var(--color-section); }
progress::-webkit-progress-bar { background: var(--color-section); }
progress::-webkit-progress-value { background: var(--color-blue); }
progress::-moz-progress-bar { background: var(--color-blue); }
#share-result { margin-top: 20px; padding-top: 4px; border-top: 1px solid var(--color-border); }
#share-result button { margin-top: 12px; }
#code-form { margin-top: 23px; }
#code-form button { margin-top: 13px; }
#sender-link { margin-bottom: 16px; }
.validation-summary-errors, .field-validation-error { color: var(--color-error); }
.input-validation-error { border-color: var(--color-error) !important; }
.visually-hidden, .drop-area input[type=file] { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.drop-area:focus-within .button { outline: 3px solid var(--color-blue); outline-offset: 4px; }
.drop-area.drag-over { outline: 3px solid var(--color-blue); outline-offset: 3px; }
.account-panel { padding: 32px; }
.account-panel h1 { font-size: 29px; }
.account-panel .button { margin-top: 8px; }
.account-panel .hint { margin-top: 20px; }
.account-panel .account-icon { display: inline-grid; place-items: center; width: 48px; height: 48px; margin-bottom: 22px; background: var(--color-section); color: var(--color-blue); border-radius: 6px; }
.recovery-options,.recovery-code-actions{display:flex;gap:1rem;flex-wrap:wrap;margin:1.5rem 0}
.recovery-options a[aria-current="page"]{font-weight:700;text-decoration-thickness:2px}
.recovery-secondary{margin-top:1.5rem}
.recovery-code-list{padding:1.5rem 1.5rem 1.5rem 3rem;background:var(--color-section);border:1px solid var(--color-border);border-radius:6px}
.recovery-code-list li{padding:.3rem 0;overflow-wrap:anywhere}
.recovery-code-list code{color:var(--color-navy);font-size:.95rem}
.recovery-code-actions button{min-height:44px}
@media print{.app-header,.workspace-footer,.preview-notice,.skip-link,.recovery-code-actions,.account-panel form,.session-notice{display:none!important}.panel{border:0}.recovery-code-list{background:white}}

.passphrase-panel{margin-top:16px;min-width:0}.passphrase-panel label{margin-top:0}.passphrase-actions{display:flex;gap:8px;margin-top:8px}.passphrase-panel details{margin-top:6px;font-size:12px;color:var(--color-muted)}.passphrase-panel details p{margin-top:8px}.recovery-notice{padding:16px;background:var(--color-section);border:1px solid var(--color-border);margin:16px 0}.recovery-notice p{margin-bottom:10px}
/* Keep the primary send action in the first desktop viewport. Full attestation remains visible. */
@media(min-width:1000px){.workspace-main:has(#send-app){padding-top:20px}#send-app>.eyebrow{margin-bottom:4px}#send-app>h1{font-size:30px;margin-bottom:6px}#send-app>.lead{margin-bottom:12px}#send-app .panel{padding:16px 22px}#send-app .drop-area{display:grid;grid-template-columns:auto 1fr auto;text-align:left;gap:4px 12px;padding:12px}#send-app .upload-symbol{grid-row:1 / 3;width:28px;height:28px;margin:0}#send-app .drop-area strong{grid-column:2}#send-app .drop-area>span:last-of-type{grid-column:2}#send-app .drop-area .button{grid-column:3;grid-row:1 / 3;margin:0}#send-app .file-list{margin:6px 0}#send-app .file-list li{padding:6px 0}#send-app label:not(.confirmation){margin-top:12px}#send-app .passphrase-panel>label{margin-top:0}#send-app .expiry-row{padding:10px 0}#send-app .confirmation{margin:12px 0}#send-app .passphrase-actions button{min-height:36px;padding:6px 12px}#send-app .billing-notice{margin:10px 0}#send-app .billing-notice p{margin:0}}
@media(max-width:600px){.file-list li{flex-wrap:wrap}.passphrase-actions{flex-wrap:wrap}}

@media(min-width:1000px){#send-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:24px;align-items:start}#send-form> *{grid-column:1 / -1}#send-form>.recipient-block{grid-column:1;grid-row:4;min-width:0}#send-form>.passphrase-panel{grid-column:2;grid-row:4;margin-top:12px}#send-app .recipient-block .expiry-row{border:0;padding-bottom:0}#send-app .passphrase-panel details{margin-bottom:0}.workspace-page:has(#send-app) .header-inner{min-height:76px;padding-top:12px;padding-bottom:12px}}

@media(min-width:1000px){.workspace-main:has(#send-app){padding-top:12px}#send-app>.lead{font-size:14px;margin-bottom:8px}#send-app>.eyebrow{margin-bottom:2px}#send-app>h1{font-size:28px;margin-bottom:4px}#send-app .panel{padding:12px 20px}#send-app .drop-area{padding-top:6px;padding-bottom:6px}#send-app .confirmation{margin:8px 0}#send-app .file-list{max-height:72px;overflow-y:auto}#send-app .billing-notice{font-size:12px;line-height:1.4;padding:8px 12px;margin:8px 0}}
