/* Mobile interaction layer (2026-07-30).
   All rules are scoped to phone widths so desktop rendering and business logic stay unchanged. */
.adjustment-timeline,.mobile-detail-list { display:none; }
.task-editor-backdrop { position:fixed; z-index:40; inset:0; display:block; background:rgba(20,24,32,.52); }
@supports ((-webkit-backdrop-filter:blur(2px)) or (backdrop-filter:blur(2px))) {
  .task-editor-backdrop { background:rgba(20,24,32,.38); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
}
.task-editor-template { display:none; }
.task-module.editing .task-editor-template {
  position:fixed; z-index:41; top:50%; left:50%; bottom:auto; display:flex; flex-direction:column;
  width:min(430px,calc(100vw - 24px)); max-height:calc(100vh - 32px); max-height:calc(100dvh - 32px); overflow:hidden;
  transform:translate(-50%,-50%); border-radius:22px; background:#fff; box-shadow:0 20px 60px rgba(0,0,0,.26);
}
body.task-editor-open { overflow:hidden; }
.task-editor-head { position:sticky; z-index:2; top:0; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 15px 11px; border-bottom:1px solid #edf0f4; background:#fff; }
.task-editor-head b { display:block; font-size:17px; line-height:1.3; }
.task-editor-head span { display:block; margin-top:2px; color:#777f8f; font-size:12px; }
.task-editor-close { width:40px; min-height:40px!important; padding:0; border:0; border-radius:50%; background:#f2f3f5; color:#555d6c; font-size:25px; line-height:1; }
.task-editor-body { min-height:0; overflow:auto; padding:13px 15px calc(15px + env(safe-area-inset-bottom)); }
.task-editor-label { margin-bottom:8px; color:#777f8f; font-size:12px; font-weight:700; text-align:center; }
.task-editor-notice { display:grid; gap:4px; margin-top:13px; padding:10px 11px; border-radius:12px; background:#fff7ef; color:#643715; font-size:12px; line-height:1.5; }
.task-editor-notice b { color:#ac5000; font-size:13px; }
.task-editor-notice small { color:#d05f00; font-size:11px; }
.task-editor-done { position:sticky; bottom:0; width:100%; min-height:48px!important; margin-top:13px; border:0; border-radius:13px; background:#ff7800; color:#fff; font-size:15px; font-weight:800; box-shadow:0 -8px 18px rgba(255,255,255,.96); }
@media (max-width: 760px) {
  :root {
    --m-orange:#ff7800;
    --m-orange-dark:#e96700;
    --m-orange-soft:#fff1e5;
    --m-blue:#1677ff;
    --m-ink:#14213d;
    --m-muted:#6f7787;
    --m-line:rgba(20,33,61,.10);
    --m-danger:#ef233c;
    --m-success:#2da44e;
    --m-surface:#fff;
    --m-bg:#fffaf5;
    --m-shadow:0 6px 20px rgba(91,57,24,.055);
  }

  html { font-size:16px; background:var(--m-bg); }
  body {
    min-width:0;
    overflow-x:hidden;
    color:var(--m-ink);
    background:linear-gradient(180deg,#fffdf9,#fff8f2) fixed;
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
  }
  button,a,[role="button"],label[for],select,input[type="checkbox"] {
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
  }
  button,a,[role="button"] { transition:transform .15s ease,opacity .15s ease,background-color .15s ease; }
  button:active:not(:disabled),a:active,[role="button"]:active { transform:scale(.97); opacity:.9; }
  button:disabled,.btn:disabled { opacity:.4!important; box-shadow:none!important; cursor:not-allowed; }
  .toast.success { background:rgba(29,122,62,.96)!important; }
  .toast.error { background:rgba(183,45,45,.96)!important; }
  input,select,textarea { font-size:16px!important; }
  input,select,textarea,button,.btn { min-height:44px; }

  .shell,.wrap,.page {
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
  .top { gap:8px!important; margin-bottom:10px!important; }
  .title,.top h1 { font-size:22px!important; line-height:1.2!important; letter-spacing:-.3px; }
  .card,.panel,.summary {
    border-radius:14px!important;
    box-shadow:var(--m-shadow)!important;
  }
  .head { font-size:17px!important; }
  .notice { font-size:13px!important; }

  /* Home/report */
  .page-home .shell { padding:8px 8px calc(76px + env(safe-area-inset-bottom))!important; }
  .page-home .hero { padding:0!important; }
  .page-home .identity-line { margin:7px 2px 0!important; }
  .page-home .identity { font-size:15px!important; }
  .page-home .identity-actions { gap:4px!important; }
  .page-home .admin-entry,.page-home .name-remark,.page-home .exit-preview {
    min-height:36px!important;
    padding:6px 9px!important;
    font-size:12px!important;
  }
  .home-summary {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:1px;
    margin-bottom:8px;
    overflow:hidden;
    border:1px solid rgba(255,120,0,.14);
    border-radius:14px;
    background:rgba(255,120,0,.12);
    box-shadow:var(--m-shadow);
  }
  .home-summary a {
    display:block;
    min-width:0;
    min-height:62px;
    padding:9px 4px 7px;
    background:#fff;
    color:var(--m-ink);
    text-align:center;
    text-decoration:none;
  }
  .home-summary strong { display:block; overflow:hidden; font-size:20px; line-height:1.2; color:var(--m-orange); text-overflow:ellipsis; }
  .home-summary span { display:block; margin-top:3px; color:var(--m-muted); font-size:11px; white-space:nowrap; }
  .home-summary.loading-summary strong { color:#d9dde5; }
  .weekly-alert,.draft-banner {
    display:flex;
    align-items:center;
    gap:8px;
    margin:8px 0;
    padding:9px 10px;
    border:1px solid rgba(239,35,60,.18);
    border-radius:12px;
    background:#fff0f1;
    color:#a2081b;
    font-size:12px;
    line-height:1.4;
  }
  .weekly-alert span,.draft-banner .draft-dialog { flex:1; min-width:0; }
  .weekly-alert a,.draft-banner button {
    min-height:36px!important;
    padding:6px 10px;
    border:0;
    border-radius:9px;
    background:#fff;
    color:inherit;
    font-size:12px;
    font-weight:750;
    text-decoration:none;
    white-space:nowrap;
  }
  .draft-banner { border-color:rgba(255,120,0,.2); background:#fff4e9; color:#8d4300; }
  .draft-banner .draft-dialog { display:flex; align-items:center; gap:7px; padding:0; background:transparent; box-shadow:none; }
  .draft-banner .draft-title { display:none; }
  .draft-banner .draft-text { flex:1; margin:0; color:inherit; font-size:12px; line-height:1.4; }
  .draft-banner .draft-actions { display:flex; flex:0 0 auto; gap:5px; }
  .draft-banner .draft-restore { background:var(--m-orange); color:#fff; }
  .draft-banner .draft-discard { background:#fff; color:#8d4300; }
  .page-home .announcement-board { min-height:70px!important; padding:28px 10px 6px!important; border-radius:13px!important; }
  .page-home .announcement-summary { min-height:34px!important; font-size:15px!important; line-height:19px!important; }
  .page-home .task-strip { margin-top:7px; border-radius:12px; }
  .page-home .task-home-item { min-height:42px; align-items:center; }
  .page-home .card { margin-top:8px!important; }
  .page-home .head { padding:11px 12px 9px!important; }
  .page-home .task-module-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; padding:8px; }
  .page-home .row.task-module { display:block!important; min-width:0; padding:0!important; border:0!important; }
  .task-module-button { position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; width:100%; min-height:100px!important; padding:9px 8px 8px; overflow:hidden; border:1px solid rgba(20,33,61,.10); border-radius:13px; background:#fff; color:var(--m-ink); text-align:left; box-shadow:0 3px 10px rgba(70,48,25,.04); }
  .task-module-button:active { transform:scale(.97); }
  .task-module-name { display:-webkit-box; width:100%; overflow:hidden; font-size:12px; font-weight:780; line-height:1.3; overflow-wrap:anywhere; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
  .task-module-rule { display:block; width:100%; margin-top:4px; color:var(--m-muted); font-size:10px; white-space:nowrap; }
  .task-module-value { display:block; max-width:100%; margin-top:auto; padding-top:6px; color:#9aa0aa; font-size:12px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .task-module-photo { position:absolute; right:5px; bottom:5px; max-width:54px; overflow:hidden; padding:2px 5px; border-radius:999px; background:#fff1e5; color:#b44d00; font-size:8px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
  .task-module.has-photo .task-module-value { max-width:calc(100% - 40px); }
  .task-module.is-filled .task-module-button { border-color:rgba(45,164,78,.28); background:#f1fbf4; }
  .task-module.is-filled .task-module-value { color:#187a35; }
  .task-module.has-error .task-module-button { border-color:rgba(239,35,60,.3); background:#fff7f7; }
  .page-home .name { font-size:15px!important; }
  .page-home .rule { font-size:12px!important; }
  .qty-stepper {
    display:grid;
    grid-template-columns:40px 52px 40px;
    width:132px;
    height:44px;
    overflow:hidden;
    border:1px solid rgba(255,120,0,.28);
    border-radius:12px;
    background:#fff;
  }
  .qty-stepper button {
    min-width:40px;
    min-height:42px;
    padding:0;
    border:0;
    background:var(--m-orange-soft);
    color:#a94700;
    font-size:22px;
    font-weight:700;
    line-height:1;
  }
  .qty-stepper .qty {
    width:52px!important;
    height:42px!important;
    min-height:42px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:#fff!important;
    color:var(--m-ink)!important;
    font-size:18px!important;
    font-weight:750;
    text-align:center;
    appearance:textfield;
    -moz-appearance:textfield;
  }
  .qty-stepper .qty::-webkit-inner-spin-button,.qty-stepper .qty::-webkit-outer-spin-button { appearance:none; margin:0; }
  .qty-stepper:focus-within { border-color:var(--m-orange); box-shadow:0 0 0 3px rgba(255,120,0,.12); }
  .qty-stepper.is-invalid { border-color:var(--m-danger); box-shadow:0 0 0 3px rgba(239,35,60,.10); }
  .task-editor-template .qty-stepper { grid-template-columns:54px 72px 54px; width:180px; height:54px; margin:0 auto; border-radius:14px; }
  .task-editor-template .qty-stepper button { min-width:54px; min-height:52px; font-size:26px; }
  .task-editor-template .qty-stepper .qty { width:72px!important; height:52px!important; min-height:52px!important; font-size:22px!important; }
  .page-home .photo-line { gap:7px!important; }
  .page-home .photo-btn { min-height:38px!important; display:inline-flex; align-items:center; }
  .page-home .photo-state { min-width:0; font-size:12px!important; }
  .page-home .photo-progress { margin-top:0!important; padding:7px 9px; border-radius:10px; background:#fff9f3; }
  .task-list-toggle {
    width:calc(100% - 20px);
    min-height:42px;
    margin:8px 10px 10px;
    border:1px solid rgba(255,120,0,.2);
    border-radius:11px;
    background:#fff8f1;
    color:#a94700;
    font-size:13px;
    font-weight:750;
  }
  .task-secondary.hide-secondary { display:none!important; }
  .page-home .actions { padding:7px 7px calc(7px + env(safe-area-inset-bottom))!important; }
  .page-home .actions .btn { height:46px!important; font-size:13px!important; }

  /* Query */
  .page-query .shell { padding:8px 8px 24px!important; }
  .page-query .hero { padding:4px 2px!important; }
  .page-query .hero h1 { font-size:22px!important; }
  .page-query .head { align-items:stretch!important; gap:7px!important; }
  .page-query .head-actions { display:grid!important; grid-template-columns:minmax(0,1fr) auto auto; width:100%; gap:6px!important; }
  .page-query .month-filter { min-width:0!important; width:100%; height:44px!important; font-size:14px!important; }
  .page-query .filter-btn,.page-query .copy { min-height:44px!important; padding:7px 10px!important; }
  .page-query .panel { padding:10px!important; }
  .page-query .metric { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  .page-query .box { min-width:0; padding:9px 3px!important; }
  .page-query .num { overflow:hidden; font-size:20px!important; text-overflow:ellipsis; }
  .page-query .lab { line-height:1.3; }
  .page-query .recon-metrics { display:grid!important; grid-template-columns:repeat(6,minmax(0,1fr))!important; }
  .page-query .recon-metrics .box:nth-child(1),.page-query .recon-metrics .box:nth-child(2) { grid-column:span 3; }
  .page-query .recon-metrics .box:nth-child(n+3) { grid-column:span 2; }
  .page-query .bonus-prediction { padding:9px 10px!important; gap:7px!important; }
  .page-query .points-table { table-layout:fixed; width:100%; font-size:12px!important; }
  .page-query .points-table th,.page-query .points-table td { padding:8px 5px!important; overflow-wrap:anywhere; }
  .page-query .points-table th:first-child,.page-query .points-table td:first-child { width:44%; }
  .adjustment-timeline { display:grid; gap:7px; margin-top:8px; }
  .adjustment-item { display:grid; grid-template-columns:58px minmax(0,1fr) auto; gap:8px; align-items:center; padding:9px 10px; border:1px solid var(--m-line); border-radius:11px; background:#fff; }
  .adjustment-date { color:var(--m-muted); font-size:11px; }
  .adjustment-main { min-width:0; font-size:12px; line-height:1.35; }
  .adjustment-main b { display:block; overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
  .adjustment-main small { display:block; color:var(--m-muted); overflow-wrap:anywhere; }
  .adjustment-value { padding:5px 7px; border-radius:999px; font-size:12px; font-weight:800; white-space:nowrap; }
  .adjustment-value.positive { background:#eaf7ee; color:#187a35; }
  .adjustment-value.negative { background:#fff0f1; color:#c7192f; }
  .adjustment-type { display:inline-block; margin-top:3px; padding:2px 6px; border-radius:999px; background:#f2f4f7; color:#667085; font-size:10px; }
  .page-query .adjustment-table { display:none; }
  .page-query .wide-detail-table { display:none; }
  .mobile-detail-list { display:grid; gap:8px; margin-top:10px; }
  .mobile-detail-card { padding:12px; border:1px solid var(--m-line); border-radius:15px; background:#fff; }
  .mobile-detail-head { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:14px; }
  .mobile-detail-store { margin-top:3px; color:var(--m-muted); font-size:12px; }
  .mobile-detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin-top:9px; }
  .mobile-detail-grid span { padding:7px 4px; border-radius:10px; background:var(--m-orange-soft); color:var(--m-muted); font-size:10px; text-align:center; }
  .mobile-detail-grid b { display:block; margin-top:2px; color:var(--m-ink); font-size:13px; }

  /* User tasks and weekly plan */
  .page-tasks .wrap { padding-top:10px!important; padding-bottom:calc(82px + env(safe-area-inset-bottom))!important; }
  .page-tasks .top h1 { margin:4px 0; }
  .page-tasks .tabs { position:sticky; z-index:5; top:0; margin:9px 0!important; }
  .page-tasks .tabs button { min-height:40px!important; padding:7px!important; }
  .page-tasks .card { padding:11px!important; margin:7px 0!important; border-radius:13px!important; }
  .page-tasks .title { font-size:16px!important; }
  .page-tasks .meta { margin-top:4px!important; font-size:12px!important; }
  .page-tasks .sheet { max-height:92vh!important; padding:14px 12px calc(12px + env(safe-area-inset-bottom))!important; border-radius:20px 20px 0 0!important; }
  .page-weekly .shell { padding:9px 9px calc(72px + env(safe-area-inset-bottom))!important; }
  .page-weekly .title { font-size:22px!important; }
  .page-weekly .summary { padding:11px!important; }
  .page-weekly .metrics { gap:5px!important; }
  .page-weekly .row { grid-template-columns:minmax(0,1fr) 132px!important; gap:8px!important; padding:9px 11px!important; }

  /* Admin: shared compact mobile language without changing desktop tables or actions. */
  .admin-mobile .shell,.admin-mobile .page { padding:10px 9px calc(24px + env(safe-area-inset-bottom))!important; }
  .admin-mobile .top { align-items:center!important; flex-wrap:wrap; }
  .admin-mobile .title { font-size:21px!important; }
  .admin-mobile .back { min-height:36px; display:inline-flex; align-items:center; }
  .admin-mobile .card { margin-bottom:9px!important; padding:11px!important; border-radius:13px!important; }
  .admin-mobile .nav { grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px!important; }
  .admin-mobile .nav a { min-height:68px!important; padding:11px!important; border-radius:12px!important; font-size:14px!important; }
  .admin-mobile .nav small { margin-top:4px!important; font-size:11px!important; line-height:1.3!important; }
  .admin-mobile .metrics { gap:1px!important; margin-bottom:9px!important; }
  .admin-mobile .metric { min-height:66px!important; padding:9px 5px!important; }
  .admin-mobile .metric b,.admin-mobile .metric strong { font-size:20px!important; }
  .admin-mobile .toolbar { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px!important; align-items:end!important; }
  .admin-mobile .toolbar label { width:auto!important; min-width:0!important; margin:0!important; }
  .admin-mobile .toolbar .btn { width:100%!important; min-width:0!important; }
  .admin-mobile .toolbar > :only-child,.admin-mobile .toolbar .full { grid-column:1/-1; }
  .admin-mobile .form { grid-template-columns:1fr!important; gap:9px!important; }
  .admin-mobile .full { grid-column:auto!important; }
  .admin-mobile input,.admin-mobile select,.admin-mobile textarea { margin-top:4px!important; border-radius:10px!important; }
  .admin-mobile textarea { min-height:96px!important; }
  .admin-mobile .btn { min-height:44px!important; padding:8px 11px!important; }
  .admin-mobile .table-wrap { max-width:100%; border-radius:11px!important; -webkit-overflow-scrolling:touch; }
  .admin-mobile th,.admin-mobile td { padding:9px 8px!important; }
  .admin-mobile .audit-dialog { align-items:end!important; padding:0!important; }
  .admin-mobile .audit-dialog-panel { width:100%!important; max-height:92vh!important; padding:14px 12px calc(12px + env(safe-area-inset-bottom))!important; border-radius:20px 20px 0 0!important; }
  .admin-mobile .audit-actions { position:sticky; bottom:0; display:grid!important; grid-template-columns:1fr 1.35fr; margin:12px -2px -2px!important; padding-top:8px; background:#fff; }
  .admin-mobile .photo-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px!important; }
  .admin-mobile .photo-meta { padding:8px!important; }
  .admin-mobile .app-progress-panel { bottom:calc(10px + env(safe-area-inset-bottom))!important; }
}

@media (max-width: 360px) {
  .page-home .row { grid-template-columns:minmax(0,1fr) 120px!important; }
  .page-weekly .row { grid-template-columns:minmax(0,1fr) 120px!important; }
  .qty-stepper { grid-template-columns:36px 48px 36px; width:120px; }
  .qty-stepper button { min-width:36px; }
  .qty-stepper .qty { width:48px!important; }
  .page-home .actions .btn { font-size:12px!important; }
  .admin-mobile .nav { grid-template-columns:1fr!important; }
}

@media (prefers-reduced-motion:reduce) {
  button,a,[role="button"] { transition:none!important; }
}