/*
 * NEXAR HUB — η πύλη του πελάτη.
 *
 * ΦΩΤΕΙΝΟ ΑΠΟ ΠΡΟΕΠΙΛΟΓΗ. Το ζήτησε ο Τάσος, ρητά.
 *
 * Μέχρι την 1.1.0 το θέμα ακολουθούσε τον υπολογιστή του επισκέπτη
 * (prefers-color-scheme). Ακούγεται σωστό και είναι λάθος για ΑΥΤΗ τη σελίδα:
 * είναι η βιτρίνα της εταιρείας, και πρέπει να μοιάζει ίδια σε όλους — αλλιώς
 * ο πελάτης που τη βλέπει σκούρα και ο συνάδελφός του που τη βλέπει φωτεινή
 * δεν μιλάνε για το ίδιο πράγμα.
 *
 * ΣΚΟΥΡΟ ΒΓΑΙΝΕΙ ΜΟΝΟ ΜΕ ΤΟ ΚΟΥΜΠΙ, και τότε το θυμάται ο browser.
 * Καμία media query: όλα κρίνονται από το data-theme στο <html>, οπότε δεν
 * υπάρχει περίπτωση δύο κανόνες να διαφωνήσουν για το ποιος είναι πιο ειδικός.
 *
 * Χρώματα της μάρκας: σκούρο μπλε του λογοτύπου, πορτοκαλί #ff5a1f.
 */

:root{
  color-scheme:light;
  /* ΦΩΤΕΙΝΟ — η προεπιλογή */
  --bg:#f5f7fb; --bg2:#eef1f7;
  --card:#fff; --card2:#f7f9fc;
  --line:#e2e7f0; --line2:#cfd6e4;
  --text:#161d2b; --muted:#5b6577; --dim:#7b8598;
  --acc:#e8490f; --on-acc:#fff;
  --bad:#c0392b; --warn:#8a5e00; --good:#1a7a4f;
  --ring:rgba(232,73,15,.22);
  --shadow:0 1px 2px rgba(20,30,50,.06),0 8px 24px rgba(20,30,50,.07);
  /* η ετικέτα «Νέο» στο «Τι άλλαξε» — εδώ, όχι γραμμένη με το χέρι πιο κάτω */
  --chg-new:#1f9d55; --chg-new-tint:#1f9d55;
}
:root[data-theme=dark]{
  color-scheme:dark;
  --bg:#0f1218; --bg2:#141821;
  --card:#171c26; --card2:#1d2330;
  --line:#242b38; --line2:#333c4d;
  --text:#e8ecf3; --muted:#9aa5b8; --dim:#6f7b90;
  --acc:#ff5a1f; --on-acc:#fff;
  --bad:#e0563c; --warn:#e0a93d; --good:#5bbd8a;
  --ring:rgba(255,90,31,.32);
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 28px rgba(0,0,0,.34);
  --chg-new:#4fd98b; --chg-new-tint:#2ecc71;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);
  font:15px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  -webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%}
/* 1.2.7 — ΤΟ hidden ΚΕΡΔΙΖΕΙ ΠΑΝΤΑ ΣΤΙΣ ΣΕΛΙΔΕΣ ΤΗΣ ΠΥΛΗΣ (εύρημα του ελεγκτή). Ένα
   «.nh-app{display:grid}» νικούσε το hidden του browser: η αναζήτηση έγραφε «Καμία
   εφαρμογή» και άφηνε όλες τις κάρτες, και το «Εμφάνιση» φαινόταν χωρίς JavaScript.
   ΜΟΝΟ μέσα στην πύλη (.nh-portal): το nh.css το φορτώνει και το θέμα του
   NexarSpin σε όλο το site, και δεν πειράζουμε ξένα στοιχεία εκεί. */
.nh-portal [hidden]{display:none!important}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:6px}

/* ── το λογότυπο ─────────────────────────────────────────────────────────
   Δύο αρχεία, ένα ορατό. Η εναλλαγή γίνεται στο CSS ώστε να ακολουθεί ΚΑΙ
   όταν ο πελάτης γυρίσει το θέμα με τη σελίδα ανοιχτή. */
.nh-brand{display:inline-flex;align-items:center;flex:0 0 auto}
.nh-lg{display:block;height:26px;width:auto}
/* Το όνομα λέει το ΜΕΛΑΝΙ: -d = σκούρο μελάνι, άρα για ΦΩΤΕΙΝΟ φόντο. */
.nh-lg-l{display:none}
:root[data-theme=dark] .nh-lg-d{display:none}
:root[data-theme=dark] .nh-lg-l{display:block}

/* Το κουμπί φωτεινό/σκούρο: δύο εικονίδια μέσα, ένα ορατό κάθε φορά. */
.nh-theme{display:inline-grid;place-items:center;width:34px;height:34px;flex:0 0 auto;
  background:none;border:1px solid transparent;border-radius:10px;cursor:pointer;
  color:var(--muted);transition:color .12s,background .12s,border-color .12s}
.nh-theme:hover{color:var(--text);background:var(--card2);border-color:var(--line)}
.nh-theme .nh-i{grid-area:1/1}
.nh-theme .nh-ic-sun{display:none}
:root[data-theme=dark] .nh-theme .nh-ic-moon{display:none}
:root[data-theme=dark] .nh-theme .nh-ic-sun{display:block}

.nh-word{font:700 26px/1 system-ui;letter-spacing:-.5px;color:var(--text);margin:0 0 18px}
.nh-small{font-size:12.5px;color:var(--muted)}
.nh-btn{display:inline-block;background:var(--acc);color:var(--on-acc);border:0;
  border-radius:10px;padding:11px 17px;font:inherit;font-size:14.5px;font-weight:600;
  cursor:pointer;transition:filter .12s,transform .12s}
.nh-btn:hover{filter:brightness(1.07)}
.nh-btn:active{transform:translateY(1px)}
.nh-btn.nh-sm{padding:7px 12px;font-size:13px}
.nh-btn.nh-danger{background:var(--bad)}
.nh-err{background:color-mix(in srgb,var(--bad) 15%,transparent);
  border:1px solid var(--bad);border-radius:10px;padding:9px 12px;margin:0 0 13px;
  font-size:13.5px}
/* 1.2.0 — τα προγράμματα υπολογιστή στον Λογαριασμό: όνομα και κατάσταση,
   το κλειδί σε σταθερό πλάτος (μετράει κάθε χαρακτήρας), κουμπί αντιγραφής. */
.nh-prog{margin:0 0 12px}
.nh-prog-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 10px}
.nh-keyrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 0 8px}
.nh-key{font:600 14px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.04em;
  background:var(--bg2);border:1px solid var(--line2);border-radius:8px;padding:7px 10px;
  user-select:all;overflow-wrap:anywhere}
/* 1.2.1 — νέα έκδοση προγράμματος, μέσα στην κάρτα του: γκρι όταν απλώς
   ενημερώνει, πράσινο όταν ο υπολογιστής σου είναι πίσω. */
.nh-upd{border:1px solid var(--line2);border-left:4px solid var(--acc);border-radius:10px;
  padding:10px 12px;margin:10px 0 2px;background:var(--bg2)}
.nh-upd.is-new{border-left-color:var(--chg-new);
  background:color-mix(in srgb,var(--chg-new-tint) 10%,var(--bg2))}
.nh-upd p{margin:0 0 6px}
.nh-upd .nh-btn{margin-top:2px}
/* Οι σύνδεσμοι-κείμενο εδώ («Κατέβασμα ξανά», το email) να φαίνονται σύνδεσμοι:
   το γενικό a{} της πύλης τους κάνει ίδιους με το κείμενο. */
.nh-prog a:not(.nh-btn),.nh-prog + .nh-sub a{color:var(--acc);text-decoration:underline;text-underline-offset:2px}
/* 1.2.6 — η σελίδα του προγράμματος (το email κάτω από το κουτί, ο δρόμος
   πίσω) και, στον Λογαριασμό, η ΜΙΑ γραμμή «Προγράμματα: X →». */
.nh-back{margin:18px 0 0;font-size:13.5px}
/* 1.2.7 — η σελίδα του προγράμματος: «Η συνδρομή σου» και «Λήψη» δίπλα-δίπλα
   (όπως στη μακέτα που ενέκρινε ο Τάσος), η μία κάτω από την άλλη στο κινητό. */
.nh-pgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.nh-pcard{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px 24px;min-width:0}
.nh-pc-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 14px}
.nh-pc-hd h2{font-size:17px;margin:0;letter-spacing:-.2px}
.nh-pc-hd .nh-badge{align-self:center}
.nh-pcard.nh-prog{margin:0}
.nh-facts{display:grid;grid-template-columns:repeat(4,minmax(0,auto));gap:10px 22px;margin:0 0 14px;justify-content:start}
.nh-facts dt{font-size:12px;color:var(--dim);margin:0}
.nh-facts dd{margin:0;font-weight:650;font-size:14px;white-space:nowrap}
.nh-facts dd.nh-dev{white-space:normal;overflow-wrap:anywhere}
.nh-life{height:8px;border-radius:99px;background:var(--line2);overflow:hidden;margin:2px 0 6px}
.nh-life i{display:block;height:100%;background:var(--good)}
.nh-life.is-soon i{background:var(--warn)}
.nh-life.is-over i{background:var(--bad)}
.nh-left{margin:0}
.nh-lbl{display:block;font-size:12.5px;color:var(--muted);margin:16px 0 6px}
.nh-key-box{display:block;white-space:nowrap;overflow-x:auto;margin:0 0 8px}
.nh-key .nh-k-mask{display:none}
.nh-key.is-hid .nh-k-real{display:none}
.nh-key.is-hid .nh-k-mask{display:inline}
.nh-keybtns{display:flex;gap:8px;flex-wrap:wrap}
.nh-dl{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:0 0 10px}
.nh-dl.is-new{border-left:4px solid var(--chg-new);
  background:color-mix(in srgb,var(--chg-new-tint) 10%,var(--bg2))}
.nh-dl-t{min-width:0}
.nh-dl-t b{display:block;font-size:15px}
.nh-dl-t .nh-small{display:block}
.nh-dl .nh-btn{display:inline-flex;align-items:center;gap:8px}
.nh-dl-none{color:var(--muted);font-size:13.5px;background:var(--bg2);border:1px dashed var(--line2);
  border-radius:12px;padding:14px 16px;margin:0}
.nh-notes{white-space:pre-line;margin:0}
.nh-steps{margin:14px 0 0;padding-left:20px;color:var(--muted);font-size:13.5px}
.nh-steps li{margin:0 0 6px}
.nh-steps a{color:var(--acc);overflow-wrap:anywhere}
@media (max-width:1100px) and (min-width:901px){
  .nh-facts{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .nh-pgrid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .nh-pcard{padding:18px 16px}
  .nh-facts{grid-template-columns:1fr 1fr}
  .nh-key-box{font-size:12.5px;letter-spacing:.01em}
}
.nh-progline{margin:-8px 0 22px;color:var(--muted);font-size:13.5px}
.nh-back a,.nh-progline a{color:var(--acc);text-decoration:none}
.nh-back a:hover,.nh-progline a:hover{text-decoration:underline}
/* Το «έγινε» — ίδιο σχήμα με το λάθος, στο πράσινο της παλέτας (1.1.6). */
.nh-done{background:color-mix(in srgb,var(--good) 14%,transparent);
  border:1px solid var(--good);border-radius:10px;padding:9px 12px;margin:0 0 13px;
  font-size:13.5px}

/* ── σύνδεση / φραγή ── */
.nh-login,.nh-block{display:flex;align-items:center;justify-content:center;
  min-height:100vh;min-height:100dvh;padding:22px;
  background:radial-gradient(120% 90% at 50% -10%,var(--bg2) 0%,var(--bg) 62%)}
.nh-card{background:var(--card);border:1px solid var(--line);border-radius:18px;
  padding:30px 28px;width:100%;max-width:390px;box-shadow:var(--shadow)}
.nh-block .nh-card{max-width:470px;text-align:center}
.nh-card h1{font-size:19px;margin:0 0 10px}
.nh-card label{display:block;margin:0 0 13px;font-size:12.5px;color:var(--muted)}
.nh-card input[type=text],.nh-card input[type=password],.nh-card input:not([type]){
  width:100%;margin-top:6px;background:var(--bg2);border:1px solid var(--line2);
  border-radius:10px;padding:11px;color:var(--text);font:inherit;font-size:15px}
.nh-card input:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px var(--ring)}
.nh-card .nh-btn{width:100%;margin-top:6px}
/* 1.2.11 — ορισμός κωδικού / «Ξέχασα»: κουμπί-σύνδεσμος, ίδιο με το κουμπί της φόρμας */
.nh-card a.nh-btn{display:block;text-align:center;text-decoration:none;box-sizing:border-box}
.nh-card p{margin:0 0 13px;line-height:1.5}
.nh-card .nh-small a{color:var(--acc)}
.nh-card .nh-btn + .nh-small{margin-top:16px}
.nh-chk{display:inline-flex;align-items:center;gap:7px;margin-right:12px}
.nh-logo{max-width:176px;display:block;margin:0 auto 22px}
.nh-logo.nh-brand{display:flex;justify-content:center}
.nh-logo .nh-lg{height:30px}
/* Στη σελίδα εισόδου το λογότυπο στέκεται μόνο του, κεντραρισμένο· η μικρή
   φράση δίπλα του θα το έβγαζε από το κέντρο. */
.nh-logo .nh-strap{display:none}

/* ── η κεφαλίδα της πύλης ── */
.nh-top{border-bottom:1px solid var(--line);background:var(--card);
  position:sticky;top:0;z-index:5}
/* Η ΜΠΑΡΑ ΧΩΡΑΕΙ ΣΕ ΜΙΑ ΣΕΙΡΑ, ΚΑΙ ΤΟ ΞΕΡΟΥΜΕ ΜΕ ΜΕΤΡΗΣΗ.
   Με τον τέταρτο σύνδεσμο («Τι άλλαξε») το περιεχόμενο βγήκε 1138px μέσα σε
   1132px διαθέσιμα — ΕΞΙ εικονοστοιχεία — και η «Έξοδος» έπεφτε σε δεύτερη
   σειρά σε ΚΑΘΕ οθόνη. Τα νούμερα ξαναμετρήθηκαν και το περιθώριο είναι πλέον
   ~28px· η σουίτα μετράει ότι όλα κάθονται στην ίδια σειρά, ώστε ο πέμπτος
   σύνδεσμος να το σπάσει ΣΕ ΕΜΑΣ και όχι στην οθόνη του. */
.nh-top-in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:14px;
  padding:12px 24px;flex-wrap:wrap}
.nh-strap{margin-left:14px;padding-left:14px;border-left:1px solid var(--line);
  color:var(--dim);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  white-space:nowrap}
.nh-navs{display:flex;align-items:center;gap:2px;font-size:13.5px;margin-left:auto;min-width:0}
.nh-nav{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;
  border-radius:10px;color:var(--muted);position:relative;
  transition:background .12s,color .12s}
.nh-nav:hover{background:var(--card2);color:var(--text)}
.nh-i{flex:0 0 auto}
/* Η τρέχουσα σελίδα: χρώμα ΚΑΙ γραμμή από κάτω. Μόνο χρώμα δεν φτάνει —
   ο πελάτης που δεν ξεχωρίζει αποχρώσεις δεν θα καταλάβαινε πού βρίσκεται. */
.nh-nav.is-on{color:var(--acc)}
.nh-nav.is-on::after{content:"";position:absolute;left:11px;right:11px;bottom:-13px;
  height:2px;border-radius:2px;background:var(--acc)}
/* ΤΟ ΑΝΘΡΩΠΑΚΙ ΕΦΥΓΕ ΑΠΟ ΤΗΝ ΚΕΦΑΛΙΔΑ (1.0.9). Ο κύκλος με τα αρχικά, το όνομα
   και ο τίτλος του site δεν βοηθούσαν κανέναν — «ποιος είμαι» ζει στη σελίδα
   Λογαριασμός. Εδώ μένει μόνο η έξοδος, που είναι ενέργεια, όχι πληροφορία. */
.nh-out{margin-left:8px;padding:7px 12px;border-radius:9px;color:var(--bad);
  font-weight:600;font-size:13px;flex:0 0 auto}
.nh-out:hover{background:color-mix(in srgb,var(--bad) 12%,transparent)}

.nh-wrap{max-width:1180px;margin:0 auto;padding:0 24px 46px}

/* ── ο ήρωας ──
   Ο τίτλος αριστερά, το κύμα και το σλόγκαν δεξιά. Το κύμα είναι <svg> μέσα
   στη σελίδα: τεντώνεται σε κάθε πλάτος χωρίς να θολώσει, και δεν είναι
   δεύτερο αίτημα στον διακομιστή. */
.nh-hero{position:relative;display:grid;grid-template-columns:1fr auto;
  align-items:center;gap:24px;padding:46px 0 34px;overflow:hidden}
.nh-eyebrow{margin:0 0 10px;color:var(--dim);font-size:11px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase}
.nh-hero h1{font-size:44px;line-height:1.05;margin:0 0 12px;letter-spacing:-1.2px}
.nh-hero .nh-lead{font-size:17px;margin:0;color:var(--muted);max-width:44ch}
.nh-hero .nh-lead b{color:var(--text);font-weight:650}
.nh-hero-art{position:relative;width:min(430px,38vw);height:200px;
  pointer-events:none;flex:0 0 auto}
/* ΤΟ ΚΥΜΑ ΕΙΝΑΙ ΕΙΚΟΝΑ, ΟΧΙ ΓΡΑΜΜΕΣ ΠΟΥ ΣΧΕΔΙΑΣΑ ΕΓΩ.
   Η πρώτη προσπάθεια ήταν τρεις καμπύλες σε SVG και έμοιαζε με σεισμογράφο.
   Αυτό εδώ είναι το κύμα της μάρκας: μία απόχρωση σε διάφορες πυκνότητες, με
   όλη τη διακύμανση στη διαφάνεια — γι' αυτό δουλεύει και στα δύο θέματα. */
.nh-wave{position:absolute;left:-16%;right:-10%;top:50%;width:126%;height:auto;
  transform:translateY(-46%);opacity:.62}
/* ΤΟ ΣΛΟΓΚΑΝ ΜΙΚΡΥΝΕ ΑΠΟ 290 ΣΕ 230 — το ζήτησε ο Τάσος.
   Το ποσοστό (84%) μένει ως έχει: είναι το φρένο για στενά παράθυρα, όπου το
   σλόγκαν δεν πρέπει να βγει έξω από το κύμα ό,τι κι αν λέει το pixel όριο. */
.nh-slog{position:absolute;right:2px;top:50%;transform:translateY(-52%);
  width:min(230px,84%);height:auto}
/* Φωτεινό φόντο → σκούρο μελάνι. Το ανοιχτό μένει κρυφό μέχρι να ζητηθεί σκούρο. */
.nh-slog-l{display:none}
:root[data-theme=dark] .nh-slog-d{display:none}
:root[data-theme=dark] .nh-slog-l{display:block}
:root[data-theme=dark] .nh-wave{opacity:1}

.nh-wrap h1{line-height:1.2;margin:0 0 4px;letter-spacing:-.4px}
.nh-lead{color:var(--muted);font-size:14px;margin:0 0 26px}
.nh-h2{font-size:17px;margin:40px 0 4px;letter-spacing:-.2px}
.nh-h3{font-size:14px;margin:24px 0 8px}
.nh-sub{color:var(--muted);font-size:13.5px;margin:0 0 16px;max-width:70ch}
.nh-empty{color:var(--muted);background:var(--card);border:1px dashed var(--line2);
  border-radius:14px;padding:20px}
.nh-nohit{color:var(--muted);font-size:13.5px;padding:18px 2px;margin:0}
/* «Είσαι μέσα ως …» — ό,τι έδειχνε το ανθρωπάκι της κεφαλίδας, στο σωστό μέρος. */
.nh-who-row{margin:0 0 22px;color:var(--muted);font-size:13.5px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:11px 16px;display:inline-flex;gap:6px;flex-wrap:wrap}
.nh-who-row b{color:var(--text);font-weight:650}
.nh-who-row span{color:var(--dim)}

/* ── η μπάρα σύνοψης ── */
.nh-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--line);border-radius:16px;
  padding:14px 18px;margin:0 0 20px}
.nh-stat{display:flex;align-items:center;gap:12px;padding-right:18px;
  border-right:1px solid var(--line)}
.nh-stat:last-of-type{border-right:0}
.nh-stat-t{display:flex;flex-direction:column;line-height:1.3}
.nh-stat-t b{font-size:14.5px;font-weight:650}
.nh-stat-t small{color:var(--dim);font-size:12px}
.nh-stat-ic{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;
  background:color-mix(in srgb,var(--acc) 14%,transparent);color:var(--acc);flex:0 0 auto}
.nh-dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto;margin:0 6px 0 8px}
.nh-dot-ok{background:var(--good);box-shadow:0 0 0 4px color-mix(in srgb,var(--good) 22%,transparent)}
.nh-dot-warn{background:var(--warn);box-shadow:0 0 0 4px color-mix(in srgb,var(--warn) 22%,transparent)}
.nh-dot-bad{background:var(--bad);box-shadow:0 0 0 4px color-mix(in srgb,var(--bad) 22%,transparent)}
.nh-search{display:flex;align-items:center;gap:9px;margin-left:auto;
  background:var(--bg2);border:1px solid var(--line);border-radius:12px;
  padding:0 13px;height:42px;min-width:min(300px,100%);color:var(--dim)}
.nh-search:focus-within{border-color:var(--acc);box-shadow:0 0 0 3px var(--ring)}
.nh-search input{border:0;background:transparent;color:var(--text);font:inherit;
  font-size:13.5px;width:100%;outline:0;height:100%}

/* ── οι κάρτες των εφαρμογών ──
   Η χρωματιστή λωρίδα είναι το χρώμα που δηλώνει η ΙΔΙΑ η εφαρμογή.
   Οι κάρτες είναι ΜΕΓΑΛΕΣ επίτηδες: με δύο-τρεις εφαρμογές μια σειρά από
   μικρά πλακίδια αφήνει τη μισή οθόνη άδεια και μοιάζει με λάθος. */
.nh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:20px}
/* 1.2.7: auto-FILL, όχι auto-fit — μία κάρτα μόνη της κρατάει το πλάτος της
   στήλης και δεν απλώνεται σε όλη τη σελίδα. */
.nh-app{position:relative;display:grid;grid-template-columns:auto 1fr;
  align-content:start;gap:0 20px;
  background:var(--card);border:1px solid var(--line);border-radius:18px;
  padding:24px 24px 18px;overflow:hidden;min-height:250px;
  transition:transform .13s,box-shadow .13s,border-color .13s}
.nh-app::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;
  background:var(--c,var(--acc))}
a.nh-app:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--line2)}
a.nh-app:hover .nh-go{background:var(--c,var(--acc));color:var(--on-acc)}
a.nh-app:hover .nh-go b{transform:translateX(3px)}
.nh-app.nh-off{opacity:.72}
.nh-app.nh-shop{border-style:dashed;min-height:210px}
.nh-app.nh-shop::before{opacity:.45}
.nh-body{display:flex;flex-direction:column;gap:3px;min-width:0}

/* Το σήμα: είτε το εικονίδιο της εφαρμογής, είτε το αρχικό της στο χρώμα της. */
/* ΣΚΕΤΟ ΣΗΜΑ, ΧΩΡΙΣ ΠΛΑΚΙΔΙΟ ΑΠΟ ΠΙΣΩ — απόφαση του Τάσου, 14/09.
   Το χρωματιστό τετράγωνο πίσω από κάθε εικονίδιο έκανε τη σειρά των καρτών
   να μοιάζει με οθόνη κινητού. Χωρίς αυτό, τα σήματα διαβάζονται ως ένα σετ.
   Τίμημα: το μελάνι πρέπει να αλλάζει με το θέμα — δες .nh-ic-d/.nh-ic-l. */
/* ΙΔΙΑ ΔΙΑΜΕΤΡΟΣ ΣΕ ΟΛΑ ΤΑ ΚΕΛΙΑ — το ζήτησε ο Τάσος.
   Το κουτί ήταν ήδη 64x64· αυτό που διέφερε ήταν ΤΟ ΣΧΗΜΑ μέσα του. Τα ίδια
   τα αρχεία μπήκαν σε κοινό οπτικό πλέγμα (ίσο εμβαδόν πλαισίου), οπότε εδώ
   αρκεί να μη ζορίζει τίποτα το κουτί. */
.nh-ico{display:grid;place-items:center;width:64px;height:64px;
  flex:0 0 auto;background:transparent}
.nh-ico img{width:100%;height:100%;object-fit:contain;display:block;grid-area:1/1}
/* ΓΡΑΜΜΕΝΟ ΩΣ «.nh-ico img.nh-ic-d» ΚΑΙ ΟΧΙ ΣΚΕΤΟ «.nh-ic-d» — ΜΕ ΠΑΤΗΣΕ.
   Ο κανόνας «.nh-ico img{display:block}» δύο γραμμές πιο πάνω είναι ΠΙΟ ΕΙΔΙΚΟΣ
   (κλάση + στοιχείο) από μια σκέτη κλάση, οπότε κέρδιζε ό,τι σειρά κι αν είχαν.
   Αποτέλεσμα: φαίνονταν ΚΑΙ ΤΑ ΔΥΟ μελάνια, το ένα πάνω στο άλλο, και τα σήματα
   έβγαιναν ξεπλυμένα. Η σειρά δεν σώζει από την ειδικότητα. */
.nh-ico img.nh-ic-l{display:none}      /* ανοιχτό μελάνι → μόνο σε σκούρο φόντο */
:root[data-theme=dark] .nh-ico img.nh-ic-d{display:none}
:root[data-theme=dark] .nh-ico img.nh-ic-l{display:block}
.nh-ico-gen{border-radius:17px;overflow:hidden}
/* Το φόντο εδώ είναι το χρώμα της ΕΦΑΡΜΟΓΗΣ, ό,τι κι αν δηλώσει· το γράμμα
   μένει λευκό και στα δύο θέματα — γι' αυτό βγαίνει από το --on-acc. */
.nh-ico-gen{background:var(--c,var(--acc));color:var(--on-acc);
  font-size:34px;font-weight:700;line-height:1}
.nh-cat{align-self:flex-start;font-size:10.5px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;border-radius:999px;padding:4px 10px;margin-bottom:7px;
  background:color-mix(in srgb,var(--c,var(--acc)) 14%,transparent);color:var(--c,var(--acc))}
.nh-name{font-weight:650;font-size:22px;letter-spacing:-.4px}
/* 1.2.7 — στις διαθέσιμες, δίπλα στην κατηγορία: «Δεν την έχεις — δοκίμασέ τη». */
.nh-cats{display:flex;flex-wrap:wrap;gap:0 6px;align-self:flex-start}
.nh-cat.nh-cat-avail{background:var(--bg2);color:var(--muted)}
.nh-tag{color:var(--text);opacity:.75;font-size:14px}
/* ΙΔΙΟ ΥΨΟΣ ΠΕΡΙΓΡΑΦΗΣ ΣΕ ΟΛΕΣ ΤΙΣ ΚΑΡΤΕΣ.
   Η μία περιγραφή ήταν τρεις γραμμές και η άλλη δύο, οπότε τα κουμπιά
   κάθονταν σε διαφορετικό ύψος και η σειρά έμοιαζε ακατάστατη. Τρεις γραμμές
   για όλες: όσο χρειάζεται η μεγαλύτερη, χωρίς να πηδάει το ύψος της κάρτας. */
.nh-blurb{color:var(--muted);font-size:13.5px;margin-top:9px;line-height:1.55;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;
  min-height:calc(3 * 1.55em)}
/* Η κάτω γραμμή κολλάει στο πάτο, ώστε οι κάρτες να τελειώνουν στην ίδια
   ευθεία ακόμη κι όταν οι περιγραφές έχουν άλλο μήκος. */
.nh-foot-row{grid-column:1/-1;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin-top:auto;padding-top:18px}
.nh-go{margin-left:auto;display:inline-flex;align-items:center;gap:7px;
  font-size:13.5px;font-weight:650;color:var(--c,var(--acc));white-space:nowrap;
  border-radius:11px;padding:9px 16px;
  background:color-mix(in srgb,var(--c,var(--acc)) 12%,transparent);
  transition:background .13s,color .13s}
.nh-go b{display:inline-block;transition:transform .13s}
.nh-badge{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;
  font-size:12px;font-weight:600;border-radius:999px;padding:6px 12px;
  background:color-mix(in srgb,var(--good) 18%,transparent);color:var(--good)}
.nh-badge .nh-i{width:15px;height:15px}
.nh-badge.nh-warn{background:color-mix(in srgb,var(--warn) 20%,transparent);color:var(--warn)}
.nh-badge.nh-bad{background:color-mix(in srgb,var(--bad) 18%,transparent);color:var(--bad)}
/* Τα chips λειτουργιών: τι ΘΑ ΒΡΕΙΣ μέσα, σε τρεις-τέσσερις λέξεις. */
.nh-feats{grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:0 4px;
  margin-top:16px;padding-top:14px;border-top:1px solid var(--line);
  color:var(--dim);font-size:12px}
.nh-feat{padding:0 10px;border-right:1px solid var(--line)}
.nh-feat:first-child{padding-left:0}
.nh-feat:last-child{border-right:0}
.nh-shop > .nh-badge{grid-column:1/-1;justify-self:start;margin-top:auto}
.nh-ask{grid-column:1/-1;display:flex;gap:8px;margin-top:auto;padding-top:16px;flex-wrap:wrap}
.nh-ask form{display:inline-block;margin:0}
.nh-btn.nh-ghost{background:transparent;color:var(--muted);
  border:1px solid var(--line2);font-weight:600}
.nh-btn.nh-ghost:hover{filter:none;border-color:var(--acc);color:var(--acc);
  background:color-mix(in srgb,var(--acc) 8%,transparent)}

/* ── πίνακες και φόρμες μέσα στην πύλη ── */
.nh-tbl{width:100%;border-collapse:collapse;background:var(--card);
  border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:10px 0 4px}
.nh-tbl th,.nh-tbl td{text-align:left;padding:10px 13px;
  border-bottom:1px solid var(--line);font-size:13.5px;vertical-align:top}
.nh-tbl tr:last-child td{border-bottom:0}
.nh-tbl th{color:var(--muted);font-weight:600;font-size:12px;
  text-transform:uppercase;letter-spacing:.04em;background:var(--card2)}
.nh-inline{display:flex;flex-wrap:wrap;align-items:center;gap:9px}
.nh-form{background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:18px;max-width:430px}
.nh-form label{display:block;margin:0 0 11px;font-size:12.5px;color:var(--muted)}
.nh-form input:not([type=checkbox]){width:100%;margin-top:6px;background:var(--bg2);
  border:1px solid var(--line2);border-radius:10px;padding:10px;color:var(--text);font:inherit}
.nh-form input:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px var(--ring)}
.nh-list{margin:0;padding-left:18px;color:var(--muted);font-size:13.5px}

/* ── υποσέλιδο ── */
.nh-foot{margin:54px 0 0;padding:22px 0 0;border-top:1px solid var(--line)}
.nh-foot-in{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  color:var(--dim);font-size:12px}
.nh-foot .nh-lg{height:17px;opacity:.6}
.nh-foot .nh-strap{font-size:10px}
.nh-flinks{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
.nh-flinks a{padding:5px 11px;border-radius:8px;color:var(--muted);font-size:12.5px}
.nh-flinks a:hover{background:var(--card2);color:var(--text)}
.nh-foot small{font-size:11.5px}

/* ── στενές οθόνες ──
   Ο ήρωας γίνεται μία στήλη και το κύμα φεύγει: σε 400px δεν διακοσμεί,
   στριμώχνει. Οι κάρτες πέφτουν σε μία στήλη και το εικονίδιο μικραίνει. */
/* ΤΟ ΣΛΟΓΚΑΝ ΔΙΠΛΑ ΣΤΟ ΛΟΓΟΤΥΠΟ ΦΕΥΓΕΙ ΠΡΩΤΟ ΟΤΑΝ ΣΤΕΝΕΨΕΙ.
   Είναι 255px διακόσμησης· το λογότυπο δίπλα του λέει ήδη ποιοι είμαστε. Αν
   έμενε, θα έσπρωχνε την «Έξοδο» σε δεύτερη σειρά σε κάθε οθόνη κάτω από
   1180 — και εκεί ακριβώς είναι τα περισσότερα laptop. */
@media (max-width:1180px){
  .nh-top .nh-strap{display:none}
}
@media (max-width:900px){
  .nh-hero{grid-template-columns:1fr;padding:34px 0 26px}
  .nh-hero h1{font-size:34px;letter-spacing:-.8px}
  .nh-hero-art{display:none}
  .nh-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .nh-top-in{padding:11px 16px;gap:10px}
  .nh-strap{display:none}
  /* Μία σειρά που κυλάει, αντί για δύο σειρές: η γραμμή της τρέχουσας
     σελίδας σε δεύτερη σειρά έπεφτε στο κενό ανάμεσά τους. */
  .nh-navs{order:3;width:100%;margin-left:0;gap:0;overflow-x:auto;
    scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .nh-navs::-webkit-scrollbar{display:none}
  .nh-nav{flex:0 0 auto}
  .nh-nav{padding:8px 9px;font-size:12.5px}
  .nh-nav.is-on::after{bottom:-11px;left:9px;right:9px}
  .nh-out{margin-left:auto}
  .nh-wrap{padding:0 16px 32px}
  .nh-hero{padding:26px 0 20px}
  .nh-hero h1{font-size:27px;letter-spacing:-.5px}
  .nh-hero .nh-lead{font-size:15px}
  .nh-bar{padding:12px 14px;gap:10px}
  .nh-stat{border-right:0;padding-right:0;width:100%}
  .nh-search{margin-left:0;width:100%;min-width:0}
  .nh-app{padding:20px 18px 16px;gap:0 14px;min-height:0}
  .nh-ico{width:52px;height:52px}
  .nh-ico-gen{font-size:25px}
  .nh-name{font-size:19px}
  .nh-go{margin-left:0}
  .nh-foot-in{font-size:11px;gap:10px}
  .nh-flinks{margin-left:0;width:100%}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important}
}

/* ── «Τι άλλαξε» ─────────────────────────────────────────────────────────
   Μία στήλη με όριο πλάτους, όχι όλο το παράθυρο: γραμμή κειμένου που
   ξεπερνάει τους ~90 χαρακτήρες κουράζει το μάτι να βρει πού αρχίζει η
   επόμενη. Οι κάρτες των εφαρμογών θέλουν πλάτος· το διάβασμα θέλει στήλη. */
.nh-chg{max-width:760px}
.nh-chg-v{border-top:1px solid var(--line);padding:26px 0 4px}
.nh-chg-v:first-child{border-top:0;padding-top:4px}
.nh-chg-hd{display:flex;align-items:center;gap:10px;margin-bottom:7px}
.nh-chg-t{font-size:19px;margin:0 0 15px;letter-spacing:-.2px}
.nh-chg-ver{font-size:11.5px;font-weight:700;letter-spacing:.06em;padding:3px 9px;
  border-radius:999px;background:color-mix(in srgb,var(--acc) 14%,transparent);color:var(--acc)}
/* 1.2.2: ζητούσε --faint, που δεν υπάρχει στην παλέτα → έβγαινε στο χρώμα του
   κειμένου. --muted και όχι --dim: το --dim σε γράμματα 12.5px δεν διαβάζεται
   άνετα (αντίθεση 3.5:1 στο φωτεινό· το --muted 5.5:1). */
.nh-chg-hd time{color:var(--muted);font-size:12.5px;white-space:nowrap}
.nh-chg-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.nh-chg-list li{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:baseline}
/* Η ετικέτα κρατάει ΣΤΑΘΕΡΟ πλάτος ώστε οι τίτλοι να ξεκινούν στην ίδια
   κάθετη γραμμή — αλλιώς το «Νέο» και η «Διόρθωση» σπρώχνουν αλλού το καθένα. */
.nh-chg-k{grid-row:1;width:76px;text-align:center;font-size:10.5px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;padding:4px 0;border-radius:999px}
.nh-chg-new{background:color-mix(in srgb,var(--chg-new-tint) 16%,transparent);color:var(--chg-new)}
.nh-chg-fix{background:color-mix(in srgb,var(--acc) 16%,transparent);color:var(--acc)}
.nh-chg-list li b{grid-row:1;font-weight:650;font-size:15px}
.nh-chg-list li p{grid-column:2;margin:0;color:var(--muted);font-size:13.5px;line-height:1.6}
:root[data-theme=dark] .nh-chg-new{background:color-mix(in srgb,var(--chg-new-tint) 18%,transparent)}
@media (max-width:620px){
  .nh-chg-list li{grid-template-columns:1fr}
  .nh-chg-k{grid-row:auto;justify-self:start;width:auto;padding:4px 10px}
  .nh-chg-list li b{grid-row:auto}
  .nh-chg-list li p{grid-column:1}
}
/* 1.2.4 — «Θέλεις να βγεις;» */
.nh-logout-q{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 44px}

/* ═══ 1.2.13 — ΟΛΑ ΣΕ ΜΙΑ ΟΘΟΝΗ (ο Τάσος, 07/10: «λίγο πιο καλή διάταξη σε όλα, να χωράνε
   σε μια σελίδα· έχουμε μόνο 4 εφαρμογές και είναι οριακά» → εκδοχή Α, «4 στη σειρά»).
   Μικρότερη κεφαλίδα σε ΟΛΕΣ τις σελίδες της πύλης· οι εφαρμογές 4 στη σειρά, μαζεμένες,
   χωρίς τη γραμμή με τις λέξεις λειτουργιών (Contracts, Reports …). ═══ */
.nh-hero{padding:20px 0 14px;gap:16px}
.nh-hero h1{font-size:30px;margin:0 0 6px;letter-spacing:-.6px}
.nh-hero .nh-lead{font-size:14.5px}
.nh-eyebrow{margin:0 0 6px}
.nh-hero-art{height:96px;width:min(250px,30vw)}
.nh-slog{width:min(130px,84%)}
.nh-bar{padding:9px 14px;margin:0 0 14px;border-radius:12px}
.nh-stat-ic{width:30px;height:30px}
.nh-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.nh-app{grid-template-columns:1fr;padding:16px 16px 12px;min-height:0;border-radius:14px;gap:0 14px}
.nh-app .nh-ico{margin-bottom:10px}
.nh-ico,.nh-ico img{width:46px;height:46px}
.nh-name{font-size:18px}
.nh-tag{font-size:13px}
.nh-cat{font-size:9.5px;padding:3px 8px;margin-bottom:5px}
.nh-blurb{font-size:12.5px;margin-top:6px}
.nh-foot-row{padding-top:10px}
.nh-go{padding:7px 12px;font-size:12.5px}
.nh-badge{padding:4px 10px;font-size:11.5px}
.nh-feats{display:none}
.nh-app.nh-shop{min-height:0}
.nh-ask{padding-top:10px}
.nh-ask .nh-btn{padding:6px 12px;font-size:12.5px}
.nh-foot{margin:22px 0 0;padding:14px 0 0}
.nh-h2{margin:26px 0 4px}
/* Στενή κάρτα: η λήξη από πάνω, το «Άνοιγμα» σε όλο το πλάτος — ίδιο ύψος σε όλες,
   όσο μακρύ κι αν είναι το «Λήγει σε 81 μέρες». */
.nh-app .nh-foot-row{flex-direction:column;align-items:flex-start;gap:8px}
.nh-app .nh-go{margin-left:0;width:100%;justify-content:center;box-sizing:border-box}
@media (max-width:1100px){.nh-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.nh-grid{grid-template-columns:1fr}.nh-hero-art{display:none}.nh-hero h1{font-size:26px}}
.nh-app .nh-foot-row .nh-badge{border-radius:10px;max-width:100%}

/* ── 1.2.14: Υποστήριξη — αιτήματα μέσα στην πύλη ── */
.nh-tk-newbox{margin:0 0 6px}
.nh-tk-newbox > summary{list-style:none;display:inline-flex}
.nh-tk-newbox > summary::-webkit-details-marker{display:none}
.nh-tk-newbox[open] > summary{margin-bottom:12px}
.nh-tk-form{max-width:640px}
.nh-tk-form select,.nh-tk-form textarea{display:block;width:100%;margin-top:6px;background:var(--bg2);
  border:1px solid var(--line2);border-radius:10px;padding:10px;color:var(--text);font:inherit;box-sizing:border-box}
.nh-tk-form textarea{resize:vertical;min-height:110px;line-height:1.5}
.nh-tk-form select:focus,.nh-tk-form textarea:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px var(--ring)}
.nh-tk-form input[type=file]{padding:8px}
.nh-tk-list a{color:var(--text);text-decoration:none;font-weight:600}
.nh-tk-list a:hover{color:var(--acc)}
.nh-tk-st{display:inline-block;padding:2px 9px;border-radius:10px;font-size:12px;font-weight:600;white-space:nowrap}
.nh-tk-st-open{background:color-mix(in srgb,var(--warn) 18%,transparent);color:var(--text)}
.nh-tk-st-ans{background:color-mix(in srgb,var(--good) 18%,transparent);color:var(--text)}
.nh-tk-st-closed{background:color-mix(in srgb,var(--muted) 16%,transparent);color:var(--muted)}   /* 1.2.17: φαινόταν σαν σκέτο κείμενο */
.nh-tk-meta{color:var(--muted);font-size:13.5px;margin:0 0 14px}
.nh-tk-thread{display:flex;flex-direction:column;gap:10px;max-width:760px}
.nh-tk-msg{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 15px}
.nh-tk-msg.nh-tk-staff{border-left:4px solid var(--acc);background:color-mix(in srgb,var(--acc) 6%,var(--card))}
.nh-tk-head{font-size:13px;margin:0 0 6px}
.nh-tk-head span{color:var(--muted);margin-left:6px}
.nh-tk-body{font-size:14.5px;line-height:1.55;overflow-wrap:anywhere}
.nh-tk-img img{display:block;max-width:min(100%,420px);max-height:320px;margin-top:10px;border-radius:10px;border:1px solid var(--line)}
/* 1.2.17 — «κλείσιμο» ψηλά, δίπλα στην κατάσταση · το κλειστό αίτημα */
.nh-tk-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;max-width:760px;margin:0 0 14px}
.nh-tk-bar .nh-tk-meta{margin:0}
.nh-tk-close{margin:0}
.nh-tk-closedbox{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;max-width:760px;
  margin:18px 0 0;padding:14px 16px;border:1px dashed var(--line2);border-radius:14px;background:var(--card)}
.nh-tk-closedbox p{margin:0;font-size:14.5px}
@media (max-width:640px){.nh-tk-list th:nth-child(3),.nh-tk-list td:nth-child(3),.nh-tk-list th:nth-child(5),.nh-tk-list td:nth-child(5){display:none}}
/* Στο κινητό οι τρεις σύνδεσμοι (μαζί η «Υποστήριξη», που είναι πια σελίδα) χωράνε χωρίς κύλιση. */
@media (max-width:640px){.nh-navs{justify-content:space-between}.nh-navs .nh-nav{padding:8px 5px;gap:5px}}
@media (max-width:420px){.nh-navs .nh-nav .nh-i{display:none}}