/* IPv6 Controle — presentation only. No handlers, data or business rules. */
:root {
  --ink:#152d45; --muted:#607489; --line:#dfe7ef; --paper:#ffffff;
  --soft:#f4f7fb; --forest:#087eb8; --lime:#e3f3fd; --red:#b43e4c;
  --amber:#936211; --radius:14px;
  --ui-blue:#087eb8; --ui-blue-hover:#066b9d; --ui-navy:#0b2035;
  --ui-shadow:0 2px 6px #152d4504,0 8px 24px #152d4504;
}
body { background:var(--soft); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:14px; line-height:1.55; -webkit-font-smoothing:antialiased; }
body button,body input,body select,body textarea { font-family:inherit; }
body .app { grid-template-columns:232px minmax(0,1fr); }
body main { width:100%; max-width:1512px; min-width:0; padding:26px 36px 48px; }
body .sidebar { background:var(--ui-navy); padding:28px 16px 22px; display:flex; flex-direction:column; border-right:1px solid #20374b; }
body .brand { padding:0 7px 25px; gap:11px; font-size:20px; letter-spacing:-.55px; font-weight:750; }
body .brand-logo { width:34px; height:34px; border-radius:10px; }
body .sidebar .nav { display:grid; gap:5px; }
body .sidebar .nav button { display:flex; align-items:center; gap:12px; min-height:44px; padding:11px 13px; border:1px solid transparent; border-radius:9px; color:#b7c9da; font-size:13px; font-weight:550; transition:background .16s,color .16s,border-color .16s; }
body .sidebar .nav button:hover { background:#152f48; color:#fff; }
body .sidebar .nav button.active { background:#173e59; border-color:#28546e; color:#e9f7ff; font-weight:650; box-shadow:inset 3px 0 #25b2eb; }
body .sidebar .nav button::before { content:""; width:18px; height:18px; flex:0 0 18px; background:currentColor; mask:var(--nav-icon) center/contain no-repeat; -webkit-mask:var(--nav-icon) center/contain no-repeat; opacity:.9; }
body [data-page=agenda] { --nav-icon:url('design-icons/CalendarDays.svg'); }
body [data-page=low] { --nav-icon:url('design-icons/ClipboardCheck.svg'); }
body [data-page=records] { --nav-icon:url('design-icons/Files.svg'); }
body [data-page=tasks] { --nav-icon:url('design-icons/ListTodo.svg'); }
body [data-page=users] { --nav-icon:url('design-icons/Users.svg'); }
body [data-page=commissions],body .commission-nav { --nav-icon:url('design-icons/HandCoins.svg'); }
body [data-page=offers] { --nav-icon:url('design-icons/Tags.svg'); }
/* A baixa continua disponível pelo botão da O.S.; o atalho redundante sai da navegação. */
body .sidebar .nav [data-page=low] { display:none; }
body .nav-sep { background:#253b50; margin:14px 12px; height:1px; }
body .side-foot { position:static; margin:auto 7px 0; padding-top:18px; border-top:1px solid #253b50; color:#8ea6bc; font-size:11px; }
body .top { min-height:44px; padding-bottom:20px; margin-bottom:30px; border-bottom:1px solid var(--line); gap:16px; }
body .crumb { color:var(--muted); font-size:12px; }
body .top-actions { gap:12px; flex-shrink:0; }
body .user-name { color:var(--ink); font-size:13px; font-weight:600; }
body .pill { background:#e8f3fa; color:#206487; border:1px solid #d5e9f4; font-size:11px; font-weight:650; padding:5px 9px; border-radius:6px; }
body .hero { align-items:flex-start; gap:24px; margin-bottom:26px; }
body .hero h1 { font-size:30px; line-height:1.2; letter-spacing:-1px; font-weight:750; }
body .hero .eyebrow { font-size:10px; font-weight:700; letter-spacing:.12em; color:#67849c; margin:0 0 8px; }
body .hero p:not(.eyebrow) { margin:10px 0 0; color:var(--muted); font-size:14px; line-height:1.6; max-width:640px; }
body h2 { color:var(--ink); letter-spacing:-.35px; line-height:1.35; }
body h3 { line-height:1.5; }
body .primary,body .secondary,body .small-btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:38px; height:auto; padding:9px 14px; border-radius:8px; font-size:13px; line-height:1.35; font-weight:600; text-decoration:none; transition:background .15s,border-color .15s,box-shadow .15s; }
body .primary { min-height:42px; background:var(--ui-blue); border:1px solid var(--ui-blue); color:#fff; box-shadow:0 2px 3px #087eb812; }
body .primary:hover:not(:disabled) { background:var(--ui-blue-hover); border-color:var(--ui-blue-hover); }
body .secondary,body .small-btn { background:#fff; border:1px solid #d3dfe9; color:#35566f; box-shadow:0 1px 2px #152d4505; }
body .secondary:hover:not(:disabled),body .small-btn:hover:not(:disabled) { border-color:#8ebad4; background:#f0f8fc; color:#096c9e; }
body .small-btn { min-height:34px; padding:7px 11px; font-size:12px; }
body button:active:not(:disabled),body a.small-btn:active { filter:brightness(.96); }
body button:disabled { opacity:.5; cursor:not-allowed; box-shadow:none; }
body :is(button,a,input,select,textarea,[tabindex]):focus-visible { outline:3px solid #279ed6; outline-offset:3px; }
body .delete-btn { background:#fff!important; color:#b43e4c!important; border-color:#edcbd1!important; }
body .delete-btn:hover { background:#fff0f2!important; border-color:#db9ca7!important; }
body .logout { min-height:32px; padding:6px 12px; font-size:12px; }
body .toolbar { gap:10px; margin-bottom:18px; }
body .filters { display:inline-flex; gap:3px; padding:4px; border:1px solid #dce6ee; border-radius:10px; background:#eaf0f6; }
body .filter { min-height:33px; padding:7px 12px; background:transparent; color:#586f83; border:1px solid transparent; font-size:12px; font-weight:600; border-radius:7px; }
body .filter.active { background:#fff; color:#0879b0; border-color:#d9e6ef; box-shadow:0 1px 3px #122d4510; }
body .date-picker,body .search { min-height:42px; border-color:#d3dfe9; border-radius:8px; padding:10px 12px; font-size:13px; background:#fff; color:var(--ink); }
body .refresh-button { color:#486c87; font-size:12px; min-height:40px; border-radius:8px; padding:8px 12px; }
body .refresh-button:hover { background:#e8f2fa; }
body .job-card { grid-template-columns:76px minmax(0,1fr) auto; padding:20px; gap:20px; border-color:var(--line); border-radius:14px; background:#fff; box-shadow:var(--ui-shadow); }
body .list { gap:12px; }
body .job-time { color:#087eb8; font-size:19px; font-weight:700; font-variant-numeric:tabular-nums; border-color:#e6edf3; }
body .job-card h3 { font-size:15px; font-weight:650; margin-bottom:5px; }
body .job-card p { font-size:13px; line-height:1.6; color:var(--muted); overflow-wrap:anywhere; }
body .tags { gap:6px; margin-top:12px; }
body .tag,body .status,body .priority,body .commission-status { font-size:10px; font-weight:650; line-height:1.4; padding:4px 8px; border-radius:6px; letter-spacing:.01em; }
body .tag { color:#4f7088; background:#eef4f8; }
body .status { background:#e8f4fb; color:#24678e; }
body .status.done { background:#e8f5ef; color:#257254; }
body .tag.urgent { color:#b14a51; background:#fff0ef; }
body .tag.overdue { color:#926411; background:#fff4db; }
body .job-action-buttons { gap:7px; flex-wrap:wrap; }
body .job-actions { gap:9px; }
body .card,body .commission-card,body .offer-card { padding:24px; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:var(--ui-shadow); }
body .card h2,body .commission-card h2,body .section-head h2 { font-size:18px; font-weight:650; margin:0 0 5px; }
body .section-head { gap:16px; margin-bottom:20px; }
body .card>p,body .commission-card>p,body .modal>p,body .modal form>p { font-size:13px; color:var(--muted); line-height:1.6; margin:0 0 20px; }
body .section-head span { font-size:12px; }
body .low-layout { max-width:760px; }
body .form-grid { gap:18px 16px; }
body .field,body .commission-filter-field { color:#586d80; font-size:11px; font-weight:650; letter-spacing:.04em; gap:7px; }
body .field input,body .field select,body .field textarea,body .commission-filter-field input,body .commission-filter-field select,body .offers-toolbar input,body .offers-toolbar select { min-height:44px; height:auto; width:100%; min-width:0; padding:11px 12px; border:1px solid #d3dfe9; border-radius:8px; background:#fff; color:var(--ink); font-size:14px; line-height:1.4; font-weight:400; box-shadow:0 1px 2px #152d4503; }
body textarea::placeholder,body input::placeholder { color:#8a9ba9; opacity:1; }
body input[type=file] { font-size:12px; }
body input[type=file]::file-selector-button { font:600 12px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; background:#edf5fa; color:#35566f; border:1px solid #cfdee9; border-radius:6px; padding:7px 10px; margin-right:10px; cursor:pointer; }
body input[type=file]::file-selector-button:hover { background:#dfeff8; }
body .field textarea { min-height:96px; line-height:1.6; }
body .field input:focus,body .field select:focus,body .field textarea:focus,body .commission-filter-field input:focus,body .commission-filter-field select:focus { border-color:#3ba0cc; box-shadow:0 0 0 3px #e1f2fb; }
body .photo-rule,body .commission-note,body .offers-help { background:#edf7fc; border:1px solid #d8edf8; color:#416d87; padding:13px 15px; font-size:12px; line-height:1.65; border-radius:9px; margin:16px 0; }
body .photo-box { padding:16px; border-color:#b6d5e6; border-radius:10px; background:#f8fcff; }
body .photo-box strong { color:#3a6681; font-size:12px; }
body .photo-choice { background:#fff; border-color:#cddfe9; border-radius:8px; min-height:42px; font-size:13px; color:#267296; }
body .photo-preview { object-fit:contain; background:#f0f5f9; }
body .record-item { padding:20px 0; gap:14px; border-color:#e8eef4; }
body .record-item h3 { font-size:14px; font-weight:650; }
body .record-item p { font-size:12px; line-height:1.65; }
body .record-icon { background:#eaf5fb; color:#237caa; border-radius:10px; width:36px; height:36px; }
body .photo-count { color:#49738d; font-size:10px; letter-spacing:.03em; }
body .image-thumb { width:44px; height:44px; border-color:#cfdee9; border-radius:8px; }
body .task-table,body .commission-table { border:1px solid var(--line); border-radius:10px; background:#fff; }
body th,body .commission-referrals-card .commission-table th { padding:14px 16px; font-size:10px; font-weight:650; line-height:1.5; letter-spacing:.05em; color:#637b8e; background:#f6f9fc; }
body td { padding:17px 16px; font-size:13px; line-height:1.55; border-color:#e8eef4; }
body tbody tr:hover { background:#f9fcff; }
body .task-name { font-weight:650; }
body .commission-table .commission-actions { gap:6px; }
body .commission-table .commission-status { white-space:normal; display:inline-block; }
body .commission-tabs { display:flex; flex-wrap:wrap; gap:4px; border-bottom:1px solid #d9e5ef; padding:0 0 12px; margin-bottom:22px; }
body .commission-tabs button { font-size:12px; font-weight:600; min-height:38px; border:1px solid transparent; border-radius:8px; padding:8px 12px; background:transparent; color:#5c758a; }
body .commission-tabs button:hover { color:#0a719f; background:#eaf4fa; }
body .commission-tabs button.active { color:#0675a9; border-color:#cde5f2; background:#e6f4fc; }
body .commission-cards { gap:14px; margin-bottom:22px; }
body .commission-stat { padding:20px; border:1px solid var(--line); border-radius:12px; box-shadow:var(--ui-shadow); }
body .commission-stat span { font-size:12px; font-weight:550; color:#60788c; }
body .commission-stat strong { font-size:29px; font-weight:700; line-height:1.3; letter-spacing:-.8px; margin-top:10px; font-variant-numeric:tabular-nums; }
body .commission-stat[role=button]:hover { transform:none; border-color:#97cce5; box-shadow:0 4px 14px #177bab0b; }
body .commission-pending { gap:14px; }
body .commission-pending button { background:#f9fbfd; border-color:#e0e9f0; padding:17px; font-size:13px; border-radius:10px; }
body .commission-pending button strong { font-size:23px; color:#167ea8; margin:6px 0; }
body .commission-pending button small { font-size:12px; color:#60788c; }
body .commission-filter-panel { background:#f7fafd; border-color:#e2eaf1; padding:18px; border-radius:10px; margin-bottom:20px; }
body .commission-filter-grid { gap:14px; }
body .commission-clear { min-height:44px; }
body .commission-row { padding:17px 0; gap:18px; border-color:#e7eef4; }
body .commission-row h3 { font-size:14px; }
body .commission-row p,body .commission-row small { font-size:12px; color:var(--muted); line-height:1.6; }
body .commission-row strong { font-weight:650; }
body .commission-value { color:#087cad; font-size:15px; }
body .commission-address-list { background:#f4f9fd; padding:11px 13px; margin-top:12px; border-color:#a4d5eb; font-size:12px; line-height:1.6; }
body .commission-address-list span { line-height:1.7; }
body .offers-hero-actions { gap:9px; }
body .offers-toolbar { margin:20px 0 14px; gap:12px; }
body .offers-count { font-size:12px; font-weight:550; color:#718597; margin:0 0 18px; }
body .offers-grid { gap:20px; }
body .offer-card { display:flex; flex-direction:column; }
body .offer-top { gap:18px; flex-direction:column; }
body .offer-card h2 { font-size:19px; font-weight:650; margin-bottom:7px; }
body .offer-card p { font-size:13px; line-height:1.6; }
body .offer-price { color:#087eaf; font-size:24px; font-weight:700; letter-spacing:-.6px; white-space:normal; max-width:100%; text-align:left; }
body .offer-meta { margin:17px 0; gap:6px; }
body .offer-tag { font-size:11px; font-weight:550; border-radius:6px; padding:4px 8px; background:#eef5fa; color:#51758f; }
body .offer-message { margin:0 0 20px; padding:18px; background:#f7fafd; border:1px solid #e3edf4; border-radius:9px; color:#405e76; font-size:13px; line-height:1.75; }
body .offer-actions { margin-top:auto; gap:8px; align-items:center; padding-top:3px; }
body .offer-actions .primary { min-height:40px; height:auto; }
body .modal-backdrop { background:#0b203580; backdrop-filter:blur(3px); padding:24px; }
body .modal { background:#fff; border:1px solid #e3ebf1; border-radius:16px; padding:28px; width:min(640px,100%); box-shadow:0 28px 90px #071a3040; max-height:calc(100dvh - 48px); }
body .modal h2 { font-size:23px; font-weight:700; letter-spacing:-.6px; margin:0 40px 8px 0; }
body .modal .close { float:right; display:grid; place-items:center; width:36px; height:36px; min-width:36px; border:1px solid #e1e9f0; border-radius:8px; padding:0; margin:-5px -5px 0 0; background:#f8fafc; color:#58748b; font-size:23px; line-height:1; }
body .modal .close:hover { background:#eaf3f9; color:#16486c; }
body .modal-actions { margin-top:24px; padding-top:20px; border-top:1px solid #e4ecf3; gap:10px; }
/* Mural de pendências: o espaço separa claramente a escrita, a ação e os filtros. */
body .pending-board { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:24px; box-shadow:var(--ui-shadow); }
body .pending-composer { display:flex; flex-direction:column; align-items:stretch; gap:16px; padding-bottom:20px; border-bottom:1px solid var(--line); }
body .pending-composer .field { gap:8px; }
body .pending-composer textarea { min-height:96px; resize:vertical; }
body .pending-composer > .primary { align-self:flex-end; min-width:184px; }
body .pending-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:18px 0 14px; }
body .pending-count { color:var(--muted); font-size:12px; font-weight:650; }
body .pending-list { display:grid; gap:10px; }
body .pending-item { display:flex; align-items:flex-start; gap:12px; padding:16px; border:1px solid var(--line); border-radius:12px; background:var(--paper); transition:border-color .15s,box-shadow .15s; }
body .pending-item:hover { border-color:#b8d9ea; box-shadow:0 5px 14px #152d4508; }
body .pending-item.done { background:#fbfdfc; }
body .pending-indicator { width:11px; height:11px; margin-top:5px; border-radius:50%; background:#f2c36c; flex:none; }
body .pending-item.done .pending-indicator { background:#55a979; }
body .pending-content { min-width:0; flex:1; }
body .pending-content p { margin:0; color:var(--ink); font-size:14px; line-height:1.6; white-space:pre-wrap; overflow-wrap:anywhere; }
body .pending-content .status { display:inline-flex; margin-top:9px; }
body .pending-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }
body .pending-complete { background:var(--ui-blue); color:#fff; border-color:var(--ui-blue); }
body .pending-complete:hover { background:var(--ui-blue-hover); border-color:var(--ui-blue-hover); }
@media(min-width:651px) {
  body #jobModal .modal { padding:24px; }
  body #jobModal .form-grid { gap:12px 16px; }
  body #jobModal .field { line-height:1.4; gap:5px; }
  body #jobModal .field input,body #jobModal .field select { min-height:40px; padding:9px 12px; }
  body #jobModal .field textarea { min-height:74px; }
  body #jobModal .modal-actions { margin-top:18px; padding-top:16px; }
}
body .commission-modal .modal,body .offers-modal .modal { width:min(680px,100%); }
body .confirm-modal .modal { width:min(460px,100%); }
body .registration-preview { font-size:14px; line-height:1.7; padding:18px; }
body .empty,body .commission-empty { background:#fff; padding:42px 24px; border:1px dashed #ccdce8; color:#6c8295; border-radius:12px; font-size:13px; }
body .empty strong { color:#395a73; font-size:16px; font-weight:600; margin-bottom:8px; }
body .toast { background:#173e59; color:#fff; border:1px solid #3b617b; border-radius:10px; font-size:13px; font-weight:500; padding:14px 18px; box-shadow:0 10px 32px #0b20352a; max-width:min(540px,calc(100vw - 32px)); line-height:1.6; }
body #loginModal,body #setupModal { background:var(--soft); }
body #loginModal .modal,body #setupModal .modal { max-width:440px; box-shadow:0 16px 56px #173e5910; padding:32px; }
body #loginModal .brand,body #setupModal .brand { color:var(--ui-navy); font-size:23px; padding-bottom:24px; }
body #loginModal .form-foot .primary { min-width:120px; }
@media(min-width:1000px) { body #records .card>.form-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } body #records .card>.form-grid .full { grid-column:1/-1; } }
@media(min-width:651px) and (max-width:1000px) { body .app { grid-template-columns:200px minmax(0,1fr); } body main { padding:22px; } body .sidebar { padding:24px 12px; } body .brand { font-size:17px; gap:8px; } body .job-card { grid-template-columns:65px minmax(0,1fr); } body .job-actions { grid-column:2; justify-items:start; } body .hero { flex-wrap:wrap; } body .offers-grid,body .commission-grid { grid-template-columns:1fr; } }
@media(max-width:700px) {
  body .commission-cards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  body .commission-stat { padding:16px; } body .commission-stat strong { font-size:24px; }
  body .commission-table,body .task-table { background:transparent; border:0; }
  body .commission-table tr,body .task-table tr { padding:16px; border-color:var(--line); border-radius:12px; margin-bottom:12px; box-shadow:var(--ui-shadow); }
  body .commission-table td,body .task-table td { padding:7px 0; font-size:13px; }
  body .commission-table td[data-label]::before,body .task-table td::before { font-size:11px; font-weight:600; color:#70879a; }
  body .commission-actions { padding-top:6px; gap:8px; }
  body .commission-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
  body .commission-tabs button { min-height:42px; background:#fff; border-color:#e0e9f1; }
  body .commission-row { gap:12px; }
}
@media(max-width:650px) {
  body .app { display:block; } body main { width:100%; max-width:100%; padding:18px 16px 32px; }
  body .sidebar { display:grid; grid-template-columns:1fr 44px; height:auto; padding:12px 16px; min-height:68px; gap:10px; border:0; }
  body .brand { padding:0; margin:0!important; font-size:19px; gap:10px; }
  body .sidebar .nav { display:none; padding-top:14px; border-color:#2a455c; }
  body .sidebar.mobile-open { right:0; left:auto; width:min(330px,92vw); max-height:100dvh; box-shadow:-20px 0 60px #071a3040; border-left:1px solid #314c60; }
  body .sidebar.mobile-open .nav { display:grid; }
  body .sidebar .nav button { min-height:46px; padding:12px; font-size:14px; }
  body .sidebar .nav-sep { width:auto; height:1px; margin:10px; }
  body .mobile-menu-toggle { width:44px; height:44px; border-radius:9px; background:#183c57; color:#c8efff; display:grid; place-items:center; padding:10px; }
  body .mobile-menu-toggle span { display:none; }
  body .mobile-menu-toggle::before { content:""; width:22px; height:22px; background:currentColor; mask:url('design-icons/Menu.svg') center/contain no-repeat; -webkit-mask:url('design-icons/Menu.svg') center/contain no-repeat; }
  body .sidebar.mobile-open .mobile-menu-toggle { background:#264b66; }
  body .sidebar.mobile-open .mobile-menu-toggle::before { mask-image:url('design-icons/X.svg'); -webkit-mask-image:url('design-icons/X.svg'); }
  body .top { min-height:42px; padding:0 0 16px; margin-bottom:22px; align-items:center; gap:8px; }
  body .crumb { font-size:11px; padding:0; } body .top-actions { gap:6px; } body .pill { font-size:10px; padding:5px 7px; }
  body .side-foot { display:none; }
  body .hero { gap:16px; margin-bottom:22px; } body .hero h1 { font-size:27px; } body .hero p:not(.eyebrow) { font-size:13px; line-height:1.65; }
  body .hero>.primary,body .hero>.secondary { width:100%; font-size:14px; min-height:44px; }
  body .hero .primary::after { content:none; }
  body .offers-hero-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; gap:8px; }
  body .offers-hero-actions button { font-size:12px; padding:10px; white-space:normal; }
  body .toolbar { gap:10px; } body .filters { display:flex; width:100%; } body .filter { flex:1; min-height:36px; }
  body .job-card { display:block; padding:18px; } body .job-time { border:0; border-bottom:1px solid #e7eef4; margin:0 0 13px; padding-bottom:10px; font-size:20px; }
  body .job-card h3 { font-size:15px; } body .job-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
  body .job-action-buttons { flex-basis:100%; } body .job-actions>.delete-btn { margin:0; width:auto; flex:0 0 auto; }
  body .small-btn { min-height:40px; padding:9px 12px; font-size:12px; }
  body .card,body .commission-card,body .offer-card { padding:18px; border-radius:13px; }
  body .section-head { flex-wrap:wrap; gap:10px; margin-bottom:18px; }
  body .form-grid { gap:17px; } body .field { font-size:11px; }
  body .field input,body .field select,body .field textarea,body .commission-filter-field input,body .commission-filter-field select,body .offers-toolbar input,body .offers-toolbar select,body .search,body .date-picker { font-size:16px; min-height:46px; }
  body .commission-filter-grid { grid-template-columns:1fr; gap:14px; }
  body .commission-pending,body .commission-grid,body .offers-grid { grid-template-columns:1fr; }
  body .commission-filter-panel { padding:14px; } body .commission-active-filters { font-size:11px; }
  body .commission-row { align-items:stretch; } body .commission-actions { width:100%; }
  body .offers-help { padding:13px; font-size:12px; } body .offers-toolbar { grid-template-columns:1fr; }
  body .offer-top { gap:13px; } body .offer-price { font-size:24px; } body .offer-message { padding:15px; font-size:13px; }
  body .offer-actions .primary { min-height:44px; flex:1 1 100%; }
  body .pending-board { padding:18px; }
  body .pending-composer { gap:14px; padding-bottom:18px; }
  body .pending-composer > .primary { align-self:stretch; min-width:0; min-height:44px; }
  body .pending-toolbar { align-items:flex-start; flex-direction:column; margin:16px 0 12px; }
  body .pending-item { flex-wrap:wrap; padding:14px; }
  body .pending-actions { width:100%; justify-content:stretch; }
  body .pending-actions .small-btn { flex:1; min-height:42px; }
  body .record-item { grid-template-columns:32px minmax(0,1fr); } body .record-media { grid-column:2; justify-content:flex-start; }
  body .modal-backdrop:not(#loginModal):not(#setupModal) { padding:12px; align-items:center; }
  body .modal-backdrop:not(#loginModal):not(#setupModal) .modal { width:100%; border-radius:16px; max-height:calc(100dvh - 24px); padding:22px 18px; }
  body .modal h2 { font-size:22px; } body .modal .close { width:40px; height:40px; }
  body .modal-actions { display:flex; flex-wrap:wrap; padding-top:17px; gap:8px; }
  body .modal-actions button { min-height:44px; flex:1; width:auto; }
  body #loginModal .modal,body #setupModal .modal { padding:26px 22px; }
  body .toast { bottom:calc(14px + env(safe-area-inset-bottom)); right:16px; left:16px; max-width:none; font-size:13px; }
}
@media(prefers-reduced-motion:reduce) { body *,body *::before,body *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }