/* One continuous hardware layer under real translucent controls. */
:root[data-skin="clearcase"] {
    --metal-accent: #62f5f2; --metal-muted: #87b7c0; --metal-shadow: #254a51;
    --metal-edge: #699ca8; --metal-highlight: #c5fcff; --metal-glow: #51ebed40;
    --metal-tint: #69f8ff0a; --metal-radius: 7px;
    --metal-room: url('/assets/skins/clearcase/hardware.webp'); --shell-frame: none;
    --shell-surface: linear-gradient(125deg, #92e8ff18, #02101485 45%, #041518a8);
    --panel: #06191e; --panel-raised: #10292f; --panel-soft: #0a2025;
}
:root[data-skin="clearcase"] .terminal-panel {
    background: linear-gradient(#00101628, #00101628), var(--metal-room) center / 100% 100% no-repeat, #020c10;
    border: 2px solid #aad9e6a0; border-radius: 24px; padding: 20px; box-shadow: inset 0 0 0 3px #8bdcf532, inset 0 0 20px #000;
}
:root[data-skin="clearcase"] :is(.brand-lockup, .resource-strip, .alarm-readout:not(.triggered), .view-button, .operations-sidebar .topology-section) {
    border: 1px solid #88c6d078; border-image: none; border-radius: 6px;
    background: var(--shell-surface); box-shadow: inset 0 1px #d1faff77, inset 0 -1px #8ee4ef2e, 0 2px 7px #0008;
}
:root[data-skin="clearcase"] .brand-lockup { grid-template-columns: 65px minmax(0, 1fr); column-gap: 12px; padding: 7px 12px; }
:root[data-skin="clearcase"] .skin-wordmark { width: 62px; height: 62px; font-size: 0; padding: 0; background: url('/assets/skins/clearcase/emblem.svg') center / contain no-repeat; }
:root[data-skin="clearcase"] .brand-lockup > strong { font-size: 11px; font-weight: 400; letter-spacing: .03em; }
:root[data-skin="clearcase"] .brand-subline { font-size: 8px; }
:root[data-skin="clearcase"] .resource-strip .skin-icon { color: #8eedf5; width: 28px; height: 28px; }
:root[data-skin="clearcase"] .resource-strip > div + div { border-left-color: #66cbd348; }
:root[data-skin="clearcase"] .header-community { padding: 4px; background: #04171caf; border-radius: 4px; }
:root[data-skin="clearcase"] .header-utilities { border: 1px solid #89d5df70; border-radius: 6px; padding: 6px; background: #0012188c; box-shadow: inset 0 1px #c9faff55; }
:root[data-skin="clearcase"] .view-rail { gap: 3px; background: none; }
:root[data-skin="clearcase"] .view-rail .view-button { min-height: 62px; color: #c6e6eb; background: linear-gradient(115deg, #70d9ef20, #001218b3); }
:root[data-skin="clearcase"] .view-rail .skin-icon { width: 27px; height: 27px; flex-basis: 27px; }
:root[data-skin="clearcase"] .view-rail .view-button.active, :root[data-skin="clearcase"] .header-utilities .view-button.active { color: #7ffff8; background: linear-gradient(120deg, #21e9e93b, #001316b8 65%); border-color: #8efffb; box-shadow: inset 0 0 12px #57f7ec44, 0 0 9px #5ffffa77; }
:root[data-skin="clearcase"] .application-body .primary-column { border: 2px solid #a4e6ed90; border-image: none; border-radius: 9px; background: linear-gradient(100deg, #001014bf, #00101496 55%, #00101466); box-shadow: inset 0 1px #d5ffff, inset 1px 0 #a8efff50, 0 0 0 3px #6ab8c124, 0 3px 12px #0007; }
:root[data-skin="clearcase"] .primary-column::after { background: linear-gradient(124deg, transparent 75%, #b7e7ff08 75.2%, transparent 80%); box-shadow: none; }
:root[data-skin="clearcase"] .skin-console-heading { background: #02202766; border-bottom-color: #78dfe65c; color: #a9f9ff; }
:root[data-skin="clearcase"] .skin-console-heading small::after { content: 'CLEARCASE  //  SYSTEM EXPOSED'; font-size: 8px; }
:root[data-skin="clearcase"] .terminal-output { background: none; color: #c1f1f7; text-shadow: 0 1px 2px #000, 0 0 4px #000; }
:root[data-skin="clearcase"] .command-line { background: #001519b3; border-top-color: #54d7dc8c; }
:root[data-skin="clearcase"] .operations-sidebar .topology-section { padding: 12px 8px; background: linear-gradient(110deg, #041b20a8, #00131980); }
:root[data-skin="clearcase"] .topology-layer { background: #0016199c; border-color: #49bbc394; border-radius: 3px; box-shadow: inset 0 1px #b3ffff22; }
:root[data-skin="clearcase"] .topology-layer-number { color: #69fff7; border-right-color: #49bbc359; }
:root[data-skin="clearcase"] .topology-layer.current { background: #3c3217e0; box-shadow: inset 3px 0 var(--amber); }
:root[data-skin="clearcase"] .skin-motto { min-height: 95px; padding: 14px 6px; font-size: .6rem; background: #03151b8a; border-color: #65bfc64a; }
:root[data-skin="clearcase"] .operations-sidebar .skin-network-art { display: block; min-height: 200px; flex: 1 0 200px; border: 0; background: none; box-shadow: none; }
:root[data-skin="clearcase"] .skin-network-art::after { content: 'AS//0\a STILL CURIOUS.\a STILL DANGEROUS.'; left: 22px; bottom: 25px; color: #b1dde0b8; text-shadow: 0 1px 2px #000; font-size: 11px; letter-spacing: .12em; }
:root[data-skin="clearcase"] :is(.palette-control select, .terminal-zoom button) { background: #00181bd9; color: #baffff; }
@media (max-width: 1279px) {
    :root[data-skin="clearcase"] .terminal-panel { padding: 12px; border-radius: 16px; }
    :root[data-skin="clearcase"] .brand-lockup { grid-template-columns: 42px minmax(0, 1fr); gap: 6px; padding: 5px; }
    :root[data-skin="clearcase"] .skin-wordmark { width: 40px; height: 40px; }
    :root[data-skin="clearcase"] .brand-lockup > strong { font-size: 8px; }
    :root[data-skin="clearcase"] .view-rail .view-button { min-height: 56px; }
    :root[data-skin="clearcase"] .skin-motto { font-size: .45rem; }
}
@media (max-width: 980px), (max-height: 760px) {
    :root[data-skin="clearcase"] .operations-sidebar .skin-network-art { display: none; }
}
@media (max-width: 640px) {
    :root[data-skin="clearcase"] .terminal-panel { padding: 5px; border-radius: 8px; background-size: auto, cover; }
    :root[data-skin="clearcase"] .view-rail .view-button { min-height: 50px; }
}