:root{--bg:#f4f6f8;--card:#fff;--text:#18202a;--muted:#667085;--green:#1f6f5f;--green-soft:#e7f4f0;--orange:#d97706;--orange-soft:#fff4e5;--border:#e4e7ec;--danger:#b42318;--danger-soft:#fef3f2}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}.hidden{display:none!important}.app{max-width:980px;margin:auto;padding:18px}.auth-screen{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,#f4f6f8,#e7f4f0)}.auth-card{width:min(100%,440px);background:#fff;border:1px solid var(--border);border-radius:24px;padding:28px}.logo-mark{width:52px;height:52px;border-radius:16px;background:var(--green);color:#fff;display:grid;place-items:center;font-size:24px;font-weight:900;margin-bottom:18px}h1,h2,h3,p{margin-top:0}h1{font-size:28px;margin-bottom:0}.eyebrow{font-size:13px;color:var(--muted);margin-bottom:4px;text-transform:uppercase;letter-spacing:.08em}.muted{color:var(--muted)}.small{font-size:13px}header{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:8px 0 20px}.header-actions,.hero-actions{display:flex;gap:8px;flex-wrap:wrap}.hero{background:linear-gradient(135deg,#e9f0f5,#dfe8ef);color:var(--text);border-radius:22px;padding:26px;margin-bottom:18px;display:flex;justify-content:space-between;gap:20px;align-items:center}.hero p{color:#52606d;margin-bottom:0}.hero-button,.primary,.ghost,.need-btn,.tab{border:0;border-radius:12px;padding:12px 14px;font-weight:800;cursor:pointer}.primary{background:var(--green);color:#fff}.hero-button.offer{background:#176553;color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.08)}.need-btn,.hero-button.need{background:var(--orange);color:#fff}.ghost{background:#fff;border:1px solid var(--border);color:#344054}.full{width:100%;margin-top:14px}.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}.tab{background:#e9ecef;color:#344054}.tab.active{background:#d7ece6;color:#17584b}.panel{display:none}.panel.active{display:block}.form-card,.card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:16px}.form-card{max-width:580px}.wide{max-width:none}.form-card label{margin:13px 0}label{font-size:13px;font-weight:700;color:#344054;display:block}input,textarea{width:100%;margin-top:7px;padding:12px;border:1px solid #d0d5dd;border-radius:10px;font:inherit;background:#fff}textarea{min-height:90px;resize:vertical}.cards{display:grid;gap:12px}.card{display:flex;justify-content:space-between;gap:14px;align-items:center}.offer-card{border-left:6px solid var(--green)}.need-card{border-left:6px solid var(--orange);background:#fffdf9}.card small{color:var(--muted);display:block;margin-top:5px}.badge{display:inline-block;padding:5px 8px;border-radius:999px;font-size:12px;font-weight:800;margin-bottom:7px}.badge.green{background:var(--green-soft);color:#174f45}.badge.orange{background:var(--orange-soft);color:#9a4f05}.section-help{color:var(--muted);margin:-4px 0 14px;font-size:14px}.empty{background:#fff;border:1px dashed #cfd4dc;border-radius:18px;padding:28px;text-align:center;color:var(--muted)}.message{margin-top:14px;padding:12px;border-radius:12px;font-size:14px}.message.error{background:var(--danger-soft);color:var(--danger)}.message.success{background:var(--green-soft);color:#174f45}dialog{border:0;border-radius:20px;width:min(92vw,480px);padding:0;box-shadow:0 20px 60px rgba(0,0,0,.2)}dialog::backdrop{background:rgba(0,0,0,.35)}.dialog-card{padding:22px}.dialog-card label{margin-top:14px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;flex-wrap:wrap}@media(max-width:700px){.tabs{grid-template-columns:1fr 1fr}.hero,.card,header{align-items:flex-start;flex-direction:column}.card button{width:100%}.header-actions{width:100%}.header-actions button{flex:1}}

.identity{font-weight:800;color:#344054;margin:2px 0 6px}.home-hint{font-size:12px;color:var(--muted)}

.notification-box{margin-top:18px;padding:14px;border:1px solid var(--border);border-radius:14px;background:#f8fafb}
.notification-box h4{margin:0 0 5px}
.notification-box p{margin-bottom:10px}
.check-row{display:flex!important;align-items:flex-start;gap:10px;margin:10px 0!important;font-weight:600}
.check-row input{width:auto;margin:2px 0 0;flex:0 0 auto}
.check-row span{line-height:1.35}

.full-width{width:100%;margin:8px 0}

/* v5.6 */
.tabs .tab{transition:.15s ease}
.tab-overview{background:#e5edf7;color:#365a7c}
.tab-overview.active{background:#cfe0f2;color:#214968}
.tab-available{background:#e7f4f0;color:#17584b}
.tab-available.active{background:#cde9e0;color:#114c41}
.tab-needed{background:#fff1df;color:#9a4f05}
.tab-needed.active{background:#ffe1b8;color:#864300}
.tab-mine{background:#eeeaf8;color:#5f4b8b}
.tab-mine.active{background:#ddd4f1;color:#4d3a7a}

.hero-button.refresh{background:#fff;color:#344054;border:1px solid var(--border)}
.refresh-status{margin-top:10px!important;min-height:16px}
.mine-section{margin-bottom:22px}
.mine-section>h3{margin:0 0 10px 2px}

.card{
  display:grid;
  grid-template-columns:minmax(220px,1.15fr) minmax(180px,1fr) minmax(150px,.65fr);
  gap:18px;
  align-items:center;
}
.card-main h3{margin:4px 0 7px}
.date-rows{display:grid;gap:5px;line-height:1.4}
.card-comment{min-height:54px;color:#52606d}
.comment-label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.05em;font-weight:800;color:#98a2b3;margin-bottom:4px}
.empty-comment{min-height:0}
.card-action{display:flex;justify-content:flex-end}
.card-action button,.card-action .own-space-label{width:100%}
.own-space-label{display:flex;align-items:center;justify-content:center;padding:12px 14px;border-radius:12px;background:#eef3f1;border:1px solid #d6e3df;color:#41645b;font-weight:800;text-align:center}

.settings-card{max-height:86vh;overflow:auto}
.pin-input{text-align:center;font-size:30px;letter-spacing:.35em;font-weight:800}
.pin-lock{position:fixed;inset:0;z-index:9999;background:linear-gradient(135deg,#f4f6f8,#e7f4f0);display:grid;place-items:center;padding:20px}
.pull-refresh{position:fixed;top:8px;left:50%;transform:translate(-50%,-60px);z-index:10000;background:#18202a;color:#fff;padding:8px 14px;border-radius:999px;font-size:12px;font-weight:800;transition:.18s ease;pointer-events:none}
.pull-refresh.visible{transform:translate(-50%,0)}

@media(max-width:700px){
  .card{grid-template-columns:1fr;gap:12px}
  .card-comment{min-height:0;padding-top:2px}
  .card-action{justify-content:stretch}
  .card-action button,.card-action .own-space-label{width:100%}
  .header-actions{display:grid;grid-template-columns:1fr 1fr}
  .header-actions button{width:100%}
}

.auth-help{margin-top:12px;line-height:1.45}
#pinLoginStep .ghost.full{margin-top:10px}

.pin-modal{
  position:fixed;
  inset:0;
  z-index:20000;
  background:rgba(15,23,42,.55);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.pin-modal.hidden{display:none!important}
.pin-modal-card{
  width:min(100%,460px);
  max-height:90vh;
  overflow:auto;
  background:#fff;
}
.modal-open{overflow:hidden}
.app-version{text-align:center;margin:14px 0 0}

#cancelActionPanel .pin-modal-card{width:min(100%,520px)}
#cancelActionMessage{min-height:120px}