/* OFFSHORE_STORAGE: internal enclosure only; shared frame and motion material are inherited. */
.storage-enclosure{display:flex;flex-direction:column;gap:var(--action-compact-padding);flex:1;min-height:0;padding:var(--space-facts)}
.storage-enclosure-head{display:flex;flex-direction:column;align-items:stretch;gap:var(--action-compact-padding)}
.storage-media{display:flex;gap:calc(var(--action-compact-padding)/2);opacity:1;transition:opacity var(--motion-structure) var(--motion-ease)}
.storage-media .chip{flex:1;display:flex;flex-direction:column;gap:calc(var(--action-compact-padding)/2)}.storage-media small{font-size:inherit;line-height:1.3;color:var(--color-text-secondary);font-weight:400}.storage-media[data-active=true]{opacity:1}.storage-media[data-active=true] .chip{color:var(--color-text-accent);border-color:var(--color-primary)}
.storage-bays{border:1px solid transparent;transition:border-color var(--motion-structure) var(--motion-ease);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--action-compact-padding);flex:1;min-height:0}
.storage-bay{display:flex;align-items:stretch;min-height:0;border:1px solid var(--technical-frame-border);border-radius:var(--radius-data);overflow:hidden;background:var(--technical-bg-base)}
.storage-drive{width:100%;display:flex;flex-direction:column;justify-content:space-between;padding:var(--action-compact-padding);border-top:1px solid var(--technical-frame-border);background:var(--technical-bg-panel);opacity:0;transform:translateY(var(--action-compact-padding));transition:opacity var(--motion-structure) var(--motion-ease),transform var(--motion-structure) var(--motion-ease);transition-delay:calc(var(--module)*var(--motion-structure)/4)}
.storage-drive:before{content:'';display:block;height:2px;background:var(--color-primary)}.storage-drive:after{content:'';display:block;height:var(--action-compact-padding);border:1px solid var(--technical-frame-border);border-radius:var(--radius-data)}
.storage-drive[data-active=true]{opacity:1;transform:none}.storage-enclosure:has(.storage-pool[data-active=true]) .storage-bays{border-color:var(--technical-active-line)}
.storage-pool{display:flex;justify-content:space-between;align-items:baseline;gap:var(--action-compact-padding);border-top:1px solid var(--technical-frame-border);padding-top:var(--action-compact-padding);opacity:1}.storage-pool[data-active=true]{opacity:1}
.storage-network{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--action-compact-padding)}.storage-network>div{display:flex;flex-direction:column;min-width:0}.storage-network .node{flex:1;display:flex;justify-content:center;align-items:center;gap:calc(var(--action-compact-padding)/2);padding:calc(var(--action-compact-padding)/2);text-align:center;min-width:0}.storage-network strong{display:block}.storage-network .connector{height:var(--action-compact-padding);flex-basis:var(--action-compact-padding)}
.storage-pool [data-storage-ready]{display:none}.frame[data-phase='5'] .storage-pool [data-storage-ready]{display:inline}.frame[data-phase='5'] .storage-pool [data-storage-building]{display:none}
@media(max-width:900px){.storage-enclosure{padding:var(--action-compact-padding)}.storage-enclosure-head{flex-wrap:wrap}.storage-bays{gap:calc(var(--action-compact-padding)/2)}.storage-drive{padding:calc(var(--action-compact-padding)/2)}}
/* Storage-only canvas allocation: use the existing compact spacing role. */
.story:has(>.storage-enclosure){gap:var(--action-compact-padding)}
.storage-network .connector{height:calc(var(--action-compact-padding)/2);flex-basis:calc(var(--action-compact-padding)/2)}
