/* Tatort 1.2: IT Buez navy and orange, with a light interface. */
:root{--ink:#272f37;--muted:#647990;--bg:#f0f2f4;--paper:#fff;--line:#e1e4e8;--accent:#c69d5b;--ui-font:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{font-family:var(--ui-font);background:radial-gradient(ellipse at 12% 0,#dce2e966,transparent 48%),var(--bg);color:var(--ink)}
button,input,select{font-family:inherit}button:hover{filter:none}header{height:78px;padding:0 max(24px,calc((100vw - 1210px)/2));position:sticky;top:0;z-index:20;background:#f6f8fae8;backdrop-filter:blur(16px);border-bottom:1px solid #dce0e5cc}
.brand{gap:11px}.brand-icon{width:39px;height:41px;border:0;border-radius:12px;background:#2f3943;color:#f5f7f9;transform:none;font:700 26px var(--ui-font);box-shadow:0 4px 10px #2d364012}.brand-icon span{right:0;bottom:-8px;font-size:26px;color:#c9a15b}.brand strong{font-size:18px;font-weight:750;letter-spacing:2.4px}.brand strong span{font-size:8px;letter-spacing:1.9px;color:#6e849b}.header-right{gap:20px}.header-right .desktop{font-size:11px;color:#70859b}.header-right button{border:0;padding:9px 11px}.header-right #rules{font-size:11px;color:#596b7f}.motion-toggle{display:flex;align-items:center;gap:6px;border:1px solid #dadfe5!important;border-radius:30px;color:#546679;font-size:10px;background:#fff9}.motion-toggle svg{width:16px;height:16px}.motion-toggle[aria-pressed=true]{background:#e7ebef;border-color:#c9d2dc!important}.motion-toggle:disabled{opacity:.65}
main{max-width:1270px;padding:30px 35px 24px}.eyebrow{font-size:9px;letter-spacing:1.6px;font-weight:700;color:#788ca1}.intro{gap:25px;margin-top:13px}.intro h1{font-family:var(--ui-font);font-size:clamp(30px,3.4vw,43px);font-weight:680;letter-spacing:-1.7px;line-height:1.15;margin-bottom:12px}.intro p{font-size:12px;line-height:1.75;color:#57697d;max-width:710px}.primary{padding:12px 19px;border-radius:11px;background:#2e3843;border:1px solid #2e3843;box-shadow:0 3px 8px #2e384314;font-weight:650;font-size:12px}.primary:hover{background:#3a4754;border-color:#3a4754}.primary:active{background:#232b33}.intro>.primary{margin-top:7px;display:flex;align-items:center;gap:7px}.primary svg{width:16px;height:16px;flex-shrink:0}
.case-meta{margin:21px 0 24px;gap:9px;flex-wrap:wrap;font-size:10px}.case-meta>span{background:#ffffffa8;border:1px solid #dfe3e8;border-radius:7px;padding:7px 10px;color:#73879d}.case-meta>span+span{border-left:1px solid #dfe3e8;padding-left:10px}.case-meta b{color:#56687b;font-weight:550}.case-meta .saved{border:0;background:transparent;color:#8597aa;margin-left:auto;padding-right:0}.dot{background:#7d90a4}.game-layout{gap:19px;grid-template-columns:minmax(0,1.32fr) minmax(320px,1fr)}
.map-panel,.clue-panel{border:1px solid #dee2e7;border-radius:18px;background:#fff;box-shadow:0 5px 24px #2b343e04}.map-panel{padding:24px 26px 15px}.clue-panel{padding:24px 22px 15px;scrollbar-width:thin;scrollbar-color:#d1d9e1 transparent}.section-heading h2{font-family:var(--ui-font);font-size:21px;letter-spacing:-.6px;font-weight:650;margin:6px 0}.section-heading .eyebrow{color:#8496aa}.progress,.clue-count{font-size:10px;background:#eff1f4;border:1px solid #dae0e7;color:#5b6f84;padding:6px 9px}.placement-meter{height:4px;margin-top:17px;background:#eaeef2;border-radius:5px;overflow:hidden}.placement-meter>span{display:block;width:var(--completion,0%);height:100%;background:linear-gradient(90deg,#91a1b3,#596c81);border-radius:5px}.motion-on .placement-meter>span{transition:width .35s cubic-bezier(.2,.8,.2,1)}
.map-panel .suspect-panel{margin:19px 0 14px;padding:0;background:transparent}.map-panel .suspect-title{margin-bottom:9px;align-items:center}.map-panel .suspect-title .eyebrow{font-size:8px;letter-spacing:1.1px}.selection-readout{display:flex;gap:4px;align-items:center;font-size:9px;color:#798da2}.selection-readout i{height:5px;width:5px;border-radius:50%;background:#768aa0;margin-right:2px}.selection-readout b{font-weight:600;color:#536578}.suspects{gap:6px}.suspect{padding:9px 2px 8px;border:1px solid #e4e8ed;border-radius:11px;background:#f4f6f8;color:#49596a}.suspect.active{border-color:#73879d;background:#ebeef2;box-shadow:0 0 0 2px #e0e5eb80}.suspect .portrait-card{width:43px;height:49px;border-radius:9px;border:1px solid #cdd5dd;box-shadow:0 2px 4px #3d4a5710}.suspect.active .portrait-card{border-color:#8093a7}.suspect .name{font:600 10px var(--ui-font);margin-top:7px}.suspect .placed{top:3px;right:3px;background:#dde3ea;color:#4e5e70;font-size:9px;border:1px solid #ccd5df;width:14px;height:14px}
.map-wrap{max-width:465px;margin-top:18px}.column-labels{margin-bottom:7px;font-size:9px;color:#94a3b4}.row-labels{font-size:9px;color:#94a3b4}.board{border-width:3px;border-color:#485767;border-radius:9px;box-shadow:0 4px 11px #37434f09}.cell.room-right{border-right-width:3px}.cell.room-bottom{border-bottom-width:3px}.cell .portrait-token{border-radius:7px;box-shadow:0 2px 5px #28303926}.cell.selected{box-shadow:inset 0 0 0 3px #3a4653}.cell:hover{box-shadow:inset 0 0 0 2px #8799ac;filter:none}.cell.selected:hover{box-shadow:inset 0 0 0 3px #3a4653}.room-map-label{background:#f6f8fae5;font-family:var(--ui-font);font-size:8px;font-weight:700;letter-spacing:.45px;color:#506174}.landscape{border-color:#8899ac;border-radius:9px}.landscape .room-map-label{background:#f6f7f9d9;color:#596c81}
.object-guide{border-top:0;margin:15px 0 9px;padding:0}.object-guide summary{font-size:10px;color:#798da2}.object-guide[open]{background:#f3f5f7;border:1px solid #dee4ea;padding:9px;border-radius:10px}.board-caption{padding:8px 0 12px;font-size:8px;color:#91a1b3;border-color:#e4e9ee}.toolbar{margin-top:13px;gap:7px;border-radius:11px;background:#f0f3f6;padding:6px}.mode-switch{background:#e0e6ec;border:0;padding:3px;gap:2px;border-radius:8px}.mode-switch button{padding:7px 8px;font-size:10px;border-radius:6px;color:#73889e}.mode-switch button.active{background:#fff;color:#4b5b6c;box-shadow:0 1px 5px #414f5d12}.icon-button{color:#5c7085;font-size:16px;padding:6px}.icon-button:hover{background:#e0e6ec;border-radius:7px}.icon-button span{font-size:10px}.instruction{font-size:10px;color:#8093a7;margin:11px 0 0;line-height:1.6}.notice{margin-top:12px;border-radius:10px;background:#e3e8ed;color:#54667a;font-size:12px;border:1px solid #d2dae3}.notice.success{background:#e8ecf1;color:#526375;border-color:#d3dbe3}
.panel-description{font-size:10px;color:#8799ac;margin:9px 0 18px}.clues li{border:0;margin:8px 0}.clue-button{border:1px solid #e0e5eb;border-radius:12px;background:#f5f7f9;padding:12px 11px;gap:10px;min-height:70px}.clue-button:hover{border-color:#bfcad6;background:#eff1f4}.clue-check{width:20px;height:20px;background:#fff;border-color:#d7dee6;font-size:8px;color:#93a3b4}.clue-portrait{border:1px solid #ced6df;border-radius:8px;box-shadow:0 2px 3px #3a47540a;width:37px;height:43px}.clue-person-name{font-size:12px;color:#4b5a6b;font-weight:650;margin-bottom:4px}.clue-text{font-size:11px;color:#57697c;line-height:1.65}.clue-button strong{color:#546679;font-weight:650}.clue-button.checked{background:#e9edf1;border-color:#cfd8e1}.clue-button.checked .clue-check{background:#74899f;border-color:#74899f;color:#fff}.clue-button.checked .clue-text{color:#91a1b3}.clue-button.checked .clue-person-name{color:#71869d}.clue-button.checked .clue-portrait{opacity:.6}.indirect-person-card{border-color:#d4dce4!important;background:#f2f4f7;padding:11px!important;border-radius:11px}.indirect-person-card strong{font-size:10px}.indirect-person-card>span>span{font-size:10px}
.accuse-panel{background:#e5e9ee;border:1px solid #d7dee5;border-radius:16px;padding:19px 24px;gap:17px}.accuse-panel h2{font-family:var(--ui-font);font-size:18px;letter-spacing:-.4px;font-weight:650;margin:2px 0 7px}.accuse-panel p{font-size:11px;margin:0;color:#768aa0}.accuse-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:12px;background:#f0f2f5;color:#6c8198;font-size:31px}.accuse-panel .primary{padding:11px 16px;font-size:11px}.accuse-panel .primary span{padding-left:10px}footer{margin-top:25px;border-color:#d9dfe6;padding-top:15px;color:#899aad;font-size:9px}.footer-brand{letter-spacing:.2px}footer .text-button{font-size:10px;color:#778ba0}
dialog{background:#fff;border:1px solid #d8dfe6;border-radius:20px;padding:27px;width:min(540px,calc(100% - 28px));box-shadow:0 24px 100px #242b3340}dialog::backdrop{background:#252d365c;backdrop-filter:blur(7px)}.dialog-top{margin-bottom:20px}.dialog-top .eyebrow{font-size:8px;color:#91a1b2}.close{font:400 23px var(--ui-font);height:30px;width:30px;border-radius:9px;color:#8799ac;background:#f1f3f6}.close:hover{background:#e4e9ee}dialog h2{font-family:var(--ui-font);font-size:28px;font-weight:650;letter-spacing:-.9px;line-height:1.2;margin-bottom:13px}dialog h3{font:600 20px var(--ui-font);letter-spacing:-.5px}dialog h4{font-size:11px}dialog p,dialog li{font-family:var(--ui-font);font-size:12px;color:#6d8299;line-height:1.8}.seed-input{border:1px solid #d7dee5;border-radius:10px;background:#f8f9fa;padding:12px;color:#536578;font-size:12px}.field-label{font-size:10px;color:#7b8fa4;margin-top:18px}.level-choices{gap:7px}.level-choice{border:1px solid #d9e0e7;background:#f3f5f8;border-radius:11px;padding:14px}.level-choice.active{background:#e8ecf1;border-color:#8a9bad}.level-choice b{font-size:12px}.level-choice span{font-size:10px}.dialog-person{border:1px solid #d1d9e2;border-radius:9px;background:#f0f3f6;color:#5d7186;padding:10px 15px}.dialog-person.active{background:#4c5c6e;color:#fff;border-color:#4c5c6e}.big-check{display:inline-grid;place-items:center;width:61px;height:61px;font-size:32px;border-radius:18px;background:#e5e9ee;color:#657b92;margin:0 0 15px}.hint-person{gap:12px;margin-bottom:20px}.hint-person h2{font-family:var(--ui-font);font-size:26px}.hint-context{border-radius:11px;padding:12px;background:#ebeef2}.hint-conclusion{border-radius:11px;background:#e5e9ee}.hint-last-free th{background:#ebeff3}.hint-fields{border-radius:0 7px 7px 0;background:#f1f3f6}.hint-more summary{font-size:11px;color:#74889e}
.generation{background:#f1f3f6b8;backdrop-filter:blur(6px);z-index:100;font-family:var(--ui-font)}.loader-card{display:flex;align-items:center;flex-direction:column;gap:8px;padding:28px 37px;background:#fff;border:1px solid #d9e0e7;box-shadow:0 12px 50px #2e384312;border-radius:20px}.loader-card strong{font-size:14px;font-weight:600;color:#5b6f84}.loader-card>span{font-size:10px;color:#8e9fb1}.loader-symbol{position:relative;display:grid;place-items:center;width:47px;height:47px;font-size:28px;color:#7a8ea3;margin-bottom:8px}.loader-symbol:before{content:'';position:absolute;inset:0;border:2px solid #dde3e9;border-top-color:#788ca2;border-radius:50%}.motion-on .loader-symbol:before{animation:loader-spin 1s linear infinite}
.note-spark{position:absolute;inset:0;display:grid;place-items:center;color:#596c81;font-size:28px;z-index:9;pointer-events:none}.celebration-layer{position:fixed;inset:0;z-index:999;pointer-events:none;overflow:hidden}.celebration-layer i{position:absolute;top:25%;width:7px;height:11px;border-radius:2px;background:var(--confetti-color)}
.motion-on button{transition:background .18s,border-color .18s,box-shadow .18s,color .18s}.motion-on .primary:hover{transform:translateY(-1px);box-shadow:0 5px 12px #2e384320}.motion-on .primary:active{transform:translateY(0) scale(.98)}.motion-on .suspect:hover{transform:translateY(-2px)}.motion-on .suspect{transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}.motion-on .clue-button{transition:background .22s,border-color .22s}.motion-on .clue-portrait{transition:opacity .22s}.motion-on dialog::backdrop{animation:backdrop-enter .22s ease both}.motion-on .landscape .floor-water{animation:water-flow 14s linear infinite}.motion-on [data-art=boat] svg{animation:boat-drift 6s ease-in-out infinite;transform-origin:50% 50%}.motion-on [data-art=palm] svg{animation:palm-sway 9s ease-in-out infinite;transform-origin:50% 85%}
@keyframes loader-spin{to{transform:rotate(360deg)}}@keyframes backdrop-enter{from{opacity:0}to{opacity:1}}@keyframes water-flow{to{background-position:0 19px}}@keyframes boat-drift{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(1.5px) rotate(1deg)}}@keyframes palm-sway{0%,100%{transform:rotate(-1.3deg)}50%{transform:rotate(1.3deg)}}

/* IT Büez palette: light surfaces, navy typography, small orange accents. */
:root{color-scheme:light;--ink:#142b43;--muted:#66778a;--bg:#f5f7fa;--line:#e2e7ee;--accent:#f06413;--r0:#e7edf5;--r1:#f3e9dd;--r2:#e4edf0;--r3:#f1e6e1;--r4:#eae8f2;--r5:#edf0e7;--brand-navy:#142b43;--brand-orange:#f06413;--brand-soft:#fff4e9}
body{background:radial-gradient(ellipse at 12% 0,#e8eef555,transparent 48%),var(--bg)}
header{background:#fbfcfdeF;border-bottom-color:#e2e7ee}.brand-icon{background:var(--brand-navy);color:#fff;box-shadow:0 4px 10px #142b4312}.brand-icon span{color:#ff9a24}
.primary{background:var(--brand-navy);border-color:var(--brand-navy);box-shadow:0 3px 8px #142b4314}.primary:hover{background:#223f5c;border-color:#223f5c}.primary:active{background:#102337}.motion-on .primary:hover{box-shadow:0 5px 12px #142b4320}
.motion-toggle[aria-pressed=true]{background:#f0f4f8;border-color:#dce4ed!important;color:#415b76}.dot,.selection-readout i{background:#ee8b4b}
.progress,.clue-count{background:#f3f6fa;color:#4f657d;border-color:#e1e7ef}.placement-meter{background:#edf1f6}.placement-meter>span{background:linear-gradient(90deg,#ffc58d,#ed975e)}
.suspect{background:#f8fafc;color:#344e68;border-color:#e5eaf0}.suspect.active{background:#fff6ed;border-color:#efaf80;box-shadow:0 0 0 2px #f8dbc333}.suspect.active .portrait-card{border-color:#e8b28b}.suspect .placed{background:#e9f0f8;color:#41617f;border-color:#d8e3ef}
.selection-readout b{color:#4c627a}.cell.selected,.cell.selected:hover{box-shadow:inset 0 0 0 3px #db813e}.cell:hover{box-shadow:inset 0 0 0 2px #8a9db5}.cell.room-right{border-right-color:#647385}.cell.room-bottom{border-bottom-color:#647385}.board{border-color:#647385}.room-map-label{background:#ffffffdf;color:#4c6177}.landscape .room-map-label{background:#ffffffdb;color:#4c6177}
.toolbar{background:#f4f6f9}.mode-switch{background:#e9eef4}.mode-switch button.active{color:#284762}.icon-button:hover{background:#e9eef5}.notice{background:#fff5eb;color:#795032;border-color:#f2dfcd}.notice.success{background:#eef4fa;color:#3c5977;border-color:#dce7f1}
.clue-button{background:#f9fafc;border-color:#e7ecf2}.clue-button:hover{background:#f3f6fa;border-color:#cdd9e6}.clue-person-name{color:#284662}.clue-text{color:#5d7084;font-size:12px}.clue-button strong{color:#304f6d}.clue-button.checked{background:#f0f4f9;border-color:#dce5ef}.clue-button.checked .clue-check{background:#567593;border-color:#567593}.clue-button.checked .clue-person-name{color:#7b8fa4}.clue-button.checked .clue-text{color:#8797a8}
.indirect-person-card strong{color:#4b627b}.indirect-person-card>span>span{color:#6d7f92}.accuse-panel{background:#f0f4f9;border-color:#dee6ef}.accuse-icon{background:#fff5eb;color:#d77b3e}.accuse-panel h2{color:var(--ink)}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #ed975e;outline-offset:3px}
dialog::backdrop{background:#142b435c}.level-choice.active{background:#fff5eb;border-color:#eca878}.dialog-person.active{background:var(--brand-navy);border-color:var(--brand-navy);color:#fff}.big-check{background:#eef4fa;color:#325674}.seed-input{background:#fafbfd;color:#294761;border-color:#dce4ed}
dialog h4,.hint-person>div>span{color:#596f86}.hint-context{background:#fff5eb}.hint-source-number{background:#edf2f8;color:#3d5a78}.hint-sources li{border-color:#e3e9f1}.hint-fields{color:#687c92;background:#f5f7fa;border-left-color:#cedbe8}.hint-conclusion{background:#edf3f9}.hint-more,.hint-reopen{color:#3d617f}.hint-more summary{color:#5f7e9b}.hint-last-free table{color:#4d647d}.hint-last-free th,.hint-last-free td{border-color:#dfe7f0}.hint-last-free th{background:#eff4fa}.cell.hint-target:before{border-color:#d78646}
.loader-symbol{color:#d48a50}.loader-symbol:before{border-color:#e5ebf2;border-top-color:#ec985e}.note-spark{color:#c4763e}

@media(min-width:900px){.clue-panel{position:static;max-height:calc(100svh - 115px)}}
@media(max-width:1050px){header{padding:0 25px}.header-right{gap:10px}main{padding:27px 23px 22px}.map-panel{padding:22px 18px 14px}.clue-panel{padding:22px 17px 13px}.toolbar{gap:3px}.suspect .portrait-card{width:36px;height:43px}.clue-button{padding:11px 8px;gap:8px}.clue-portrait{width:34px;height:40px}.clue-portraits:has(.clue-portrait:nth-child(2)) .clue-portrait{width:26px;height:33px}}
@media(max-width:760px){header{height:68px;padding:0 16px}.brand-icon{width:34px;height:36px;border-radius:10px;font-size:23px}.brand strong{font-size:16px;letter-spacing:2px}.brand strong span{font-size:7px;letter-spacing:1.5px}.header-right{gap:4px}.header-right #rules{padding:8px 4px;font-size:10px}.header-right .motion-toggle{padding:7px!important}.motion-toggle span{display:none}.motion-toggle svg{width:16px;height:16px}main{padding:23px 13px 20px}.intro{gap:12px;flex-wrap:wrap}.intro h1{font-size:31px;letter-spacing:-1.1px}.intro p{font-size:11px;line-height:1.7}.intro>.primary{font-size:11px;padding:10px 13px;margin-top:2px}.case-meta{gap:6px;margin:17px 0 20px;font-size:9px}.case-meta>span,.case-meta>span+span{padding:6px 8px}.game-layout{grid-template-columns:1fr;gap:15px}.map-panel{padding:19px 12px 13px;border-radius:16px}.clue-panel{position:static;max-height:none;padding:20px 15px 14px;border-radius:16px}.section-heading h2{font-size:20px}.map-panel .suspect-panel{margin:17px 0 12px}.suspects{gap:4px}.suspect{padding:7px 1px 6px;border-radius:9px}.suspect .portrait-card{width:34px;height:41px;border-radius:7px}.suspect .name{font-size:9px;margin-top:5px}.selection-readout{font-size:8px;gap:3px}.map-wrap{margin-top:15px;max-width:470px}.board{border-width:3px}.room-map-label{font-size:7px;letter-spacing:0}.toolbar{padding:5px;gap:5px}.mode-switch button{font-size:9px;padding:7px 7px}.icon-button span{font-size:9px}.icon-button{font-size:16px;padding:5px}.clues .clue-button{padding:12px 10px;gap:9px}.clue-portrait{width:37px;height:43px}.clue-text{font-size:11px}.clue-person-name{font-size:12px}.accuse-panel{padding:17px;border-radius:14px;gap:12px}.accuse-panel h2{font-size:17px}.accuse-panel p{font-size:10px}.accuse-icon{height:36px;width:36px;font-size:27px}.accuse-panel .primary{font-size:10px;padding:10px 12px}dialog{padding:22px;border-radius:17px}dialog h2{font-size:26px}.hint-person h2{font-size:24px}.case-meta .saved{display:none}footer{margin-top:22px}.footer-brand{font-size:9px}}
@media(max-width:380px){.suspect .portrait-card{width:28px;height:34px}.suspects{gap:3px}.selection-readout{display:none}.toolbar .icon-button span{display:none}.brand strong{font-size:15px}.header-right #rules{font-size:9px}.clue-portraits:has(.clue-portrait:nth-child(2)) .clue-portrait{width:23px;height:30px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{header,.placement-meter,.selection-readout,.celebration-layer,.generation{display:none!important}body{background:#fff}.map-panel,.clue-panel{box-shadow:none;position:static;max-height:none}.clue-button{break-inside:avoid}*,*:before,*:after{animation:none!important;transition:none!important}}
