/* Bürokratopia – Ordnerregal (0.16.0). Präfix s-ordnerregal-, Variablen aus app.css.
   Bis zu 7 Fächer auf 340 px: Fach ≥ 44 px breit, Ordner 34 px hoch, Farbe über --farbe (im JS gesetzt). */
.s-ordnerregal-regal { display: grid; grid-template-columns: repeat(var(--n, 6), minmax(0, 1fr)); gap: 5px; margin-top: 6px; padding: 8px 6px 10px; background: var(--flaeche2); border: 1px solid var(--linie); border-radius: var(--radius-k); touch-action: manipulation; }
.s-ordnerregal-fach { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-width: 0; min-height: calc(var(--kap, 4) * 38px + 30px); padding: 6px 3px 14px; border: 2px solid var(--linie2); border-bottom-width: 6px; border-radius: 8px 8px 5px 5px; background: var(--flaeche); cursor: pointer; font: inherit; color: var(--text); -webkit-tap-highlight-color: transparent; transition: border-color var(--dauer), background var(--dauer), box-shadow var(--dauer); }
.s-ordnerregal-fach:hover { border-color: var(--leise); }
.s-ordnerregal-fach.gewaehlt { border-color: var(--akzent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--akzent) 25%, transparent); }
.s-ordnerregal-fach.ziel { background: var(--akzent-hell); border-color: var(--akzent); border-style: dashed; }
.s-ordnerregal-fach.fertig { border-color: var(--gruen); background: var(--gruen-hell); }
.s-ordnerregal-stapel { display: flex; flex-direction: column-reverse; gap: 3px; }
.s-ordnerregal-ordner { display: grid; place-items: center; height: 35px; border-radius: 4px; background: var(--farbe, #6b7280); box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .25); transition: transform .18s var(--kurve); }
.s-ordnerregal-ordner span { display: inline-block; min-width: 18px; padding: 0 4px; border-radius: 3px; background: rgba(255, 255, 255, .92); color: #111827; font: 800 .78rem/1.35 var(--schrift); text-align: center; letter-spacing: .02em; }
.s-ordnerregal-fach.gewaehlt .s-ordnerregal-ordner:last-child { transform: translateY(-9px); }
.s-ordnerregal-nr { position: absolute; left: 0; right: 0; bottom: -1px; font-size: .66rem; font-weight: 700; color: var(--leise); text-align: center; line-height: 1.1; }
.s-ordnerregal-hinweis { padding: 6px 10px; border-left: 3px solid var(--gold); background: var(--gold-hell); color: var(--gold-text); border-radius: 0 var(--radius-k) var(--radius-k) 0; }
.s-ordnerregal-legende { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 8px 0 0; }
.s-ordnerregal-farbe { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.s-ordnerregal-farbe i { width: 12px; height: 12px; border-radius: 3px; background: var(--farbe, #6b7280); box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .22); }
.s-ordnerregal-wackelt { animation: s-ordnerregal-wackeln .3s ease-in-out; }
@keyframes s-ordnerregal-wackeln { 0%, 100% { translate: 0 0; } 25% { translate: -4px 0; } 75% { translate: 4px 0; } }
@media (prefers-reduced-motion: reduce) { .s-ordnerregal-ordner, .s-ordnerregal-fach { transition: none; } .s-ordnerregal-wackelt { animation: none; } }