/* Connect printer to the hive: the native <dialog> opened from Your hive
   (assets/printer-connect.js). Hive cells and honey gold carry the brand; every
   other color is a theme token, so dark mode follows :root[data-theme="dark"].
   All rules are scoped to .printer-connect. */

.printer-connect{
  --pc-gold:#e9ae42;
  --pc-gold-edge:#c98a1c;
  --pc-on-gold:#2c1c08;
  --pc-gold-ink:var(--gold-ink,#a45d13);
  --pc-gold-soft:color-mix(in srgb,var(--pc-gold) 15%,var(--surface,#fff));
  --pc-hex:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);
  --pc-radius:var(--radius-lg,18px);
  --pc-pad:20px;
  box-sizing:border-box;
  width:min(560px,calc(100% - 32px)); max-width:none; max-height:calc(100dvh - 48px);
  margin:auto; padding:0; overflow:hidden;
  border:1px solid var(--line,#dce1e8); border-radius:var(--pc-radius);
  background:var(--surface,#fff); color:var(--text,#303742);
  box-shadow:var(--shadow-lg,0 24px 80px rgba(20,24,32,.28));
  font:500 13px/1.5 var(--font,system-ui,sans-serif);
}
.printer-connect *,.printer-connect *::before,.printer-connect *::after{ box-sizing:border-box; }
.printer-connect [hidden]{ display:none !important; }
.printer-connect::backdrop{ background:rgba(14,17,23,.46); backdrop-filter:blur(5px); }
@media (prefers-reduced-transparency:reduce){ .printer-connect::backdrop{ backdrop-filter:none; } }
.printer-connect[open]{ animation:printer-connect-in .24s cubic-bezier(.16,1,.3,1); }
@keyframes printer-connect-in{ from{ opacity:0; transform:translateY(12px) scale(.985); } to{ opacity:1; transform:none; } }

.printer-connect__shell{
  max-height:calc(100dvh - 48px); display:flex; flex-direction:column;
  overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain;
}
.printer-connect :is(button,input,a):focus-visible{ outline:2px solid var(--accent-ink,#175bc7); outline-offset:2px; }
.printer-connect__title:focus{ outline:none; }
.printer-connect svg{ display:block; width:100%; height:100%; }
.printer-connect code{ padding:1px 5px; border-radius:6px; background:var(--slot,var(--raised)); color:var(--ink); font:600 12px/1.4 var(--mono,ui-monospace,monospace); overflow-wrap:anywhere; }
.printer-connect__sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }

/* ── header ── */
.printer-connect__head{ display:grid; grid-template-columns:44px minmax(0,1fr) 44px; gap:12px; align-items:center; padding:var(--pc-pad) var(--pc-pad) 12px; }
/* The 3Dhive mark, in honey, as on the app icon. */
.printer-connect__mark{ width:44px; height:38px; padding:3px 2px; color:var(--hive-loader-honey,#e2a400); }
.printer-connect__mark svg{ fill:currentColor; }
.printer-connect__head-text{ min-width:0; }
.printer-connect__eyebrow{ display:block; color:var(--pc-gold-ink); font:700 11px/1.2 var(--font); letter-spacing:.12em; text-transform:uppercase; }
.printer-connect__title{ margin:3px 0 0; color:var(--ink); font:750 19px/1.25 var(--font); letter-spacing:-.01em; overflow-wrap:anywhere; text-wrap:balance; }
.printer-connect__close{
  width:44px; height:44px; padding:13px; display:grid; place-items:center; align-self:start;
  border:1px solid var(--line); border-radius:50%; background:var(--raised); color:var(--dim); cursor:pointer;
}
.printer-connect__close:hover{ color:var(--ink); background:var(--slot,var(--raised)); }

/* ── stepper: four hive cells joined by a filament line ── */
.printer-connect__steps{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0; padding:2px 12px 14px; list-style:none;
  border-bottom:1px solid var(--line-soft,var(--line));
}
.printer-connect__steps li{ position:relative; min-width:0; display:grid; justify-items:center; gap:5px; color:var(--dim); font:650 11.5px/1.2 var(--font); text-align:center; }
.printer-connect__steps li + li::before{
  content:""; position:absolute; top:13px; left:calc(-50% + 22px); right:calc(50% + 22px); height:2px; border-radius:2px; background:var(--line);
}
.printer-connect__steps li:is([data-state="done"],[data-state="current"])::before{ background:var(--pc-gold); }
.printer-connect__steps li[data-state="current"]{ color:var(--ink); }
.printer-connect__step-hex{
  position:relative; width:32px; height:28px; display:grid; place-items:center;
  clip-path:var(--pc-hex); background:var(--line); color:var(--dim); font:750 12px/1 var(--font);
}
.printer-connect__step-hex::before{ content:""; position:absolute; inset:2px; clip-path:var(--pc-hex); background:var(--surface); }
.printer-connect__step-hex > *{ position:relative; }
.printer-connect__step-hex svg{ display:none; width:15px; height:15px; }
.printer-connect__steps li[data-state="current"] .printer-connect__step-hex,
.printer-connect__steps li[data-state="current"] .printer-connect__step-hex::before{ background:var(--pc-gold); color:var(--pc-on-gold); }
.printer-connect__steps li[data-state="done"] .printer-connect__step-hex{ background:var(--pc-gold); color:var(--pc-gold-ink); }
.printer-connect__steps li[data-state="done"] .printer-connect__step-hex::before{ background:var(--pc-gold-soft); }
.printer-connect__steps li[data-state="done"] .printer-connect__step-hex b{ display:none; }
.printer-connect__steps li[data-state="done"] .printer-connect__step-hex svg{ display:block; }
.printer-connect__step-label{ max-width:100%; overflow-wrap:anywhere; }

/* ── body copy ── */
.printer-connect__body{ min-width:0; display:grid; gap:14px; padding:18px var(--pc-pad) 8px; }
.printer-connect__lead{ margin:0; color:var(--ink); font:650 14px/1.45 var(--font); overflow-wrap:anywhere; }
.printer-connect__hint{ margin:0; color:var(--dim); font:500 12.5px/1.5 var(--font); overflow-wrap:anywhere; }
.printer-connect__hero{ width:64px; height:56px; padding:14px 18px; margin:4px auto 0; clip-path:var(--pc-hex); background:var(--pc-gold-soft); color:var(--pc-gold-ink); }
.printer-connect__callout{ display:grid; gap:4px; padding:12px 14px; border:1px solid var(--line); border-radius:14px; background:var(--raised); color:var(--text); overflow-wrap:anywhere; }
.printer-connect__callout p{ margin:0; }
.printer-connect__callout strong{ color:var(--ink); font:700 13.5px/1.35 var(--font); }
.printer-connect__callout[data-tone="warn"]{ border-color:color-mix(in srgb,var(--ui-warning,#a25b14) 45%,var(--line)); background:color-mix(in srgb,var(--ui-warning,#a25b14) 8%,var(--surface)); }
.printer-connect__callout[data-tone="error"]{ border-color:color-mix(in srgb,var(--danger,#c83742) 45%,var(--line)); background:color-mix(in srgb,var(--danger,#c83742) 7%,var(--surface)); color:var(--ink); }

/* ── searching: a honeycomb that pulses cell by cell ── */
.printer-connect__pulse-wrap{ display:block; width:120px; height:104px; margin:4px auto 0; }
.printer-connect__pulse polygon{
  fill:var(--pc-gold); opacity:.2; transform-box:fill-box; transform-origin:center;
  animation:printer-connect-pulse 1.8s ease-in-out infinite;
}
.printer-connect__pulse g:nth-child(1) polygon{ opacity:.95; animation-name:printer-connect-core; }
.printer-connect__pulse g:nth-child(2) polygon{ animation-delay:.12s; }
.printer-connect__pulse g:nth-child(3) polygon{ animation-delay:.24s; }
.printer-connect__pulse g:nth-child(4) polygon{ animation-delay:.36s; }
.printer-connect__pulse g:nth-child(5) polygon{ animation-delay:.48s; }
.printer-connect__pulse g:nth-child(6) polygon{ animation-delay:.6s; }
.printer-connect__pulse g:nth-child(7) polygon{ animation-delay:.72s; }
@keyframes printer-connect-pulse{ 0%,100%{ opacity:.18; transform:scale(.84); } 40%{ opacity:.9; transform:scale(1); } }
@keyframes printer-connect-core{ 0%,100%{ transform:scale(.94); } 50%{ transform:scale(1); } }
.printer-connect__spinner-wrap{ display:block; width:56px; height:56px; margin:6px auto 0; }
.printer-connect__spinner polygon{ fill:none; stroke-width:3; stroke-linejoin:round; }
.printer-connect__spinner-track{ stroke:var(--line); }
.printer-connect__spinner-arc{ stroke:var(--pc-gold); stroke-dasharray:28 80; stroke-linecap:round; }
.printer-connect__spinner{ animation:printer-connect-spin 1.3s linear infinite; }
@keyframes printer-connect-spin{ to{ transform:rotate(360deg); } }
/* The load screen's animated 3Dhive mark (assets/hive-loading-animations.*) while 3Dhive works. */
.printer-connect__loader[data-hive-loader-variant]{ display:grid; place-items:center; width:104px; height:104px; margin:4px auto 0; }
.printer-connect__loader .hive-loading-animation__mark{ width:96px; height:96px; }
:root[data-reduce-motion="true"] .printer-connect [data-hive-loader-variant] .hive-loading-animation__motion{ animation:none !important; }
:root[data-reduce-motion="true"] .printer-connect [data-hive-loader-variant] :is(.hive-loading-animation__bar,.hive-loading-animation__shimmer){ opacity:0; }
:root[data-reduce-motion="true"] .printer-connect [data-hive-loader-variant] .hive-loading-animation__wipe{ opacity:1; transform:none; }

/* ── candidates and the printer summary ── */
.printer-connect__candidates{ margin:0; padding:0; list-style:none; display:grid; gap:8px; }
.printer-connect__candidate,.printer-connect__summary{
  width:100%; min-height:64px; display:grid; grid-template-columns:44px minmax(0,1fr); gap:12px; align-items:center;
  padding:10px 12px; border:1px solid var(--line); border-radius:14px; background:var(--raised); color:var(--text); text-align:left; font:inherit;
}
.printer-connect__candidate{ cursor:pointer; transition:border-color .12s,background .12s; }
.printer-connect__candidate:hover{ border-color:color-mix(in srgb,var(--pc-gold) 60%,var(--line)); background:var(--pc-gold-soft); }
.printer-connect__candidate[aria-pressed="true"]{ border-color:var(--pc-gold); box-shadow:0 0 0 1px var(--pc-gold); }
.printer-connect__candidate-icon{ width:44px; height:38px; padding:9px 11px; clip-path:var(--pc-hex); background:var(--pc-gold-soft); color:var(--pc-gold-ink); }
.printer-connect__candidate[data-auth="true"] .printer-connect__candidate-icon{ background:var(--slot,var(--raised)); color:var(--dim); }
.printer-connect__candidate-text{ min-width:0; display:grid; gap:2px; }
.printer-connect__candidate-text strong{ color:var(--ink); font:700 14px/1.3 var(--font); overflow-wrap:anywhere; }
.printer-connect__candidate-meta{ color:var(--dim); font:500 12px/1.4 var(--font); overflow-wrap:anywhere; }
.printer-connect__tags{ display:flex; flex-wrap:wrap; gap:5px; margin-top:4px; }
.printer-connect__tag{
  display:inline-block; padding:1px 8px; border-radius:999px; background:var(--slot,var(--raised)); color:var(--text);
  font:650 11px/1.6 var(--font); letter-spacing:.01em; vertical-align:1px;
}
.printer-connect__tag[data-tone="warn"]{ background:color-mix(in srgb,var(--ui-warning,#a25b14) 15%,var(--surface)); color:var(--ui-warning,#a25b14); }

/* ── manual address ── */
.printer-connect__manual{ display:grid; gap:6px; margin:0; min-width:0; }
.printer-connect__manual label{ color:var(--ink); font:680 13px/1.3 var(--font); }
.printer-connect__manual-row{ display:flex; gap:8px; min-width:0; }
.printer-connect__manual input{
  flex:1 1 auto; min-width:0; min-height:44px; padding:0 12px; border:1px solid var(--line); border-radius:12px;
  background:var(--slot,var(--raised)); color:var(--ink); font:600 14px/1 var(--mono,ui-monospace,monospace);
}
.printer-connect__manual input::placeholder{ color:var(--dim); opacity:1; }
.printer-connect__manual input[aria-invalid="true"]{ border-color:var(--danger); }
.printer-connect__field-error{ margin:0; color:var(--danger); font:600 12.5px/1.4 var(--font); }

/* ── permissions ── */
.printer-connect__permissions{ margin:0; padding:0; list-style:none; display:grid; gap:8px; }
.printer-connect__permission{ display:grid; grid-template-columns:36px minmax(0,1fr); gap:12px; align-items:start; padding:12px 14px; border:1px solid var(--line); border-radius:14px; background:var(--raised); }
.printer-connect__permission[data-optional="true"]{ display:block; padding:0; }
.printer-connect__permission-mark{ width:36px; height:32px; padding:8px 10px; clip-path:var(--pc-hex); background:var(--pc-gold); color:var(--pc-on-gold); }
.printer-connect__permission-text{ min-width:0; display:grid; gap:3px; }
.printer-connect__permission-text strong{ color:var(--ink); font:700 13.5px/1.35 var(--font); overflow-wrap:anywhere; }
.printer-connect__permission-text :is(p,small){ margin:0; color:var(--dim); font:500 12.5px/1.45 var(--font); }
.printer-connect__choice{ min-height:44px; display:grid; grid-template-columns:36px minmax(0,1fr); gap:12px; align-items:start; padding:12px 14px; border-radius:14px; cursor:pointer; }
.printer-connect__choice input{ width:22px; height:22px; margin:5px 7px; accent-color:var(--pc-gold); cursor:pointer; }
.printer-connect__assure{
  display:grid; grid-template-columns:20px minmax(0,1fr); gap:10px; align-items:start; margin:0; padding:11px 13px;
  border-radius:14px; background:var(--pc-gold-soft); color:var(--ink); font:600 12.5px/1.5 var(--font);
}
.printer-connect__icon{ display:block; width:20px; height:20px; color:var(--pc-gold-ink); }

/* ── connection checks ── */
.printer-connect__checks{ margin:0; padding:0; list-style:none; display:grid; gap:6px; }
.printer-connect__checks li{ min-height:36px; display:grid; grid-template-columns:30px minmax(0,1fr); gap:10px; align-items:center; color:var(--ink); font:600 13px/1.4 var(--font); overflow-wrap:anywhere; }
.printer-connect__check-mark{
  width:30px; height:26px; padding:5px 7px; clip-path:var(--pc-hex);
  background:color-mix(in srgb,var(--ui-positive,#15724f) 18%,var(--surface)); color:var(--ui-positive,#15724f);
}
.printer-connect__checks li[data-tone="warn"] .printer-connect__check-mark{ background:color-mix(in srgb,var(--ui-warning,#a25b14) 18%,var(--surface)); color:var(--ui-warning,#a25b14); }
.printer-connect__checks li[data-tone="skip"] .printer-connect__check-mark{ background:var(--slot,var(--raised)); color:var(--dim); }
.printer-connect__checks li[data-tone="skip"]{ color:var(--dim); }

/* ── online: live status ── */
.printer-connect__live{ display:grid; gap:10px; padding:14px; border:1px solid var(--line); border-radius:16px; background:var(--raised); }
.printer-connect__live[data-stale="true"]{ opacity:.7; }
.printer-connect__state{ display:grid; grid-template-columns:30px minmax(0,1fr); gap:10px; align-items:center; }
.printer-connect__state-hex{ width:30px; height:26px; clip-path:var(--pc-hex); background:var(--ui-positive,#15724f); }
.printer-connect__state-hex[data-tone="printing"]{ background:var(--pc-gold); animation:printer-connect-core 1.6s ease-in-out infinite; }
.printer-connect__state-hex:is([data-tone="paused"],[data-tone="warning"]){ background:var(--ui-warning,#a25b14); }
.printer-connect__state-hex:is([data-tone="offline"],[data-tone="checking"]){ background:var(--line); }
.printer-connect__state-line{ margin:0; min-width:0; color:var(--ink); font:700 14px/1.35 var(--font); overflow-wrap:anywhere; }
.printer-connect__progress{ height:10px; overflow:hidden; border-radius:999px; background:var(--slot,var(--line)); }
.printer-connect__progress-fill{
  display:block; width:0; height:100%; border-radius:inherit;
  background:repeating-linear-gradient(135deg,var(--pc-gold) 0 7px,var(--pc-gold-edge) 7px 14px);
  transition:width .4s ease;
}
.printer-connect__temps{ display:flex; flex-wrap:wrap; gap:6px 20px; margin:0; }
.printer-connect__temps div{ display:flex; align-items:baseline; gap:6px; }
.printer-connect__temps dt{ color:var(--dim); font:650 11px/1.3 var(--font); letter-spacing:.08em; text-transform:uppercase; }
.printer-connect__temps dd{ margin:0; color:var(--ink); font:650 13px/1.3 var(--font); font-variant-numeric:tabular-nums; }
.printer-connect__hours{ margin:0; color:var(--text); font:600 12.5px/1.45 var(--font); font-variant-numeric:tabular-nums; }
.printer-connect__hours[hidden],.printer-connect__issue[hidden]{ display:none; }
.printer-connect__issue{ gap:10px; justify-items:start; }

/* ── online: keep-online notice ── */
.printer-connect__notice{
  display:grid; grid-template-columns:36px minmax(0,1fr); gap:12px; align-items:center; padding:12px 14px;
  border:1px solid color-mix(in srgb,var(--pc-gold) 60%,var(--line)); border-radius:14px; background:var(--pc-gold-soft); color:var(--ink);
}
.printer-connect__notice p{ margin:0; font:650 13px/1.45 var(--font); }
.printer-connect__notice-mark{ width:36px; height:32px; padding:7px 9px; clip-path:var(--pc-hex); background:var(--pc-gold); color:var(--pc-on-gold); }

/* ── online: camera ── */
.printer-connect__camera,.printer-connect__recent{ display:grid; gap:10px; min-width:0; }
.printer-connect__camera{ padding:14px; border:1px solid var(--line); border-radius:16px; }
.printer-connect :is(.printer-connect__camera,.printer-connect__recent) h3{ margin:0; color:var(--ink); font:700 13.5px/1.3 var(--font); }
.printer-connect__switch{
  width:100%; min-height:44px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 2px 6px 0;
  border:0; border-radius:10px; background:none; color:var(--ink); font:650 13px/1.3 var(--font); text-align:left; cursor:pointer;
}
.printer-connect__switch[aria-busy="true"]{ cursor:progress; }
.printer-connect__switch-track{ position:relative; flex:none; width:44px; height:26px; border-radius:999px; background:var(--line); transition:background .16s; }
.printer-connect__switch-track::after{
  content:""; position:absolute; left:3px; top:3px; width:20px; height:20px; border-radius:50%;
  background:var(--surface); box-shadow:0 1px 3px rgba(0,0,0,.25); transition:transform .18s cubic-bezier(.16,1,.3,1);
}
.printer-connect__switch[aria-checked="true"] .printer-connect__switch-track{ background:var(--pc-gold); }
.printer-connect__switch[aria-checked="true"] .printer-connect__switch-track::after{ transform:translateX(18px); }
.printer-connect__camera-frame{ position:relative; display:grid; place-items:center; aspect-ratio:4/3; overflow:hidden; border-radius:12px; background:var(--slot,var(--raised)); }
.printer-connect__camera-img{ display:block; width:100%; height:100%; object-fit:contain; }
/* Once a picture arrives the frame takes the camera's shape after its turn (set
   from the picture's size in printer-connect.js), so there are no letterbox bands. */
.printer-connect__camera-frame[data-shape]{
  display:block; container-type:size; aspect-ratio:var(--pc-cam-aspect);
  width:min(100%, calc(min(56vh,480px) * var(--pc-cam-aspect))); margin-inline:auto;
}
.printer-connect__camera-frame[data-shape] .printer-connect__camera-img{
  position:absolute; left:50%; top:50%; width:100cqw; height:100cqh;
  transform:translate(-50%,-50%) rotate(var(--pc-cam-turn,0deg)); transition:transform .2s ease;
}
.printer-connect__camera-frame[data-shape="quarter"] .printer-connect__camera-img{ width:100cqh; height:100cqw; }
.printer-connect__rotate{
  position:absolute; right:8px; bottom:8px; z-index:1; display:grid; place-items:center; width:44px; height:44px; padding:11px;
  border:1px solid rgba(255,255,255,.3); border-radius:50%; background:rgba(12,12,14,.62); color:#fff; cursor:pointer;
}
.printer-connect__rotate:hover{ background:rgba(12,12,14,.82); }
.printer-connect__rotate:focus-visible{ outline:2px solid var(--pc-gold); outline-offset:2px; }
.printer-connect__rotate[aria-busy="true"]{ opacity:.7; }
@media (prefers-reduced-motion:reduce){ .printer-connect__camera-img{ transition:none; } }
:root[data-reduce-motion="true"] .printer-connect__camera-img{ transition:none; }
.printer-connect__camera-wait{ margin:0; color:var(--dim); font:500 12.5px/1.4 var(--font); }
.printer-connect__camera-note{ margin:0; color:var(--ui-warning,#a25b14); font:600 12px/1.4 var(--font); }
.printer-connect__camera-note:empty{ display:none; }
.printer-connect__camera > .printer-connect__button{ justify-self:start; }

/* ── online: recent prints ── */
.printer-connect__prints{ margin:0; padding:0; list-style:none; display:grid; gap:6px; }
.printer-connect__print{ display:grid; grid-template-columns:10px minmax(0,1fr); column-gap:10px; padding:8px 10px; border-radius:10px; background:var(--raised); }
.printer-connect__print::before{ content:""; grid-row:span 2; width:10px; height:10px; margin-top:4px; border-radius:50%; background:var(--dim); }
.printer-connect__print:is([data-state="printing"],[data-state="complete"])::before{ background:var(--pc-gold); }
.printer-connect__print:is([data-state="paused"],[data-state="error"])::before{ background:var(--ui-warning,#a25b14); }
.printer-connect__print-name{ min-width:0; color:var(--ink); font:650 13px/1.35 var(--font); overflow-wrap:anywhere; }
.printer-connect__print-meta{ min-width:0; color:var(--dim); font:500 12px/1.35 var(--font); }

/* ── disconnect confirmation ── */
.printer-connect__confirm-slot:empty{ display:none; }
.printer-connect__confirm{
  display:grid; gap:10px; padding:12px 14px; border:1px solid color-mix(in srgb,var(--danger,#c83742) 45%,var(--line)); border-radius:14px;
  background:color-mix(in srgb,var(--danger,#c83742) 7%,var(--surface));
}
.printer-connect__confirm p{ margin:0; color:var(--ink); font:600 13px/1.45 var(--font); overflow-wrap:anywhere; }
.printer-connect__confirm-actions{ display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }

/* ── status line and actions ── */
.printer-connect__status{ margin:0; padding:0 var(--pc-pad); color:var(--text); font:600 12.5px/1.45 var(--font); overflow-wrap:anywhere; }
.printer-connect__status:not(:empty){ padding-top:6px; }
.printer-connect__status[data-tone="ok"]{ color:var(--ui-positive,#15724f); }
.printer-connect__status[data-tone="error"]{ color:var(--danger,#c83742); }
/* While scanning, the lead line already says it; the status stays for screen readers only. */
.printer-connect[data-view="find"][data-mode="scanning"] .printer-connect__status{
  position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap;
}
.printer-connect__actions{
  position:sticky; bottom:0; z-index:1; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px;
  margin-top:auto; padding:12px var(--pc-pad) var(--pc-pad); background:var(--surface);
}
.printer-connect__actions:empty{ display:none; }
.printer-connect__actions > :is([data-variant="quiet"],[data-variant="danger"]){ margin-right:auto; }
.printer-connect__button{
  min-height:44px; padding:0 16px; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink);
  font:680 13px/1.2 var(--font); text-align:center; cursor:pointer; transition:background .12s,border-color .12s,filter .12s;
}
.printer-connect__button:hover{ background:var(--surface-hover,var(--raised)); }
.printer-connect__button:disabled{ cursor:default; opacity:.55; }
.printer-connect__button[data-variant="primary"]{ border-color:var(--pc-gold-edge); background:var(--pc-gold); color:var(--pc-on-gold); }
.printer-connect__button[data-variant="primary"]:hover{ background:var(--pc-gold); filter:brightness(1.06); }
.printer-connect__button[data-variant="quiet"]{ border-color:transparent; background:transparent; color:var(--dim); }
.printer-connect__button[data-variant="quiet"]:hover{ color:var(--ink); background:var(--slot,var(--raised)); }
.printer-connect__button[data-variant="danger"]{ border-color:color-mix(in srgb,var(--danger,#c83742) 40%,var(--line)); color:var(--danger,#c83742); }
.printer-connect__button[data-variant="danger-solid"]{ border-color:var(--danger,#c83742); background:var(--danger,#c83742); color:var(--surface,#fff); }
.printer-connect__button[data-variant="danger-solid"]:hover{ background:var(--danger,#c83742); filter:brightness(1.06); }

/* ── phones: a full-width sheet from the bottom edge ── */
@media (max-width:520px){
  .printer-connect{
    --pc-pad:16px;
    width:100%; max-width:100%; max-height:calc(100dvh - 12px); margin:auto 0 0;
    border-bottom:0; border-radius:var(--pc-radius) var(--pc-radius) 0 0;
  }
  .printer-connect[open]{ animation-name:printer-connect-sheet; }
  .printer-connect__shell{ max-height:calc(100dvh - 12px); }
  .printer-connect__head{ grid-template-columns:38px minmax(0,1fr) 44px; gap:10px; }
  .printer-connect__mark{ width:38px; height:33px; padding:3px 2px; }
  .printer-connect__title{ font-size:17px; }
  .printer-connect__steps{ padding:2px 4px 12px; }
  .printer-connect__steps li{ font-size:11px; }
  .printer-connect__actions{ padding-bottom:calc(var(--pc-pad) + env(safe-area-inset-bottom,0px)); }
  .printer-connect__actions > .printer-connect__button{ flex:1 1 auto; }
  .printer-connect__actions > :is([data-variant="quiet"],[data-variant="danger"]){ margin-right:0; }
  .printer-connect__manual-row{ flex-wrap:wrap; }
  .printer-connect__manual-row > .printer-connect__button{ flex:1 1 100%; }
}
@keyframes printer-connect-sheet{ from{ transform:translateY(40px); opacity:.4; } to{ transform:none; opacity:1; } }

/* ── reduced motion, from the system or the workspace setting ── */
@media (prefers-reduced-motion:reduce){
  .printer-connect[open],.printer-connect__pulse polygon,.printer-connect__spinner,.printer-connect__state-hex{ animation:none; }
  .printer-connect__switch-track,.printer-connect__switch-track::after,.printer-connect__progress-fill,.printer-connect__button,.printer-connect__candidate{ transition:none; }
}
:root[data-reduce-motion="true"] .printer-connect[open],
:root[data-reduce-motion="true"] .printer-connect__pulse polygon,
:root[data-reduce-motion="true"] .printer-connect__spinner,
:root[data-reduce-motion="true"] .printer-connect__state-hex{ animation:none; }
:root[data-reduce-motion="true"] .printer-connect__switch-track,
:root[data-reduce-motion="true"] .printer-connect__switch-track::after,
:root[data-reduce-motion="true"] .printer-connect__progress-fill,
:root[data-reduce-motion="true"] .printer-connect__button,
:root[data-reduce-motion="true"] .printer-connect__candidate{ transition:none; }
/* Without motion the honeycomb still reads as "searching": cells rest at stepped strengths. */
@media (prefers-reduced-motion:reduce){
  .printer-connect__pulse g:nth-child(even) polygon{ opacity:.55; }
  .printer-connect__pulse g:nth-child(odd):not(:first-child) polygon{ opacity:.3; }
}
:root[data-reduce-motion="true"] .printer-connect__pulse g:nth-child(even) polygon{ opacity:.55; }
:root[data-reduce-motion="true"] .printer-connect__pulse g:nth-child(odd):not(:first-child) polygon{ opacity:.3; }
