feat(ui): asleep state, 24×7 chip, presence toggle for host mode

web/styles/input.css

@@ -70,6 +70,7 @@
   .dot-online   { background: var(--ok);   box-shadow: 0 0 0 3px color-mix(in oklch, var(--ok),   transparent 80%); }
   .dot-degraded { background: var(--warn); box-shadow: 0 0 0 3px color-mix(in oklch, var(--warn), transparent 80%); }
   .dot-offline  { background: var(--off); }
+  .dot-asleep   { background: var(--ink-fade); opacity: 0.6; }
   .dot-failed   { background: var(--bad);  box-shadow: 0 0 0 3px color-mix(in oklch, var(--bad),  transparent 80%); }
   .pulse        { animation: rm-pulse 2.4s ease-in-out infinite; }
   @keyframes rm-pulse {

web/templates/partials/host_chrome.html

@@ -34,7 +34,11 @@
         {{else if eq $host.Status "degraded"}}
           <span class="dot dot-degraded"></span>
         {{else if eq $host.Status "offline"}}
-          <span class="dot dot-offline"></span>
+          {{if $host.AlwaysOn}}
+            <span class="dot dot-offline"></span>
+          {{else}}
+            <span class="dot dot-asleep"></span>
+          {{end}}
         {{else}}
           <span class="dot dot-failed"></span>
         {{end}}
@@ -45,6 +49,11 @@
                   style="padding: 2px 8px; border: 1px dashed var(--line); border-radius: 3px; cursor: pointer;"
                   onclick="document.getElementById('tags-edit-{{$host.ID}}').classList.toggle('hidden')"
                   title="Edit tags">{{if $host.Tags}}edit tags{{else}}add tags{{end}}</button>
+          {{if $host.AlwaysOn}}<span class="tag" title="Expected online 24×7 — offline raises an alert">24×7</span>{{end}}
+          <button type="button" class="text-ink-fade text-[11px] hover:text-ink-mid whitespace-nowrap"
+                  style="padding: 2px 8px; border: 1px dashed var(--line); border-radius: 3px; cursor: pointer;"
+                  onclick="document.getElementById('mode-edit-{{$host.ID}}').classList.toggle('hidden')"
+                  title="Change presence mode">presence</button>
         </div>
         {{if gt $page.ScheduleVersion 0}}
           <span class="mono text-[11px] text-ink-mute ml-2">
@@ -80,6 +89,24 @@
         </div>
         <div class="field-help">Comma-separated. Lowercased automatically.</div>
       </form>
+      {{/* Presence-mode editor — hidden by default; toggled by the
+           "presence" button. Checkbox present => always-on (24×7);
+           unchecked => intermittent (laptop): no offline alerts, shows
+           "asleep", auto-catches-up a missed backup on reconnect. */}}
+      <form id="mode-edit-{{$host.ID}}" method="post"
+            action="/hosts/{{$host.ID}}/mode"
+            class="hidden mt-3" style="max-width: 640px;">
+        <label class="flex items-center gap-2 text-[12px] text-ink-mid">
+          <input type="checkbox" name="always_on" value="on" {{if $host.AlwaysOn}}checked{{end}} />
+          Always On — expected online 24×7
+        </label>
+        <div class="field-help">
+          Uncheck for an intermittent host (laptop/workstation): it won't
+          raise offline alerts when asleep, shows an "asleep" state, and
+          catches up a missed backup ~1 minute after it reconnects.
+        </div>
+        <button type="submit" class="btn btn-primary mt-2 whitespace-nowrap">Save presence</button>
+      </form>
       <div class="flex items-center gap-3 mt-3 text-[13px] text-ink-mute">
         <span class="mono text-ink-mid">{{$host.OS}}/{{$host.Arch}}</span>
         <span class="text-ink-fade">·</span>
@@ -88,7 +115,11 @@
         <span>restic <span class="mono text-ink-mid">{{if $host.ResticVersion}}{{$host.ResticVersion}}{{else}}—{{end}}</span></span>
         <span class="text-ink-fade">·</span>
         {{if eq $host.Status "offline"}}
-          <span>last seen <span class="mono text-ink-mid">{{relTime $host.LastSeenAt}}</span></span>
+          {{if $host.AlwaysOn}}
+            <span>last seen <span class="mono text-ink-mid">{{relTime $host.LastSeenAt}}</span></span>
+          {{else}}
+            <span>asleep · last seen <span class="mono text-ink-mid">{{relTime $host.LastSeenAt}}</span> · will catch up on return</span>
+          {{end}}
         {{else}}
           <span>online · last heartbeat <span class="mono text-ink-mid">{{relTime $host.LastSeenAt}}</span></span>
         {{end}}

web/templates/partials/host_row.html

@@ -8,7 +8,11 @@
     {{- else if eq $h.Status "degraded" -}}
       <span class="dot dot-degraded"></span>
     {{- else if eq $h.Status "offline" -}}
-      <span class="dot dot-offline"></span>
+      {{- if $h.AlwaysOn -}}
+        <span class="dot dot-offline"></span>
+      {{- else -}}
+        <span class="dot dot-asleep"></span>
+      {{- end -}}
     {{- else -}}
       <span class="dot dot-failed"></span>
     {{- end -}}
@@ -26,7 +30,11 @@
     {{- else if eq (deref $h.LastBackupStatus) "cancelled" -}}
       <span class="text-warn">cancelled</span> · <span class="mono">{{relTime $h.LastBackupAt}}</span>
     {{- else if eq $h.Status "offline" -}}
-      <span class="text-ink-mute">last seen <span class="mono">{{relTime $h.LastSeenAt}}</span></span>
+      {{- if $h.AlwaysOn -}}
+        <span class="text-ink-mute">last seen <span class="mono">{{relTime $h.LastSeenAt}}</span></span>
+      {{- else -}}
+        <span class="text-ink-mute">asleep · <span class="mono">{{relTime $h.LastSeenAt}}</span> · will catch up on return</span>
+      {{- end -}}
     {{- else -}}
       <span class="text-ink-fade italic">never run</span>
     {{- end -}}
@@ -53,7 +61,7 @@
   </div>
   <div class="text-right row-action">
     {{- if eq $h.Status "offline" -}}
-      <span class="mono text-xs text-ink-fade">offline</span>
+      <span class="mono text-xs text-ink-fade">{{if $h.AlwaysOn}}offline{{else}}asleep{{end}}</span>
     {{- else if $h.CurrentJobID -}}
       <a href="/jobs/{{deref $h.CurrentJobID}}" class="btn btn-ghost">View job →</a>
     {{- else if .RunAllScheduleID -}}