@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@500;700;800&display=swap');
html{-webkit-text-size-adjust:100%;touch-action:manipulation}.mode-switch{display:flex;gap:18px;align-items:center;min-height:42px;border-bottom:1px solid #aaa395;font:800 9px 'DM Mono'}.mode-switch a,.mode-switch span{color:var(--ink);text-decoration:none}.mode-switch .active{color:var(--red)}.mode-switch .friend-mode{display:flex;align-items:center;gap:8px}.mode-switch .friend-mode b{font:inherit}.mode-switch .friend-mode small{padding:3px 5px;background:var(--yellow);border:1px solid var(--ink);color:var(--ink);font:800 7px 'DM Mono'}
.diagonal-demo{display:grid;grid-template-columns:repeat(2,34px);gap:5px;justify-content:center;position:relative}.diagonal-demo i{display:grid;place-items:center;height:30px;border:2px solid var(--ink);background:#58b7c8;font-style:normal;font-weight:800}.diagonal-demo b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:25px;height:25px;display:grid;place-items:center;border:2px solid var(--ink);background:#ef7947;color:white}.give-demo{display:flex;align-items:center;justify-content:center;gap:5px}.give-demo i{padding:8px 5px;border:2px solid var(--ink);font:800 7px 'DM Mono';font-style:normal}.give-demo i:first-child{background:#58b7c8}.give-demo i:last-child{background:#ef7947}.give-demo b{font-size:14px}
.intro-rules .figures-rule{grid-column:1/-1;grid-template-columns:105px 1fr;min-height:92px}.intro-rules .figures-rule p{max-width:480px}
.tutorial-skip{width:100%;margin-top:10px;border:0;background:transparent;text-decoration:underline;font:800 9px 'DM Mono';cursor:pointer}.tutorial-overlay{position:fixed;z-index:55;inset:0;display:grid;place-items:center;padding:18px;background:#171713df;overflow:auto}.tutorial-card{width:min(520px,100%);padding:22px;border:3px solid var(--ink);background:var(--paper);box-shadow:9px 9px 0 var(--yellow)}.tutorial-card h2{margin:5px 0 7px;font-size:29px;line-height:1}.tutorial-card>p{min-height:43px;margin:0 0 13px;font-size:12px;line-height:1.45;color:#625d53}.tutorial-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.tutorial-cell{position:relative;aspect-ratio:1;border:3px solid var(--ink);overflow:hidden;background:#ef7947;box-shadow:2px 2px 0 var(--ink);transition:background .16s,transform .16s,box-shadow .16s}.tutorial-cell:before{content:'';position:absolute;inset:7%;border-radius:50%;background:url('assets/cat-head-v3.jpg') center/cover;filter:hue-rotate(325deg) saturate(1.15);transition:filter .16s,transform .16s}.tutorial-cell.blue{background:#58b7c8}.tutorial-cell.blue:before{filter:hue-rotate(145deg) saturate(1.45)}.tutorial-cell.target{cursor:pointer;animation:tutorialTarget .45s infinite alternate}.tutorial-cell.target:after{content:'НАЖМИ';position:absolute;left:3px;right:3px;bottom:3px;padding:3px 1px;background:var(--yellow);border:1px solid var(--ink);font:900 6px 'DM Mono';text-align:center}.tutorial-cell.reached:before{transform:rotate(25deg) scale(1.07)}.tutorial-cell.figure{z-index:2;box-shadow:0 0 0 4px var(--yellow),2px 2px 0 6px var(--ink)}.tutorial-cell.figure:after{content:'+3';position:absolute;right:2px;top:2px;padding:2px;background:var(--yellow);border:1px solid var(--ink);font:900 7px 'DM Mono'}.tutorial-cell.danger{animation:tutorialDanger .38s infinite alternate}.tutorial-message{min-height:35px;margin:13px 0 0;padding:9px;border:2px solid var(--ink);background:#f7f1e4;font:800 9px/1.4 'DM Mono';text-align:center}.tutorial-card>.primary{width:100%;margin-top:11px}.tutorial-card.busy .tutorial-grid{pointer-events:none}@keyframes tutorialTarget{to{transform:translateY(-2px);box-shadow:0 0 0 5px #f1dc3577,2px 3px 0 var(--ink)}}@keyframes tutorialDanger{to{box-shadow:0 0 0 5px #ef4d3477,2px 3px 0 var(--ink)}}
.rules-lead{max-width:610px;margin:-7px 0 16px;font-size:12px;line-height:1.5;color:#5f5a50}.rules-lead:before{content:'ВАЖНО · ';font:800 9px 'DM Mono';color:var(--red)}
.language-switch{position:fixed;z-index:100;right:12px;bottom:12px;display:grid;place-items:center;width:46px;height:46px;border:3px solid var(--ink);background:var(--yellow);color:var(--ink);box-shadow:4px 4px 0 var(--ink);font:900 13px 'DM Mono';text-decoration:none}.lang-en .rules-lead:before{content:'IMPORTANT · '}.lang-en .howto-overlay:before{content:'READ THE RULES'}.lang-en .tutorial-cell.target:after{content:'CLICK'}.lang-en .machine.escaping:after{content:'MOVE FASTER'}.lang-en .machine.fatal-center:after{content:'SURROUNDED'}.lang-en .machine.preview-source:after{content:'CLICK'}.lang-en .machine.move-source:after{content:'UNCHANGED'}.lang-en .machine.wave-emitter:after{content:'WAVE'}.lang-en .machine.wave-front:before{content:'STEP ' attr(data-wave-step)}.lang-en .machine.wave-next:before{content:'NEXT'}.lang-en .machine.armed-pattern:before{content:'SHAPE'}
.mode-overlay{position:fixed;z-index:49;inset:0;display:grid;place-items:center;padding:18px;background:#171713df}.mode-card{width:min(440px,100%);padding:26px;border:3px solid var(--ink);background:var(--paper);box-shadow:9px 9px 0 var(--yellow)}.mode-card h2{margin:6px 0 22px;font-size:34px}.mode-card .primary,.mode-card .secondary{width:100%;height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;text-decoration:none;color:var(--ink);font-size:12px}.mode-card .secondary{justify-content:center;margin-top:12px;background:#f7f1e4}
.mode-card .trial-hint{margin:10px 0 0;color:#706b60;font:800 8px/1.45 'DM Mono'}
.helper-promo{position:relative;margin-top:18px;padding:14px;border-top:2px solid var(--ink);background:#d9e9e8}.helper-promo-close{position:absolute;top:7px;right:7px;width:25px;height:25px;padding:0;border:2px solid var(--ink);background:var(--paper);color:var(--ink);font:800 18px/19px Manrope;cursor:pointer}.helper-promo-close:hover{background:var(--yellow)}.helper-promo .eyebrow{max-width:calc(100% - 28px);margin-bottom:7px;font-size:7px;line-height:1.4}.helper-promo>b{display:block;padding-right:25px;font-size:14px;line-height:1.25}.helper-promo p{margin:6px 0 11px;color:#5e5a50;font-size:10px;line-height:1.45}.helper-promo>a{min-height:38px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border:2px solid var(--ink);background:var(--paper);color:var(--ink);box-shadow:2px 2px 0 var(--ink);font:800 9px 'DM Mono';text-decoration:none}.helper-promo>a:hover{background:var(--yellow)}
@media(max-width:520px){.mode-card{padding:20px}.mode-card h2{margin-bottom:16px;font-size:30px}.helper-promo{margin-top:14px;padding:11px}.helper-promo p{font-size:9px}.helper-promo>a{min-height:36px}}
.nickname-card p{margin:-10px 0 18px;color:#706b60;font-size:12px;line-height:1.45}.nickname-card label{display:grid;gap:7px;font:800 8px 'DM Mono'}.nickname-card input{width:100%;height:50px;padding:0 13px;border:3px solid var(--ink);background:#fff;font:700 16px Manrope}.nickname-card small{display:block;min-height:28px;padding-top:7px;color:#c42f1c;font:800 9px 'DM Mono'}
.hidden{display:none!important}.howto-overlay{position:fixed;z-index:50;inset:0;display:grid;place-items:center;padding:18px;background:#171713df;overflow:auto}.howto-card{width:min(680px,100%);padding:24px;border:3px solid var(--ink);background:var(--paper);box-shadow:9px 9px 0 var(--yellow)}.howto-card h2{margin:5px 0 17px;font-size:32px;line-height:1}.intro-rules{display:grid;grid-template-columns:1fr 1fr;border-top:2px solid var(--ink);border-left:2px solid var(--ink)}.intro-rules article{display:grid;grid-template-columns:105px 1fr;gap:13px;align-items:center;min-height:116px;padding:12px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);background:#f7f1e4}.intro-rules p{display:grid;gap:5px;margin:0}.intro-rules p b{font-size:13px;line-height:1.2}.intro-rules p span{font-size:10px;line-height:1.4;color:#706b60}.color-demo,.fill-demo{display:flex;gap:5px;justify-content:center}.color-demo i,.fill-demo i{width:37px;height:37px;border:3px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}.color-demo i:first-child,.fill-demo i{background:#58b7c8}.color-demo i:last-child{background:#ef7947}.fill-demo i:nth-child(1){opacity:.35}.fill-demo i:nth-child(2){opacity:.65}.clock-demo{display:grid;grid-template-columns:repeat(3,25px);grid-template-rows:repeat(3,25px);gap:2px;justify-content:center}.clock-demo i,.clock-demo b{display:grid;place-items:center;border:1px solid var(--ink);background:var(--yellow);font:800 8px 'DM Mono';font-style:normal}.clock-demo b{background:var(--ink);color:white}.shape-demo{display:flex;gap:7px;align-items:center;justify-content:center}.shape-demo i{font:800 8px/1.05 'DM Mono';font-style:normal;color:#168da4;white-space:nowrap}.rules-intro .primary{width:100%;height:48px;margin-top:16px;font-size:13px}.howto-overlay:before{content:'ПРАВИЛА ОБЯЗАТЕЛЬНЫ';position:fixed;top:10px;right:13px;color:white;font:800 8px 'DM Mono';letter-spacing:.15em}
@media(max-width:620px){.howto-overlay{place-items:start center;padding:12px}.howto-card{padding:15px;box-shadow:5px 5px 0 var(--yellow)}.howto-card h2{font-size:25px;margin-bottom:12px}.intro-rules{grid-template-columns:1fr}.intro-rules article,.intro-rules .figures-rule{grid-column:1;grid-template-columns:88px 1fr;min-height:91px;padding:8px}.intro-rules p b{font-size:12px}.intro-rules p span{font-size:9px}.color-demo i,.fill-demo i{width:29px;height:29px}.clock-demo{grid-template-columns:repeat(3,21px);grid-template-rows:repeat(3,21px)}.rules-intro .primary{margin-top:11px;height:46px;font-size:10px}.howto-overlay:before{display:none}}
:root{--ink:#171713;--paper:#e5dfcf;--yellow:#f1dc35;--red:#ef4d34;--green:#b8d83e}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,sans-serif}.app-shell{min-height:100vh;padding:22px 32px;background:linear-gradient(105deg,#ede7d7 0 73%,#d5cfbf 73%)}.masthead{height:90px;border-bottom:3px solid var(--ink);display:flex;justify-content:space-between;align-items:flex-start}.eyebrow{font:500 10px 'DM Mono';letter-spacing:.16em;color:#706b60}.masthead h1{font-size:40px;letter-spacing:-.06em;margin:2px 0}.score{text-align:right;border:3px solid var(--ink);padding:7px 13px;background:var(--yellow);box-shadow:3px 3px 0 var(--ink);min-width:100px}.score small{display:block;font:500 8px 'DM Mono'}.score strong{font-size:30px}.game-layout{display:grid;grid-template-columns:minmax(650px,1fr) 320px;min-height:calc(100vh - 135px)}.game-stage{padding:17px 26px 20px 0;border-right:3px solid var(--ink);min-width:0}.message-bar{display:flex;gap:10px;align-items:center;height:34px;font:500 10px 'DM Mono';letter-spacing:.06em}.message-bar #turnText{margin-left:auto}.live-dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px #b8d83e44}.machine-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:11px}.machine{position:relative;min-width:0;aspect-ratio:.84;padding:9px;border:3px solid var(--ink);border-radius:4px 4px 13px 13px;background:#d9d3c4;box-shadow:4px 5px 0 var(--ink);color:var(--ink);cursor:default;overflow:hidden}.machine:nth-child(3n+2){background:#e4d662}.machine-top,.machine-foot{display:flex;justify-content:space-between;font:500 7px 'DM Mono';letter-spacing:.08em}.machine-top span:last-child{font-size:11px;border:2px solid var(--ink);background:var(--yellow);padding:2px 4px}.lamps{display:flex;gap:5px;height:22px;align-items:center}.lamps i{width:7px;height:7px;border:1px solid var(--ink);border-radius:50%;background:var(--red)}.lamps i:nth-child(2){background:var(--yellow)}.lamps i:nth-child(3){background:#85afb0}.lamps b{margin-left:auto;background:var(--ink);color:var(--yellow);font:500 6px 'DM Mono';padding:2px 5px}.door{width:min(88%,180px);aspect-ratio:1;margin:2px auto 8px;padding:8px;border:3px solid var(--ink);border-radius:50%;background:linear-gradient(135deg,#4a4943,#c8c2b5 48%,#3c3b36 51%)}.glass{width:100%;height:100%;overflow:hidden;border:3px solid var(--ink);border-radius:50%;background:#f3ecd8;box-shadow:inset 0 0 20px #2227}.cat-wrap{width:100%;height:100%;animation:spin 7s linear infinite}.cat-wrap img{width:100%;height:100%;object-fit:cover;display:block}.machine:nth-child(2n) img{filter:hue-rotate(35deg) saturate(.8)}.machine:nth-child(3n) img{filter:hue-rotate(185deg) saturate(.7)}.machine:nth-child(5n) img{filter:hue-rotate(305deg)}.machine-foot{align-items:center}.direction{border:1px solid var(--ink);background:#fff9;padding:3px 6px}.machine-foot em{font-style:normal;color:var(--red)}.warning-label{position:absolute;inset:auto 8px 8px;background:var(--red);color:white;border:2px solid var(--ink);padding:5px;font:500 7px 'DM Mono';opacity:0;transform:translateY(15px)}.machine.incoming{animation:warning .35s infinite alternate;cursor:pointer}.machine.incoming .warning-label{opacity:1;transform:none}.machine.incoming:after{content:'!';position:absolute;right:8px;top:44px;width:24px;height:24px;display:grid;place-items:center;background:var(--red);color:white;border:2px solid var(--ink);border-radius:50%;font-weight:800}.machine.player-move{animation:player .45s}.machine.reacting .glass{animation:reaction .65s}.chain-log{min-height:40px;border-top:1px solid #999285;margin-top:17px;padding-top:12px;display:flex;gap:7px;font:500 8px 'DM Mono';color:#746e61}.chain-log span{background:var(--yellow);color:var(--ink);border:1px solid var(--ink);border-radius:99px;padding:5px 8px}.side-panel{padding:25px 0 20px 25px;display:flex;flex-direction:column}.side-panel h2{font-size:31px;line-height:1.02;letter-spacing:-.05em;margin:5px 0 18px}.rule-card{display:grid;grid-template-columns:33px 1fr;gap:10px;border-top:1px solid #aaa395;padding:10px 0}.rule-card span{width:28px;height:28px;display:grid;place-items:center;border:2px solid var(--ink);background:var(--yellow);font:500 10px 'DM Mono'}.rule-card p,.danger-card p{font-size:11px;line-height:1.45;margin:0}.danger-card{background:var(--ink);color:white;padding:11px;margin:8px 0 15px}.danger-card b{font:500 9px 'DM Mono';color:var(--red)}.primary,.secondary{height:42px;border:3px solid var(--ink);font-weight:800;cursor:pointer}.primary{background:var(--yellow);display:flex;justify-content:space-between;align-items:center;padding:0 13px;box-shadow:3px 3px 0 var(--ink)}.secondary{margin-top:8px;background:transparent}.score-help{margin-top:auto;font:500 9px/1.7 'DM Mono';color:#716b5f}.game-over .app-shell{box-shadow:inset 0 0 0 12px var(--red)}.game-over .live-dot{background:var(--red)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes warning{to{background:var(--yellow);box-shadow:0 0 0 7px #f1dc3566,4px 5px 0 var(--ink);transform:translateY(-2px)}}@keyframes player{50%{transform:scale(.96);background:#fff}}@keyframes reaction{30%{box-shadow:inset 0 0 25px white,0 0 0 8px var(--red);transform:scale(.94)}}@media(max-width:950px){.game-layout{grid-template-columns:1fr}.game-stage{border-right:0}.side-panel{border-top:3px solid var(--ink);padding-left:0}.score-help{margin-top:20px}}@media(max-width:680px){.app-shell{padding:15px}.machine-grid{grid-template-columns:repeat(2,1fr)}.masthead h1{font-size:31px}.game-stage{padding-right:0}}