/* Shared frame, navigation, forms and page layouts. */
.workspace-header { position:sticky; top:0; z-index:1000; height:76px; display:flex; align-items:center; gap:24px; padding:0 max(24px,calc((100vw - 1280px)/2)); background:var(--surface); border-bottom:1px solid var(--border); }
.workspace-name { display:flex; align-items:center; gap:10px; color:var(--text); font-size:15px; font-weight:700; white-space:nowrap; }
.workspace-name svg { width:26px; height:26px; color:var(--accent); }
.workspace-header svg { fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
body[data-page] .workspace-nav { display:flex; align-items:center; justify-content:center; gap:4px; height:auto; padding:0; margin:0 auto; position:static; border:0; box-shadow:none; background:none; }
body[data-page] .workspace-link { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 13px; border-radius:8px; color:var(--muted); text-decoration:none; font-size:14px; font-weight:550; white-space:nowrap; }
.workspace-link svg { width:20px; height:20px; flex-shrink:0; }
body[data-page] .workspace-link:hover { background:var(--surface2); color:var(--text); }
body[data-page] .workspace-link[aria-current="page"] { background:var(--accent-soft); color:var(--accent); }
.workspace-tools { display:flex; gap:8px; align-items:center; }
.user-label { max-width:110px; overflow:hidden; text-overflow:ellipsis; font-size:12px; color:var(--muted); }
.icon-button { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; padding:10px; border:1px solid var(--border); border-radius:8px; background:var(--surface); color:var(--text); }
.icon-button svg { width:20px; height:20px; }
body[data-page] .session-action { display:inline-flex; align-items:center; min-height:44px; padding:9px 13px; border-radius:8px; text-decoration:none; font-size:13px; }
.skip-link { position:fixed; left:16px; top:-100px; padding:12px 20px; z-index:2000; background:var(--surface); border:2px solid var(--accent); }
.skip-link:focus { top:12px; }
.workspace-intro, body[data-page] > main { width:min(1184px,calc(100% - 64px)); max-width:1184px; margin:0 auto; }
body[data-page] > main { padding:0 0 48px; }
.workspace-page-head { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:32px 0 22px; }
.page-eyebrow { margin-bottom:7px; color:var(--accent); font-size:11px; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.workspace-page-head h1 { font-size:30px; font-weight:700; line-height:1.2; letter-spacing:-.035em; margin:0 0 8px; }
.workspace-page-head p { color:var(--muted); font-size:14px; margin:0; max-width:70ch; }
body[data-page] .workspace-subnav { position:static; display:flex; justify-content:flex-start; gap:24px; height:auto; min-height:48px; padding:0; margin:0 0 24px; border:0; border-bottom:1px solid var(--border); background:none; box-shadow:none; overflow-x:auto; }
.workspace-subnav a { display:flex; align-items:center; min-height:48px; padding:10px 0; white-space:nowrap; text-decoration:none; color:var(--muted); font-size:14px; border-bottom:2px solid transparent; }
.workspace-subnav a[aria-current="page"] { color:var(--accent); border-bottom-color:var(--accent); font-weight:650; }
.cip-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:20px; align-items:start; }
.cip-panel { grid-column:span 6; }
.cip-panel.wide { grid-column:1/-1; }
.cip-panel h2 { margin:0 0 7px; font-size:17px; }
.cip-panel p { margin:0 0 12px; color:var(--muted); font-size:14px; }
.cip-panel .section-overline { color:var(--accent); font-size:11px; text-transform:uppercase; letter-spacing:.1em; font-weight:750; margin-bottom:8px; }
.cip-actions,.cip-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:16px; }
.cip-field { display:grid; gap:7px; margin-top:16px; font-weight:500; }
.cip-field input,.cip-field select { width:100%; }
.cip-check { display:flex; align-items:center; gap:10px; min-height:44px; margin-top:10px; cursor:pointer; }
.cip-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 18px; }
.cip-panel .cip-status { color:var(--muted); font-size:13px; margin:14px 0 0; min-height:20px; overflow-wrap:anywhere; }
.cip-status:empty { display:none; }
.cip-list { display:grid; gap:12px; margin-top:18px; }
.cip-item { padding:18px; border:1px solid var(--border); border-radius:10px; background:var(--surface2); min-width:0; }
.cip-item-head { display:flex; justify-content:space-between; align-items:start; gap:16px; }
.cip-item-title { font-size:15px; font-weight:650; overflow-wrap:anywhere; }
.cip-item-meta { font-size:13px; color:var(--muted); overflow-wrap:anywhere; }
.cip-chip { display:inline-flex; align-items:center; gap:5px; min-height:28px; padding:3px 9px; border-radius:5px; color:var(--muted); background:var(--surface2); font-size:12px; white-space:nowrap; }
.cip-chip.ok { color:var(--green); }
.cip-chip.warn { color:var(--yellow); }
.cip-chip.info { color:var(--blue); }
.cip-empty { padding:32px 20px; border:1px dashed var(--border); background:var(--surface2); border-radius:10px; color:var(--muted); text-align:center; font-size:14px; }
.cip-panel summary { min-height:44px; cursor:pointer; font-weight:650; font-size:16px; color:var(--text); list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.cip-panel summary::after { content:'+'; color:var(--muted); font-size:23px; font-weight:400; }
.cip-panel[open] > summary::after { content:'−'; }
.cip-panel[open] > summary { margin-bottom:18px; padding-bottom:16px; border-bottom:1px solid var(--border); }
.cip-panel summary::-webkit-details-marker { display:none; }
.summary-caption { display:block; margin-top:4px; font-size:13px; font-weight:400; color:var(--muted); }
.agent-suggestions { grid-column:span 8; }
.agent-notifications { grid-column:span 4; }
.assistant-note { border-top:1px solid var(--border); margin-top:20px !important; padding-top:16px; }
/* Settings: one local navigation, same names as the global model. */
body[data-page="settings"] .tabs { display:flex; align-items:stretch; flex-wrap:wrap; gap:6px; margin:0 0 24px; padding:0; border:0; background:none; }
body[data-page="settings"] .tab { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:10px 14px; font-size:13px; font-weight:550; color:var(--muted); background:var(--surface); border:1px solid var(--border); border-radius:8px; text-decoration:none; white-space:nowrap; }
body[data-page="settings"] .tab.active { color:var(--accent); background:var(--accent-soft); border-color:var(--accent); }
body[data-page="settings"] .tabs .cip-inline-icon { display:none; }
body[data-page="settings"] .card-title { flex-wrap:wrap; line-height:1.5; }
body[data-page="settings"] .tab-panel { min-width:0; }
body[data-page="settings"] .grid-2 { gap:20px; }
body[data-page="settings"] .scene-item { padding:16px; border-color:var(--border); background:var(--surface2); }
body[data-page="settings"] .cat-item { border-color:var(--border); }
/* Account: visible summaries, expandable forms, no wall of configuration. */
#management { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:16px; }
body[data-page="account"] .tool-card { margin:0; }
.tool-card > summary { display:flex; align-items:center; justify-content:space-between; gap:16px; list-style:none; min-height:44px; cursor:pointer; }
.tool-card > summary::after { content:'+'; color:var(--muted); font-size:24px; }
.tool-card[open] > summary::after { content:'−'; }
.tool-card > summary h2 { font-size:16px; margin:0; }
.tool-card > summary::-webkit-details-marker { display:none; }
.tool-card[open] > summary { padding-bottom:14px; margin-bottom:14px; border-bottom:1px solid var(--border); }
.tool-card p { margin:0 0 16px; color:var(--muted); font-size:13px; }
.tool-form { display:grid; gap:16px; margin:16px 0; }
.tool-form > label { display:grid; gap:6px; }
.tool-form input,.tool-form textarea,.tool-form select { width:100%; }
.tool-form textarea { min-height:150px; resize:vertical; }
.tool-form label.field-check { display:flex; align-items:center; min-height:44px; gap:10px; }
.tool-form .field-check input { width:20px; }
.tool-actions { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.tool-actions button, .tool-card button:not([type="submit"]) { padding:10px 14px; border:1px solid var(--border); border-radius:8px; background:var(--surface2); color:var(--text); font-size:14px; }
.tool-item { padding:14px; margin:10px 0; border:1px solid var(--border); border-radius:8px; background:var(--surface2); overflow-wrap:anywhere; }
.account-identity { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin:0 0 20px; }
#identity { color:var(--muted); font-size:14px; margin:0; }
#status { color:var(--muted); font-size:13px; margin:0 0 14px; }
/* Login */
body[data-page="login"] { display:grid; place-items:center; padding:28px 20px; }
body[data-page="login"] .login-card { width:min(100%,440px); max-width:440px; padding:38px; border:1px solid var(--border); border-radius:16px; background:var(--surface); }
.login-mark { display:inline-flex; padding:12px; margin-bottom:24px; border-radius:12px; background:var(--accent-soft); color:var(--accent); }
.login-mark svg { width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.8; }
body[data-page="login"] h1 { font-size:28px; letter-spacing:-.03em; margin:0 0 8px; }
body[data-page="login"] .subtitle { color:var(--muted); font-size:14px; margin:0 0 24px; }
body[data-page="login"] .btn { width:100%; margin-top:24px; }
body[data-page="login"] label { margin-top:18px; }
body[data-page="login"] .back { display:block; margin-top:22px; text-align:center; font-size:13px; text-decoration:none; color:var(--muted); }
.login-footer { margin-top:26px; padding-top:20px; border-top:1px solid var(--border); color:var(--muted); font-size:12px; text-align:center; }
body[data-page="report"] .report-header { text-align:left; padding:20px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); margin-bottom:24px; }
body[data-page="report"] .report-title { display:none; }
body[data-page="report"] .version-badge { color:var(--muted); background:var(--surface2); }
body[data-page="report"] .rpt-section { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:20px; overflow:auto; margin-bottom:20px; }
@media (max-width:1100px) { .workspace-header { gap:14px; padding:0 24px; } .workspace-name span { display:none; } .user-label { display:none; } }
@media (max-width:899px) {
 body[data-page]:not([data-page="login"]) { padding-bottom:calc(90px + env(safe-area-inset-bottom)); }
 .workspace-header { height:64px; position:sticky; justify-content:space-between; padding:0 20px; }
 .workspace-name span { display:inline; }
 body[data-page] .workspace-nav { position:fixed; inset:auto 0 0; z-index:1300; display:flex; justify-content:space-around; gap:0; padding:6px 8px calc(6px + env(safe-area-inset-bottom)); height:auto; min-height:72px; background:var(--surface); border-top:1px solid var(--border); border-radius:0; }
 body[data-page] .workspace-link { flex:1 1 0; min-width:0; min-height:56px; padding:7px 2px; flex-direction:column; gap:5px; border-radius:8px; font-size:11px; line-height:1.2; }
 .workspace-link svg { width:22px; height:22px; }
 .workspace-intro,body[data-page] > main { width:calc(100% - 40px); }
 .workspace-page-head { padding:24px 0 20px; align-items:start; }
 .workspace-page-head h1 { font-size:26px; }
 .workspace-page-head p { font-size:13px; }
 body[data-page] .workspace-subnav { gap:22px; margin-bottom:20px; }
 .agent-suggestions,.agent-notifications,.cip-panel { grid-column:1/-1; }
 .cip-grid { gap:16px; }
 body[data-page] .toast { bottom:calc(88px + env(safe-area-inset-bottom)); }
 body[data-page="settings"] .tabs { flex-wrap:nowrap; overflow-x:auto; padding:3px 3px 10px; }
 body[data-page="settings"] .tab { flex-shrink:0; }
 #management { grid-template-columns:1fr; }
}
@media (max-width:540px) {
 .workspace-header { padding:0 16px; gap:8px; }
 .workspace-name { font-size:14px; gap:7px; }
 .workspace-name svg { width:23px; }
 .workspace-tools { gap:6px; }
 .workspace-intro,body[data-page] > main { width:calc(100% - 32px); }
 .workspace-page-head { gap:12px; flex-wrap:wrap; }
 .workspace-page-head h1 { font-size:25px; }
 .workspace-page-head > button { align-self:flex-start; }
 body[data-page] :is(.card,.chart-card,.room-card,.storico-card,.cip-panel,.tool-card) { padding:18px; }
 .cip-form-grid { grid-template-columns:1fr; }
 .cip-item-head { flex-direction:column; }
 .cip-actions .cip-button { flex:1 1 140px; }
 body[data-page="login"] .login-card { padding:28px 24px; }
 .workspace-nav .workspace-link span { font-size:10px; }
}
@media print { .workspace-header,.workspace-subnav,.workspace-tools,.skip-link { display:none !important; } body[data-page] > main { width:100%; } }
/* Agent status and guided device setup. */
.agent-overview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:0 0 20px; }
.agent-overview > div { display:flex; flex-direction:column; gap:6px; padding:20px; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.agent-overview span { color:var(--muted); font-size:12px; }
.agent-overview strong { color:var(--text); font-size:18px; line-height:1.35; }
.agent-overview small { color:var(--muted); font-size:12px; }
.agent-permissions { margin-top:24px; border:1px solid var(--border); border-radius:10px; padding:8px 18px 18px; }
.agent-permissions legend { font-size:15px; font-weight:650; padding:0 8px; }
.device-picker { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-height:300px; overflow:auto; border:1px solid var(--border); border-radius:8px; margin-top:16px; padding:12px; background:var(--surface2); }
.device-picker .cip-check { margin:0; font-size:13px; }
body[data-page] .field-help { font-size:13px; color:var(--muted); margin:12px 0; }
.capability-list { padding-left:20px; font-size:14px; line-height:1.8; margin:12px 0; }
.status-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:22px 0; }
.status-facts dt { color:var(--muted); font-size:12px; margin-bottom:5px; }
.status-facts dd { color:var(--text); font-size:15px; font-weight:650; margin:0; overflow-wrap:anywhere; }
.connection-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; list-style:none; padding:0; margin:20px 0; counter-reset:step; }
.connection-steps li { counter-increment:step; padding-left:38px; position:relative; }
.connection-steps li::before { content:counter(step); position:absolute; left:0; top:0; display:grid; place-items:center; width:26px; height:26px; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:12px; font-weight:700; }
.connection-steps strong { display:block; font-size:14px; margin-bottom:6px; }
.connection-steps span { font-size:13px; color:var(--muted); }
.connection-help { margin-top:16px; border-top:1px solid var(--border); padding-top:8px; }
.connection-protocols { margin:16px 0 0; display:grid; gap:16px; }
.connection-protocols dt { font-size:13px; color:var(--text); font-weight:650; }
.connection-protocols dd { margin:4px 0 0; font-size:13px; color:var(--muted); overflow-wrap:anywhere; }
.hardware-details { margin-top:12px; }
.cip-panel .hardware-details summary { font-size:13px; font-weight:500; justify-content:start; }
.hardware-association { margin-top:16px; border-top:1px solid var(--border); padding-top:10px; }
.device-badges { display:flex; flex-wrap:wrap; gap:6px; }
@media(max-width:899px){.agent-overview { gap:10px; }.agent-overview > div { padding:16px; }.agent-overview strong { font-size:16px; }.connection-steps {grid-template-columns:1fr;}}
@media(max-width:540px){.agent-overview,.status-facts,.device-picker {grid-template-columns:1fr;}.agent-overview > div {padding:16px 18px;}.status-facts {gap:18px;}}
.scene-workspace { display:grid; grid-template-columns:1fr; gap:18px; }
.scenario-create > summary { min-height:44px; display:flex; align-items:center; cursor:pointer; font-size:16px; font-weight:650; list-style:none; }
.scenario-create > summary::before { content:'+'; font-size:22px; margin-right:12px; color:var(--accent); }
.scenario-create[open] > summary { padding-bottom:16px; margin-bottom:16px; border-bottom:1px solid var(--border); }
.scenario-create[open] > summary::before { content:'−'; }
body[data-page="settings"] .scene-actions .btn { background:var(--surface); color:var(--text); border:1px solid var(--border); }
body[data-page="settings"] .scene-actions .btn-red { color:var(--red); }
@media(min-width:1000px){body[data-page="settings"] .scene-item { display:flex; align-items:center; justify-content:space-between; gap:20px; }}
@media(max-width:360px){body[data-page] .workspace-nav {padding-left:0;padding-right:0;} body[data-page] .workspace-link {padding-left:0;padding-right:0;} .workspace-nav .workspace-link span {font-size:10px;letter-spacing:-.02em;}}
.connection-status-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0; }
.connection-status-grid > div {display:flex;align-items:flex-start;flex-direction:column;gap:10px;border:1px solid var(--border);border-radius:10px;padding:16px;background:var(--surface2);}
.connection-status-grid p {font-size:12px;margin:0;}
#connection-form fieldset {border:1px solid var(--border);border-radius:10px;padding:18px;margin:18px 0;min-width:0;}
#connection-form legend {font-weight:650;padding:0 8px;}
@media(max-width:540px){.connection-status-grid {grid-template-columns:1fr;}}

.hardware-data {white-space:pre-wrap;overflow-wrap:anywhere;max-height:300px;overflow:auto;background:var(--surface);padding:12px;border-radius:8px;font-size:12px}
.hardware-association textarea {width:100%;min-width:0;font-family:monospace}