/* Tatort-Sudoku · Lohnmeister.ai (26.10.2026) — Styles für assets/tatort-sudoku.js.
   Warm & hell (Creme-Spielfeld, dunkle Aktionsleiste, Orange als Aktionsfarbe), flach, Knöpfe ≥ 44 px.
   Farben aus lm.css (--blue-600, --ink-900); im Dunkelmodus bleibt das Spielbrett bewusst hell.
   Layout reagiert auf die Breite des Containers (container queries) – passt so auch ins Schulungszentrum. */
.ts,.ts-ov{--ts-bg:#fbf6ec;--ts-card:#fffdf9;--ts-line:#eadfcb;--ts-line2:#dccdb2;--ts-ink:var(--ink-900,#14202a);--ts-mute:#6a6157;--ts-blue:var(--blue-600,#1190ce);
  --ts-o:#d9650d;--ts-o2:#f59a3c;--ts-osoft:#fde9d3;--ts-dark:#1f2a33;--ts-dark2:#2c3a46;--ts-red:#c63d2f;--ts-redsoft:#fbe1dc;--ts-green:#2f8a5b;--ts-greensoft:#dcf2e5;--ts-wall:#2b2622;
  --ts-r:18px;--ts-fd:var(--font-display,"Space Grotesk",system-ui,sans-serif);--ts-fb:var(--font-body,"IBM Plex Sans",system-ui,sans-serif)}
html[data-theme=dark] .ts,html[data-theme=dark] .ts-ov{--ts-ink:#14202a;--ts-blue:#1190ce;color-scheme:light}
.ts{container-type:inline-size;position:relative;background:var(--ts-bg);color:var(--ts-ink);border:1px solid var(--ts-line);border-radius:24px;padding:clamp(10px,2.2vw,24px);font:15px/1.5 var(--ts-fb);text-align:left;min-width:0;overflow-wrap:break-word}
.ts *,.ts *::before,.ts *::after,.ts-ov *,.ts-ov *::before,.ts-ov *::after{box-sizing:border-box}
.ts h2,.ts h3,.ts-ov h3{font-family:var(--ts-fd);color:var(--ts-ink);margin:0;letter-spacing:-.01em;line-height:1.15;font-weight:600}
.ts h2{font-size:clamp(22px,3.6vw,30px)}
:where(.ts,.ts-ov) p{margin:0}
:where(.ts,.ts-ov) button{font:inherit;color:inherit}
.ts :focus-visible,.ts-ov :focus-visible{outline:3px solid var(--ts-blue);outline-offset:2px}
.ts-eye{font:600 12px/1.3 var(--ts-fd);letter-spacing:.12em;text-transform:uppercase;color:var(--ts-blue);margin:0 0 6px}
.ts-ic{width:22px;height:22px;flex:none}
body.ts-noscroll{overflow:hidden}

/* Knöpfe */
.ts-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 18px;border-radius:12px;border:1.5px solid var(--ts-line2);background:var(--ts-card);color:var(--ts-ink);font:600 15px/1.2 var(--ts-fd);cursor:pointer;text-align:center}
.ts-btn:hover:not(:disabled){border-color:var(--ts-o)}
.ts-btn .ts-ic{width:19px;height:19px}
.ts-btn-o{background:var(--ts-o);border-color:var(--ts-o);color:#fff}
.ts-btn-o:hover:not(:disabled){background:#c05708;border-color:#c05708}
.ts-btn-ghost{background:transparent}
.ts-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.ts-row-end{justify-content:flex-end}
.ts-ib{display:inline-grid;place-items:center;width:44px;height:44px;flex:none;border-radius:12px;border:1.5px solid var(--ts-line2);background:var(--ts-card);color:var(--ts-ink);cursor:pointer}
.ts-ib:hover{border-color:var(--ts-o)}

/* Helden-Figuren: Bild, sonst Kreis-Avatar */
.ts-fig{--fh:60px;position:relative;display:inline-flex;align-items:flex-end;justify-content:center;flex:none;height:var(--fh);min-width:calc(var(--fh) * .5)}
.ts-fig-img{display:block;height:100%;width:auto;max-width:none;opacity:0;transition:opacity .2s}
.ts-fig.ts-ok .ts-fig-img{opacity:1}
.ts-av{display:none;width:min(var(--fh),48px);height:min(var(--fh),48px);border-radius:50%;background:#e8f4fb url("lm-helden.webp") no-repeat;background-size:200% auto;border:2px solid #f2c230}
.ts-fig.ts-fail{min-width:0}
.ts-fig.ts-fail>.ts-av{display:inline-block}
.ts-av-lome{background-position:8% 18%}
.ts-av-lomy{background-position:92% 18%}
.ts-av.ts-av-domi{background:#3a2440;position:relative}
.ts-av-domi::after{content:"D";position:absolute;inset:0;display:grid;place-items:center;color:#f2c230;font:800 18px/1 var(--ts-fd)}
.ts-f-xs{--fh:30px}.ts-f-s{--fh:58px}.ts-f-m{--fh:96px}.ts-f-l{--fh:132px}
.ts-say{display:flex;gap:10px;align-items:flex-end;min-width:0}
.ts-say>p{position:relative;flex:1;min-width:0;background:var(--ts-card);border:1px solid var(--ts-line);border-radius:16px 16px 16px 4px;padding:9px 13px;font-size:14.5px;line-height:1.5;color:var(--ts-ink);margin-bottom:4px}
.ts-say-domi>p{border-color:#e2c9e9;background:#fdf8ff}
.ts-say.is-bad>p{border-color:#ebb3aa;background:var(--ts-redsoft)}
.ts-say.is-ok>p{border-color:#a9dcc0;background:var(--ts-greensoft)}
.ts-say-mini>p{font-size:13.5px;padding:7px 11px}
.ts-say-bust{align-items:flex-start}
.ts-say-bust>.ts-fig{--fh:64px;width:64px;border-radius:50%;overflow:hidden;background:#efe3f3;align-items:flex-start}
.ts-say-bust>.ts-fig .ts-fig-img{height:118%;width:auto;margin-top:-2px}
.ts-say-bust>.ts-fig.ts-fail{background:transparent}
.ts-say-mini .ts-fig{--fh:44px}
.ts-say-plain{margin-top:8px;color:var(--ts-mute);max-width:62ch}
.ts-say-plain b{color:var(--ts-ink)}

/* Startbildschirm */
.ts-mhead{display:flex;gap:16px;align-items:flex-end}
.ts-mtxt{min-width:0;padding-bottom:6px}
.ts-daily{display:flex;align-items:center;gap:14px;width:100%;margin:20px 0 14px;padding:14px 16px;border:1.5px solid var(--ts-o2);background:linear-gradient(100deg,#fff4e6,var(--ts-card));border-radius:var(--ts-r);cursor:pointer;text-align:left;min-height:76px}
.ts-daily:hover{border-color:var(--ts-o)}
.ts-daily-cal{display:grid;place-items:center;flex:none;width:56px;height:58px;border-radius:12px;background:var(--ts-card);border:1.5px solid var(--ts-line2);overflow:hidden}
.ts-daily-cal b{font:700 22px/1 var(--ts-fd);color:var(--ts-ink);padding-top:6px}
.ts-daily-cal small{display:block;width:100%;text-align:center;background:var(--ts-o);color:#fff;font:600 11px/1.6 var(--ts-fd);text-transform:uppercase;letter-spacing:.05em}
.ts-daily-t{flex:1;min-width:0;display:grid;gap:1px}
.ts-daily-t b{font:600 17px/1.25 var(--ts-fd)}
.ts-daily-t small{color:var(--ts-mute);font-size:13px}
.ts-daily-t em,.ts-lv-t em{font-style:normal;font-size:12.5px;font-weight:600;color:var(--ts-o)}
.ts-daily.is-done .ts-daily-t em{color:var(--ts-green)}
.ts-resume{border-color:var(--ts-blue);background:linear-gradient(100deg,#e9f5fc,var(--ts-card));margin-bottom:0}
.ts-resume+.ts-daily{margin-top:12px}
.ts-resume-ic{color:var(--ts-blue)}
.ts-resume .ts-daily-t em{color:var(--ts-blue)}
.ts-resume .ts-daily-go{background:var(--ts-blue)}
.ts-daily-go{flex:none;padding:10px 14px;border-radius:11px;background:var(--ts-o);color:#fff;font:600 14px/1 var(--ts-fd)}
.ts-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ts-lv{display:flex;align-items:center;gap:14px;padding:14px;border:1.5px solid var(--ts-line);background:var(--ts-card);border-radius:var(--ts-r);cursor:pointer;text-align:left;min-height:84px}
.ts-lv:hover{border-color:var(--ts-o)}
.ts-lv-grid{display:grid;grid-template-columns:repeat(var(--n),1fr);gap:1.5px;width:46px;height:46px;flex:none;padding:3px;border:2px solid var(--ts-wall);border-radius:5px;background:#f3e7cf}
.ts-lv-grid i{background:#fffaf0;border-radius:1px}
.ts-lv-lehrling .ts-lv-grid{background:#d9ecd7}.ts-lv-profi .ts-lv-grid{background:#f5dcc0}.ts-lv-meister .ts-lv-grid{background:#e2d4ef}
.ts-lv-t{display:grid;gap:1px;min-width:0}
.ts-lv-t b{font:600 17px/1.2 var(--ts-fd)}
.ts-lv-t small{color:var(--ts-mute);font-size:13px}
.ts-lv-t em{color:var(--ts-mute);font-weight:500}
.ts-mfoot{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:16px}
.ts-mfoot p{flex:1;min-width:220px;color:var(--ts-mute);font-size:13.5px}
.ts-load{display:grid;justify-items:center;gap:12px;padding:40px 16px;text-align:center;color:var(--ts-mute)}
.ts-load b{color:var(--ts-ink)}
.ts-spin{width:34px;height:34px;border-radius:50%;border:3px solid var(--ts-line2);border-top-color:var(--ts-o);animation:ts-spin .8s linear infinite}
@keyframes ts-spin{to{transform:rotate(360deg)}}

/* Kopfzeile im Spiel */
.ts-head{display:flex;align-items:center;gap:8px;min-width:0}
.ts-ttl{flex:1;min-width:0;display:grid}
.ts-ttl b{font:600 17px/1.2 var(--ts-fd);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ts-ttl small{color:var(--ts-mute);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ts-time{flex:none;min-width:58px;text-align:center;padding:8px 8px;border-radius:10px;background:var(--ts-dark);color:#fff;font:600 15px/1 var(--ts-fd);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.ts-brief{margin:12px 0 0}
.ts-brief .ts-say{position:relative}
.ts-brief .ts-say>p{padding-right:44px}
.ts-x-btn{position:absolute;top:2px;right:2px;display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:var(--ts-mute);cursor:pointer;border-radius:12px}
.ts-x-btn .ts-ic{width:18px;height:18px}
.ts-x-btn:hover{color:var(--ts-ink)}
.ts-brief-mini{display:flex;align-items:center;gap:10px;width:100%;min-height:46px;padding:6px 12px;border:1px solid var(--ts-line);border-radius:12px;background:var(--ts-card);cursor:pointer;text-align:left;font-size:13.5px}
.ts-brief-mini .ts-brief-t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ts-brief-mini em{font-style:normal;font-weight:600;color:var(--ts-o);font-size:13px}
.ts-headshake .ts-fig-img,.ts-headshake .ts-av{animation:ts-nope .7s ease-in-out 2}
@keyframes ts-nope{0%,100%{transform:rotate(0)}20%{transform:rotate(-7deg)}45%{transform:rotate(7deg)}70%{transform:rotate(-5deg)}}

/* Hauptbereich */
.ts-main{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:14px}
.ts-left,.ts-right{min-width:0;display:grid;gap:12px;align-content:start}

/* Spielbrett */
.ts-bw{position:relative;width:100%;max-width:620px;margin:0 auto;aspect-ratio:1;container-type:inline-size;border-radius:6px;background:var(--ts-wall)}
.ts-board{position:absolute;inset:0;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));grid-template-rows:repeat(var(--n),minmax(0,1fr));border-radius:4px;overflow:hidden}
.ts-c{position:relative;display:block;min-width:0;min-height:0;margin:0;padding:0;border:0;border-right:1px solid rgba(43,38,34,.13);border-bottom:1px solid rgba(43,38,34,.13);background-color:var(--tint,#f3e7cf);cursor:pointer;-webkit-tap-highlight-color:transparent;overflow:hidden}
.ts-c:hover{box-shadow:inset 0 0 0 2px rgba(217,101,13,.45)}
.ts-c:focus-visible{outline:3px solid var(--ts-blue);outline-offset:-3px;z-index:3}
.ts-c.is-blk{cursor:not-allowed}
/* Böden */
.f-holz{background-image:linear-gradient(rgba(122,74,34,.14) 1px,transparent 1px),linear-gradient(90deg,transparent 48%,rgba(122,74,34,.12) 48%,rgba(122,74,34,.12) calc(48% + 1px),transparent calc(48% + 1px)),repeating-linear-gradient(0deg,rgba(255,255,255,.18) 0 2px,transparent 2px 6px);background-size:100% 33.34%,100% 66.67%,100% 100%;background-position:0 0,0 33.34%,0 0}
.f-fliesen{background-image:linear-gradient(rgba(255,255,255,.75) 1.5px,transparent 1.5px),linear-gradient(90deg,rgba(255,255,255,.75) 1.5px,transparent 1.5px);background-size:50% 50%}
.f-teppich{background-image:radial-gradient(rgba(60,40,20,.13) 1px,transparent 1.3px),radial-gradient(rgba(255,255,255,.35) 1px,transparent 1.3px);background-size:5px 5px,7px 7px;background-position:0 0,2px 3px}
.f-beton{background-color:color-mix(in srgb,var(--tint,#e6e2da) 45%,#d8d6d1);background-image:radial-gradient(rgba(0,0,0,.09) .8px,transparent 1.2px),radial-gradient(rgba(255,255,255,.45) .9px,transparent 1.3px),radial-gradient(rgba(0,0,0,.05) 1.5px,transparent 2px);background-size:7px 7px,11px 11px,17px 17px;background-position:0 0,4px 5px,9px 2px}
/* Objekte */
.ts-o{position:absolute;inset:9%;display:block;pointer-events:none}
.ts-o.is-occ{inset:12%}
.ts-o-svg,.ts-o-img{position:absolute;inset:0;width:100%;height:100%;display:block}
.ts-o-img{object-fit:contain;opacity:0}
.ts-o.ts-ok .ts-o-img{opacity:1}
.ts-o.ts-ok .ts-o-svg{display:none}
.ts-c:has(.ts-tok) .ts-o.is-occ{opacity:.55}
/* Kreuz */
.ts-xm{position:absolute;inset:18%;pointer-events:none}
.ts-xm::before,.ts-xm::after{content:"";position:absolute;left:50%;top:-4%;width:max(3px,9%);height:108%;background:var(--ts-red);border-radius:3px;opacity:.78;transform:translateX(-50%) rotate(45deg)}
.ts-xm::after{transform:translateX(-50%) rotate(-45deg)}
/* Notizen */
.ts-nt{position:absolute;inset:auto 2px 2px 2px;display:flex;flex-wrap:wrap;gap:1px;justify-content:center;pointer-events:none;z-index:2}
.ts-nt i{font:700 calc(100cqi / var(--n) * .2)/1.15 var(--ts-fd);font-style:normal;color:#fff;background:var(--pc,#555);border-radius:4px;padding:0 .25em;min-width:1.2em;text-align:center}
/* Personen-Marke */
.ts-tok{position:absolute;left:50%;top:50%;width:76%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;z-index:2;pointer-events:none;box-shadow:0 2px 0 rgba(43,38,34,.25)}
.ts-tok>.ts-face{width:100%;height:100%;border:2px solid #fff}
.ts-tok.is-sel>.ts-face{border-color:var(--ts-o);box-shadow:0 0 0 2px var(--ts-o)}
.ts-tok.is-conf>.ts-face{border-color:var(--ts-red);box-shadow:0 0 0 2px var(--ts-red)}
.ts-tok.is-pop{animation:ts-pop .38s cubic-bezier(.2,1.4,.4,1)}
@keyframes ts-pop{0%{transform:translate(-50%,-50%) scale(.3);opacity:0}60%{transform:translate(-50%,-50%) scale(1.14);opacity:1}100%{transform:translate(-50%,-50%) scale(1)}}
.ts-lockb{position:absolute;right:-6%;bottom:-6%;display:grid;place-items:center;width:42%;aspect-ratio:1;border-radius:50%;background:#f2c230;color:#3a2a00;border:1.5px solid #fff}
.ts-lockb .ts-ic{width:66%;height:66%}
/* Wände, Raumschilder, Nordpfeil */
.ts-walls{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4;overflow:visible}
.ts-labels{position:absolute;inset:0;pointer-events:none;z-index:5}
.ts-lab{position:absolute;display:flex;justify-content:center}
.ts-lab.is-l{justify-content:flex-start;padding-left:3px}
.ts-lab.is-r{justify-content:flex-end;padding-right:3px}
.ts-lab.is-n{padding-right:18px}
.ts-lab i{font:600 clamp(7.5px,calc(100cqi / var(--n) * .19),11.5px)/1.3 var(--ts-fd);font-style:normal;text-transform:uppercase;letter-spacing:.05em;color:#3b332b;background:rgba(255,251,243,.9);padding:0 .5em;margin-top:max(2px,.45cqi);border-radius:0 0 5px 5px;white-space:nowrap;max-width:none}
.ts-north{position:absolute;top:-2px;right:-2px;transform:translate(35%,-35%);display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ts-dark);color:#fff;font:700 11px/1 var(--ts-fd);z-index:6}
.ts-north::before{content:"";position:absolute;top:-7px;left:50%;transform:translateX(-50%);border:5px solid transparent;border-bottom:6px solid var(--ts-dark);border-top:0}
.ts-pausebox{position:absolute;inset:0;z-index:8;display:grid;place-content:center;gap:14px;justify-items:center;background:rgba(251,246,236,.94);border-radius:6px}
.ts-pausebox[hidden]{display:none}
.ts-pausebox p{font:600 26px/1 var(--ts-fd)}
.ts-bw.is-paused .ts-board,.ts-bw.is-paused .ts-labels{filter:blur(8px)}
.is-shake{animation:ts-shake .5s ease-in-out}
@keyframes ts-shake{0%,100%{transform:translateX(0)}15%{transform:translateX(-9px)}35%{transform:translateX(8px)}55%{transform:translateX(-6px)}75%{transform:translateX(4px)}}
.ts-info{min-height:2.6em;font-size:13.5px;color:var(--ts-mute);line-height:1.4;text-align:center;max-width:620px;margin:0 auto}
.ts-info b{color:var(--ts-ink)}

/* Werkzeugleiste (dunkel) */
.ts-tools{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;padding:5px;border-radius:16px;background:var(--ts-dark);max-width:620px;width:100%;margin:0 auto}
.ts-tool{display:grid;justify-items:center;align-content:center;gap:3px;min-height:56px;min-width:0;padding:6px 2px;border:0;border-radius:12px;background:transparent;color:#e9eef2;cursor:pointer}
.ts-tool span{font:600 clamp(9.5px,2.6cqi,12.5px)/1.1 var(--ts-fd);letter-spacing:-.01em;white-space:nowrap}
.ts-tool:hover:not(:disabled){background:var(--ts-dark2)}
.ts-tool.is-on{background:var(--ts-o);color:#fff}
.ts-tool-hint{color:#f6c453}
.ts-tool-hint .ts-ic{color:#f6c453}
.ts-tool:disabled{opacity:.38;cursor:not-allowed}
.ts-tool.is-act{position:relative}
.ts-tool-hint::before{content:"";position:absolute;left:0;top:18%;bottom:18%;border-left:1px solid rgba(255,255,255,.18)}

/* Personenleiste */
.ts-people{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:4px 2px 8px;margin:0 -2px;scrollbar-width:thin}
.ts-pt{position:relative;flex:0 0 78px;display:grid;justify-items:center;align-content:start;gap:2px;min-height:96px;padding:8px 4px 6px;border:2px solid var(--ts-line);border-radius:14px;background:var(--ts-card);cursor:pointer;scroll-snap-align:start}
.ts-pt b{font:600 13px/1.2 var(--ts-fd);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ts-pt small{font:700 11px/1 var(--ts-fd);color:var(--ts-mute);background:#f3ebdd;border-radius:5px;padding:2px 6px}
.ts-pt:hover{border-color:var(--ts-o2)}
.ts-pt.is-sel{border-color:var(--ts-o);box-shadow:0 0 0 2px var(--ts-o);background:#fff8ef}
.ts-pt.is-vic{background:#f4f1ec}
.ts-pt-ok{position:absolute;top:4px;right:4px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--ts-green);color:#fff}
.ts-pt-ok .ts-ic{width:13px;height:13px}
.ts-pt-bad{position:absolute;top:5px;left:5px;width:11px;height:11px;border-radius:50%;background:var(--ts-red);box-shadow:0 0 0 2px #fff}
/* Gesichter */
.ts-face{position:relative;display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:50%;overflow:hidden;background:color-mix(in srgb,var(--pc,#888) 22%,#fff);color:var(--pc,#555)}
.ts-face{font-size:15px}
.ts-ini{font-family:var(--ts-fd);font-weight:700;letter-spacing:.02em;line-height:1}
.ts-tok .ts-ini{font-size:calc(100cqi / var(--n) * .3)}
.ts-face-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%;transform:scale(1.18);transform-origin:50% 22%;opacity:0}
.ts-face.ts-ok .ts-face-img{opacity:1}
.ts-face.ts-ok .ts-ini{visibility:hidden}
.ts-face-vic{background:#e7e3dc;color:#6a6157}
.ts-face-vic svg{width:72%;height:72%}
.ts-tok.is-vic>.ts-face{border-style:dashed;border-color:#8b8277}
.ts-face-s{width:30px;height:30px;font-size:12px}
.ts-face-m{width:52px;height:52px;font-size:17px}
.ts-face-l{width:56px;height:56px;font-size:19px}
.ts-face-xl{width:84px;height:84px;font-size:28px;border:3px solid var(--ts-o)}

/* Hinweiskarte */
.ts-card{border:1.5px solid var(--ts-line);border-radius:var(--ts-r);background:var(--ts-card);padding:12px 12px 8px}
.ts-card-h{display:flex;align-items:center;gap:12px;min-width:0;margin-bottom:6px}
.ts-card-h>div{flex:1;min-width:0;display:grid}
.ts-card-h b{font:600 16.5px/1.25 var(--ts-fd)}
.ts-card-h small{color:var(--ts-mute);font-size:13px}
.ts-card-h small i{font-style:normal;font-weight:700;color:var(--ts-ink)}
.ts-chip{flex:none;font:600 11.5px/1.2 var(--ts-fd);padding:5px 8px;border-radius:99px;background:#f1e8d8;color:var(--ts-mute);max-width:120px;text-align:center}
.ts-chip.is-on{background:var(--ts-greensoft);color:var(--ts-green)}
.ts-clues{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.ts-clues li>button,.ts-clues li>span{display:block;width:100%;min-height:42px;padding:10px 10px 10px 34px;border:0;border-radius:10px;background:transparent;text-align:left;cursor:pointer;font-size:15px;line-height:1.4;position:relative;color:var(--ts-ink)}
.ts-clues li>button::before{content:"";position:absolute;left:9px;top:12px;width:16px;height:16px;border-radius:50%;border:2px solid var(--ts-line2);background:#fff}
.ts-clues li>button:hover{background:#faf3e7}
.ts-clues li.is-struck>button{color:#a39a8f;text-decoration:line-through;text-decoration-color:rgba(106,97,87,.6)}
.ts-clues li.is-struck>button::before{background:var(--ts-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/11px no-repeat;border-color:var(--ts-green)}
.ts-clues li.is-bad>button{background:var(--ts-redsoft);color:#7e2318}
.ts-clues li.is-bad>button::before{border-color:var(--ts-red)}
.ts-clues li.is-bad em{font-style:normal;font:700 11px/1 var(--ts-fd);color:#fff;background:var(--ts-red);border-radius:5px;padding:3px 6px;margin-left:4px;white-space:nowrap;vertical-align:1px}
.ts-clues li.is-rule>span{cursor:default;background:#f6effb;color:#4b3357;font-size:14px}
.ts-clues li.is-rule>span::before{content:"§";position:absolute;left:11px;top:9px;font:700 16px/1 var(--ts-fd);color:#8a5cc4}
.ts-clues li.is-none>span{cursor:default;color:var(--ts-mute);font-style:italic}
.ts-allbtn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;width:100%;border:1.5px dashed var(--ts-line2);border-radius:12px;background:transparent;cursor:pointer;font:600 14.5px var(--ts-fd);color:var(--ts-ink)}
.ts-allbtn .ts-ic{width:18px;height:18px}
.ts-allbtn:hover{border-color:var(--ts-o)}
.ts-all{display:none;border:1.5px solid var(--ts-line);border-radius:var(--ts-r);background:var(--ts-card);padding:12px;gap:6px}
.ts-showall .ts-all{display:grid}
.ts-all h3{font-size:16px;margin:0 0 4px}
.ts-allp{border-top:1px solid var(--ts-line);padding-top:6px}
.ts-allp:first-of-type{border-top:0;padding-top:0}
.ts-allp-h{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;border:0;background:transparent;cursor:pointer;padding:2px 4px;border-radius:10px;text-align:left;font:600 14.5px var(--ts-fd)}
.ts-allp.is-sel .ts-allp-h{background:var(--ts-osoft)}
.ts-all .ts-clues li>button,.ts-all .ts-clues li>span{font-size:14px;min-height:38px;padding-top:8px;padding-bottom:8px}
.ts-all .ts-clues li>button::before{top:10px}
.ts-submit{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;border:0;border-radius:14px;background:var(--ts-o);color:#fff;font:600 17px/1.2 var(--ts-fd);cursor:pointer;box-shadow:0 6px 18px rgba(217,101,13,.28)}
.ts-submit:hover:not(:disabled){background:#c05708}
.ts-submit:disabled{background:#e9dfcf;color:#7d7266;box-shadow:none;cursor:not-allowed}

/* Overlays (Anleitung, Lohnfrage, Lösung) */
.ts-ov{position:fixed;inset:0;z-index:1000;background:rgba(31,24,16,.58);display:flex;align-items:flex-start;justify-content:center;padding:clamp(10px,4vh,44px) 12px;overflow-y:auto;color:var(--ts-ink);font:15px/1.5 var(--ts-fb);text-align:left}
.ts-dlg{position:relative;width:100%;max-width:580px;margin:auto 0;background:var(--ts-bg);border-radius:22px;padding:clamp(16px,3vw,26px);box-shadow:0 24px 60px rgba(13,29,43,.3);overflow:hidden;animation:ts-in .22s ease-out}
@keyframes ts-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.ts-dlg h3{font-size:clamp(20px,3vw,25px);margin-bottom:8px}
.ts-prog{height:6px;border-radius:99px;background:#efe3cf;margin:-4px 0 14px;overflow:hidden}
.ts-prog span{display:block;height:100%;background:var(--ts-o);border-radius:99px;transition:width .3s}
.ts-gtxt{color:#3b3631;line-height:1.6}
.ts-gex{margin:14px 0}
.ts-gnav{flex-wrap:nowrap;align-items:center;gap:8px}
.ts-gnav span{flex:1}
.ts-gnav .ts-btn{flex:none;padding-inline:14px}
.ts-btn-link{border-color:transparent;background:transparent;color:var(--ts-mute);padding-inline:6px!important;text-decoration:underline;text-underline-offset:3px}
.ts-btn-link:hover:not(:disabled){border-color:transparent;color:var(--ts-ink)}
.ts-g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ts-g2c{align-items:center}
.ts-g-ok,.ts-g-no{display:flex;align-items:center;gap:6px;font:600 14px var(--ts-fd);margin-bottom:6px}
.ts-g-ok{color:var(--ts-green)}.ts-g-no{color:var(--ts-red)}
.ts-g-ok .ts-ic,.ts-g-no .ts-ic{width:18px;height:18px}
.ts-olist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.ts-olist li{display:flex;align-items:center;gap:6px;font-size:12.5px;line-height:1.2;min-width:0}
.ts-olist .ts-o{position:relative;inset:auto;width:30px;height:30px;flex:none}
.ts-olist span{min-width:0;overflow-wrap:anywhere}
.ts-legend{font-size:13.5px;line-height:2}
.ts-legend .ts-mk{position:relative;display:inline-block;width:18px;height:18px;vertical-align:-4px;inset:auto}
.ts-tlist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ts-tlist li{display:grid;grid-template-columns:38px minmax(0,1fr);column-gap:10px;align-items:center;font-size:14px;color:var(--ts-mute)}
.ts-tlist li .ts-ic{grid-row:span 2;width:38px;height:38px;padding:8px;border-radius:10px;background:var(--ts-dark);color:#fff}
.ts-tlist li b{color:var(--ts-ink);font-family:var(--ts-fd)}
/* Mini-Raster der Anleitung */
.ts-mini{position:relative;width:min(230px,78%);aspect-ratio:1;margin:0 auto;container-type:inline-size;border-radius:5px;background:var(--ts-wall)}
.ts-mini-s{width:150px}
.ts-mini .ts-c{cursor:default}
.ts-mini .ts-c:hover{box-shadow:none}
.ts-mini .ts-tok .ts-ini{font-size:calc(100cqi / var(--n) * .34)}
.ts-mk{position:absolute;inset:0;pointer-events:none;z-index:3}
.ts-mk-hl{background:rgba(245,154,60,.28)}
.ts-mk-ok{inset:22%;border-radius:50%;background:var(--ts-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/62% no-repeat}
.ts-mk-bad{inset:22%;border-radius:50%;background:var(--ts-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7L7 17'/%3E%3C/svg%3E") center/58% no-repeat}
/* Lohnfrage */
.ts-q-head{display:flex;gap:12px;align-items:flex-start}
.ts-q-head>div{flex:1;min-width:0}
.ts-q{font:600 clamp(17px,2.4vw,20px)/1.4 var(--ts-fd);margin:16px 0 12px;text-wrap:pretty}
.ts-opts{display:grid;gap:8px}
.ts-opt{display:flex;gap:10px;align-items:flex-start;width:100%;min-height:48px;padding:11px 12px;border:1.5px solid var(--ts-line2);border-radius:12px;background:var(--ts-card);text-align:left;cursor:pointer;font-size:15px;line-height:1.4}
.ts-opt span{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ts-osoft);color:#8a3c00;font:700 13px var(--ts-fd)}
.ts-opt:hover:not(:disabled){border-color:var(--ts-o)}
.ts-opt:disabled{cursor:default}
.ts-opt.is-ok{border-color:var(--ts-green);background:var(--ts-greensoft)}
.ts-opt.is-bad{border-color:var(--ts-red);background:var(--ts-redsoft)}
.ts-qmsg{margin-top:12px}
.ts-qmsg:empty{display:none}
/* Lösung */
.ts-win{max-width:620px}
.ts-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.ts-confetti i{position:absolute;top:-16px;width:9px;height:14px;border-radius:2px;opacity:0;animation:ts-fall 3s cubic-bezier(.25,.6,.5,1) forwards}
@keyframes ts-fall{0%{opacity:1;transform:translate(0,0) rotate(0)}85%{opacity:1}100%{opacity:0;transform:translate(var(--dx,0),620px) rotate(var(--r,360deg))}}
.ts-win>*:not(.ts-confetti){position:relative;z-index:1}
.ts-win-top{display:flex;gap:14px;align-items:flex-end}
.ts-win-top>div{min-width:0;padding-bottom:8px}
.ts-reveal{display:flex;gap:14px;align-items:center;margin:16px 0 0;padding:14px;border-radius:16px;background:var(--ts-card);border:1.5px solid var(--ts-o2)}
.ts-reveal>div{display:grid;min-width:0}
.ts-reveal small{font:600 12px/1.3 var(--ts-fd);letter-spacing:.1em;text-transform:uppercase;color:var(--ts-o)}
.ts-reveal b{font:700 20px/1.25 var(--ts-fd)}
.ts-reveal span{color:var(--ts-mute);font-size:14px}
.ts-stats{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ts-stats li{display:grid;gap:2px;padding:10px;border-radius:12px;background:var(--ts-card);border:1px solid var(--ts-line);text-align:center;min-width:0}
.ts-stats small{font-size:12px;color:var(--ts-mute);overflow-wrap:anywhere}
.ts-stats b{font:700 19px/1.2 var(--ts-fd);font-variant-numeric:tabular-nums}
.ts-stats em{font-style:normal;font-size:11px;color:#fff;background:var(--ts-green);border-radius:5px;padding:1px 5px;vertical-align:3px}
.ts-kids{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.ts-kid{display:flex;align-items:flex-end;gap:8px;min-width:0}
.ts-kid p{flex:1;min-width:0;background:var(--ts-card);border:1px solid var(--ts-line);border-radius:14px 14px 14px 4px;padding:7px 10px;font-size:13.5px;margin-bottom:6px}
.ts-kid .ts-fig{animation:ts-hop 1.1s ease-in-out 3}
@keyframes ts-hop{0%,100%{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-2px)}}

/* Breiter Container: Brett links, Personen & Hinweise rechts */
@container (min-width: 860px){
  .ts-main{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:24px;align-items:start}
  .ts-people{flex-wrap:wrap;overflow:visible}
  .ts-all{display:grid}
  .ts-allbtn{display:none}
  .ts-right{position:sticky;top:76px}
}
@container (max-width: 640px){
  .ts-levels{grid-template-columns:minmax(0,1fr)}
  .ts-lv{min-height:74px}
  .ts-f-l{--fh:104px}
  .ts-mhead .ts-fig{--fh:96px}
  .ts-head{gap:6px}
  .ts-ttl b{font-size:15.5px}
  .ts-time{min-width:52px;font-size:14px;padding:8px 6px}
}
@container (max-width: 420px){
  .ts-say-bust>.ts-fig{--fh:46px;width:46px}
  .ts-brief .ts-say>p{font-size:14px;padding:8px 40px 8px 11px}
  .ts-mhead{gap:10px}
  .ts-mhead .ts-fig{--fh:80px}
  .ts-daily{padding:12px;gap:10px}
  .ts-daily-go{display:none}
  .ts-tools{gap:2px;padding:4px}
  .ts-tool{min-height:54px}
  .ts-tool .ts-ic{width:20px;height:20px}
}
@media (max-width: 520px){
  .ts-g2{grid-template-columns:minmax(0,1fr)}
  .ts-stats b{font-size:17px}
  .ts-win-top .ts-fig{--fh:96px}
  .ts-kids .ts-fig{--fh:76px}
  .ts-reveal .ts-face-xl{width:66px;height:66px}
}
@media (prefers-reduced-motion: reduce){
  .ts *,.ts-ov *{animation:none!important;transition:none!important}
  .ts-confetti{display:none}
}