/* Redaktions-App des TuS Chlodwig Zülpich – gemeinsame Schriften, Farben und Kopfzeile aller Werkzeuge.
   Angelehnt an tcz1896.de: Inter, Beschriftungen in Geist Mono (bronze, Versalien), feine Linien, Rot als Akzent, keine Rundungen. */

@font-face{font-family:'Inter';src:url('/fonts/inter-latin-wght-normal.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Geist Mono';src:url('/fonts/geist-mono-latin-300-normal.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Geist Mono';src:url('/fonts/geist-mono-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Geist Mono';src:url('/fonts/geist-mono-latin-500-normal.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter Tight';src:url('/fonts/inter-tight-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter Tight';src:url('/fonts/inter-tight-latin-500-normal.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Marcellus';src:url('/fonts/marcellus-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';src:url('/fonts/inter-latin-ext-wght-normal.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Geist Mono';src:url('/fonts/geist-mono-latin-ext-300-normal.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Geist Mono';src:url('/fonts/geist-mono-latin-ext-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Geist Mono';src:url('/fonts/geist-mono-latin-ext-500-normal.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter Tight';src:url('/fonts/inter-tight-latin-ext-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter Tight';src:url('/fonts/inter-tight-latin-ext-500-normal.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Marcellus';src:url('/fonts/marcellus-latin-ext-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Geist Mono';src:url('/fonts/geist-mono-pfeile.woff2') format('woff2');font-weight:100 900;font-display:swap;unicode-range:U+2190-2199}

:root{
  --t-weiss:#fff; --t-schwarz:#000; --t-rot:#f00000; --t-creme:#F7F2ED; --t-linie:#E6DACE; --t-bronze:#9E7B54; --t-leise:#6B5A48;
  --t-inter:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  --t-mono:'Geist Mono',ui-monospace,Menlo,Consolas,monospace;
  --t-kopf:48px;
  color-scheme:light;
}

/* ---------- Kopfzeile (fügt app.js auf jeder Seite ein) ---------- */
.t-kopf{flex:none;position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:20px;height:var(--t-kopf);padding:0 20px;
  background:var(--t-weiss);border-bottom:1px solid var(--t-linie);font:400 10px/1 var(--t-mono);letter-spacing:.04em;text-transform:uppercase}
.t-kopf a{color:var(--t-bronze);text-decoration:none;white-space:nowrap;padding:8px 0}
.t-kopf a:hover,.t-kopf a[aria-current="page"]{color:var(--t-schwarz)}
.t-kopf .t-marke{display:flex;align-items:center;gap:8px;color:var(--t-schwarz);font:400 15px/1 var(--t-inter);letter-spacing:-.01em;text-transform:none;margin-right:auto}
.t-kopf .t-marke i{width:8px;height:8px;background:var(--t-rot);display:block}
.t-kopf nav{display:flex;gap:18px;overflow-x:auto;scrollbar-width:none}
.t-kopf nav::-webkit-scrollbar{display:none}
.t-kopf button{border:0;background:none;padding:8px 0;font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--t-bronze);cursor:pointer}
.t-kopf button:hover{color:var(--t-schwarz)}
@media (max-width:560px){ .t-kopf{gap:14px;padding:0 16px} .t-kopf .t-marke span{display:none} .t-kopf nav{gap:14px} }

/* ---------- Startseite und Anmeldung ---------- */
body.t-seite{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--t-weiss);color:var(--t-schwarz);font:400 16px/1.4 var(--t-inter);-webkit-font-smoothing:antialiased}
.t-seite *,.t-seite *::before,.t-seite *::after{box-sizing:border-box}
.t-seite main{width:100%;max-width:1040px;margin:0 auto;padding:56px 20px 80px}
.t-seite h1{margin:0 0 12px;font-weight:400;font-size:clamp(2.25rem,8vw,4rem);line-height:1;letter-spacing:-.03em}
.t-seite .t-vorspann{max-width:46ch;margin:0 0 48px;color:var(--t-leise)}
.t-label{font:400 10px/1.2 var(--t-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--t-bronze)}
.t-kacheln{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--t-schwarz)}
.t-kachel{display:flex;flex-direction:column;gap:10px;min-height:230px;padding:18px 24px 22px 0;border-bottom:1px solid var(--t-linie);color:inherit;text-decoration:none}
.t-kachel + .t-kachel{padding-left:24px;border-left:1px solid var(--t-linie)}
.t-kachel h2{margin:6px 0 0;font-weight:400;font-size:1.75rem;line-height:1.1;letter-spacing:-.02em}
.t-kachel p{margin:0;color:var(--t-leise);font-size:.95rem}
.t-kachel .t-pfeil{margin-top:auto;font:400 16px/1 var(--t-mono);color:var(--t-rot);transition:transform .15s}
.t-kachel:hover .t-pfeil{transform:translateX(6px)}
.t-kachel:hover h2{color:var(--t-rot)}
@media (max-width:760px){
  .t-kacheln{grid-template-columns:1fr}
  .t-kachel{min-height:0;padding:18px 0 22px}
  .t-kachel + .t-kachel{padding-left:0;border-left:0}
  .t-kachel .t-pfeil{margin-top:8px}
}
.t-fuss{margin-top:40px;display:grid;gap:8px;color:var(--t-leise);font-size:.9rem;max-width:60ch}
.t-form{display:grid;gap:18px;max-width:380px;margin-top:36px}
.t-form label{display:grid;gap:8px}
.t-form input{width:100%;border:0;border-bottom:1px solid var(--t-schwarz);border-radius:0;background:none;padding:8px 0;font:400 18px/1.3 var(--t-inter);color:inherit;outline:none}
.t-form input:focus{border-bottom-color:var(--t-rot)}
.t-knopf{justify-self:start;border:1px solid var(--t-schwarz);background:var(--t-schwarz);color:var(--t-weiss);border-radius:0;padding:12px 22px;font:400 10px/1 var(--t-mono);letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.t-knopf:hover{background:var(--t-rot);border-color:var(--t-rot)}
.t-knopf:disabled{opacity:.4;cursor:default}
.t-fehler{color:var(--t-rot);min-height:1.4em;margin:0}

/* ---------- Werkzeuge: gemeinsame Angleichung ---------- */
html.t-werkzeug{color-scheme:light}
.t-werkzeug body{font-family:var(--t-inter);letter-spacing:0;-webkit-font-smoothing:antialiased}
.t-werkzeug *:not(.t-rund):not(.cursor):not(input[type="range"]){border-radius:0 !important}
.t-werkzeug :focus-visible{outline:1px solid var(--t-schwarz);outline-offset:2px}

/* Berichte (früher Artefakt „TuS-Redaktion“) */
.t-berichte{
  --hintergrund:#fff; --card:#fff; --ink:#000; --mid:#6B5A48; --light:#E6DACE; --lightest:#F7F2ED;
  --gruen:#bde8a7; --rot:#f00000; --gelb:#f7d258; --on-dark:#fff;
  --text:var(--t-inter);
}
.t-berichte body{font-size:16px}
.t-berichte main{max-width:720px;padding-top:40px}
.t-berichte .page-h h1,.t-berichte .start-title{font-weight:400;letter-spacing:-.03em}
.t-berichte h2,.t-berichte h3{font-weight:400}
.t-berichte .label-line,.t-berichte .choice-k,.t-berichte .step-h .n,.t-berichte label,.t-berichte th{font-family:var(--t-mono);font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:var(--t-bronze)}
.t-berichte .label-line::after{background:var(--t-schwarz)}
.t-berichte .panel,.t-berichte .choice,.t-berichte .game,.t-berichte .board,.t-berichte .empty,.t-berichte .note{border-color:var(--t-linie)}
.t-berichte .choices{gap:0;border-top:1px solid var(--t-schwarz)}
.t-berichte .choice{border-width:0 0 1px;padding:20px 0}
.t-berichte .choice:hover .choice-t{color:var(--t-rot)}
.t-berichte .teambar button,.t-berichte .subtabs button,.t-berichte .emo button{background:none;border:1px solid var(--t-linie);color:var(--t-bronze);font:400 10px/1 var(--t-mono);letter-spacing:.04em;text-transform:uppercase;padding:9px 14px;min-height:0}
.t-berichte .teambar button[aria-pressed="true"],.t-berichte .subtabs button[aria-selected="true"],.t-berichte .emo button[aria-pressed="true"]{background:var(--t-schwarz);border-color:var(--t-schwarz);color:#fff}

/* Cutter */
.t-cutter{
  --bg:#fff; --surface:#F7F2ED; --ink:#000; --muted:#6B5A48; --line:#E6DACE;
  --accent:#f00000; --accent-ink:#fff; --seg-a:#f00000; --seg-b:#ff7a6b; --danger:#f00000; --gfx:#9E7B54;
  --font:var(--t-inter);
}
.t-cutter h1{font-weight:400;font-style:normal;letter-spacing:-.03em;font-size:clamp(2.25rem,8vw,3.5rem);line-height:1}
.t-cutter .wrap{padding-top:40px}
.t-cutter .tabs{border-bottom:1px solid var(--t-schwarz);gap:18px}
.t-cutter .tabs button{font:400 10px/1 var(--t-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--t-bronze);padding:12px 0;border-bottom:0;margin-bottom:0}
.t-cutter .tabs button[aria-selected="true"]{color:var(--t-schwarz)}
.t-cutter .tag{font:400 10px/1.2 var(--t-mono);letter-spacing:.04em;color:var(--t-bronze)}
.t-cutter strong,.t-cutter b,.t-cutter .name,.t-cutter .num{font-weight:500}
.t-cutter .drop{border-width:1px}

/* Bewegungsunschärfe: war schon im Vereinsbild, hier nur Weiß statt Creme als Grund und die Kopfzeile darüber */
.t-unschaerfe{ --bg:#fff; --panel:#fff; --stage:#F7F2ED; --ink:#000; --muted:#6B5A48; --line:#E6DACE; --field:#F7F2ED; --accent:#f00000; --accent-ink:#f00000; --on-accent:#fff }
.t-unschaerfe body{display:flex;flex-direction:column}
.t-unschaerfe .app{flex:1;height:auto;min-height:0}
.t-unschaerfe .brand{display:none}
.t-berichte select,.t-berichte input,.t-berichte textarea{font-family:var(--t-inter);text-transform:none;letter-spacing:0;font-size:16px}
.t-berichte .start-title{font-size:clamp(2.25rem,8vw,3.5rem);line-height:1}
.t-berichte label .hint,.t-berichte label .muted,.t-berichte label span{font:400 .9rem/1.4 var(--t-inter);letter-spacing:0;text-transform:none;color:var(--t-leise)}