/*! Ninja Run v1.0.0 | ninjacado.gr */
.nr{
  --nr-bg:#E8EEE2; --nr-ink:#1B2416; --nr-muted:#5B6754; --nr-frame:#FFFFFF; --nr-chrome:#D5DFCC;
  --nr-avocado:#437A1E; --nr-error:#D9472F; --nr-ok:#2E7D4F; --nr-gold:#F2B632;
  --nr-font:inherit;
  --nr-mono:var(--font-mono,ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace);
  display:grid; gap:18px; max-width:940px; margin-inline:auto; color:var(--nr-ink); font-family:var(--nr-font);
}
.nr,.nr *,.nr *::before,.nr *::after{box-sizing:border-box}
.nr [hidden]{display:none!important}

.nr-browser{background:var(--nr-frame);border:2px solid var(--nr-ink);border-radius:14px;overflow:hidden;box-shadow:0 6px 0 var(--nr-ink)}
.nr-bar{display:flex;align-items:center;gap:10px;padding:9px 12px;background:var(--nr-chrome);border-bottom:2px solid var(--nr-ink)}
.nr-dots{display:flex;gap:6px;flex:none}
.nr-dots i{display:block;width:11px;height:11px;border-radius:50%;border:1.5px solid var(--nr-ink);background:var(--nr-frame)}
.nr-dots i:first-child{background:var(--nr-error)}
.nr-url{flex:1;min-width:0;font:500 12.5px/1.3 var(--nr-mono);color:var(--nr-ink);background:var(--nr-frame);border:1.5px solid var(--nr-ink);border-radius:999px;padding:5px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nr-dim{color:var(--nr-muted)}
.nr-status{flex:none;font:700 11.5px/1.3 var(--nr-mono);padding:4px 9px;border-radius:999px;color:#fff;background:var(--nr-ok);font-variant-numeric:tabular-nums}
.nr-status.err{background:var(--nr-error)}

.nr-stage{position:relative;height:clamp(250px,40vw,340px);touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer;background:#F3F7EF}
.nr-stage canvas{display:block;width:100%;height:100%;max-width:none}
.nr-overlay{position:absolute;inset:0;display:grid;place-items:safe center;padding:10px;overflow-y:auto;background:rgba(232,238,226,.66)}
.nr-card{background:var(--nr-frame);border:2px solid var(--nr-ink);border-radius:12px;box-shadow:0 4px 0 var(--nr-ink);padding:14px 18px;max-width:400px;width:100%;text-align:center;display:grid;gap:9px;cursor:default}
.nr .nr-card h2{margin:0;padding:0;font:800 clamp(18px,3vw,21px)/1.2 var(--nr-font);letter-spacing:-.02em;text-wrap:balance;color:var(--nr-ink);text-transform:none}
.nr .nr-card p{margin:0;padding:0;color:var(--nr-muted);font-size:13.5px;line-height:1.45}
.nr-keys{font:500 12px/1.6 var(--nr-mono);color:var(--nr-ink)}
.nr kbd{font:500 11px var(--nr-mono);color:var(--nr-ink);border:1.5px solid var(--nr-ink);border-bottom-width:3px;border-radius:5px;padding:1px 5px;background:var(--nr-frame);box-shadow:none}
.nr-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.nr-stats > div{border:1.5px solid var(--nr-chrome);border-radius:8px;padding:4px}
.nr-stats > div.nr-new{background:var(--nr-gold);border-color:var(--nr-ink)}
.nr-stats > div.nr-new span{color:var(--nr-ink);font-weight:700}
.nr-stats b{display:block;font:700 17px/1.3 var(--nr-mono);font-variant-numeric:tabular-nums}
.nr-stats span{display:block;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--nr-muted)}

.nr .nr-btn{appearance:none;-webkit-appearance:none;display:block;width:100%;margin:0;font:800 15px/1.2 var(--nr-font);text-transform:none;letter-spacing:normal;background:var(--nr-avocado);color:#fff;border:2px solid var(--nr-ink);border-radius:10px;padding:10px 18px;box-shadow:0 3px 0 var(--nr-ink);cursor:pointer}
.nr .nr-btn:hover{background:#467E1F;color:#fff}
.nr .nr-btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--nr-ink)}
.nr .nr-cta{color:var(--nr-ink);font-weight:700;font-size:13px;line-height:1.4;text-decoration:underline;text-decoration-color:var(--nr-avocado);text-underline-offset:3px}
.nr .nr-cta:hover{color:var(--nr-avocado)}
.nr .nr-btn:focus-visible,.nr .nr-cta:focus-visible,.nr .nr-pad button:focus-visible,.nr .nr-pausebtn:focus-visible{outline:3px solid var(--nr-gold);outline-offset:2px}

.nr .nr-pausebtn{appearance:none;-webkit-appearance:none;position:absolute;top:8px;left:50%;transform:translateX(-50%);margin:0;width:34px;height:30px;padding:0;display:grid;place-items:center;font:800 12px/1 var(--nr-mono);color:var(--nr-ink);background:rgba(255,255,255,.85);border:2px solid var(--nr-ink);border-radius:8px;box-shadow:0 2px 0 var(--nr-ink);cursor:pointer}

.nr-pad{display:none;grid-template-columns:1fr 1fr;gap:12px}
.nr .nr-pad button{appearance:none;-webkit-appearance:none;margin:0;font:800 16px/1.2 var(--nr-font);text-transform:none;padding:16px;border:2px solid var(--nr-ink);border-radius:12px;background:var(--nr-frame);color:var(--nr-ink);box-shadow:0 4px 0 var(--nr-ink);touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.nr .nr-pad button.on{background:var(--nr-chrome);transform:translateY(2px);box-shadow:0 2px 0 var(--nr-ink)}
@media (pointer:coarse){.nr-pad{display:grid}}

.nr .nr-legend h3{text-align:center;margin:0 0 12px;padding:0;font:700 13px/1.3 var(--nr-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--nr-muted)}
.nr-items{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.nr-item{flex:0 1 270px;display:flex;gap:10px;align-items:center;background:var(--nr-frame);border:1.5px solid var(--nr-chrome);border-radius:10px;padding:8px 10px;min-width:0}
.nr-item canvas{width:48px;height:40px;flex:none;max-width:none}
.nr-item > div{min-width:0}
.nr-item b{display:block;font-size:14px;color:var(--nr-ink)}
.nr-item span{display:block;font-size:12.5px;color:var(--nr-muted);line-height:1.35}

@media (max-width:560px){
  .nr-overlay{padding:8px}
  .nr-card{max-width:340px;padding:10px 12px;gap:6px;border-radius:10px;box-shadow:0 3px 0 var(--nr-ink)}
  .nr .nr-card h2{font-size:16px}
  .nr .nr-card p{font-size:12px;line-height:1.35}
  .nr-keys{font-size:11px}
  .nr-stats{gap:5px}
  .nr-stats > div{padding:3px 2px}
  .nr-stats b{font-size:14.5px}
  .nr-stats span{font-size:9px;letter-spacing:.04em}
  .nr .nr-card .nr-btn{font-size:14px;padding:7px 14px;box-shadow:0 2px 0 var(--nr-ink)}
  .nr .nr-cta{font-size:11.5px;line-height:1.35}
}
@media (prefers-reduced-motion:reduce){.nr .nr-btn:active,.nr .nr-pad button.on{transform:none}}
