/* DNS Escape Room: styles (same-origin, no external assets) */
.gamehd .by{font-size:15px;font-weight:500;color:var(--dim);white-space:nowrap;margin-left:6px}
.fic-badge{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.08em;padding:2px 8px;border-radius:999px;background:#fdf3dc;color:var(--warn);border:1px solid #e6c77f;margin-right:8px;vertical-align:2px}
.game{margin:20px 0 8px}
.game .topbar{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;margin-bottom:12px}
.stepper{list-style:none;margin:0;padding:0;display:flex;gap:6px;flex-wrap:wrap}
.stepper li{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--dim)}
.stepper .n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:12px;background:var(--card2);border:1px solid var(--line);color:var(--dim)}
.stepper li.done .n{background:var(--ok);border-color:var(--ok);color:#fff}
.stepper li.cur .n{background:var(--acc);border-color:var(--acc);color:#fff;box-shadow:0 0 0 3px rgba(11,92,173,.18)}
.stepper li.cur .nm{color:var(--fg);font-weight:700}
.stepper li:not(:last-child):after{content:"";width:10px;height:2px;background:var(--line);margin-left:2px}
@media(max-width:560px){.stepper .nm{display:none}.stepper li.cur .nm{display:inline}.stepper li:not(:last-child):after{width:6px}}
.meter{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--mut);font-weight:600}
.pips{display:flex;gap:4px}.pip{width:16px;height:16px;border-radius:50%;border:2px solid var(--line);background:#fff}
.pip.on{background:var(--bad);border-color:var(--bad);animation:pop .3s}
@keyframes pop{50%{transform:scale(1.35)}}
.game .card{display:block;padding:22px;border-radius:14px;box-shadow:0 2px 14px rgba(0,0,0,.04)}
.game .card:hover{border-color:var(--line)}
.game .kick{margin:0 0 4px;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--acc)}
.game h2{font-size:26px;line-height:1.2;margin:0 0 10px;letter-spacing:-.01em}
.game h3.q{font-size:19px;margin:16px 0 10px}
.game p{margin:0 0 12px}
.game .story{font-size:18px;line-height:1.55;color:#222;outline:none}
.game :focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.game .fb:focus{outline:none}
.signs{margin:0 0 6px;padding:12px 14px 12px 32px;background:var(--card2);border:1px solid var(--line);border-radius:10px;font-size:16.5px}
.signs li{margin:3px 0}
.learn{background:var(--accbg);border:1px solid #c4d8ef;border-radius:10px;padding:10px 14px;margin:12px 0;font-size:16px;color:#0a3f78}
.how{margin:0 0 12px;padding-left:22px}.how li{margin:4px 0}
.fic{font-size:14.5px;color:var(--warn);background:#fdf7e8;border:1px solid #e6c77f;border-radius:8px;padding:8px 12px}
.opts{display:grid;gap:10px}
.opt{display:block;width:100%;text-align:left;min-height:52px;padding:12px 16px;font:600 17px/1.35 var(--font);color:var(--fg);background:#fff;border:1.5px solid #bdbdb5;border-radius:12px;cursor:pointer;transition:border-color .15s,background .15s,transform .1s}
.opt:hover:not(:disabled){border-color:var(--acc);background:var(--accbg)}
.opt:active:not(:disabled){transform:scale(.99)}
.opt:disabled{cursor:default}
.opt.wrong{background:#fdf0ef;border-color:#e8aaa5;color:#7a2a24;text-decoration:line-through;text-decoration-thickness:1px}
.opt.picked{background:var(--accbg);border-color:var(--acc);color:#0a3f78}
.seq{margin:2px 0 0;padding:10px 14px 10px 34px;background:var(--card2);border:1px dashed #bdbdb5;border-radius:10px;min-height:44px;font-size:16px}
.seq:empty:before{content:"Your order shows here";color:var(--dim);margin-left:-20px}
.codein{width:140px;min-height:48px;font:700 22px var(--mono);letter-spacing:.12em;text-align:center}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:14px}
.row.tools{margin-top:12px}
.gbtn{min-height:48px;padding:10px 20px;font:700 16px var(--font);border-radius:12px;border:1.5px solid #bdbdb5;background:#fff;color:var(--fg);cursor:pointer}
.gbtn:hover:not(:disabled){border-color:var(--acc);color:var(--acc)}
.gbtn.primary{background:var(--acc);border-color:var(--acc);color:#fff}.gbtn.primary:hover:not(:disabled){background:#094a8c;color:#fff}
.gbtn.ghost{background:transparent}
.gbtn.small{min-height:44px;font-size:15px;padding:8px 14px}
.gbtn:disabled{opacity:.55;cursor:default}
@media(max-width:480px){.row .gbtn.primary{flex:1 1 100%}.game .card{padding:16px}.game h2{font-size:23px}}
.fb{margin-top:14px;border-radius:10px;font-size:16.5px}
.fb.ok,.fb.bad{padding:12px 14px;border:1px solid}
.fb.ok{background:#eef8f2;border-color:#9fd3b4;color:#0d5a32}
.fb.bad{background:#fdf0ef;border-color:#e8aaa5;color:#7a2a24}
.hint{margin-top:10px;padding:10px 14px;border-radius:10px;background:#fff8e1;border:1px solid #f0d98a;color:#5b4500;font-size:16px}
.hint[hidden]{display:none}
.nb{margin-top:16px;border-top:1px solid var(--line);padding-top:10px;font-size:15.5px}
.nb summary{cursor:pointer;font-weight:700;color:var(--mut);min-height:36px;display:flex;align-items:center}
.nb ul{margin:6px 0 0;padding-left:20px}.nb li{margin:3px 0}
.stats{display:flex;gap:12px;margin:14px 0}
.stats div{flex:1;text-align:center;padding:12px 6px;background:var(--card2);border:1px solid var(--line);border-radius:12px}
.stats b{display:block;font-size:26px;line-height:1.1}.stats span{font-size:12.5px;color:var(--dim);text-transform:uppercase;letter-spacing:.05em}
.game .lbl{display:block;font-weight:700;margin:14px 0 6px}
.share{width:100%;min-height:96px;font:15px/1.5 var(--font)!important;resize:none}
.copied{font-weight:700;color:var(--ok);font-size:15px}
.win{border-color:#9fd3b4;background:linear-gradient(180deg,#f3fbf6,#fff 40%)}
.lose{border-color:#e8aaa5;background:linear-gradient(180deg,#fdf5f4,#fff 40%)}
.lose .kick{color:var(--bad)}.win .kick{color:var(--ok)}
.explain{margin-top:18px;border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:#fff;font-size:15.5px}
.explain summary{cursor:pointer;font-weight:700;min-height:36px;display:flex;align-items:center}
.explain ul{padding-left:20px}.explain li{margin:6px 0}
.srcs{font-size:14.5px;color:var(--mut)}
.about-game{max-width:680px;margin-top:36px}
.about-game h2{margin-top:22px}
.about-game p,.about-game li{color:#2a2a2a}
.nojs{padding:16px;border:1px solid var(--line);border-radius:10px;background:var(--card)}
@media(prefers-reduced-motion:reduce){.pip.on{animation:none}.opt{transition:none}}