/* Smart home uses the same tokens, buttons and panel rhythm as service management. */
.smart-home { display:grid; gap:20px; }
.smart-tabs { display:flex; gap:4px; width:fit-content; max-width:100%; overflow-x:auto; padding:4px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.smart-tabs a { margin:0; padding:7px 16px; font-size:12px; white-space:nowrap; border-radius:7px; }
.smart-tabs a[aria-current=page] { background:var(--primary-soft); color:var(--primary); font-weight:600; }
.smart-home button,.smart-home a,.smart-dialog button { font-family:var(--font); }
.smart-home .mono,.smart-dialog .mono { font-family:var(--mono); font-variant-numeric:tabular-nums; }
.smart-home p { color:var(--muted); line-height:1.75; }
.smart-home h2 { font-size:15px; letter-spacing:-.015em; }
.smart-home .primary,.smart-home .secondary,.smart-home .ghost-button { min-height:34px; font-size:12px; padding:7px 12px; border-radius:8px; }
.smart-hero { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:28px; background:radial-gradient(ellipse at 100% 0,var(--primary-soft),transparent 70%),var(--surface); }
.smart-hero h2 { font-size:clamp(22px,2.5vw,30px); line-height:1.45; letter-spacing:-.035em; margin:14px 0; }
.smart-hero p { font-size:13px; }
.smart-eyebrow { font-size:9px; letter-spacing:.13em; color:var(--subtle); white-space:nowrap; }
.smart-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.smart-stats .card { padding:20px; }
.smart-stats small { color:var(--muted); font-size:11px; }
.smart-stats strong { display:block; font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:26px; margin:12px 0; }
.smart-stats p { font-size:11px; }
.smart-empty { padding:36px 24px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:12px; }
.smart-empty p { max-width:460px; font-size:12px; }
.smart-empty a { margin-top:4px; }
.smart-emblem { display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:var(--primary-soft); color:var(--primary); flex-shrink:0; }
.smart-device-symbol { display:grid; place-items:center; width:34px; height:34px; border:1px solid var(--line); border-radius:9px; background:var(--surface-raised); color:var(--muted); flex-shrink:0; }
.smart-discovery { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px; }
.smart-discovery-copy { display:flex; align-items:flex-start; gap:14px; min-width:0; }
.smart-discovery-copy>.smart-device-symbol { width:42px; height:42px; color:var(--primary); background:var(--primary-soft); border-color:transparent; }
.smart-discovery p { font-size:12px; margin-top:5px; }
.smart-discovery>button { flex-shrink:0; }
.smart-inline-meta { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:12px; color:var(--subtle); font-size:10px; }
.smart-summary-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:16px 0; }
.smart-summary-strip>div { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 20px; border-right:1px solid var(--line); }
.smart-summary-strip>div:last-child { border:0; }
.smart-summary-strip span { font-size:11px; color:var(--muted); }
.smart-summary-strip strong { font-size:13px; font-weight:600; }
.smart-operation-status { padding:12px 16px; background:var(--primary-soft); border:1px solid var(--line); border-radius:9px; font-size:12px; color:var(--ink)!important; }
.smart-operation-status:empty { display:none; }
.smart-device-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:16px; }
.smart-device { padding:20px; min-width:0; }
.smart-device-title { display:flex; align-items:center; gap:12px; }
.smart-device-title h3 { font-size:14px; margin-bottom:4px; }
.smart-device-title small { color:var(--muted); font-size:11px; }
.smart-device>p { font-size:11px; margin-top:12px; overflow-wrap:anywhere; }
.smart-device dl { display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; font-size:11px; margin:18px 0; }
.smart-device dt { color:var(--muted); }
.smart-device dd { margin:0; text-align:right; overflow-wrap:anywhere; }
.smart-device-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
.smart-table-heading { align-items:center; padding:20px; }
.smart-table-heading h2 { display:flex; align-items:center; gap:8px; }
.smart-count { font-size:10px; color:var(--muted); background:var(--surface-raised); border:1px solid var(--line); border-radius:6px; padding:1px 6px; }
.smart-candidate-table { min-width:900px; }
.smart-candidate-table th { padding:11px 20px; font-family:var(--font); }
.smart-candidate-table td { padding:16px 20px; height:84px; vertical-align:middle; font-family:var(--font); }
.smart-candidate-table tbody tr { background:transparent; }
.smart-candidate-table tbody tr:hover { background:var(--surface-raised); }
.smart-candidate-table td small { display:block; font-family:var(--font); font-size:10px; color:var(--subtle); margin-top:5px; }
.smart-candidate-table td small.mono { font-family:var(--mono); }
.smart-candidate-identity { display:flex; align-items:center; gap:12px; }
.smart-candidate-identity strong { display:block; font-family:var(--font); font-size:12px; color:var(--ink); font-weight:600; }
.smart-address { font-size:12px; color:var(--ink); }
.smart-candidate-table time { font-size:10px; }
.smart-candidate-table .smart-action-cell { text-align:right; }
.smart-row-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.smart-candidate-table button { font-family:var(--font); font-size:11px; min-height:32px; padding:6px 10px; border-radius:7px; gap:6px; }
.smart-candidate-table button .ui-icon { width:14px; height:14px; }
.smart-candidate-table button.secondary { color:var(--ink); background:var(--surface-raised); }
.smart-candidate-table button.ghost-button { background:transparent; color:var(--muted); border-color:transparent; }
.smart-candidate-table button:hover { border-color:var(--line-strong); background:var(--primary-soft); }
.smart-table-note { display:flex; align-items:flex-start; gap:8px; border-top:1px solid var(--line); padding:14px 20px; color:var(--subtle); font-size:11px; line-height:1.7; }
.smart-table-note>.ui-icon { margin-top:2px; }
.smart-table-empty { display:flex; align-items:center; flex-direction:column; gap:10px; padding:28px 16px; color:var(--muted); text-align:center; white-space:normal; }
.smart-table-empty strong { color:var(--ink); font-size:13px; }
.smart-table-empty span { max-width:420px; }
.smart-events { overflow:hidden; }
.smart-event-list { padding:12px 20px 6px; }
.smart-event { display:flex; align-items:center; gap:12px; padding:13px 0; border-top:1px solid var(--line); font-size:11px; }
.smart-event-dot { width:5px; height:5px; flex-shrink:0; border-radius:50%; background:var(--subtle); }
.smart-event time { color:var(--subtle); margin-left:auto; white-space:nowrap; font-size:10px; }
.smart-setup { display:grid; grid-template-columns:minmax(220px,1fr) minmax(0,1.8fr); gap:32px; }
.smart-setup>.card { padding:24px; }
.smart-setup h2 { margin:12px 0; }
.smart-setup>section>p { font-size:12px; }
.smart-steps { padding-left:22px; display:grid; gap:24px; margin-top:28px; font-size:12px; }
.smart-steps span { display:block; color:var(--muted); margin-top:6px; font-size:11px; }
.smart-notice { padding:14px; background:var(--primary-soft); border:1px solid var(--line); border-radius:9px; margin-bottom:24px; }
.smart-notice b { font-size:12px; }
.smart-notice p { margin-top:6px; font-size:12px; }
.smart-setup form,.smart-bind-form { display:grid; gap:18px; }
.smart-setup label,.smart-dialog .smart-bind-form label { display:grid; gap:8px; font-size:12px; color:var(--muted); margin:0; }
.smart-setup input,.smart-setup select,.smart-setup textarea { width:100%; min-height:38px; padding:10px 12px; border:1px solid var(--line); border-radius:9px; background:var(--surface-soft); color:var(--ink); font:12px/1.6 var(--font); }
.smart-setup textarea { resize:vertical; }
.smart-help { font-size:11px; color:var(--muted); line-height:1.75; margin:0; }
.smart-save { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:18px; border-top:1px solid var(--line); }
.smart-save span { font-size:11px; color:var(--muted); }
.smart-dialog { width:min(480px,calc(100vw - 32px)); }
.smart-dialog .dialog-heading { margin-bottom:18px; }
.smart-dialog>.smart-help { padding:12px 14px; border:1px solid var(--line); border-radius:9px; background:var(--surface-raised); }
.smart-dialog .smart-bind-form { margin-top:22px; gap:18px; }
.smart-dialog .smart-bind-form input { margin-top:0; }
.smart-dialog .smart-check { display:flex!important; align-items:center; gap:8px; }
.smart-dialog .smart-check input { width:auto; accent-color:var(--primary); }
.smart-bind-form>button { width:100%; }
.smart-bind-form>p[role=status]:empty { display:none; }
.smart-home button.is-busy::after { content:""; width:12px; height:12px; flex-shrink:0; border:1.5px solid currentColor; border-right-color:transparent; border-radius:50%; animation:spin .7s linear infinite; }
@media(max-width:1000px) { .smart-summary-strip>div { padding:0 16px; } .smart-setup { grid-template-columns:1fr; gap:20px; } }
@media(max-width:767px) { .smart-home { gap:16px; } .smart-tabs { width:100%; } .smart-tabs a { flex:1; justify-content:center; padding:7px 12px; } .smart-stats { grid-template-columns:1fr; } .smart-hero { padding:20px; flex-direction:column; } .smart-discovery { flex-direction:column; align-items:stretch; } .smart-discovery>button { width:100%; } .smart-summary-strip { padding:14px 0; } .smart-summary-strip>div { padding:0 12px; flex-direction:column; align-items:flex-start; gap:5px; } .smart-table-heading .smart-eyebrow { display:none; } .smart-table-heading { padding:18px; } .smart-table-note { padding:12px 18px; } .smart-save { align-items:stretch; flex-direction:column; } .smart-event { flex-wrap:wrap; } .smart-event time { margin-left:17px; width:100%; } .smart-event-list { padding:12px 18px; } }
@media(prefers-reduced-motion:reduce) { .smart-home button.is-busy::after { animation:none; } }

.smart-dialog input[name=token] { font-family:var(--mono); font-variant-numeric:tabular-nums; }
.smart-row-actions button[data-smart-auto] { min-width:104px; }
.smart-row-actions button.is-busy>.ui-icon { display:none; }

.smart-home .smart-candidate-table td { font-family:var(--font); }
.smart-home .smart-candidate-table .status-pill { font-family:var(--font); }
.smart-device-title>.icon-button { margin-left:auto; flex-shrink:0; }
.smart-control-form { display:grid; gap:10px; border-top:1px solid var(--line); margin-top:16px; padding-top:16px; }
.smart-control-row { display:flex; align-items:end; gap:10px; }
.smart-control-row label { display:grid; gap:7px; flex:1; min-width:0; margin:0; font-size:12px; color:var(--muted); }
.smart-control-row input,.smart-control-row select { width:100%; min-height:36px; margin:0; padding:7px 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface-raised); color:var(--ink); }
.smart-control-row input { font-family:var(--mono); font-variant-numeric:tabular-nums; }
.smart-control-row button { flex-shrink:0; min-height:36px; }
.smart-ir-note { margin-top:10px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--surface-raised); }
.smart-discovery-actions { display:flex; gap:8px; flex-wrap:wrap; }
.smart-cloud-dialog { width:min(720px,calc(100vw - 32px)); }
.smart-cloud-intro { display:flex; gap:12px; align-items:center; margin-bottom:12px; }
.smart-cloud-intro p { font-size:13px; line-height:1.7; margin:0; }
#smart-cloud-form { display:flex; align-items:end; gap:12px; margin-top:20px; }
#smart-cloud-form[hidden] { display:none; }
#smart-cloud-form label { display:grid; gap:8px; flex:1; font-size:12px; color:var(--muted); }
#smart-cloud-form select { width:100%; margin:0; }
#smart-cloud-status { font-size:12px; line-height:1.7; color:var(--muted); margin:18px 0; }
.smart-cloud-qr { display:block; width:240px; height:240px; max-width:100%; object-fit:contain; margin:18px auto; padding:12px; background:#fff; border:1px solid var(--line); border-radius:12px; }
.smart-cloud-list { display:grid; max-height:340px; overflow:auto; border:1px solid var(--line); border-radius:10px; margin-bottom:16px; }
.smart-cloud-device { display:flex!important; align-items:center; gap:12px; padding:14px; border-bottom:1px solid var(--line); margin:0!important; }
.smart-cloud-device:last-child { border-bottom:0; }
.smart-cloud-device input { width:16px; height:16px; flex-shrink:0; margin:0; accent-color:var(--primary); }
.smart-cloud-device>span:first-of-type { display:grid; gap:6px; flex:1; min-width:0; }
.smart-cloud-device strong { font-size:13px; overflow-wrap:anywhere; }
.smart-cloud-device small { color:var(--muted); font-size:11px; overflow-wrap:anywhere; }
#smart-cloud-import { width:100%; margin-top:16px; }
@media(max-width:767px) { .smart-discovery-actions { width:100%; } .smart-discovery-actions button { flex:1; } .smart-cloud-device { flex-wrap:wrap; } .smart-cloud-device>.status-pill { margin-left:28px; } #smart-cloud-form { flex-direction:column; align-items:stretch; } }

/* Device pages use CSS geometry; there is no 3D renderer or model download. */
.smart-device-link { color:var(--ink); text-decoration:none; border-radius:8px; }
.smart-device-link>div { flex:1; min-width:0; }
.smart-device-link h3 { overflow-wrap:anywhere; }
.smart-device-link>.ui-icon { color:var(--subtle); flex-shrink:0; }
.smart-device-link:hover h3 { color:var(--primary); }
.smart-device-summary-status { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:18px; }
.smart-device-summary-status time { font-size:10px; color:var(--subtle); margin-left:auto; }
.smart-device-summary .smart-device-actions { justify-content:space-between; align-items:center; }
.smart-device-summary .smart-device-actions>a { display:inline-flex; align-items:center; gap:8px; text-decoration:none; }
.smart-device-detail { display:grid; gap:20px; }
.smart-detail-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.smart-back-link { display:inline-flex; align-items:center; gap:7px; color:var(--muted); font-size:11px; text-decoration:none; margin-bottom:16px; }
.smart-back-link .ui-icon { width:14px; height:14px; }
.smart-back-link:hover { color:var(--ink); }
.smart-detail-title { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.smart-home .smart-detail-title h2 { font-size:clamp(22px,2.5vw,30px); letter-spacing:-.04em; line-height:1.3; overflow-wrap:anywhere; }
.smart-detail-heading>div { min-width:0; }
.smart-detail-heading>button { flex-shrink:0; }
.smart-detail-heading p { display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:12px; margin-top:10px; }
.smart-detail-divider { height:10px; width:1px; background:var(--line-strong); }
.smart-detail-layout { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:20px; align-items:start; }
.smart-device-showcase { overflow:hidden; min-width:0; }
.smart-showcase-top { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:22px 24px 0; }
.smart-showcase-label { font-size:10px; color:var(--subtle); }
.smart-device-stage { position:relative; display:grid; grid-template-columns:minmax(0,1fr); min-height:500px; isolation:isolate; background:radial-gradient(ellipse at 35% 44%,rgba(114,153,154,.13),transparent 68%); }
.smart-device-stage.has-controls { grid-template-columns:minmax(0,1fr) 210px; }
.smart-model-viewport { position:relative; min-width:0; min-height:500px; overflow:hidden; }
.smart-model-canvas { position:absolute; inset:0; }
.smart-model-canvas canvas { display:block; width:100%; height:100%; touch-action:pan-y; cursor:grab; }
.smart-device-stage.is-dragging canvas { cursor:grabbing; }
.smart-model-caption { position:absolute; left:20px; bottom:14px; font:9px/1.5 var(--mono); letter-spacing:.1em; color:var(--subtle); pointer-events:none; }
.smart-model-loading { position:absolute; top:10px; left:18px; right:18px; text-align:center; font-size:11px; color:var(--muted); pointer-events:none; }
.smart-model-loading[hidden] { display:none; }
.smart-model-rail { max-height:600px; overflow-y:auto; overscroll-behavior:contain; padding:20px 14px; border-left:1px solid var(--line); background:var(--surface-soft); min-width:0; }
.smart-rail-heading h3 { font-size:14px; margin:8px 0; }
.smart-rail-heading p { font-size:10px; line-height:1.6; color:var(--muted); }
.smart-home .smart-model-controls { display:grid; gap:0; margin:10px 0 0; padding:0; border:0; }
.smart-model-property { border-bottom:1px solid var(--line); min-width:0; }
.smart-model-property>summary { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:48px; padding:12px 0; color:var(--ink); font-size:11px; cursor:pointer; list-style:none; }
.smart-model-property>summary small { color:var(--muted); font-size:10px; text-align:right; overflow-wrap:anywhere; }
.smart-model-property>summary::-webkit-details-marker { display:none; }
.smart-model-property>summary:hover,.smart-model-property[open]>summary { color:var(--primary); }
.smart-model-property>summary:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }
.smart-home .smart-model-power { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:40px; margin-top:18px; padding:8px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface); color:var(--muted); font-size:11px; cursor:pointer; }
.smart-home .smart-model-power.is-powered { color:var(--green); border-color:rgba(16,185,129,.4); }
.smart-model-controls .smart-model-property>.smart-control-row { padding:4px 0 12px; margin:0; border:0; display:grid; grid-template-columns:minmax(0,1fr); gap:10px; align-items:end; }
.smart-model-property:not([open])>.smart-control-row { display:none; }
.smart-model-property .smart-control-row label { grid-column:1; grid-row:auto; }
.smart-model-property .smart-control-row>[data-smart-property] { grid-column:1; grid-row:auto; width:100%; }
.smart-model-property .smart-range-labels { margin:0; }
.smart-model-property .smart-range-control { gap:6px; }
.smart-home .smart-model-close { grid-column:1/-1; justify-self:end; padding:3px 0; border:0; background:transparent; color:var(--muted); font-size:10px; cursor:pointer; }
.smart-model-guide { color:var(--muted); font-size:12px; line-height:1.9; margin-top:18px; }
.model-fallback .smart-model-viewport { background:repeating-linear-gradient(45deg,transparent,transparent 20px,rgba(128,128,128,.025) 20px,rgba(128,128,128,.025) 21px); }
.model-fallback .smart-model-canvas { visibility:hidden; }
.smart-stage-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 24px; padding:12px 0 18px; border-bottom:1px solid var(--line); font-size:10px; color:var(--subtle); }
.smart-stage-toolbar>div { display:flex; align-items:center; gap:5px; }
.smart-stage-toolbar .icon-button { width:29px; height:29px; min-height:29px; padding:5px; color:var(--muted); border:1px solid var(--line); border-radius:7px; }
.smart-home .smart-view-reset { padding:5px 8px; background:transparent; color:var(--muted); border:0; font-size:10px; cursor:pointer; }
.smart-device-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; padding:24px; }
.smart-device-metrics>div { min-width:0; border-right:1px solid var(--line); }
.smart-device-metrics>div:last-child { border:0; }
.smart-device-metrics span { display:block; font-size:11px; color:var(--muted); margin-bottom:10px; }
.smart-device-metrics strong { font-size:20px; letter-spacing:-.03em; font-weight:550; overflow-wrap:anywhere; }
.smart-device-metrics strong.mono { font-size:28px; }
.smart-device-metrics small { font-size:12px; margin-left:4px; color:var(--muted); }
.smart-feedback-note { display:flex; gap:8px; align-items:flex-start; font-size:10px; line-height:1.8; color:var(--subtle); border-top:1px solid var(--line); padding:14px 24px; background:var(--surface-soft); }
.smart-feedback-note>.ui-icon { width:14px; height:14px; margin-top:2px; flex-shrink:0; }
.smart-detail-sidebar { display:grid; gap:16px; min-width:0; }
.smart-device-control-panel,.smart-device-info { padding:22px; }
.smart-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.smart-panel-heading h3 { font-size:14px; font-weight:550; margin-top:6px; }
.smart-panel-heading>.ui-icon { color:var(--subtle); }
.smart-power-panel { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:24px 0 18px; padding:20px; border:1px solid var(--line); background:var(--surface-raised); border-radius:12px; }
.smart-power-panel>div { display:grid; gap:8px; }
.smart-power-panel span { font-size:11px; color:var(--muted); }
.smart-power-panel strong { font-size:22px; font-weight:550; letter-spacing:-.035em; }
.smart-power-panel small { font-size:10px; color:var(--subtle); }
.smart-home .smart-power-button,.smart-power-readonly { display:grid; place-items:center; width:58px; height:58px; flex-shrink:0; padding:0; border-radius:50%; border:1px solid var(--line-strong); background:var(--surface); color:var(--muted); cursor:pointer; }
.smart-home .smart-power-button.is-powered { color:var(--green); border-color:rgba(16,185,129,.3); background:var(--green-soft); }
.smart-home .smart-power-button:hover { border-color:var(--primary); color:var(--primary); }
.smart-power-button.is-busy>.ui-icon { display:none; }
.smart-home .smart-power-button.is-busy::after { width:20px; height:20px; }
.smart-power-readonly { cursor:default; opacity:.6; }
.smart-controls-detail { border:0; margin:0; padding:0; gap:18px; }
.smart-controls-detail .smart-control-row { gap:12px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.smart-controls-detail .smart-control-row label { font-size:11px; gap:10px; }
.smart-controls-detail .smart-control-row input[type=number] { font-size:24px; font-weight:500; padding:8px 12px; min-height:48px; letter-spacing:-.04em; }
.smart-controls-detail .smart-control-numeric { display:grid; grid-template-columns:minmax(0,1fr) auto; }
.smart-control-numeric>label { grid-column:1; grid-row:1; }
.smart-control-numeric>[data-smart-property] { grid-column:2; grid-row:1; align-self:end; }
.smart-range-control { grid-column:1/-1; display:flex; align-items:center; gap:10px; margin-top:2px; }
.smart-range-control input[type=range] { min-width:0; flex:1; width:auto; min-height:28px; padding:0; border:0; accent-color:var(--green); background:transparent; cursor:pointer; }
.smart-range-control .icon-button { width:30px; min-width:30px; height:30px; min-height:30px; padding:5px; border:1px solid var(--line); border-radius:8px; }
.smart-range-labels { grid-column:1/-1; display:flex; justify-content:space-between; margin:-5px 40px 0; font:10px/1.5 var(--mono); color:var(--subtle); font-variant-numeric:tabular-nums; }
.smart-refresh-device { width:100%; margin-top:18px; }
.smart-device-control-panel .smart-ir-note { font-size:11px; padding:12px; margin-top:18px; }
.smart-device-control-panel .smart-ir-note b { color:var(--ink); font-weight:500; }
.smart-device-control-panel .smart-ir-note p { font-size:10px; margin:5px 0 0; }
.smart-readonly-note { font-size:11px; }
.smart-device-info dl { display:grid; margin:18px 0 0; font-size:11px; }
.smart-device-info dl>div { display:grid; grid-template-columns:80px minmax(0,1fr); gap:12px; padding:11px 0; border-bottom:1px solid var(--line); }
.smart-device-info dl>div:last-child { border:0; }
.smart-device-info dt { color:var(--muted); }
.smart-device-info dd { margin:0; text-align:right; overflow-wrap:anywhere; }
.smart-home .smart-remove-device { margin-top:16px; padding-left:0; font-size:11px; }
.smart-device-detail a:focus-visible,.smart-device-detail button:focus-visible,.smart-device-link:focus-visible { outline:2px solid var(--primary); outline-offset:4px; }
html[data-theme=light] .smart-device-stage { background:radial-gradient(ellipse at 50% 38%,rgba(166,200,188,.16),transparent 64%); }

@media(min-width:1400px) { .smart-model-viewport { min-height:540px; } }
@media(max-width:1080px) { .smart-detail-layout { grid-template-columns:minmax(0,1fr); } .smart-detail-sidebar { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); align-items:start; } }
@media(max-width:767px) { .smart-detail-heading { align-items:flex-start; gap:12px; } .smart-detail-heading>button { font-size:10px; padding:7px 9px; } .smart-detail-heading>button .ui-icon { display:none; } .smart-detail-title { gap:8px; } .smart-home .smart-detail-title h2 { font-size:23px; } .smart-detail-sidebar { grid-template-columns:minmax(0,1fr); } .smart-detail-layout { gap:16px; } .smart-device-stage.has-controls { grid-template-columns:minmax(0,1fr); } .smart-model-viewport { min-height:360px; } .smart-model-rail { border-left:0; border-top:1px solid var(--line); padding:18px; } .smart-showcase-top { padding:18px 18px 0; } .smart-stage-toolbar { margin:0 18px; } .smart-device-metrics { padding:20px 18px; gap:12px; } .smart-device-metrics strong { font-size:16px; } .smart-device-metrics strong.mono { font-size:24px; } .smart-device-metrics span { font-size:10px; } .smart-feedback-note { padding:12px 18px; } .smart-device-control-panel,.smart-device-info { padding:18px; } }
@media(prefers-reduced-motion:reduce) { .smart-device-object { transition:none; } .smart-airflow i { animation:none!important; } }

.smart-direction-controls { margin-top:18px; border-top:1px solid var(--line); padding-top:16px; }
.smart-direction-controls>span { font-size:11px; color:var(--muted); }
.smart-direction-controls>div { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:10px 0; }
.smart-direction-controls button { font-size:11px; padding:7px; }
.smart-capabilities { border-top:1px solid var(--line); padding-top:18px; margin-top:20px; font-size:11px; }
.smart-capabilities>p { margin-top:8px; color:var(--muted); line-height:1.8; }
.smart-capabilities>p>strong { color:var(--ink); font-size:18px; }
.smart-capabilities dl { margin:14px 0; }
.smart-capabilities dl>div { display:flex; justify-content:space-between; gap:10px; padding:10px 0; }
.smart-capabilities dd { margin:0; }
.smart-capabilities dt,.smart-capabilities small { color:var(--muted); }
.smart-capabilities summary { cursor:pointer; color:var(--muted); padding:10px 0; }
.smart-capabilities details p { line-height:1.8; }
@media(max-width:767px) { .smart-model-rail { max-height:none; } }
