.scd-acc {
  display: flex; gap: 0;
  width: 240px; height: 140px; margin: 0 auto;
  border: 2px solid #1a1a1a; border-radius: 4px; overflow: hidden;
  cursor: pointer;
  background: #1a1a1a;
}
.scd-acc__c {
  flex: 1;
  background: var(--c);
  color: var(--t);
  display: flex; align-items: center; justify-content: center;
  font: 800 11px/1 ui-monospace, monospace;
  letter-spacing: 0.22em;
  writing-mode: vertical-rl; transform: rotate(180deg);
  transition: flex .45s cubic-bezier(.3,1,.3,1);
  border-right: 2px solid #1a1a1a;
  position: relative;
}
.scd-acc__c:last-child { border-right: none; }
.scd-acc__c::before {
  content: ''; position: absolute; inset: 4px;
  border: 1px dashed currentColor; opacity: 0.3;
  pointer-events: none;
}
.scd-acc__c:hover { flex: 5; writing-mode: horizontal-tb; transform: none; letter-spacing: 0.32em; }