/* UX-04 shares the UX-02 semantic tokens and keyboard contract. */
.o360-header,.o360-panel,.o360-coverage{background:var(--im-surface);color:var(--im-text);border:1px solid var(--im-line);border-radius:var(--im-radius);padding:20px;margin-block:16px}.o360-context,.o360-toolbar,.o360-tabs{display:flex;gap:12px;flex-wrap:wrap}.o360-context{font-size:12px;color:var(--im-muted)}.o360-context span{overflow-wrap:anywhere}.o360-toolbar{margin-top:16px}.o360-header h1{font-size:28px}.o360-window{display:grid;grid-template-columns:2fr 2fr 1fr 1fr auto;gap:12px;align-items:end;margin-block:20px}.o360-window label,.o360-panel form label{display:grid;gap:6px;font-size:12px;color:var(--im-muted)}.o360-window input,.o360-window select,.o360-panel select{width:100%;min-width:0;background:var(--im-surface);color:var(--im-text);padding:10px;border:1px solid var(--im-line);border-radius:6px;box-sizing:border-box}.o360-toolbar button,.o360-tabs button,.o360-window button,.o360-panel button,.o360-object-list button,.o360-relations button{background:var(--im-surface);color:var(--im-text);border:1px solid var(--im-line);border-radius:6px;padding:10px 14px;font:inherit;cursor:pointer}.o360-tabs [aria-current="page"]{border:2px solid var(--im-focus);font-weight:700}.o360-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.o360-object-list,.o360-relations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-block:16px}.o360-object-list button,.o360-relations button{display:grid;text-align:left;gap:6px;overflow-wrap:anywhere}.o360-object-list small,.o360-relations small{font-size:12px;color:var(--im-muted);overflow-wrap:anywhere}.o360-relations article{display:grid;gap:10px;padding:12px;border:1px solid var(--im-line);border-radius:8px}.o360-action{padding:16px;border-bottom:1px solid var(--im-line)}.o360-action .im-state{margin-inline:12px}.o360-coverage li{margin-block:8px;overflow-wrap:anywhere}.o360-search-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-block:12px}.o360-search-results button{display:grid;text-align:left;gap:6px;padding:12px;background:var(--im-surface);color:var(--im-text);border:1px solid var(--im-line);border-radius:8px;overflow-wrap:anywhere}.o360-search-results small{color:var(--im-muted)}.o360-panel table td{overflow-wrap:anywhere}.o360-panel form{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.o360-panel form label{flex:1;min-width:200px}.o360-return{display:block;margin:12px;padding:12px;background:var(--im-surface);color:var(--im-text);border:1px solid var(--im-line)}
@media(max-width:1000px){.o360-window{grid-template-columns:1fr 1fr}.o360-window button{justify-self:start}.o360-search-results{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.o360-header,.o360-panel,.o360-coverage{padding:14px}.o360-header h1{font-size:23px}.o360-window,.o360-metrics,.o360-object-list,.o360-relations,.o360-search-results{grid-template-columns:1fr}.o360-tabs{gap:6px}.o360-tabs button{font-size:12px}.o360-context{display:grid}}

/* IM-UX-GA-02: facility-local history controls and explicit historian-state treatment. */
.o360-presets{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap;align-items:center}.o360-presets button{padding:7px 12px}.o360-history-state{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:12px 0;padding:10px 12px;border:1px solid var(--im-line);border-radius:8px;background:var(--im-surface)}.o360-history-state p{margin:0;min-width:240px;flex:1}.operator-history-presets{display:flex;gap:6px;align-items:end;flex-wrap:wrap}.operator-history-toolbar label{min-width:190px}.operator-state-grid small{color:var(--im-muted);max-width:46ch;text-align:right}.operator-history-toolbar input[type="datetime-local"]{min-width:205px}
@media(max-width:760px){.operator-history-toolbar label,.operator-history-toolbar input[type="datetime-local"]{min-width:100%;width:100%}.operator-state-grid small{text-align:left}}

/* IM-UX-GA-04: one persistent asset object page with hierarchy and synchronized operational context. */
.o360-workspace{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:16px;align-items:start}.o360-object-main{min-width:0}.o360-hierarchy{position:sticky;top:12px;max-height:calc(100vh - 32px);overflow:auto;background:var(--im-surface);color:var(--im-text);border:1px solid var(--im-line);border-radius:var(--im-radius);padding:14px}.o360-hierarchy header{padding:4px 6px 10px}.o360-hierarchy h2{font-size:16px;margin:0 0 6px}.o360-hierarchy p{font-size:12px;color:var(--im-muted);line-height:1.45;margin:0}.o360-hierarchy nav{display:grid;gap:3px}.o360-tree-row{display:grid!important;gap:2px;text-align:left!important;width:100%;padding:8px 10px 8px calc(10px + var(--o360-depth,0)*14px)!important;border:1px solid transparent!important;background:transparent!important}.o360-tree-row span{font-weight:600;overflow-wrap:anywhere}.o360-tree-row small{font-size:11px;color:var(--im-muted);overflow-wrap:anywhere}.o360-tree-row[aria-current="page"]{border-color:var(--im-focus)!important;background:color-mix(in srgb,var(--im-focus) 10%,transparent)!important}.o360-tree-measurement_point span{font-weight:500}.o360-hierarchy details{margin-top:10px;font-size:12px;color:var(--im-muted)}
.o360-timeline{margin-top:18px;border-top:1px solid var(--im-line);padding-top:14px}.o360-timeline header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;flex-wrap:wrap}.o360-timeline header p{max-width:72ch;margin:0;color:var(--im-muted)}.o360-timeline-track{height:44px;position:relative;margin:12px 4px 18px;border-top:1px solid var(--im-line);border-bottom:1px solid var(--im-line);background:linear-gradient(to right,transparent 24.8%,var(--im-line) 25%,transparent 25.2%,transparent 49.8%,var(--im-line) 50%,transparent 50.2%,transparent 74.8%,var(--im-line) 75%,transparent 75.2%)}.o360-timeline-marker{position:absolute!important;left:var(--o360-x);top:4px;transform:translateX(-50%);width:24px;height:34px;padding:0!important;border:0!important;background:transparent!important}.o360-timeline-marker span{display:block;width:10px;height:10px;margin:4px auto;border:2px solid currentColor;border-radius:50%;background:var(--im-surface)}.o360-timeline-marker:after{content:"";display:block;width:1px;height:17px;background:currentColor;margin:auto;opacity:.65}.o360-timeline-command{color:var(--im-focus)}.o360-timeline-alert{color:var(--im-warn)}.o360-timeline-maintenance{color:var(--im-muted)}
@media(max-width:1000px){.o360-workspace{grid-template-columns:1fr}.o360-hierarchy{position:static;max-height:320px}.o360-hierarchy nav{grid-template-columns:repeat(2,minmax(0,1fr))}.o360-tree-row{padding-left:10px!important}}
@media(max-width:600px){.o360-hierarchy nav{grid-template-columns:1fr}.o360-timeline header{display:block}.o360-timeline-track{margin-inline:0}}