/* Reflow at narrow widths and browser zoom; touch-friendly controls. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:0}
button,input,textarea{font-family:inherit}
main,.header,footer{width:100%}
.workspace>* , .transfer-card,.transfer-view,.panel-top>*,.toggle-row>span,.benefits>div{min-width:0}
.header{gap:18px;flex-wrap:wrap;padding-block:18px}
.brand{flex-shrink:0}.header nav{flex-wrap:wrap}
.panel-top,.field-label,.file-summary,.transfer-meta{flex-wrap:wrap;row-gap:10px}
.text-input{font-size:1rem;line-height:1.5}
textarea:focus-visible{outline:3px solid #6a8c35;outline-offset:3px}
.primary,.secondary,.danger{min-height:48px;line-height:1.5;overflow-wrap:anywhere}
.primary{font-size:.875rem}.primary>span{flex-shrink:0}
.text-button,.remove-file,.management summary,.new-transfer{min-height:44px}
.remove-file{min-width:44px;flex-shrink:0}
.text-button{padding:10px 0}.management summary{padding-block:12px}
.field-help,.submit-note,.panel-note,.notice{font-size:.75rem;line-height:1.65}
.drop-zone strong{line-height:1.4}.drop-zone small{line-height:1.6}
.file-name{font-size:.875rem}.file-size{font-size:.75rem}
.toggle-row{min-height:48px}.toggle-row strong{font-size:.875rem}.toggle-row small{font-size:.75rem}
.toggle-row input{width:44px;height:44px}.toggle-row>span:first-child{flex:1}
.retention-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.retention-options label{min-width:0;min-height:48px;font-size:.8125rem;white-space:normal;text-align:center}
.retention-options input{flex-shrink:0;width:16px;height:16px}
.field-label{font-size:.875rem}.field-label .optional{font-size:.6875rem}
.progress-box>div{flex-wrap:wrap}.progress-box>div>span{min-width:0;overflow-wrap:anywhere}
.notice,.error-message,.lead,.management p,.transfer-meta,.received-note{overflow-wrap:anywhere}
.transfer-heading h1{font-size:clamp(1.7rem,4vw,2.5rem);overflow-wrap:anywhere}
.copy-row .text-input{width:0;min-width:0}.copy-row button{flex-shrink:0}
.benefits p{font-size:.75rem}.benefits h3{font-size:.875rem}
footer{padding-inline:28px;gap:16px;flex-wrap:wrap}
.toast{width:max-content;max-width:calc(100vw - 32px);overflow-wrap:anywhere;bottom:max(20px,env(safe-area-inset-bottom))}
.mobile-upload-title{display:none}
@media(max-width:960px){
 .workspace{grid-template-columns:minmax(0,1fr);max-width:720px;margin-inline:auto}
 .header{padding-inline:24px}.settings-panel h2{margin-bottom:24px}
 .drop-zone{min-height:230px}.benefits{gap:22px}.benefits>div+div{padding-left:22px}
}
@media(max-width:600px){
 main{padding-inline:16px}.header{padding:14px 16px;min-height:72px;gap:12px}
 .brand{font-size:21px;gap:9px}.brand-icon{width:36px;height:36px;font-size:28px}
 .header nav a{display:flex;align-items:center;min-height:44px;font-size:12px}.nav-current{display:none}
 .intro.visual-intro{padding:10px 0 16px}.hero-scene{width:100%}
 .upload-panel,.settings-panel,.transfer-card{padding:20px;border-radius:18px}
 .panel-top{margin-bottom:18px}h2{font-size:.9375rem;gap:8px}
 .drop-zone{min-height:210px;padding:22px 12px}.upload-art{width:72px;height:72px}
 .desktop-upload-title{display:none}.mobile-upload-title{display:inline}
 .drop-zone strong{font-size:1rem}.drop-zone>span:not(.upload-art){font-size:.8125rem}.drop-zone small{font-size:.6875rem;margin-top:16px}
 .note-field{margin-top:20px}.note-field textarea{min-height:112px}
 .file-list{max-height:320px}.file-row{gap:9px}.file-summary{font-size:.75rem}
 .settings-panel .divider{margin:20px 0}.primary{font-size:.9375rem;min-height:50px}
 .benefits{grid-template-columns:1fr;gap:0;padding:24px 4px}
 .benefits>div{position:relative;padding:16px 0 16px 38px}
 .benefits>div+div{border-left:0;border-top:1px solid var(--line);padding-left:38px}
 .benefit-number{position:absolute;left:0;top:18px}.benefits h3{margin:0 0 6px}.benefits br{display:none}
 footer{width:auto;margin:0 16px;padding:20px 0 max(24px,env(safe-area-inset-bottom));font-size:.6875rem}
 .transfer-view{margin:26px auto}.transfer-heading{margin-bottom:24px}.transfer-meta{font-size:.75rem}
 .copy-row{flex-direction:column}.copy-row .text-input{width:100%;flex-basis:auto}.copy-row button{width:100%;justify-content:center}
 .management{font-size:.8125rem}.danger{width:100%;font-size:.8125rem}.received-note{padding:14px}
 .new-transfer{padding:12px 0}.success-icon{margin-bottom:18px}
}
@media(max-width:360px){
 main{padding-inline:12px}.header{padding-inline:12px}.header nav a span{margin-left:4px}
 .upload-panel,.settings-panel,.transfer-card{padding:16px}.retention-options{gap:5px}.retention-options label{padding:10px 3px;gap:4px;font-size:.75rem}
 .field-label{align-items:flex-start}.pill{letter-spacing:.3px}.file-summary{align-items:flex-start}
}
@media(pointer:coarse){.remove-file{min-width:48px;min-height:48px}.drop-zone:hover .upload-art{transform:none}.drop-zone:hover:after{display:none}}
footer{width:auto}


/* Prominent upload and recipient progress. */
.progress-box progress{height:18px;border-radius:10px;margin:16px 0 10px}
.progress-box>div{align-items:center;font-size:14px;line-height:1.5}
#progress-percent{font-size:20px;font-weight:750;color:#405a23;font-variant-numeric:tabular-nums}
#receiver-progress-text{font-size:15px;font-weight:600;line-height:1.6}
.progress-box progress::-webkit-progress-bar{background:#edf1e5;border-radius:10px}
.progress-box progress::-webkit-progress-value{border-radius:10px}
.progress-box progress::-moz-progress-bar{border-radius:10px}
@media(max-width:600px){.progress-box progress{height:20px}}

/* Recipient uses the same moving stripes as the sender. */
#receiver-progress-bar::-webkit-progress-value{background:repeating-linear-gradient(110deg,#87a644 0 12px,#a1bd65 12px 24px);background-size:52px 100%;animation:qbot-progress 1s linear infinite;transition:width .3s}
#receiver-progress-bar::-moz-progress-bar{background:repeating-linear-gradient(110deg,#87a644 0 12px,#a1bd65 12px 24px);background-size:52px 100%;animation:qbot-progress 1s linear infinite}
#expiry.expiry-countdown{display:inline-block;max-width:100%;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.6;color:#b73737;background:#fff0ee;border:1px solid #efc4bf;border-radius:9px;padding:8px 12px;animation:qbot-deadline 2.4s ease-in-out infinite}
.transfer-meta{align-items:center}
@keyframes qbot-deadline{0%,100%{box-shadow:0 0 0 0 #dc5b4e00}50%{box-shadow:0 0 0 4px #dc5b4e1c;background:#ffe5e1}}
@media(max-width:600px){#expiry.expiry-countdown{font-size:12px}}
@media(prefers-reduced-motion:reduce){#expiry.expiry-countdown,#receiver-progress-bar::-webkit-progress-value,#receiver-progress-bar::-moz-progress-bar{animation:none!important}}

.hero-loading main{visibility:hidden;opacity:0}
.page-reveal main{animation:qbot-page-in .3s ease-out both}
.page-reveal .upload-panel.motion-enter,.page-reveal .settings-panel.motion-enter{animation:none}
@keyframes qbot-page-in{from{opacity:0}to{opacity:1}}