:root{color-scheme:dark;--paper:#050809;--ink:#eef9f5;--muted:#9db4ae;--gold:#d9bc78;--gold-soft:#f3dda4;--cyan:#76f7df;--cyan-soft:#c7fff5;--cyan-dark:#073e3a;--amber:#ffc969;--red:#ff736e;--line:#29453f;--panel:#0a1111;--spring:cubic-bezier(.22,1.35,.42,1);font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background:radial-gradient(circle at 50% 22%,#0b5b5040,transparent 37%),linear-gradient(135deg,#050707,#07100f 52%,#050707);-webkit-tap-highlight-color:transparent}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(#76f7df0a 1px,transparent 1px),linear-gradient(90deg,#76f7df08 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,#000,transparent 82%)}button,a,input{touch-action:manipulation}button,input{font:inherit}button{color:inherit;cursor:pointer}button:disabled{cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--cyan-soft);outline-offset:3px}
.home-bar{position:sticky;top:0;z-index:30;display:flex;width:100%;min-height:calc(52px + env(safe-area-inset-top));align-items:center;justify-content:center;gap:10px;border-bottom:1px solid #f4dfa5;background:linear-gradient(110deg,#b18a38,#f0d98e 48%,#b18a38);color:#090806;padding-top:env(safe-area-inset-top);box-shadow:0 8px 28px #0009,inset 0 1px #fff8;font-size:.88rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.home-bar:before{content:"\2190";font-size:1.15rem}.home-bar:focus-visible{outline:3px solid #fff;outline-offset:-5px}.preview-capture .home-bar{display:none}.preview-capture .game-shell{min-height:100svh}
.game-shell{position:relative;width:min(100%,500px);min-height:calc(100svh - 52px - env(safe-area-inset-top));margin:auto;padding:14px 16px calc(10px + env(safe-area-inset-bottom));display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.game-identity{min-width:0;display:flex;flex-direction:column;gap:3px}.game-identity h1{margin:0;color:var(--gold);font:500 32px/1 Georgia,serif;letter-spacing:-1.2px}.player-name{max-width:155px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:10px;font-weight:750;letter-spacing:.12em;text-transform:uppercase}.player-name:empty{display:none}.top-actions{display:flex;gap:5px;flex-shrink:0}.icon-button{width:40px;height:40px;border:1px solid #554625;background:#15130e;color:#ecd59c;border-radius:50%;display:grid;place-items:center;flex-shrink:0;font-size:23px;line-height:1;transition:background .2s,transform .3s var(--spring)}.icon-button:hover{background:#272218}.icon-button:active{transform:scale(.92)}.icon-button:disabled{opacity:.45}.info-icon{font:italic bold 21px Georgia,serif}html[lang=de] .game-identity h1{font-size:29px;letter-spacing:-1.5px}
.statusbar{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:9px;padding:0 0 9px;border-bottom:1px solid var(--line)}.statusbar.is-timer-hidden{grid-template-columns:repeat(3,1fr)}.statusbar>div{text-align:center;border-right:1px solid var(--line)}.statusbar>div:last-child,.statusbar.is-timer-hidden>div:nth-last-child(2){border:0}.statusbar>div[hidden]{display:none}.statusbar span{display:block;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:1.35px}.statusbar strong{display:inline-block;color:var(--cyan-soft);font:600 24px/1.15 ui-monospace,SFMono-Regular,Consolas,monospace;font-variant-numeric:tabular-nums;text-shadow:0 0 16px #76f7df66}.statusbar small{margin-left:3px;color:var(--muted);font-size:8px;font-weight:700;letter-spacing:.08em}
.lock-panel{position:relative;min-width:0;overflow:hidden;border:1px solid #3f7369;border-radius:18px;padding:13px 15px 12px;background:linear-gradient(145deg,#12201e,#07100f 70%);box-shadow:inset 0 1px #d3fff51a,inset 0 -16px 35px #0005,0 18px 45px #0008}.lock-panel:before{content:"";position:absolute;inset:5px;border:1px solid #76f7df14;border-radius:13px;pointer-events:none}.lock-hardware i{position:absolute;width:5px;height:5px;border-radius:50%;background:#536d68;box-shadow:inset 0 1px #bde6dc88}.lock-hardware i:nth-child(1){left:8px;top:8px}.lock-hardware i:nth-child(2){right:8px;top:8px}.lock-hardware i:nth-child(3){left:8px;bottom:8px}.lock-hardware i:nth-child(4){right:8px;bottom:8px}.terminal-heading{display:flex;align-items:center;gap:7px;color:#88a8a1;font:750 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.4px}.signal-dot{width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:signal 1.8s ease-in-out infinite}.terminal-id{margin-left:auto;color:#5d7a74}.code-display{display:flex;justify-content:center;gap:8px;margin:13px 0 10px}.code-slot{display:grid;width:clamp(46px,14vw,66px);aspect-ratio:.76;place-items:center;border:1px solid #346159;border-radius:9px;background:linear-gradient(#06100f,#0b1917);box-shadow:inset 0 0 14px #000b,0 0 0 1px #000;color:var(--cyan);font:500 clamp(32px,10vw,47px)/1 ui-monospace,SFMono-Regular,Consolas,monospace;text-shadow:0 0 8px var(--cyan),0 0 22px #28d8baaa;transition:.22s ease}.code-slot.empty:before{content:"·";color:#31534d;text-shadow:none}.code-slot.active{border-color:var(--cyan);box-shadow:inset 0 0 14px #000b,0 0 14px #76f7df44}.lock-panel.is-scanning .code-slot{animation:slot-scan .48s ease both}.lock-panel.is-success{border-color:var(--cyan);box-shadow:inset 0 1px #d3fff52e,0 0 40px #3effd54f}.lock-panel.is-error{border-color:#984a47;animation:panel-shake .35s ease}.scan-line{position:absolute;left:6%;right:6%;top:42px;height:1px;opacity:0;background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 9px var(--cyan)}.lock-panel.is-scanning .scan-line{animation:scan 620ms ease-in-out}.computer-message{position:relative;min-height:34px;margin:0;color:#c3d4d0;text-align:center;font-size:12px;line-height:1.4}.lock-panel.is-success .computer-message{color:var(--cyan-soft);font-weight:800;letter-spacing:.05em}.lock-panel.is-error .computer-message{color:#ffb4ae}.feedback{position:relative;display:grid;min-width:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px;margin-top:8px}.feedback[hidden]{display:none}.feedback-item{display:grid;min-width:0;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:6px;min-height:32px;border:1px solid #34554f;border-radius:8px;padding:5px 8px;background:#050a09;text-align:left}.feedback-item strong{font:700 17px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.feedback-item .feedback-label{font-size:9px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.feedback-item.exact{color:var(--cyan-soft);cursor:default}.feedback-item.exact:disabled{opacity:1}.feedback-item.exact.can-help{cursor:pointer;border-color:#73d9c3;box-shadow:0 0 15px #76f7df28}.feedback-item.exact.can-help:hover{border-color:var(--cyan);background:#0c211d}.feedback-item.exact.helped{border-color:#467a6e}.feedback-item.exact .feedback-icon{color:var(--cyan);text-shadow:0 0 8px var(--cyan)}.feedback-item.misplaced{color:#ffe0a8}.feedback-item.misplaced .feedback-icon{color:var(--amber);text-shadow:0 0 8px var(--amber)}.help-indicator{display:grid;width:20px;height:20px;place-items:center;border:1px solid currentColor;border-radius:50%;font:800 11px/1 system-ui,sans-serif}
.code-slot{position:relative;padding:0;cursor:default}.code-slot.fixable,.code-slot.fixed{cursor:pointer}.code-slot.fixable:hover{border-color:#b4ffe8;box-shadow:inset 0 0 17px #0008,0 0 18px #76f7df55}.code-slot.fixed{border:2px solid #83ffc9;background:linear-gradient(155deg,#164e3b,#09251d);color:#effff8;box-shadow:inset 0 0 18px #42ffb42b,0 0 0 2px #83ffc929,0 0 22px #42ffb466;text-shadow:0 0 7px #fff,0 0 20px #42ffb4}.code-slot.fixed:after{content:"✓";position:absolute;right:4px;top:3px;color:#d8ffeb;font:800 11px/1 system-ui,sans-serif;text-shadow:0 0 8px #42ffb4}.code-slot:disabled{opacity:1}
.attempt-log{min-height:86px;margin:9px 0 8px}.log-heading{display:flex;align-items:center;justify-content:space-between;margin:0 2px 5px}.log-heading h2,.log-heading span{margin:0;color:var(--muted);font-size:9px;font-weight:850;letter-spacing:1.25px}.log-heading span{color:#5e8179}.attempt-log ol{display:flex;gap:7px;min-height:58px;margin:0;padding:1px 1px 6px;overflow-x:auto;list-style:none;scrollbar-color:#315d54 transparent;scrollbar-width:thin}.attempt-row{flex:0 0 auto;min-width:116px;border:1px solid #294b44;border-radius:9px;padding:7px 9px;background:#08100f}.attempt-row:last-child{border-color:#4c8278;box-shadow:0 0 12px #76f7df14}.attempt-code{display:flex;align-items:center;justify-content:space-between;gap:8px}.attempt-code strong{color:#d9fff8;font:650 17px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:3px}.attempt-code small{color:#66847e;font:700 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.attempt-clues{display:flex;gap:10px;margin-top:7px;font:700 10px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.attempt-clues .exact{color:var(--cyan)}.attempt-clues .misplaced{color:var(--amber)}.empty-log{display:grid;width:100%;place-items:center;border:1px dashed #28463f;border-radius:9px;color:#68847e;font-size:11px}
.keypad{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;width:100%}.digit-key{position:relative;min-height:50px;border:1px solid #3d6f65;border-radius:10px;background:linear-gradient(160deg,#13201e,#09100f);box-shadow:inset 0 1px #d7fff51c,0 4px 0 #020504;color:var(--cyan-soft);font:650 22px/1 ui-monospace,SFMono-Regular,Consolas,monospace;text-shadow:0 0 10px #76f7df66;transition:transform .16s var(--spring),border-color .18s,background .18s}.digit-key:before{content:"";position:absolute;inset:4px;border-top:1px solid #76f7df12;border-radius:6px}.digit-key:hover:not(:disabled){border-color:var(--cyan);background:#132b27}.digit-key:active:not(:disabled){transform:translateY(3px);box-shadow:inset 0 1px #d7fff51c,0 1px 0 #020504}.digit-key:disabled{opacity:.24}.input-actions{display:grid;grid-template-columns:.8fr 2fr;gap:8px;margin-top:9px}.delete-button,.unlock-button{position:relative;display:flex;min-height:49px;align-items:center;justify-content:center;gap:8px;border-radius:10px;font-weight:850}.delete-button{border:1px solid #4f6964;background:#0b1110;color:#aebfbb;font-size:12px}.delete-button span:first-child{font-size:19px}.unlock-button{overflow:hidden;border:1px solid var(--cyan);background:linear-gradient(105deg,#4ee5ca,#a4ffec 52%,#4ee5ca);color:#04100d;box-shadow:0 0 20px #4ee5ca2e;text-transform:uppercase;font-size:12px;letter-spacing:.06em}.unlock-button:disabled{border-color:#37524c;background:#172321;color:#6b827d;box-shadow:none;opacity:.65}.unlock-button:not(:disabled):active{transform:scale(.98)}.button-scan{position:absolute;inset:0;transform:translateX(-120%);background:linear-gradient(90deg,transparent,#fff7,transparent)}.unlock-button:not(:disabled):hover .button-scan{animation:button-scan .7s ease}.ad-reservation{display:grid;min-height:27px;place-items:center;margin-top:7px;border:1px dashed #294139;border-radius:8px;color:#52665f;font-size:7px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
dialog{width:min(calc(100% - 28px),430px);max-height:calc(100dvh - 28px);margin:auto;overflow:auto;border:1px solid #4b8d80;border-radius:20px;background:linear-gradient(145deg,#111b19,#070a09 70%);color:var(--ink);padding:22px;box-shadow:0 32px 110px #000e}dialog::backdrop{background:#000d;backdrop-filter:blur(8px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}.dialog-top h2,dialog h2{margin:0;color:var(--gold-soft);font:400 31px/1.05 Georgia,serif}.dialog-top .eyebrow{margin:0 0 6px}.dialog-top .icon-button{width:38px;height:38px;font-size:17px}.eyebrow{margin:0 0 9px;color:var(--cyan);font-size:10px;font-weight:850;letter-spacing:1.5px}.length-fieldset{margin:0 0 10px;border:0;padding:0}.length-fieldset legend{margin-bottom:9px;color:#d8e5e1;font-size:14px}.length-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.length-options label{cursor:pointer}.length-options input{position:absolute;opacity:0;pointer-events:none}.length-options span{display:grid;min-height:72px;place-items:center;align-content:center;gap:5px;border:1px solid #365c54;border-radius:11px;background:#09100f}.length-options b{color:var(--cyan-soft);font:700 25px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.length-options small{color:var(--muted);font-size:10px}.length-options input:checked+span{border-color:var(--cyan);background:#11312b;box-shadow:0 0 16px #76f7df2e}.length-options input:focus-visible+span{outline:3px solid var(--cyan-soft);outline-offset:3px}.switch-row{display:flex;min-height:52px;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);cursor:pointer}.switch-row span{font-size:14px}.switch-row input{appearance:none;width:40px;height:24px;margin:0;flex:0 0 40px;border:1px solid #67817a;border-radius:20px;background:#293330;position:relative}.switch-row input:before{content:"";position:absolute;width:16px;height:16px;top:3px;left:3px;border-radius:50%;background:#ecf7f3;transition:transform .2s}.switch-row input:checked{background:var(--cyan);border-color:var(--cyan)}.switch-row input:checked:before{transform:translateX(16px);background:#07100e}.primary-button{display:flex;width:100%;min-height:49px;align-items:center;justify-content:center;border:1px solid var(--gold);border-radius:11px;background:var(--gold);color:#0a0906;font-weight:800}.primary-button:hover{background:var(--gold-soft)}#settings-form>.primary-button{margin-top:16px}.secondary-button{min-height:48px;border:1px solid #6f857f;border-radius:10px;background:transparent;padding:8px 12px}.dialog-buttons{display:flex;gap:8px;margin-top:22px}.dialog-buttons .primary-button{flex:1}.dialog-note{margin:10px 0 0;color:var(--muted);font-size:12px;line-height:1.5}.record-panel{padding:14px;border:1px solid #35584f;border-radius:12px;background:#050908}.record-grid{display:grid;grid-template-columns:1fr auto;gap:9px;color:#c4d5d1;font-size:13px}.record-grid strong{color:var(--cyan-soft);font-size:14px;text-align:right}.rules h3{margin:22px 0 8px;color:var(--gold-soft);font:400 24px/1.1 Georgia,serif}.rules p,dialog>p{color:#d2dedb;font-size:14px;line-height:1.55}.clue-rule{display:flex;align-items:flex-start;gap:12px;margin:12px 0;padding:10px;border:1px solid #35554f;border-radius:10px;background:#07100f}.clue-rule>span{padding-top:2px;font-size:21px}.clue-rule p{margin:0}.clue-rule.exact>span{color:var(--cyan);text-shadow:0 0 9px var(--cyan)}.clue-rule.misplaced>span{color:var(--amber);text-shadow:0 0 9px var(--amber)}.control-rule{display:flex;align-items:flex-start;gap:12px;margin:12px 0}.control-rule p{margin:5px 0}.control-symbol{flex:0 0 36px;height:36px;display:grid;place-items:center;border:1px solid #554625;border-radius:50%;background:#15130e;color:#ecd59c;font-size:22px}.sound-muted{opacity:.55}.result-dialog{text-align:center}.result-lock{position:relative;width:72px;height:60px;margin:6px auto 20px;border:3px solid var(--cyan);border-radius:13px;box-shadow:0 0 27px #76f7df55}.result-lock:before{content:"";position:absolute;left:17px;top:-32px;width:32px;height:35px;border:3px solid var(--cyan);border-bottom:0;border-radius:18px 18px 0 0;transform:translateX(7px) rotate(20deg);transform-origin:left bottom}.result-lock span{position:absolute;left:50%;top:17px;width:8px;height:19px;transform:translateX(-50%);border-radius:50% 50% 3px 3px;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}.revealed-code{display:block;margin:17px 0;color:var(--cyan-soft);font:650 43px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.18em;text-indent:.18em;text-shadow:0 0 16px var(--cyan)}.result-best{padding:11px;border-radius:9px;background:#12302a;color:var(--cyan-soft)!important}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation:none!important;transition-duration:.01ms!important}
.mode-fieldset{margin:14px 0 10px;border:0;padding:0}.mode-fieldset legend{margin-bottom:9px;color:#d8e5e1;font-size:14px}.mode-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mode-options label{cursor:pointer}.mode-options input{position:absolute;opacity:0;pointer-events:none}.mode-options span{display:grid;min-height:76px;place-items:center;align-content:center;gap:7px;border:1px solid #365c54;border-radius:11px;background:#09100f;padding:8px;text-align:center}.mode-options b{color:var(--cyan-soft);font-size:15px;letter-spacing:.08em;text-transform:uppercase}.mode-options small{color:var(--muted);font-size:10px;line-height:1.25}.mode-options input:checked+span{border-color:var(--cyan);background:#11312b;box-shadow:0 0 16px #76f7df2e}.mode-options input:focus-visible+span{outline:3px solid var(--cyan-soft);outline-offset:3px}.record-grid-modes{grid-template-columns:1fr auto auto;align-items:center}.record-grid-modes>b{color:var(--gold-soft);font-size:11px;text-align:right;text-transform:uppercase}.record-grid-modes strong{min-width:62px}
@keyframes signal{50%{opacity:.35;box-shadow:0 0 3px var(--cyan)}}@keyframes scan{0%{top:42px;opacity:0}20%{opacity:1}80%{opacity:1}100%{top:154px;opacity:0}}@keyframes slot-scan{0%{filter:brightness(1)}50%{filter:brightness(1.8);transform:translateY(-2px)}100%{filter:brightness(1)}}@keyframes panel-shake{25%{transform:translateX(-5px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}}@keyframes button-scan{to{transform:translateX(120%)}}
@media(max-width:370px){.game-shell{padding-inline:10px}.top-actions{gap:3px}.icon-button{width:36px;height:39px}.game-identity h1{font-size:28px}html[lang=de] .game-identity h1{font-size:25px}.code-display{gap:5px}.code-slot{width:44px}.digit-key{min-height:45px}.computer-message{font-size:11px}.feedback-item{padding-inline:6px}.feedback-item .feedback-label{font-size:8px}}
@media(max-height:750px){.game-shell{padding-top:8px}.topbar{margin-bottom:7px}.statusbar{margin-bottom:6px;padding-bottom:6px}.lock-panel{padding-block:9px}.code-display{margin-block:9px 7px}.code-slot{width:43px}.computer-message{min-height:31px}.attempt-log{min-height:71px;margin-block:6px}.attempt-log ol{min-height:49px}.attempt-row{padding-block:5px}.digit-key{min-height:42px}.input-actions{margin-top:7px}.delete-button,.unlock-button{min-height:42px}.ad-reservation{min-height:22px;margin-top:5px}}
@media(min-width:700px) and (orientation:portrait){.game-shell{width:min(100%,760px);padding:22px 30px 16px}.game-identity h1{font-size:43px}.topbar{margin-bottom:20px}.icon-button{width:48px;height:48px}.statusbar{margin-bottom:18px;padding-bottom:15px}.statusbar strong{font-size:31px}.lock-panel{padding:20px 28px 18px;border-radius:24px}.terminal-heading{font-size:11px}.code-display{gap:14px;margin:22px 0 16px}.code-slot{width:82px;font-size:56px}.computer-message{font-size:16px;min-height:45px}.feedback{max-width:560px;margin:12px auto 0}.feedback-item{min-height:45px;padding-inline:14px}.feedback-item .feedback-label{font-size:11px}.attempt-log{min-height:112px;margin-block:17px 13px}.attempt-log ol{min-height:78px}.attempt-row{min-width:155px;padding:11px 13px}.attempt-code strong{font-size:22px}.attempt-clues{margin-top:12px;font-size:13px}.keypad{gap:12px}.digit-key{min-height:68px;font-size:28px}.input-actions{gap:12px;margin-top:14px}.delete-button,.unlock-button{min-height:62px;font-size:15px}.ad-reservation{min-height:38px;margin-top:13px}}
@media(min-width:800px) and (orientation:landscape){.game-shell{width:min(100%,960px);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);grid-template-rows:auto auto auto 1fr auto;gap:0 24px;padding-inline:28px}.topbar,.statusbar,.ad-reservation{grid-column:1/-1}.lock-panel{grid-column:1;grid-row:3/5;align-self:start;padding:17px 22px}.attempt-log{grid-column:1;grid-row:5;margin-right:0}.keypad{grid-column:2;grid-row:3;align-self:start;margin-top:0}.digit-key{min-height:57px}.input-actions{grid-column:2;grid-row:4;align-self:start}.ad-reservation{grid-row:6}.code-slot{width:63px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition-duration:.01ms!important}}
.feedback-item:disabled{opacity:1}.feedback-item.misplaced{cursor:default}.feedback-item.misplaced.can-help{cursor:pointer;border-color:#a77a28;box-shadow:0 0 15px #b77c182c}.feedback-item.misplaced.can-help:hover{border-color:var(--amber);background:#211a0c}.feedback-item.misplaced.helped{border-color:#705722}.code-slot.misplaced-hint{border:2px solid #c69435;background:linear-gradient(155deg,#3a2d13,#171207);color:#fff3cc;box-shadow:inset 0 0 18px #ffc96920,0 0 0 2px #b9822527,0 0 19px #a96d154d;text-shadow:0 0 7px #ffe6aa,0 0 18px #b77c18}.code-slot.misplaced-hint:after{content:"◇";position:absolute;right:4px;top:2px;color:#ffe1a0;font:900 13px/1 system-ui,sans-serif;text-shadow:0 0 8px #d68a1b}