/* Alpha-Skin fuer Tinkertale Mission Control (Lex 21.10.2026): nur die OPTIK von Status und Feedback (Gunmetal, Bahnschrift, gruener Glow, Scanlinien, Stahl-Tasten).
   Keine Layout-Aenderung, kein Popup-Verhalten: Mission Control bleibt eine normale Webseite. Einbinden NACH style.css:
   <link rel="stylesheet" href="http://127.0.0.1:8470/f/demo/mc-alpha-skin.css">   (oder Kopie neben style.css) */
:root{--ak:120,240,93;--ak2:201,79,176;--kopf:'Bahnschrift','Bahnschrift SemiCondensed','Segoe UI',system-ui,sans-serif;--mono:'Cascadia Mono',Consolas,monospace;
 --stahl:linear-gradient(180deg,#3b4652 0%,#222a33 48%,#171d24 52%,#202830 100%);--stahl-hover:linear-gradient(180deg,#4a5663 0%,#2a343e 48%,#1c232b 52%,#27313b 100%);
 --kartebg:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.015) 40%,rgba(0,0,0,.2));--font:15px/1.55 'Bahnschrift','Segoe UI',system-ui,sans-serif}
html{scrollbar-width:thin;scrollbar-color:rgba(var(--ak),.45) var(--bg-tief)}
body{font-family:var(--kopf);background:radial-gradient(1200px 500px at 8% -5%,rgba(var(--ak),.07),transparent 60%),radial-gradient(900px 500px at 100% 0%,rgba(var(--ak2),.05),transparent 60%),#050912;background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:repeating-linear-gradient(0deg,rgba(var(--ak),.028) 0 1px,transparent 1px 4px);mix-blend-mode:screen}
main,nav#mainnav{position:relative;z-index:1}nav#mainnav{position:fixed}
::-webkit-scrollbar-thumb{background:rgba(var(--ak),.35);border-radius:6px}::-webkit-scrollbar-track{background:var(--bg-tief)}
/* Ueberschriften wie am Geraet */
h1,h2,.eyebrow,.wordmark{font-family:var(--kopf);letter-spacing:.14em;text-transform:uppercase}
h1{text-shadow:0 0 14px rgba(var(--ak),.45),0 1px 0 rgba(0,0,0,.8)}h1 span{color:rgb(var(--ak))}
h2{letter-spacing:.2em;font-weight:700;color:var(--heading);text-shadow:0 0 12px rgba(var(--ak),.55),0 1px 0 rgba(0,0,0,.8)}
h3{font-family:var(--kopf);letter-spacing:.03em}
.eyebrow{font-family:var(--mono);letter-spacing:.3em;color:rgb(var(--ak));text-shadow:0 0 10px rgba(var(--ak),.6);font-size:.7rem}
.wordmark{text-shadow:0 0 14px rgba(var(--ak),.4)}
/* Navigation als Metallgehaeuse */
nav#mainnav{background:linear-gradient(145deg,var(--line-hell) 0%,var(--line-3) 22%,#171d24 48%,var(--line-3) 74%,#10151a 100%);border-right:1px solid #05080b;box-shadow:6px 0 24px rgba(0,0,0,.6),0 0 22px rgba(var(--ak),.18),inset -1px 0 0 rgba(255,255,255,.18),inset 0 1.5px 0 rgba(255,255,255,.3)}
nav#mainnav::after{content:"";position:absolute;inset:8px 6px 8px 8px;border-radius:9px;pointer-events:none;z-index:-1;background:linear-gradient(180deg,rgba(11,18,32,.985),rgba(6,10,18,.985)),repeating-linear-gradient(0deg,rgba(var(--ak),.045) 0 1px,transparent 1px 4px);border:1px solid rgba(var(--ak),.4);box-shadow:inset 0 3px 14px rgba(0,0,0,.85),inset 0 0 40px rgba(var(--ak),.07)}
.brand{text-shadow:0 0 12px rgba(var(--ak),.5)}
.nav{font-family:var(--kopf);letter-spacing:.1em;text-transform:uppercase;font-weight:700;font-size:.78rem}
.nav:hover{background:rgba(var(--ak),.08)}
.nav.active{color:rgb(var(--ak));background:linear-gradient(90deg,rgba(var(--ak),.16),rgba(var(--ak),.02));border-left:2px solid rgb(var(--ak));text-shadow:0 0 10px rgba(var(--ak),.6)}
/* Karten und Kacheln */
.panel,.task,.decision,.feedback-card,.metric,details,.card,article{background:var(--kartebg),var(--panel);border:1px solid rgba(var(--ak),.26);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 2px 5px rgba(0,0,0,.45)}
.panel,.task,.decision,.feedback-card{border-radius:8px}
.task:hover,.panel:hover{border-color:rgba(var(--ak),.75);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 16px rgba(var(--ak),.3)}
.metric .value{font-family:var(--kopf);text-shadow:0 0 14px rgba(var(--ak),.4)}
.chip,.badge{font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;font-size:.66rem}
/* Stahl-Tasten */
button,a.button{font-family:var(--kopf);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.78rem;color:var(--muted);border:1px solid #05080b;border-radius:7px;background:var(--stahl);box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 -2px 3px rgba(0,0,0,.6),0 2px 4px rgba(0,0,0,.55);text-shadow:0 -1px 0 rgba(0,0,0,.8)}
button:hover,a.button:hover{background:var(--stahl-hover);color:#fff;border-color:#05080b;box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 3px rgba(0,0,0,.6),0 2px 4px rgba(0,0,0,.55),0 0 12px rgba(var(--ak),.35)}
.primary,button.primary{color:#04120a;text-shadow:0 1px 0 rgba(255,255,255,.35);border-color:var(--ok-bg);background:linear-gradient(180deg,color-mix(in srgb,rgb(var(--ak)) 55%,#fff) 0%,rgb(var(--ak)) 46%,color-mix(in srgb,rgb(var(--ak)) 70%,#000) 54%,color-mix(in srgb,rgb(var(--ak)) 85%,#000) 100%)}
.primary:hover{color:#000;box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 0 18px rgba(var(--ak),.7)}
.nav,.nav:hover{background:none;box-shadow:none;border:0;text-shadow:none}.nav.active{border-left:2px solid rgb(var(--ak))}
/* Eingaben */
input,select,textarea{font-family:var(--kopf);background:rgba(0,0,0,.4);border:1px solid rgba(var(--ak),.3);box-shadow:inset 0 2px 6px rgba(0,0,0,.6)}
input:focus,textarea:focus,select:focus{outline:none;border-color:rgb(var(--ak));box-shadow:0 0 12px rgba(var(--ak),.3),inset 0 2px 6px rgba(0,0,0,.6)}
@media (prefers-reduced-motion:reduce){body::before{display:none}}
@media print{body::before{display:none}}
/* Nachbesserung 21.10.2026 (Wunsch Master-Plan-Chat): kleine Knoepfe (Update-Leiste) nie umbrechen, Sprungleiste mit weichem Rand rechts */
.sw-update button,.sw-update a,[class*="update"] button{white-space:nowrap;letter-spacing:.03em;text-transform:none}
button,a.button{white-space:nowrap}
@media(max-width:680px){
 button,a.button{letter-spacing:.06em}
 .abschnitte{overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#000 0,#000 86%,transparent 100%);mask-image:linear-gradient(90deg,#000 0,#000 86%,transparent 100%)}
}
