:root{
  --navy:#0A1628; --navy2:#0f2040; --navy3:#162d50;
  --gold:#C9963A; --gold2:#E8B455; --gold3:#f5d080;
  --lime:#7BC242; --lime2:#9CD65A;
  --cream:#F4EFE6; --slate:#7A8EA8; --slate2:#4e637a;
  --green:#1A7A45; --green2:#27AE60;
  --red:#922B21; --red2:#e57373; --amber:#D4880A;
  --font-d:'EB Garamond',serif;
  --font-b:'Manrope',sans-serif;
  --font-m:'JetBrains Mono',monospace;
  --r:8px; --rl:14px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
/* ── ΣΚΟΥΡΟ ΘΕΜΑ ΚΑΙ ΓΙΑ ΤΑ ΝΑΤΙΒ ΣΤΟΙΧΕΙΑ (v470) ──────────────────────────
   Το επιλογέα ημερομηνίας που ανοίγει το <input type="date"> τον ζωγραφίζει ο
   browser, όχι εμείς: δεν στυλίζεται με CSS. Το `color-scheme:dark` είναι ο
   ΜΟΝΟΣ μοχλός — λέει στον browser ότι η σελίδα είναι σκούρη, και εκείνος
   ζωγραφίζει σκούρο ημερολόγιο, σκούρα dropdown και σκούρες μπάρες.
   Χωρίς αυτό, ένα λευκό ημερολόγιο άνοιγε πάνω σε σκούρα εφαρμογή. */
/* ── Η ΜΠΑΡΑ ΤΟΥ ΠΑΡΑΘΥΡΟΥ ΜΙΛΑΕΙ ΤΗΝ ΙΔΙΑ ΓΛΩΣΣΑ (v492) ────────────────────
   Τα modal και ο οδηγός είχαν λεπτή χρυσή μπάρα· το ίδιο το παράθυρο κρατούσε
   την γκρίζα του συστήματος. Δίπλα-δίπλα φαίνονταν σαν δύο εφαρμογές. Και
   εγκατεστημένη ως PWA η διαφορά χτυπάει περισσότερο: εκεί δεν υπάρχει πλαίσιο
   browser να δικαιολογήσει ξένο στοιχείο.
   ΤΟ ΜΑΘΗΜΑ ΤΗΣ v489 ΙΣΧΥΕΙ ΚΑΙ ΕΔΩ: ο σύγχρονος Chrome διαβάζει το ΤΥΠΙΚΟ
   scrollbar-color και τότε αγνοεί τα ::-webkit-scrollbar-*. Τα δύο πρέπει να
   λένε το ίδιο· τα webkit μένουν μόνο ως εφεδρεία. */
html{scroll-behavior:smooth;overflow-x:hidden;color-scheme:dark;
  scrollbar-width:thin;scrollbar-color:rgba(201,150,58,.35) var(--navy);
  /* v630 (§143 ανοιχτό #1): ο Chrome στο Android «φουσκώνει» τα μικρά μεγέθη (font boosting) — ο υπότιτλος
     7.33px του λογοτύπου έβγαινε φαρδύτερος από το όνομα στο site. Ίδια γραμμή με το wisdom-rm.gr. */
  -webkit-text-size-adjust:100%;text-size-adjust:100%}
html::-webkit-scrollbar{width:8px}
html::-webkit-scrollbar-track{background:var(--navy)}
html::-webkit-scrollbar-thumb{background:rgba(201,150,58,.35);border-radius:4px}
html::-webkit-scrollbar-thumb:hover{background:rgba(201,150,58,.55)}
body{background:var(--navy);color:var(--cream);font-family:var(--font-b);min-height:100vh;overflow-x:hidden;max-width:100%;padding-bottom:60px}

/* SIDEBAR */
.sidebar{position:fixed;left:0;top:54px;bottom:0;width:62px;background:rgba(5,10,20,.97);border-right:1px solid rgba(201,150,58,.14);display:flex;flex-direction:column;align-items:center;padding:14px 0 10px;z-index:200;gap:3px}
/* v629 — το σήμα της εφαρμογής (logo.png = το εικονίδιο της εφαρμογής, ίδιο με το wisdom-rm.gr).
   Χωρίς μόνιμη λάμψη: το σκούρο τετράγωνο ξεχωρίζει μόνο του· απαλή χρυσή λάμψη ΜΟΝΟ στο hover, όπως στο site. */
.tb-logo{width:40px;height:40px;object-fit:contain;margin-right:0;flex:none;transition:filter .25s;border-radius:9px}
.tb-logo:hover{filter:drop-shadow(0 0 3px rgba(201,150,58,.55)) drop-shadow(0 0 10px rgba(201,150,58,.35))}
.nb{width:44px;height:44px;border-radius:10px;border:none;background:transparent;color:var(--slate);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;transition:.2s;position:relative}
.nb:hover{background:rgba(201,150,58,.1);color:var(--cream)}
.nb.on{background:rgba(201,150,58,.18);color:var(--gold2)}
.nb.on::before{content:'';position:absolute;left:-1px;top:22%;bottom:22%;width:3px;border-radius:0 3px 3px 0;background:var(--gold)}
.tt{position:absolute;left:56px;background:rgba(8,16,32,.98);color:var(--cream);font-family:var(--font-m);font-size:10px;padding:5px 10px;border-radius:6px;white-space:nowrap;border:1px solid rgba(201,150,58,.2);pointer-events:none;opacity:0;transform:translateX(-4px);transition:.15s;z-index:300}
.nb:hover .tt{opacity:1;transform:translateX(0)}
.nb-spacer{flex:1}
/* Διαχωριστικό τμημάτων sidebar (v449). `flex:0 0 1px` γιατί το manager.js
   κάνει `el.style.display='flex'` σε ΟΛΑ τα .mgr-only — χωρίς σταθερή βάση, η
   γραμμή θα τεντωνόταν ως flex item και θα έσπρωχνε τα κουμπιά. */
/* Διακριτικό προέλευσης τιμής (v454): «από report» δίπλα στην ετικέτα πεδίου.
   Σκόπιμα διακριτικό — δεν είναι προειδοποίηση, είναι ίχνος. Φεύγει μόλις ο
   άνθρωπος αγγίξει το πεδίο. */
.src-chip{font-family:var(--font-m);font-size:8px;letter-spacing:.5px;
  text-transform:none;color:#5dade2;border:1px solid rgba(93,173,226,.42);
  border-radius:4px;padding:1px 5px;vertical-align:middle;white-space:nowrap}
/* ── ΛΕΠΤΕΣ ΜΠΑΡΕΣ ΚΥΛΙΣΗΣ (v467) ────────────────────────────────────────────
   Οι μπάρες του λειτουργικού είναι 15-17px και σε ανοιχτό γκρι: μέσα σε σκούρα
   διεπαφή ξεχωρίζουν περισσότερο από τα δεδομένα που κυλούν. Δύο τέτοιες μπάρες
   κάθονταν ακριβώς κάτω από τους τύπους δωματίου και κάτω από το ημερολόγιο.
   6px, ημιδιαφανές χρυσό, χωρίς βέλη — και εμφανίζονται μόνο όταν χρειάζονται.
   `scrollbar-width/color` για Firefox, `::-webkit-scrollbar` για Chrome/Safari.
   ΔΕΝ κρύβονται εντελώς: μπάρα που δεν φαίνεται είναι περιεχόμενο που δεν ξέρεις
   ότι υπάρχει. */
/* Το εικονίδιο ημερολογίου μέσα στο input: με color-scheme:dark γίνεται ήδη
   ανοιχτό, αλλά μένει λευκό-έντονο. Ελαφρύ ξεθώριασμα ώστε να μη διεκδικεί
   περισσότερη προσοχή από την ίδια την ημερομηνία, και χρυσό στο hover. */
input[type="date"]::-webkit-calendar-picker-indicator{opacity:.45;cursor:pointer;transition:opacity .12s}
input[type="date"]:hover::-webkit-calendar-picker-indicator{opacity:.85}

.thin-scroll{scrollbar-width:thin;scrollbar-color:rgba(201,150,58,.35) transparent}
.thin-scroll::-webkit-scrollbar{height:6px;width:6px}
.thin-scroll::-webkit-scrollbar-track{background:rgba(255,255,255,.03);border-radius:3px}
.thin-scroll::-webkit-scrollbar-thumb{background:rgba(201,150,58,.35);border-radius:3px}
.thin-scroll::-webkit-scrollbar-thumb:hover{background:rgba(201,150,58,.55)}
.thin-scroll::-webkit-scrollbar-corner{background:transparent}

.nb-div{flex:0 0 1px;width:26px;height:1px;margin:18px auto;background:rgba(255,255,255,.16);border-radius:1px}

/* MAIN */
.main{margin-left:62px;min-height:100vh;padding-top:54px}

/* TOPBAR */
.topbar{height:54px;background:rgba(5,10,20,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(201,150,58,.12);display:flex;align-items:center;padding:0 18px;position:fixed;left:0;right:0;top:0;z-index:250;gap:12px;overflow:hidden;max-width:100%}
.topbar > *{min-width:0}
.tb-logo{height:30px;width:30px;object-fit:contain;border-radius:6px}
/* ΤΟ ΛΟΓΟΤΥΠΟ ΔΕΝ ΣΠΑΕΙ ΠΟΤΕ (v391). Έσπαγε ΜΟΝΟ στην καρτέλα Engine, γιατί το
   κεντρικό κείμενο εκεί είναι μακρύτερο («Core Engine — Στρατηγείο» έναντι «Manager
   Dashboard») και σε μισή οθόνη έσπρωχνε το brand. Το `.tb-hotel` είχε ήδη
   nowrap+ellipsis· το λογότυπο και ο τίτλος σελίδας δεν είχαν τίποτα. */
.tb-brand{flex:0 0 auto}
.tb-name{font-family:var(--font-b);font-size:22px;font-weight:600;color:#fff;letter-spacing:.004em;line-height:1;white-space:nowrap}
.tb-name span{color:var(--lime)}
/* v629 — ΙΔΙΟ λογότυπο με το wisdom-rm.gr (18/10/2026, μετρημένο σε pixel μελανιού):
   ο υπότιτλος = 1/3 του τίτλου, letter-spacing .25em + justify → ΙΔΙΟ πλάτος με τον τίτλο·
   line-height:1 + margin-top:2px → κενό ανάμεσα στις γραμμές ≈ ύψος γραμμάτων υπότιτλου.
   Πριν: τίτλος 700 / letter-spacing 1px · υπότιτλος inline στο index.html, 7px / 2.5px / 600. */
.tb-tag{display:block;font-family:var(--font-m);font-size:7.33px;font-weight:400;letter-spacing:.25em;color:var(--gold2);text-transform:uppercase;
  margin-top:2px;line-height:1;white-space:nowrap;text-align:justify;text-align-last:justify;-moz-text-align-last:justify}
/* 20/10/2026 (Site-4, ίδιος κανόνας με το wisdom-rm.gr): τελευταίο γράμμα χωρίς letter-spacing — κάποια Chromium
   βάζουν το spacing και μετά το τελευταίο γράμμα και ο υπότιτλος σταματούσε νωρίτερα από το όνομα· padding-right
   .12em για τη διαφορά περιθωρίου γλυφής «M» (Manrope) / «E» (JetBrains Mono). Ίδιο πλάτος σε κάθε browser. */
.tb-tag .tb-tag-l{letter-spacing:0}
.tb-tag{padding-right:.12em}
.tb-spacer{flex:1}
.tb-hotel{font-family:var(--font-m);font-size:10px;color:var(--gold2);background:rgba(201,150,58,.08);padding:4px 10px;border-radius:6px;border:1px solid rgba(201,150,58,.2);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 0 auto}
/* Ο τίτλος σελίδας είναι ΤΟ ΜΟΝΟ που επιτρέπεται να κοπεί: είναι πληροφορία που ο
   χρήστης ήδη ξέρει (μόλις πάτησε την καρτέλα), ενώ το όνομα του προϊόντος όχι.
   v403: ΜΕΤΑΚΙΝΗΘΗΚΕ στην αριστερή ομάδα, δίπλα στο ξενοδοχείο. Ήταν το πρώτο
   στοιχείο της ΔΕΞΙΑΣ ομάδας — ένα label ανάμεσα σε χειριστήρια (MASTER, Support).
   Αριστερά «πού είσαι», δεξιά «τι μπορείς να κάνεις». Είναι ετικέτα πλοήγησης, όχι
   κουμπί: το sidebar είναι μόνο εικονίδια και το `.topbar` είναι fixed, άρα όταν η
   επικεφαλίδα της σελίδας κυλήσει, αυτός μένει η μόνη απάντηση στο «πού είμαι».
   Η προτεραιότητα της v391 ΔΙΑΤΗΡΕΙΤΑΙ ρητά: το `.tb-hotel` παίρνει `flex:0 0 auto`
   (δεν συρρικνώνεται — το φράζει ήδη το max-width:180px) ώστε σε στενό παράθυρο να
   κόβεται πρώτος ο τίτλος, όπως πριν. Χωρίς αυτό, το flex θα τα συρρίκνωνε αναλογικά
   και το όνομα του ξενοδοχείου θα άρχιζε να χάνει γράμματα μαζί του. */
.tb-page{font-family:var(--font-m);font-size:8px;letter-spacing:2px;color:var(--slate);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:0 1 auto}
.tb-time{font-family:var(--font-m);font-size:11px;color:var(--gold);background:rgba(201,150,58,.06);padding:4px 10px;border-radius:6px;border:1px solid rgba(201,150,58,.15);white-space:nowrap;flex:0 0 auto}
/* v629 — ΕΝΔΙΑΜΕΣΑ ΠΛΑΤΗ (501–850px: μισή οθόνη, tablet). Ως τώρα υπήρχε μόνο το βήμα των 500px:
   από 501 ως ~850 όλα τα στοιχεία της μπάρας ζητούσαν χώρο μαζί, ο τίτλος σελίδας γινόταν «Α.»,
   το Support κοβόταν και το ρολόι έσπαγε σε δύο γραμμές και έβγαινε από τη μπάρα.
   Τώρα φεύγουν σταδιακά, με την ίδια σειρά προτεραιότητας με το κινητό (v410):
   πρώτα ο τίτλος σελίδας (≤850), μετά οι ετικέτες κειμένου του Support (≤760) και της άδειας (≤640),
   τελευταίο το όνομα ξενοδοχείου (≤620) — τα εικονίδια μένουν.
   Το ρολόι δεν σπάει ποτέ (nowrap) και δεν συρρικνώνεται. */
@media(max-width:850px){
  .tb-page,.tb-div{display:none}
}
@media(max-width:760px){
  .tb-sup-t{display:none}
  .tb-support{padding:5px 7px!important;flex:0 0 auto}
  .tb-hotel{max-width:140px}
}
@media(max-width:640px){
  .lic-txt{display:none}
  #lic-badge{flex:0 0 auto}
}
@media(max-width:620px){
  .tb-hotel{display:none}
}

/* PAGES */
.page{display:none;padding:26px 26px 50px;animation:fadeIn .25s ease}
.page.on{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* SECTION TITLE */
.sec{font-family:var(--font-m);font-size:9px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;margin:26px 0 13px;display:flex;align-items:center;gap:10px}
.sec::after{content:'';flex:1;height:1px;background:rgba(201,150,58,.18)}

/* CARDS */
.card{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);border-radius:var(--rl);padding:18px 20px}
.card.gold{border-color:rgba(201,150,58,.32);background:rgba(201,150,58,.04)}
.card.lime{border-color:rgba(123,194,66,.32);background:rgba(123,194,66,.04)}
.card.info{border-color:rgba(93,173,226,.2);background:rgba(93,173,226,.04);font-size:11px;color:var(--slate);line-height:1.7;padding:12px 16px}

/* KPI ROW */
.krow{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:10px}
.kpi{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);border-radius:var(--r);padding:13px 14px;position:relative;overflow:hidden;transition:border-color .3s}
.kpi::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--lime));opacity:1;transition:.3s}
.kpi.lit::after{opacity:1}
.kpi-l{font-family:var(--font-m);font-size:8px;letter-spacing:2px;color:var(--slate);text-transform:uppercase;margin-bottom:5px}
.kpi-v{font-family:var(--font-d);font-size:26px;font-weight:700;color:#fff;line-height:1}
.kpi-v.g{color:var(--green2)}.kpi-v.w{color:var(--amber)}.kpi-v.r{color:var(--red2)}
.kpi-s{font-size:10px;color:var(--slate);margin-top:3px}

/* STLY MONTH KPIS — compact card row */
.month-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:14px 0 4px}
.mk{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);border-radius:var(--r);padding:13px 15px;position:relative;overflow:hidden;transition:border-color .3s}
.mk::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--lime));opacity:.5}
.mk:hover{border-color:rgba(201,150,58,.3)}
.mk-lbl{font-family:var(--font-m);font-size:8px;letter-spacing:2px;color:var(--slate);text-transform:uppercase;margin-bottom:6px}
.mk-val{font-family:var(--font-d);font-size:25px;font-weight:700;color:#fff;line-height:1}
.mk-stly{margin-top:8px}
.mk-ic,.kpi-ic{position:absolute;top:12px;right:13px;color:var(--gold);opacity:.5}
.esvg{width:1em;height:1em;vertical-align:-.14em;margin-right:.4em;flex-shrink:0}
.an-icon svg{width:17px;height:17px}
@media(max-width:1000px){.month-kpi{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.month-kpi{grid-template-columns:1fr}}

/* FIELDS */
.ig{display:grid;grid-template-columns:repeat(auto-fit,minmax(138px,1fr));gap:10px}
/* ΕΥΘΥΓΡΑΜΜΙΣΗ ΠΕΔΙΩΝ (v568): όταν μια ετικέτα τυλίγεται σε δύο γραμμές («ΑΡΙΘΜΟΣ ΔΩΜΑΤΙΩΝ
   (CAPACITY)»), το πεδίο της κατέβαινε και η σειρά έβγαινε σκαλωτή. Τα πεδία στοιχίζονται
   πλέον στο ΚΑΤΩ μέρος του κελιού — ίδια γραμμή κουτιών, όποιο μήκος κι αν έχει η ετικέτα. */
.ig > .field, .ig-2 > .field{display:flex;flex-direction:column;justify-content:flex-end}
/* ΟΝΟΜΑ / ΠΡΟΣΦΩΝΗΣΗ / EMAIL GM (v568): μία γραμμή, πλάτος ανά κείμενο. `field-sizing:content`
   (Chrome 123+)· αλλού το `size` που ενημερώνει το _gmRowSize (store.js). */
.gm-row{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end}
.gm-row > .field{flex:0 1 auto;min-width:0;max-width:100%}
.gm-row > .field input{width:auto;min-width:16ch;max-width:100%;field-sizing:content}
/* ── ΕΥΘΥΓΡΑΜΜΙΣΗ ΠΕΔΙΩΝ ΑΝΕΞΑΡΤΗΤΑ ΑΠΟ ΤΟ ΥΨΟΣ ΤΗΣ ΕΤΙΚΕΤΑΣ (v472) ────────
   Το σήμα «από report» (v454) πλαταίνει την ετικέτα. Όταν δεν χωράει, σπάει σε
   δεύτερη γραμμή και το πεδίο κατεβαίνει χαμηλότερα από τα διπλανά του — ορατή
   ανισορροπία, χειρότερη σε στενή οθόνη όπου σπάνε οι μισές ετικέτες.
   `justify-content:flex-end` σε grid item που τεντώνεται στο ύψος της γραμμής
   σπρώχνει το input στη ΒΑΣΗ: όλα τα inputs μιας γραμμής ευθυγραμμίζονται, όσες
   γραμμές κι αν πιάσει η ετικέτα από πάνω τους.
   Η ετικέτα γίνεται flex ώστε το σήμα να κάθεται δίπλα στο κείμενο και να
   αναδιπλώνεται καθαρά, όχι να κρέμεται. */
/* Το `justify-content:flex-end` ΜΟΝΟ στο .frow (v474). Στο .ig έσπρωχνε το input
   στη βάση της γραμμής — σωστό όταν διαφέρει το ύψος της ΕΤΙΚΕΤΑΣ, λάθος όταν ένα
   πεδίο έχει βοηθητικό κείμενο ΑΠΟ ΚΑΤΩ: τότε «βάση» είναι κάτω από το κείμενο,
   και το διπλανό πεδίο κατέβαινε μόνο του. */
.frow > .field{display:flex;flex-direction:column;justify-content:flex-end}
.ig > .field > label:first-child, .frow > .field > label:first-child{display:flex;align-items:center;flex-wrap:wrap;gap:6px}


/* ── ΣΕΙΡΑ ΠΕΔΙΩΝ ΜΕ ΑΝΙΣΑ ΠΛΑΤΗ (v473) ────────────────────────────────────
   Το `.ig` δίνει ΙΣΕΣ στήλες. Σωστό όταν τα πεδία είναι ισοδύναμα — λάθος όταν
   δεν είναι: το «Σύνολο Δωμ.» είναι ένας διψήφιος αριθμός που έρχεται από τις
   Ρυθμίσεις και σπάνια αλλάζει, και έπαιρνε το ίδιο πλάτος με το Room Revenue.
   Το πλάτος ενός πεδίου είναι ΔΗΛΩΣΗ για το τι περιμένεις μέσα του.
   Το `.frow` είναι flex: κάθε πεδίο δηλώνει το δικό του flex-basis, και το
   `align-items:flex-end` κρατά τα inputs ευθυγραμμισμένα στη βάση όπως και στο
   `.ig` (v472) — όσες γραμμές κι αν πιάσει η ετικέτα. */
.frow{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
/* Σειρά όπου τα πεδία έχουν βοηθητικό κείμενο από κάτω: στοίχιση στην ΚΟΡΥΦΗ.
   ΜΕΤΑ το .frow, όχι πριν (v475): ίδια ειδικότητα (0,1,0) — κερδίζει ο τελευταίος.
   Γραμμένο πριν, το `.frow{align-items:flex-end}` ακύρωνε το `.frow-top` και τα δύο
   πεδία έμεναν σκαλωτά όπως πριν. Το CSS δεν έβγαλε κανένα σφάλμα· απλώς δεν ίσχυε. */
.frow-top{align-items:flex-start}
.frow-top > .field{justify-content:flex-start}
.field label{font-family:var(--font-m);font-size:8px;letter-spacing:2px;color:var(--slate);text-transform:uppercase;display:block;margin-bottom:5px}
.field input,.field select,.field textarea{width:100%;background:rgba(255,255,255,.05);border:1px solid rgba(201,150,58,.24);border-radius:var(--r);color:var(--cream);font-family:var(--font-m);font-size:13px;padding:9px 11px;transition:.2s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold);background:rgba(201,150,58,.08)}
.field input::placeholder{color:rgba(122,142,168,.35)}
/* ── ΤΟ ΠΕΔΙΟ SCORE ΕΙΝΑΙ ΠΥΛΗ (v533) ──────────────────────────────────────
   Όλα τα πεδία της φόρμας έχουν αχνό χρυσό περίγραμμα (.24)· το Score χρειάζεται
   να ξεχωρίζει ΚΑΤΗΓΟΡΙΑΣ, όχι βαθμού: γεμάτο χρυσό περίγραμμα, χρυσό φόντο,
   χρυσό κείμενο — μοιάζει με κουμπί γιατί είναι κουμπί.
   Ο id στον επιλογέα κερδίζει το `.field input` χωρίς `!important`. */
#a-score.sc-trigger{border:1.5px solid var(--gold);background:rgba(201,150,58,.12);color:var(--gold2);
  font-family:var(--font-d);font-size:18px;font-weight:700;cursor:pointer;padding:7px 12px;text-align:left}
#a-score.sc-trigger:hover{background:rgba(201,150,58,.2);border-color:var(--gold2)}
#a-score.sc-trigger::placeholder{color:var(--gold2);opacity:1;font-family:var(--font-b);font-size:12.5px;font-weight:700;letter-spacing:.2px}
/* Ο παλμός του άδειου πεδίου αφαιρέθηκε (v537, απόφαση Άλκη): κίνηση που επαναλαμβάνεται
   κάθε νύχτα κοστίζει προσοχή συνέχεια, ενώ λέει κάτι μία φορά. Το χρυσό περίγραμμα
   αρκεί για να ξεχωρίζει το πεδίο από τα διπλανά. */
/* Αριθμητικό input: τα βελάκια θα έλεγαν «γράψε εδώ» — ακριβώς ό,τι δεν θέλουμε. */
#a-score.sc-trigger::-webkit-inner-spin-button,#a-score.sc-trigger::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#a-score.sc-trigger{-moz-appearance:textfield;appearance:textfield}
.field select option{background:var(--navy)}
/* ── ΕΠΙΛΟΓΕΑΣ, ΟΧΙ ΠΕΔΙΟ (v551) ──────────────────────────────────────────
   Όλα τα πεδία έχουν το ίδιο αχνό χρυσό περίγραμμα (.24), οπότε ένα `select`
   δίπλα σε δύο read-only πεδία διαβαζόταν σαν ακόμη μια ένδειξη — ενώ είναι το
   μόνο στοιχείο της γραμμής που ΑΛΛΑΖΕΙ αυτό που βλέπεις. Πιο έντονο περίγραμμα
   και ελαφρύ χρυσό φόντο: «εδώ διαλέγεις». Ο επιλογέας του διαστήματος στο
   Forecast/Budget παίρνει την ίδια κλάση, ώστε να μη μαθαίνει ο χρήστης δύο όψεις
   για το ίδιο πράγμα. */
.field select.sel-strong,select.sel-strong{border:1px solid rgba(201,150,58,.55);background:rgba(201,150,58,.07);cursor:pointer}
.field select.sel-strong:hover,select.sel-strong:hover{border-color:var(--gold)}
/* Per-month στόχος inputs — ίδιο dark theme με τα υπόλοιπα settings inputs */
#s-goal-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media(max-width:760px){#s-goal-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:440px){#s-goal-cards{grid-template-columns:1fr}}
input[id^="s-mt-"],input[id^="s-ly-"],input[id^="s-gr-"]{background:rgba(255,255,255,.05);border:1px solid rgba(201,150,58,.24);border-radius:var(--r);color:var(--cream);font-family:var(--font-m)}
input[id^="s-mt-"]:focus,input[id^="s-ly-"]:focus,input[id^="s-gr-"]:focus{outline:none;border-color:var(--gold);background:rgba(201,150,58,.08)}
input[id^="s-mt-"]::placeholder,input[id^="s-ly-"]::placeholder,input[id^="s-gr-"]::placeholder{color:rgba(122,142,168,.35)}

/* Global select reset — prevents Chromium from overriding background with white */
select{
  -webkit-appearance:none;
  appearance:none;
  background:var(--card,rgba(255,255,255,.04)) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%237A8EA8'/%3E%3C/svg%3E") no-repeat right 10px center;
  background-color:#0f2040;
  color:var(--cream);
  border:1px solid rgba(201,150,58,.24);
  border-radius:var(--r);
  font-family:var(--font-m);
  font-size:11px;
  padding:6px 28px 6px 10px;
  cursor:pointer;
  transition:.2s;
}
select:focus{outline:none;border-color:var(--gold)}
select option{background:#0f2040;color:var(--cream)}
.field textarea{resize:vertical;min-height:60px;line-height:1.6}

/* BUTTONS */
.btn{background:linear-gradient(135deg,var(--gold),var(--gold2));border:none;border-radius:var(--r);color:var(--navy);cursor:pointer;font-family:var(--font-m);font-size:10px;font-weight:600;letter-spacing:1.5px;padding:11px 22px;text-transform:uppercase;transition:.2s;margin-top:10px;display:inline-block}
.btn:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(201,150,58,.3)}
.btn.lime{background:linear-gradient(135deg,var(--lime),var(--lime2));color:var(--navy)}
.btn.sm{padding:6px 13px;font-size:9px;margin-top:0}
.btn.out{background:transparent;border:1px solid rgba(201,150,58,.38);color:var(--gold)}
.btn.out:hover{background:rgba(201,150,58,.08)}
.btn.danger{background:linear-gradient(135deg,var(--red),#c0392b);color:#fff}

/* ANALYSIS BLOCKS */
.an-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
@media(max-width:640px){.an-grid{grid-template-columns:1fr}}
.an-block{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:var(--rl);padding:15px 17px}
.an-hdr{display:flex;align-items:center;gap:10px;margin-bottom:11px;padding-bottom:9px;border-bottom:1px solid rgba(255,255,255,.06)}
.an-icon{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.an-title{font-size:12px;font-weight:600;color:var(--cream)}
.an-sub{font-family:var(--font-m);font-size:8px;color:var(--slate);letter-spacing:1px;text-transform:uppercase;margin-top:2px}
.irow{display:flex;align-items:flex-start;gap:8px;margin-bottom:8px;font-size:11px;line-height:1.5;color:rgba(244,239,230,.8)}
.idot{width:5px;height:5px;border-radius:50%;margin-top:5px;flex-shrink:0}
.irow strong{color:var(--cream)}.irow .num{font-family:var(--font-m);color:var(--gold2)}

/* PROGRESS */
.pb-lbl{display:flex;justify-content:space-between;font-family:var(--font-m);font-size:9px;color:var(--slate);margin-bottom:4px}
.pb{height:5px;background:rgba(255,255,255,.07);border-radius:3px;overflow:hidden;margin-bottom:6px}
.pb-fill{height:100%;border-radius:3px;transition:width 1.2s ease;width:0}

/* CHARTS */
.chart-wrap{position:relative;width:100%;height:210px}
.chart-tall{height:270px}

/* TABLES */
.tbl{width:100%;border-collapse:collapse}
.tbl th{font-family:var(--font-m);font-size:8px;letter-spacing:1.5px;color:var(--slate);text-transform:uppercase;text-align:left;padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.08)}
.tbl td{font-size:11px;color:rgba(244,239,230,.8);padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.04)}
.tbl td.num{font-family:var(--font-m)}.tbl td.money{font-family:var(--font-m);color:var(--gold2);font-weight:500}
.tbl tr:last-child td{border-bottom:none}

/* OPP TABLE (STLY daily, patterns, etc.) */
.opp-tbl{width:100%;border-collapse:collapse}
.opp-tbl thead tr{background:rgba(201,150,58,.08);border-bottom:1px solid rgba(201,150,58,.22)}
.opp-tbl th{font-family:var(--font-m);font-size:8px;letter-spacing:1.5px;color:var(--gold);text-transform:uppercase;padding:9px 12px;text-align:right;white-space:nowrap}
.opp-tbl th:first-child,.opp-tbl th:nth-child(2){text-align:left}
.opp-tbl td{font-family:var(--font-m);font-size:11px;color:rgba(244,239,230,.85);padding:7px 12px;border-bottom:1px solid rgba(255,255,255,.04);text-align:right;white-space:nowrap}
.opp-tbl td:first-child,.opp-tbl td:nth-child(2){text-align:left;color:var(--slate)}
.opp-tbl tbody tr:hover{background:rgba(255,255,255,.025)}
.opp-tbl tbody tr:last-child td{border-bottom:none}

/* SCORE */
.sc-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
@media(max-width:600px){.sc-grid{grid-template-columns:1fr}}
/* ΔΙΑΣΤΑΣΕΙΣ ΑΡΙΣΤΕΡΑ, ΑΠΟΤΕΛΕΣΜΑ ΔΕΞΙΑ (v528) — η φαρδιά στήλη είναι πια η
   πρώτη. Σε κινητό στοιβάζονται με τη σειρά του markup: βαθμολογείς, μετά
   βλέπεις τι βγήκε. */
.score-grid-container{display:grid;grid-template-columns:1.75fr 1fr;gap:18px;align-items:start}
/* Μπάρα πλαισίου: τρία νούμερα σε μία σειρά, πάνω από τα πάντα. Η ετικέτα κάθεται
   ΜΕΣΑ στη μπάρα αριστερά — δεύτερος τίτλος ενότητας από πάνω θα κόστιζε 50px για
   να πει αυτό που λέει ήδη η ίδια η ετικέτα. */
.sc-databar{display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));align-items:end;gap:14px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:var(--rl);padding:12px 16px;margin-bottom:14px}
.sc-databar-lbl{font-family:var(--font-m);font-size:8px;letter-spacing:2px;color:var(--slate);text-transform:uppercase;padding-bottom:11px;white-space:nowrap}
.sc-databar .field{margin:0}
.sc-databar .field input{font-size:12px;padding:7px 10px}
@media(max-width:1180px){.sc-databar{grid-template-columns:repeat(3,minmax(0,1fr))}.sc-databar-lbl{grid-column:1 / -1;padding-bottom:0}}
@media(max-width:768px){.score-grid-container{grid-template-columns:1fr}}

/* ── ΖΕΥΓΟΣ ΑΔΡΑΝΩΝ ΠΛΑΙΣΙΩΝ (Ανάλυση Νύχτας) ──────────────────────────────
   GM Morning Report + AI Deep Dive: δίπλα-δίπλα σε πλάτος, στοιβαγμένα στο
   κινητό. Το flex-basis κάνει το σπάσιμο μόνο του — χωρίς media query, ώστε να
   ισχύει και σε στενό παράθυρο desktop, όχι μόνο σε κινητό.
   Το κάτω περιθώριο μπαίνει στα ΠΑΙΔΙΑ, όχι στον γονέα: μετά την ανάλυση και τα
   δύο γίνονται display:none και ο γονέας πρέπει να μηδενίζει — περιθώριο στον
   γονέα θα άφηνε κενό-φάντασμα πάνω από τις μορφές του report. */
.idle-pair{display:flex;flex-wrap:wrap;column-gap:14px;row-gap:0;align-items:stretch}
.idle-pair>*{flex:1 1 320px;min-width:0;margin:0 0 14px}

/* ── REPORT ΑΡΙΣΤΕΡΑ, ΕΡΜΗΝΕΙΑ AI ΔΕΞΙΑ (v555) ──────────────────────────────
   Ένα ζεύγος για τα τρία σημεία όπου το AI διαβάζει report: Morning Report,
   Weekly, Μηνιαίο. Σε πλήρη οθόνη η γραμμή του report έφτανε ~270 χαρακτήρες
   και δεν διαβαζόταν· δίπλα-δίπλα πέφτει στο μισό, και ο αριθμός που επικαλείται
   το AI βρίσκεται στο διπλανό κείμενο χωρίς κύλιση.
   FLEX, ΟΧΙ GRID: όταν λείπει το ένα μισό (άδεια χωρίς AI, AI που δεν έτρεξε
   ακόμη), το άλλο πρέπει να πιάνει όλο το πλάτος. Το display:none παιδί δεν
   μετρά στο flex· στο grid θα άφηνε κενή στήλη.
   `.rpt-ai:empty` κρύβεται: το δοχείο AI είναι άδειο ώσπου να πατηθεί το κουμπί,
   και άδειο μισό θα έκοβε το report στη μέση χωρίς λόγο. Γεμίζει με το loading
   της renderAILoading, οπότε η στήλη ανοίγει τη στιγμή του πατήματος.
   Όριο 1200px: κάτω από αυτό κάθε στήλη πέφτει κάτω από ~530px και οι κεφαλίδες
   με τρία κουμπιά στριμώχνονται. Εκεί στοιβάζονται — report πρώτα, όπως στο DOM.
   Το κενό είναι `gap`, όχι περιθώριο στα παιδιά: κρυμμένο παιδί δεν αφήνει
   κενό-φάντασμα (το μάθημα του .idle-pair, §50). */
.rpt-pair{display:flex;flex-direction:column;gap:14px}
.rpt-pair>*{min-width:0}
.rpt-pair>.rpt-ai:empty{display:none}
/* Το μπλοκ AI του νυχτερινού έχει διαχωριστική γραμμή όταν κάθεται ΚΑΤΩ από το
   report· δίπλα του η γραμμή θα έκοβε τη στήλη χωρίς να χωρίζει τίποτα. */
.rpt-ai-blk{padding-top:14px;border-top:1px solid rgba(255,255,255,.07)}
@media(min-width:1200px){
  .rpt-pair{flex-direction:row;align-items:flex-start;gap:16px}
  .rpt-pair>*{flex:1 1 0}
  /* ΙΔΙΟ ΠΛΑΤΟΣ ΜΕ Ή ΧΩΡΙΣ AI (v564, §90.3 — απόφαση Άλκη). Ο report κρατά ΠΑΝΤΑ τη
     μισή γραμμή· χωρίς AI το δεξί μισό μένει κενό, αντί να απλωθεί σε ~270 χαρακτήρες
     ανά γραμμή. Όταν ανοίγει το AI, εμφανίζεται δεξιά — τίποτα δεν μετακινείται. Αριστερή
     στοίχιση, για να μένει κάτω από την κεφαλίδα και τη γραμμή μορφών. */
  .rpt-pair>:first-child{flex:0 0 calc((100% - 16px) / 2);max-width:calc((100% - 16px) / 2)}
  .rpt-ai-blk{padding-top:0;border-top:none}
}
/* ΚΕΦΑΛΕΣ ΙΣΟΥ ΥΨΟΥΣ (v558). Στο νυχτερινό κάθε στήλη αρχίζει με μια γραμμή:
   αριστερά «Μορφή: Email/WhatsApp/PDF», δεξιά το κουμπί AI με τη λεζάντα του. Είχαν
   διαφορετικό ύψος (κουμπί sm έναντι κανονικού με margin-top 10px), οπότε οι δύο
   κάρτες ξεκινούσαν ~20px απόσταση. Ίδιο min-height σε πλάτος → ίδια γραμμή εκκίνησης.
   Σε στενή οθόνη το ύψος δεν επιβάλλεται: εκεί στοιβάζονται. */
.rpt-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 12px}
.rpt-head .btn{margin-top:0}
@media(min-width:1200px){ .rpt-pair .rpt-head{min-height:44px} }
/* Κεφαλίδα report σε μισό πλάτος: τα κουμπιά τυλίγονται αντί να ξεχειλίζουν. */
.rpt-pair .rbox-hdr{flex-wrap:wrap;gap:10px}
.rpt-pair .rbox-hdr>div:last-child{flex-wrap:wrap}

/* ── ΤΟ ΚΕΙΜΕΝΟ ΤΟΥ AI ΕΙΝΑΙ ΠΡΟΖΑ (v555) ─────────────────────────────────
   Ήταν monospace 11px με line-height 2 — η γραμματοσειρά του report. Στο report
   η monospace έχει λόγο: στοιχίζει τον πίνακα «Πληρότητα : 76,5%». Στο AI δεν
   στοιχίζει τίποτα· είναι παράγραφοι, και η monospace τις κάνει κουραστικές.
   Μία κλάση για ΟΛΑ τα σημεία που περνούν από τη renderAIResponse (νυχτερινό,
   Weekly, μηνιαίο, Ιστορικό) — η ίδια ερμηνεία πρέπει να διαβάζεται ίδια παντού.
   Η εκτύπωση (printAIResponse) έχει δική της γραμματοσειρά και δεν επηρεάζεται. */
.ai-text{padding:16px 20px;font-family:var(--font-b);font-size:13px;line-height:1.7;
  color:rgba(244,239,230,.9);white-space:pre-wrap;overflow-wrap:break-word}
/* ── ΣΗΜΕΙΩΣΕΙΣ ΝΥΧΤΑΣ — ΓΕΓΟΝΟΤΑ ΠΡΩΤΑ (v532) ───────────────────────────
   Ο κατάλογος πιάνει τη φαρδιά στήλη· το score είναι μικρό και δεξιά. Τα
   γεγονότα είναι chips με flex-wrap: τα ονόματα έχουν άνισο μήκος και μια
   σταθερή στήλη θα έκοβε το «Αίτημα που δεν ικανοποιήθηκε». */
.sc-panel{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:var(--rl);padding:18px 20px;display:flex;flex-direction:column;gap:10px;min-width:0}
.sc-h2{margin:0;font-family:var(--font-d);font-size:27px;font-weight:600;color:var(--cream)}
.sc-lead{margin:4px 0 0;font-size:12.5px;color:#9FB0C6;line-height:1.45}
.sc-legend{display:flex;gap:14px;flex-wrap:wrap;font-family:var(--font-m);font-size:10px;color:#9FB0C6}
.sc-legend span:first-child{letter-spacing:1.5px;text-transform:uppercase;color:var(--slate)}
.sc-cats{display:flex;flex-direction:column;gap:2px}
.sc-cat{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border-radius:12px;border:1px solid transparent}
/* Η κατηγορία που αφορά η ασυμφωνία πλαισιώνεται — το μάτι πάει εκεί που λύνεται. */
.sc-cat.flag{border-color:rgba(212,136,10,.55);background:rgba(212,136,10,.05)}
.sc-catname{font-size:12.5px;font-weight:700;color:var(--cream)}
.sc-evs{display:flex;flex-wrap:wrap;gap:6px}
.sc-ev{min-height:44px;padding:0 12px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);
  color:#C9D4E2;font-family:var(--font-b);font-size:12px;font-weight:500;display:flex;align-items:center;gap:8px;cursor:pointer;white-space:nowrap;
  transition:background .12s,border-color .12s,color .12s}
.sc-ev:hover{border-color:rgba(201,150,58,.45);color:var(--cream)}
.sc-ev.on{border-color:var(--gold);background:rgba(201,150,58,.16);color:var(--gold2);font-weight:600}
.sc-ev.other{color:#9FB0C6}
.sc-ev.hint{border-color:var(--amber)}
.sc-box{width:16px;height:16px;border-radius:4px;border:1.5px solid var(--slate);box-sizing:border-box;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}
.sc-ev.on .sc-box,.sc-ctog.on .sc-box{background:var(--gold);border-color:var(--gold)}
.sc-ev.on .sc-box::after,.sc-ctog.on .sc-box::after{content:'';width:4px;height:8px;border:solid var(--navy);border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.sc-det{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border-radius:10px;background:rgba(10,22,40,.55);border:1px solid rgba(201,150,58,.3)}
.sc-detrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.sc-detlbl{font-size:12.5px;color:var(--gold2);font-weight:600;min-width:140px}
.sc-sevs{display:flex;gap:6px}
.sc-sev{width:44px;height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#9FB0C6;
  font-family:var(--font-d);font-size:18px;font-weight:600;cursor:pointer}
.sc-sev:hover{border-color:rgba(201,150,58,.45);color:var(--cream)}
.sc-sev.on.s4{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.10);color:var(--cream)}
.sc-sev.on.s3{border-color:rgba(212,136,10,.6);background:rgba(212,136,10,.16);color:#E8A23A}
.sc-sev.on.s2{border-color:rgba(229,115,115,.6);background:rgba(229,115,115,.16);color:#F09A9A}
.sc-sev.on.s1{border-color:var(--red2);background:rgba(229,115,115,.26);color:#F09A9A}
.sc-sevtxt{font-family:var(--font-m);font-size:10.5px;color:#C9D4E2}
.sc-sevtxt.s3{color:#E8A23A}.sc-sevtxt.s2,.sc-sevtxt.s1{color:#F09A9A}
.sc-sevtxt.miss{color:var(--amber)}
.sc-room{display:flex;align-items:center;gap:6px;margin-left:auto;font-size:11px;color:#9FB0C6}
.sc-room input{width:64px;height:36px;box-sizing:border-box;padding:0 8px;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.25);color:var(--cream);font-family:var(--font-m);font-size:12px}
.sc-txtrow{display:flex;flex-direction:column;gap:4px}
.sc-txtrow label{font-size:11px;color:#E8A23A}
.sc-txtrow input,.sc-cin{height:40px;box-sizing:border-box;padding:0 12px;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.25);color:var(--cream);font-family:var(--font-b);font-size:12.5px;width:100%}
/* Κείμενο που λείπει: περίγραμμα, όχι μήνυμα — το μήνυμα το λέει ήδη το score. */
.sc-txtrow input.need,.sc-cin.need{border-color:rgba(212,136,10,.6)}
.sc-warn{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:12px;background:rgba(212,136,10,.08);border:1px solid rgba(212,136,10,.5)}
.sc-warnhd{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:700;color:var(--cream)}
.sc-warnhd svg{color:#E8A23A;flex-shrink:0}
.sc-warntx{font-size:12.5px;color:#C9D4E2;line-height:1.5}
.sc-quiet{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-top:12px;border-top:1px solid rgba(255,255,255,.07);font-size:12px;color:#9FB0C6}
.sc-quietbtn{min-height:44px;padding:0 18px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:transparent;color:#9FB0C6;
  font-family:var(--font-b);font-size:13px;font-weight:600;display:flex;align-items:center;gap:8px;cursor:pointer}
.sc-quietbtn svg{display:none}
.sc-quietbtn.on{border-color:var(--gold);background:rgba(201,150,58,.18);color:var(--gold2)}
.sc-quietbtn.on svg{display:block}
.sc-quietbtn.suspended{border-style:dashed;background:transparent;color:#9C8350}
.sc-quietbtn:disabled{opacity:.4;cursor:not-allowed}
.sc-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.sc-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:var(--rl);padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.sc-h3{margin:0;font-family:var(--font-d);font-size:19px;font-weight:600;color:var(--cream)}
.sc-cap{margin:-6px 0 0;font-size:11.5px;color:#9FB0C6}
.sc-contrib{display:flex;flex-direction:column;gap:8px}
.sc-ctog{min-height:44px;width:100%;padding:0 12px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:transparent;color:var(--cream);
  font-family:var(--font-b);font-size:12.5px;display:flex;align-items:center;gap:10px;cursor:pointer;text-align:left}
.sc-ctog.on{border-color:rgba(201,150,58,.45);background:rgba(201,150,58,.08)}
.sc-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sc-schd{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-family:var(--font-m);font-size:9px;color:var(--slate)}
.sc-schd span:first-child{letter-spacing:2px;text-transform:uppercase}
.sc-scrow{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.sc-scval{font-family:var(--font-d);font-size:34px;font-weight:600;color:var(--gold);line-height:1}
.sc-scval.grey{color:var(--slate)}
.sc-scsub{font-size:12px;color:#9FB0C6;line-height:1.4;flex:1 1 160px}
.sc-break{display:flex;flex-direction:column;gap:6px;font-size:11.5px}
.sc-brrow{display:flex;justify-content:space-between;gap:10px;color:var(--cream)}
.sc-brrow span:last-child{font-family:var(--font-m);text-align:right}
.sc-brrow.quiet{color:#9FB0C6}
.sc-brrow .s4{color:var(--cream)}.sc-brrow .s3{color:#E8A23A}.sc-brrow .s2,.sc-brrow .s1{color:#F09A9A}
.sc-break p{margin:2px 0 0;font-size:11px;color:#9FB0C6;line-height:1.45}
.sc-expl{font-size:10.5px;color:var(--slate);line-height:1.7;margin-top:8px;max-width:880px}
.sc-expl>div{margin-bottom:8px}
.sc-expl b{color:var(--cream)}
.btn:disabled{opacity:.38;cursor:not-allowed;filter:grayscale(.5)}
.btn:disabled:hover{opacity:.38}

/* VERDICT */
.verdict{background:linear-gradient(135deg,rgba(201,150,58,.1),rgba(201,150,58,.02));border:1px solid rgba(201,150,58,.28);border-radius:var(--rl);padding:18px 22px;margin-top:6px}
.verdict-l{font-family:var(--font-m);font-size:9px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;margin-bottom:8px}
.verdict-t{font-size:13px;color:var(--cream);line-height:1.8}

/* REPORT BOX */
.rbox{background:rgba(5,10,20,.85);border:1px solid rgba(122,142,168,.18);border-radius:var(--rl);padding:18px 22px}
.rbox-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.rbox-t{font-family:var(--font-m);font-size:9px;letter-spacing:2px;color:var(--slate);text-transform:uppercase}
.rtext{font-family:var(--font-m);font-size:10.5px;color:rgba(244,239,230,.75);line-height:1.9;white-space:pre-wrap}

/* CHIPS */
.chip{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-m);font-size:9px;padding:3px 8px;border-radius:10px}
.chip.up{background:rgba(39,174,96,.14);color:#4caf82;border:1px solid rgba(39,174,96,.28)}
.chip.dn{background:rgba(146,43,33,.14);color:var(--red2);border:1px solid rgba(146,43,33,.28)}
.chip.eq{background:rgba(122,142,168,.1);color:var(--slate);border:1px solid rgba(122,142,168,.2)}

/* HISTORY */
.hist-list{display:flex;flex-direction:column;gap:7px}
.he{display:flex;align-items:center;gap:13px;padding:11px 15px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:var(--r);cursor:pointer;transition:.2s}
.he:hover{border-color:rgba(201,150,58,.3);background:rgba(201,150,58,.04)}
.he-score{font-family:var(--font-d);font-size:22px;font-weight:700;min-width:38px;text-align:center}
.he-info{flex:1}
.he-date{font-size:12px;font-weight:600;color:var(--cream)}
.he-sub{font-size:10px;color:var(--slate);font-family:var(--font-m);margin-top:2px}
.he-kpis{display:flex;gap:10px;font-family:var(--font-m);font-size:10px;color:var(--slate);margin-top:3px;flex-wrap:wrap}
.he-del{width:28px;height:28px;border-radius:6px;border:1px solid rgba(229,115,115,.3);background:transparent;color:var(--red2);cursor:pointer;font-size:12px;transition:.2s;flex-shrink:0}
.he-del:hover{background:rgba(229,115,115,.15)}
.hist-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:9px;margin-bottom:18px}
.hs{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:var(--r);padding:11px 13px;text-align:center}
.hs-v{font-family:var(--font-d);font-size:24px;font-weight:700;color:var(--gold)}
.hs-l{font-family:var(--font-m);font-size:8px;color:var(--slate);text-transform:uppercase;letter-spacing:1.5px;margin-top:3px}

/* SETTINGS */
.ov{position:fixed;inset:0;z-index:500;background:rgba(5,10,20,.88);backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center}
.ov.open{display:flex}
.ov-panel{background:var(--navy2);border:1px solid rgba(201,150,58,.28);border-radius:16px;width:min(580px,95vw);max-height:90vh;overflow-y:auto;padding:30px;
  /* v467: και εδώ λεπτή μπάρα — τα modal του P&L και του Ιστορικού κυλούν πολύ,
     και η μπάρα του συστήματος έκοβε το χρυσό περίγραμμα του παραθύρου.

     v489: το track ΔΕΝ είναι πια transparent. Το transparent άφηνε να φανεί το
     --navy2 του panel, οπότε η κολόνα του scrollbar έμενε ανοιχτή ενώ η
     κεφαλίδα από δίπλα ήταν --navy — το «κενό στην άκρη».
     ΠΡΟΣΟΧΗ ΑΝ ΞΑΝΑΠΕΙΡΑΧΤΕΙ: εδώ παλεύουν δύο συστήματα. Ο σύγχρονος Chrome
     υποστηρίζει το ΤΥΠΙΚΟ scrollbar-color και τότε ΑΓΝΟΕΙ εντελώς τα
     ::-webkit-scrollbar-* από κάτω. Άρα το χρώμα του track ορίζεται ΕΔΩ· τα
     webkit μένουν μόνο ως εφεδρεία για παλιότερες μηχανές και πρέπει να λένε
     το ίδιο πράγμα. Αλλαγή στο ένα χωρίς το άλλο δεν φαίνεται πουθενά. */
  scrollbar-width:thin;scrollbar-color:rgba(201,150,58,.35) var(--navy)}
.ov-panel::-webkit-scrollbar{width:6px}
/* Εφεδρεία για μηχανές χωρίς scrollbar-color — ίδιο χρώμα με τον κανόνα πάνω.
   Γιατί σκούρο: η κολλημένη κεφαλίδα βάφεται με box-shadow, που κόβεται στο
   padding box, και η κολόνα του scrollbar είναι έξω από αυτό. Καμία τιμή στη
   σκιά δεν το φτάνει — το clipping δεν είναι θέμα μεγέθους. Το track είναι το
   μόνο στοιχείο που ζωγραφίζει εκεί.
   ΤΟ ΤΙΜΗΜΑ, ΡΗΤΑ: βάφεται σε ΟΛΟ το ύψος, όχι μόνο στο ύψος της κεφαλίδας —
   δεν υπάρχει τρόπος να ξέρει πού τελειώνει εκείνη. Κάθε modal αποκτά σκούρα
   ράγα στη δεξιά άκρη. Επιλογή, όχι παρενέργεια. */
.ov-panel::-webkit-scrollbar-track{background:var(--navy)}
.ov-panel::-webkit-scrollbar-thumb{background:rgba(201,150,58,.35);border-radius:3px}
.ov-panel::-webkit-scrollbar-thumb:hover{background:rgba(201,150,58,.55)}
/* ── ΚΟΛΛΗΜΕΝΗ ΚΕΦΑΛΙΔΑ MODAL (v469) ────────────────────────────────────────
   Τα modal κυλούν πολύ: το P&L, το Ιστορικό και το Budget είναι ολόκληρες
   σελίδες μέσα σε παράθυρο. Με την κεφαλίδα να φεύγει προς τα πάνω, στα μισά
   του P&L δεν ξέρεις σε ποιο παράθυρο βρίσκεσαι — ούτε πού είναι το ✕.
   ΧΩΡΙΣ αρνητικά περιθώρια: επτά panel έχουν δικό τους padding (24, 28, 32, 36,
   clamp…) και ένα σταθερό -30px θα ξεπερνούσε το πλαίσιο στα περισσότερα. Δεν
   χρειάζονται: το περιεχόμενο ζει ΜΕΣΑ στο content box, στο ίδιο πλάτος με την
   κεφαλίδα, οπότε ποτέ δεν περνά από τα πλάγια της. */
/* ── ΓΙΑΤΙ ΠΙΟ ΣΚΟΥΡΟ (v486) ────────────────────────────────────────────────
   Η κεφαλίδα είχε ΑΚΡΙΒΩΣ το φόντο του panel (--navy2), οπότε το κείμενο που
   κυλούσε από κάτω της έμοιαζε συνέχεια του τίτλου. Τώρα --navy (#0A1628):
   σκουρότερη ΑΠΟ το panel, άρα ξεχωριστό επίπεδο.

   ΤΟ ΟΤΙ ΦΑΙΝΕΤΑΙ ΚΕΙΜΕΝΟ ΠΑΝΩ ΑΠΟ ΤΗΝ ΚΕΦΑΛΙΔΑ ΕΙΝΑΙ ΣΚΟΠΙΜΟ.
   Το panel έχει padding, η sticky κεφαλίδα κολλάει στο top:0 του content box,
   και στη λωρίδα από πάνω της το περιεχόμενο περνά ορατό. Στη v485 το κάλυψα με
   ψευδοστοιχείο — ΛΑΘΟΣ: το εφέ είναι επιλογή, δίνει βάθος στο modal, και η
   κάλυψη το μετέτρεπε σε αδιαφανή λωρίδα κολλημένη στην κορυφή. Αναιρέθηκε.
   Αν κάποιος ξαναδεί «κείμενο πάνω από τον τίτλο» και το περάσει για σφάλμα:
   δεν είναι. Το μόνο που έλειπε ήταν η αντίθεση, και μπήκε. */
.ov-hdr{position:sticky;top:0;z-index:5;background:var(--navy);
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:6px 0 12px;margin-bottom:18px;
  border-bottom:1px solid rgba(255,255,255,.08);
  /* ── ΑΠΟ ΑΚΡΗ ΣΕ ΑΚΡΗ, ΧΩΡΙΣ ΝΑ ΞΕΡΟΥΜΕ ΤΟ PADDING (v487) ────────────────
     Η κεφαλίδα ζει ΜΕΣΑ στο content box, άρα η λωρίδα σταματούσε όσο το padding
     του panel — και τα panel έχουν επτά διαφορετικά padding (24, 28, 32, 36,
     clamp…). Αρνητικά περιθώρια απορρίφθηκαν ήδη δύο φορές γι' αυτόν ακριβώς
     τον λόγο: ένα σταθερό -30px ξεπερνά το πλαίσιο στα μισά.

     Το box-shadow λύνει και τα δύο. Δεν πιάνει χώρο, δεν εξαρτάται από το
     padding, και — σε αντίθεση με absolute ψευδοστοιχείο — ΔΕΝ δημιουργεί
     scrollable overflow, άρα δεν βγάζει οριζόντια μπάρα. Το κόβει το overflow
     του panel ακριβώς στην άκρη του.

     Τέσσερις σκιές: δύο αντίγραφα σε --navy αριστερά/δεξιά (η λωρίδα) και δύο
     ίδια μετατοπισμένα 1px κάτω στο χρώμα της γραμμής — ώστε το border-bottom
     να ΣΥΝΕΧΙΖΕΤΑΙ ως την άκρη αντί να κόβεται στο πλάτος του κειμένου.
     Τα 40px καλύπτουν και το μεγαλύτερο padding. */
  box-shadow:-40px 0 0 var(--navy), 40px 0 0 var(--navy),
             -40px 1px 0 rgba(255,255,255,.08), 40px 1px 0 rgba(255,255,255,.08)}
.ov-title{font-family:var(--font-d);font-size:24px;font-weight:700;color:var(--cream)}
.ov-close{width:32px;height:32px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:transparent;color:var(--slate);cursor:pointer;font-size:16px;transition:.2s}
.ov-close:hover{background:rgba(255,255,255,.07);color:var(--cream)}
.set-group{margin-bottom:22px}
.set-group h3{font-family:var(--font-d);font-size:17px;color:var(--cream);margin-bottom:12px;padding-bottom:7px;border-bottom:1px solid rgba(255,255,255,.08)}

/* Ξενοδοχείο: άνισες στήλες κατά περιεχόμενο. Με ίσα μερίδια το όνομα κοβόταν ενώ
   ο αριθμός δωματίων είχε το ίδιο πλάτος για δύο ψηφία. Οι αναλογίες βγαίνουν από το
   τι χωράει το κάθε πεδίο: όνομα ξενοδοχείου (μακρύ κείμενο) > πόλη > νόμισμα (select)
   > χωρητικότητα (2-3 ψηφία). */
#set-hotel .ig{grid-template-columns:2.2fr 1fr 1.5fr 1.4fr}
#set-hotel .ig > .field{display:flex;flex-direction:column}
#set-hotel .ig > .field > label:first-child{min-height:20px;display:flex;align-items:flex-end}
@media(max-width:759px){#set-hotel .ig{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Δύο πεδία πλάι-πλάι. Το .ig (auto-fit 138px) θα έφτιαχνε πέντε στενές στήλες για δύο
   πεδία· εδώ θέλουμε ακριβώς δύο. Οι ετικέτες πιάνουν άνισο αριθμό γραμμών, οπότε ίδιο
   min-height ώστε τα πλαίσια να ξεκινούν στο ίδιο ύψος. */
.ig-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:start}
.ig-2 > .field{display:flex;flex-direction:column}
.ig-2 > .field > label:first-child{min-height:20px;display:flex;align-items:flex-end}
@media(max-width:559px){.ig-2{grid-template-columns:1fr}}

/* Comp Set & ARI: κοινή γραμμή βάσης στα πεδία.
   Οι ετικέτες έχουν άνισο μήκος («Ημέρες που αξίζουν — πλαφόν» πιάνει δύο γραμμές,
   «Alert αν Comp κόψει» μία), οπότε τα πλαίσια κατέβαιναν σε διαφορετικό ύψος και
   φαίνονταν μετατοπισμένα. Το πλάτος ήταν ήδη ίσο (grid 1fr) — μόνο η κατακόρυφη
   στοίχιση έλειπε. Στοχευμένο σε αυτή την ομάδα: αλλού οι ετικέτες είναι μονόγραμμες
   και το min-height θα πρόσθετε κενό χωρίς λόγο. */
/* Τέσσερις ρητές στήλες: το auto-fit έφτιαχνε ΠΕΝΤΕ των ~153px σε πλάτος 806px, οπότε
   τα τέσσερα ονόματα κόβονταν και η πέμπτη στήλη έμενε κενή — ενώ το μπλοκ βαρυτήτων,
   που πιάνει grid-column:1/-1 και μοιράζεται σε τέσσερα, έβγαζε ~194px. Ίδια ομάδα,
   δύο πλάτη. Το minmax(0,1fr) αντί για 1fr ώστε μακρύ όνομα να μη σπρώχνει τη στήλη. */
#set-comp .ig{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:759px){#set-comp .ig{grid-template-columns:repeat(2,minmax(0,1fr))}}
#set-comp .ig > .field{display:flex;flex-direction:column;align-self:start}
#set-comp .ig > .field > label:first-child{min-height:20px;display:flex;align-items:flex-end}
/* Το μπλοκ «Δείκτες Βαρύτητας» έχει μονόγραμμη ετικέτα και δικό του εσωτερικό grid */
#set-comp .ig > .field.cs-wide > label:first-child{min-height:0;display:block}

/* Ρυθμίσεις: φαρδύτερο modal σε desktop (το .ig auto-fit δίνει 4-5 στήλες) */
@media(min-width:760px){#settings-overlay .ov-panel{width:min(900px,95vw);padding:34px 38px}}

/* Add-ons (AI + Sync) */
.addon-block{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:14px 16px;margin-bottom:14px}
.addon-block:last-child{margin-bottom:0}
.addon-head{font-family:var(--font-d);font-size:15px;color:var(--cream);display:flex;align-items:center;gap:8px;margin-bottom:11px}
.addon-head .esvg{width:17px;height:17px;color:var(--gold2);flex:0 0 auto}
.addon-locked{display:flex;flex-direction:column;gap:6px;padding:13px 14px;border:1px dashed rgba(201,150,58,.38);border-radius:8px;background:rgba(201,150,58,.05)}
.addon-locked .al-title{font-family:var(--font-m);font-size:12px;color:var(--gold2);font-weight:600}
.addon-locked .al-desc{font-family:var(--font-m);font-size:10px;color:var(--slate);line-height:1.6}

/* Baseline accordion (ένα <details> ανά τύπο δωματίου) */
.bl-acc{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:8px;margin-bottom:8px;overflow:hidden}
.bl-acc>summary{list-style:none;cursor:pointer;padding:11px 13px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-family:var(--font-m);font-size:12px;color:var(--cream);user-select:none}
.bl-acc>summary::-webkit-details-marker{display:none}
.bl-acc>summary:hover{background:rgba(255,255,255,.03)}
.bl-acc .bl-sumL{display:flex;align-items:center;gap:9px;min-width:0}
.bl-acc .bl-chevron{transition:transform .2s;color:var(--slate);flex:0 0 auto}
.bl-acc[open] .bl-chevron{transform:rotate(90deg)}
.bl-acc .bl-body{padding:2px 13px 13px}
.bl-acc .bl-state{font-family:var(--font-m);font-size:9px;letter-spacing:.5px;padding:2px 8px;border-radius:10px;white-space:nowrap;flex:0 0 auto}
.bl-acc .bl-state.set{color:var(--lime);background:rgba(156,214,90,.1)}
.bl-acc .bl-state.empty{color:var(--slate);background:rgba(255,255,255,.04)}

/* RATE INTEL */
.ri{width:74px;background:rgba(255,255,255,.05);border:1px solid rgba(201,150,58,.2);border-radius:6px;color:var(--cream);font-family:var(--font-m);font-size:13px;padding:7px 7px;text-align:center;transition:.2s}
.ri:focus{outline:none;border-color:var(--gold);background:rgba(201,150,58,.1)}
.ri.h1r{border-color:rgba(201,150,58,.5);background:rgba(201,150,58,.07)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}
@media(max-width:700px){.cal-grid{grid-template-columns:repeat(3,1fr)}}
.cal-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:11px}
.cal-card.cup{border-color:rgba(39,174,96,.4);background:rgba(39,174,96,.05)}
.cal-card.cdn{border-color:rgba(146,43,33,.4);background:rgba(146,43,33,.05)}
.cal-card.cok{border-color:rgba(201,150,58,.25)}
.cal-card.calt{border-color:rgba(229,115,115,.5);background:rgba(229,115,115,.05)}
.pos-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 7px;border-radius:10px;font-family:var(--font-m);font-size:8px;font-weight:600;margin-top:4px}
.pos-pm{background:rgba(201,150,58,.2);color:var(--gold2);border:1px solid rgba(201,150,58,.4)}
.pos-pa{background:rgba(39,174,96,.15);color:#4caf82;border:1px solid rgba(39,174,96,.3)}
.pos-di{background:rgba(93,173,226,.15);color:#5dade2;border:1px solid rgba(93,173,226,.3)}
.pos-un{background:rgba(146,43,33,.2);color:var(--red2);border:1px solid rgba(146,43,33,.4)}
.alert-row{display:flex;align-items:flex-start;gap:10px;padding:11px 13px;border-radius:8px;background:rgba(229,115,115,.07);border:1px solid rgba(229,115,115,.2);margin-bottom:8px;font-size:11px}

/* FORMAT TABS */
.fmt-tabs{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.fmt-tab{padding:7px 15px;border-radius:var(--r);border:1px solid rgba(201,150,58,.28);background:transparent;color:var(--slate);font-family:var(--font-m);font-size:9px;letter-spacing:1px;cursor:pointer;transition:.2s}
.fmt-tab.on{background:rgba(201,150,58,.14);color:var(--gold2);border-color:rgba(201,150,58,.48)}

/* TOAST */
.toast{position:fixed;bottom:22px;right:22px;background:rgba(8,16,30,.97);border:1px solid rgba(201,150,58,.38);border-radius:10px;padding:11px 18px;font-family:var(--font-m);font-size:11px;color:var(--cream);z-index:999;transform:translateY(70px);opacity:0;transition:.3s;box-shadow:0 8px 30px rgba(0,0,0,.5)}
.toast.show{transform:translateY(0);opacity:1}

/* PDF PRINT */
@media print{
  .sidebar,.topbar,.toast,.ov{display:none!important}
  .main{margin-left:0;padding-top:0}
  body{background:#fff;color:#111}
  .page{display:block!important;padding:0}
  #page-analyze .card, #page-analyze .kpi, #page-analyze .verdict{border-color:#ccc!important;background:#fff!important;color:#111!important}
}

/* RESPONSIVE */
@media(max-width:500px){
  .sidebar{width:50px}.main{margin-left:50px}
  .page{padding:16px 12px 40px}.topbar{padding:0 12px}
  .tb-logo{width:34px;height:34px;margin-right:8px}
  /* v410 — σε κινητό μένουν ΛΟΓΟΤΥΠΟ · ΟΝΟΜΑ · ΡΟΛΟΪ ως κείμενο.
     Το όνομα του προϊόντος ΕΠΙΣΤΡΕΦΕΙ: ήταν το μόνο που έλειπε ενώ είναι η
     ταυτότητα της οθόνης. Καμία αλλαγή μεγέθους — όνομα και υπότιτλος είναι
     σχεδιασμένοι με ΙΔΙΟ πλάτος και αλλάζουν μαζί ή καθόλου.
     Support και badge άδειας ΔΕΝ κρύβονται, μένουν ως εικονίδια: το Support
     είναι ο μόνος τρόπος επικοινωνίας για χρήστη με ενεργή άδεια, και το badge
     γράφει τις ημέρες που απομένουν σε TRIAL ≤5 (.lic-days, δεν κρύβεται ποτέ). */
  .tb-hotel,.tb-page,.tb-div{display:none}
  .tb-brand{display:block}
  .tb-sup-t,.lic-txt{display:none}
  /* flex:0 0 auto — όταν το topbar ξεχείλιζε, τα στοιχεία συμπιέζονταν και το
     εικονίδιο του Support (13px SVG, χωρίς κείμενο να το κρατήσει) έσβηνε σε
     μηδενικό πλάτος: έμενε άδειο περίγραμμα. Ό,τι είναι μόνο εικονίδιο δεν
     συρρικνώνεται ποτέ. */
  .tb-support{padding:5px 7px!important;flex:0 0 auto}
  .tb-support svg{flex:0 0 auto}
  #lic-badge{flex:0 0 auto}
  #lic-badge{font-size:8px;padding:3px 7px;max-width:92px;overflow:hidden;
    text-overflow:ellipsis;white-space:nowrap}
  .tb-time{font-size:10px;padding:4px 6px;flex:0 0 auto}
  /* ασφαλιστική: αν το topbar γεμίσει, συρρικνώνεται ΤΟ ΟΝΟΜΑ, όχι το ρολόι.
     Το ρολόι είτε διαβάζεται ολόκληρο είτε δεν έχει νόημα. */
  .tb-brand{min-width:0;overflow:hidden}
  .tb-name{white-space:nowrap}
  /* Morning Report: label πάνω, κουμπιά από κάτω με wrap (αντί να ξεχειλίζουν) */
  .rbox-hdr{flex-direction:column;align-items:stretch;gap:10px}
  .rbox-hdr>div:last-child{flex-wrap:wrap}
}

/* ══════════════════════════════════════════════════════
   PIN PAD — Manager Login
══════════════════════════════════════════════════════ */
.pin-dot{
  width:14px;height:14px;border-radius:50%;
  border:2px solid rgba(201,150,58,.4);
  background:transparent;
  transition:.2s;
}
.pin-dot.filled{
  background:var(--gold);
  border-color:var(--gold);
  transform:scale(1.15);
}
.pin-btn{
  width:100%;aspect-ratio:1;border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.05);
  color:var(--cream);
  font-family:var(--font-d);
  font-size:22px;font-weight:600;
  cursor:pointer;
  transition:.15s;
  display:flex;align-items:center;justify-content:center;
}
.pin-btn:hover{
  background:rgba(201,150,58,.15);
  border-color:rgba(201,150,58,.4);
  color:var(--gold);
}
.pin-btn:active{
  transform:scale(.93);
  background:rgba(201,150,58,.25);
}
.pin-btn-clear{
  font-size:16px;
  color:var(--slate);
}
.pin-btn-cancel{
  font-size:14px;
  color:var(--slate);
}

/* ── ΤΟ ΚΕΛΙ — ΗΜΕΡΟΛΟΓΙΟ, ΑΝΑΖΗΤΗΣΗ, ΣΤΡΑΤΗΓΙΚΕΣ (v497) ────────────────────
   Μία κλάση για τις τρεις οθόνες, επειδή είναι το ίδιο κελί (_calCell).
   Χρώμα περιγράμματος, αριστερή λωρίδα και φόντο γράφονται INLINE ανά κελί από
   την παλέτα ρυθμού. Εδώ μένει μόνο η γεωμετρία.

   ΤΟ HOVER ΔΕΝ ΑΓΓΙΖΕΙ ΟΥΤΕ ΓΕΩΜΕΤΡΙΑ ΟΥΤΕ ΣΥΓΚΕΚΡΙΜΕΝΟ ΧΡΩΜΑ. Τρεις
   προηγούμενες απόπειρες απέτυχαν, κάθε φορά αλλιώς: το scale(1.02) ΕΚΟΒΕ την
   αριστερή λωρίδα στη στήλη των στρατηγικών (overflow-x:hidden), το
   borderColor την ΕΒΑΦΕ γκρι (shorthand και για τις τέσσερις πλευρές, §62).
   Το brightness φωτίζει ό,τι υπάρχει κρατώντας τις σχέσεις — ό,τι κι αν μπει
   αύριο στο κελί, δεν σβήνεται και δεν κόβεται. */
.cal-cell{cursor:pointer;border-radius:8px;padding:8px;
  display:flex;flex-direction:column;justify-content:space-between;
  box-sizing:border-box;transition:filter .12s;

  /* ── ΤΟ ΥΨΟΣ ΕΙΝΑΙ ΕΝΑ, ΓΡΑΜΜΕΝΟ ΜΙΑ ΦΟΡΑ (v500) ────────────────────────
     Μετρημένο, όχι εκτιμημένο: κελί ημερολογίου 104px, κελί στρατηγικών 80px
     — με ΙΔΙΕΣ τέσσερις σειρές. Δύο διαφορετικές αιτίες:
     • Το ημερολόγιο είναι πλέγμα 7 στηλών: κάθε κελί τεντώνεται στο ύψος του
       ψηλότερου κελιού ΤΗΣ ΕΒΔΟΜΑΔΑΣ του (περιεχόμενο 93px → κουτί 104px).
     • Οι στρατηγικές είναι μονή στήλη: κανένας γείτονας να τεντώσει, οπότε το
       κελί έμενε στο min-height.
     Το ίδιο min-height παντού εξαλείφει και τις δύο: κανένα κελί δεν πέφτει
     κάτω από 104, άρα η εβδομαδιαία σειρά δεν έχει τι να τεντώσει.
     ΑΝ ΑΛΛΑΞΕΙ ΤΟ ΠΕΡΙΕΧΟΜΕΝΟ ΤΟΥ ΚΕΛΙΟΥ, ΑΥΤΟΣ Ο ΑΡΙΘΜΟΣ ΞΑΝΑΜΕΤΡΙΕΤΑΙ. */
  min-height:104px;

  /* ── ΓΙΑΤΙ clip ΚΑΙ ΟΧΙ hidden (v500) ──────────────────────────────────
     Η v498 έβαλε `overflow:hidden` για να μη διαφεύγει το περιεχόμενο πλάγια
     σε στενή στήλη. Παρενέργεια: το κελί έγινε κουτί με δικό του clipping, το
     πλέγμα έπαψε να μετρά το περιεχόμενό του και του έδινε σκέτο το
     min-height — άρα ΕΚΟΒΕ την κάτω σειρά (98px περιεχόμενο σε κουτί 80px).
     Το `overflow-x:clip` κόβει ΜΟΝΟ οριζόντια και αφήνει το ύψος ελεύθερο:
     αν αύριο το περιεχόμενο ξεπεράσει τα 104, το κελί μεγαλώνει αντί να κρύψει
     δεδομένα. Σιωπηλή περικοπή αριθμού είναι χειρότερη από άσχημο κελί. */
  overflow-x:clip;overflow-y:visible}
.cal-cell:hover{filter:brightness(1.35)}

/* Manager sidebar buttons gold accent */
.nb.mgr-only{
  position:relative;
}
.nb.mgr-only::after{
  content:'';
  position:absolute;
  right:6px;top:6px;
  width:5px;height:5px;
  border-radius:50%;
  background:var(--gold);
  opacity:.7;
}

/* ══════════════════════════════════════════════════════
   MANAGER DASHBOARD
══════════════════════════════════════════════════════ */
@media(max-width:640px){
  #page-mgr-dashboard .grid-2{grid-template-columns:1fr}
}
/* GOPPAR gauge + breakeven side by side → stack on mobile */
#dash-goppar-gauge, #dash-breakeven{min-height:180px}
@media(max-width:600px){
  #dash-goppar-gauge, #dash-breakeven{grid-column:span 1}
  #page-mgr-dashboard > .container > div[style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr!important
  }
}

/* ══════════════════════════════════════════════════════
   LICENSE & ONBOARDING OVERLAYS
══════════════════════════════════════════════════════ */
#license-overlay,
#onboarding-overlay {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

#license-overlay .ov-panel,
#onboarding-overlay .ov-panel {
  border: 1px solid rgba(201,150,58,.2);
  box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04);
}

/* License key input — monospace feel */
#lic-key-input {
  text-transform: uppercase;
  box-sizing: border-box;
}
#lic-key-input::placeholder {
  color: rgba(138,155,176,.4);
  text-transform: none;
  letter-spacing: 0;
}

/* Onboarding step animation */
#ob-icon {
  animation: obPulse 2s ease-in-out infinite;
}
@keyframes obPulse {
  0%,100% { transform: scale(1); }
  50%      { transform: scale(1.08); }
}

/* License badge in topbar */
#lic-badge {
  font-size: 9px;
  white-space: nowrap;
  flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════
   AI INTELLIGENCE LAYER
══════════════════════════════════════════════════════ */
@keyframes aiPulse {
  0%,100% { opacity:.3; transform:scale(.8); }
  50%      { opacity:1;  transform:scale(1.2); }
}

/* AI response card */
#night-ai-container,
#weekly-ai-container {
  animation: fadeIn .3s ease;
}

/* ── HELP / ΟΔΗΓΙΕΣ ── */
/* ── ΚΥΛΑΕΙ ΜΟΝΟ ΤΟ ΚΕΙΜΕΝΟ (v490) ──────────────────────────────────────────
   ΗΤΑΝ: όλη η σελίδα κυλούσε και η λίστα θεμάτων ήταν position:sticky. Στη μέση
   ενός μεγάλου κεφαλαίου η λίστα είχε φύγει από το οπτικό πεδίο και ο χρήστης
   δεν ήξερε ΠΟΥ βρίσκεται — ούτε πώς να πάει αλλού χωρίς να γυρίσει πάνω.
   Τώρα το .help-wrap έχει το ύψος της οθόνης και κυλούν ΤΑ ΠΑΙΔΙΑ του χωριστά:
   η λίστα μένει πάντα ορατή με το ενεργό θέμα τονισμένο, και το κείμενο κυλάει
   μέσα στο πλαίσιό του.
   Το min-height:0 είναι απαραίτητο: flex item δεν συρρικνώνεται κάτω από το
   περιεχόμενό του χωρίς αυτό, οπότε το overflow δεν θα ενεργοποιούνταν ποτέ.
   ΔΥΟ ΜΠΑΡΕΣ ΔΙΠΛΑ-ΔΙΠΛΑ (v492): ο οδηγός έπιανε ήδη όλο το ύψος, αλλά από
   κάτω του έμεναν 50px padding σελίδας + 60px padding του body — 110px κενού
   εκτός οθόνης, που γεννούσαν μπάρα κύλισης για το τίποτα, δίπλα στη δική μας.
   Και τα δύο μηδενίζονται ΜΟΝΟ στις σελίδες του οδηγού (:has παρακάτω), ώστε να
   μην αλλάξει η αναπνοή σε καμία άλλη σελίδα.
   Τα 96px = topbar 54 + padding σελίδας 26 πάνω + 16 κάτω. Αν ξαναμπεί κάτι
   πάνω από το .help-wrap, αυτός ο αριθμός πρέπει να μεγαλώσει — αλλιώς
   ξαναγυρίζει η δεύτερη μπάρα.
   Το min-height κρατά τη σελίδα χρήσιμη σε κοντές οθόνες: εκεί ξανακυλάει η
   σελίδα, που είναι προτιμότερο από πλαίσιο κειμένου 120px. */
.help-wrap{display:flex;gap:20px;align-items:stretch;height:calc(100dvh - 96px);min-height:340px}
#page-help,#page-help-shift{padding-bottom:16px}
body:has(#page-help.on),body:has(#page-help-shift.on){padding-bottom:0}
.help-nav{flex:0 0 195px;display:flex;flex-direction:column;gap:4px;overflow-y:auto;min-height:0;padding-right:4px}
.help-nav,.help-content{scrollbar-width:thin;scrollbar-color:rgba(201,150,58,.35) transparent}
/* Τα ανενεργά θέματα έχουν ΚΙ ΑΥΤΑ πλαίσιο, απλώς ξεθωριασμένο: η λίστα
   διαβάζεται ως σύνολο επιλογών όπου μία είναι επιλεγμένη, όχι ως κείμενο με
   ένα κουμπί μέσα. Πριν, το ανενεργό ήταν border:transparent — μόνο το ενεργό
   είχε σχήμα, οπότε τα υπόλοιπα δεν έμοιαζαν καν πατήσιμα. */
.help-topic-btn{text-align:left;padding:10px 13px;border-radius:var(--r);background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.07);color:var(--slate);font-family:var(--font-m);font-size:12px;cursor:pointer;transition:.15s}
.help-topic-btn:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14);color:var(--cream)}
.help-topic-btn.on{background:rgba(201,150,58,.1);border-color:rgba(201,150,58,.3);color:var(--gold)}
.help-content{flex:1;min-width:0;max-width:780px;line-height:1.65;color:var(--cream);padding:22px 26px;overflow-y:auto;min-height:0}
.help-content h2{font-family:var(--font-d);font-size:23px;color:var(--cream);margin:0 0 4px}
.help-content h3{font-family:var(--font-d);font-size:16px;color:var(--gold);margin:26px 0 8px;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.07)}
.help-content h4{font-size:12px;color:var(--cream);margin:18px 0 6px;font-family:var(--font-m);letter-spacing:.6px;text-transform:uppercase}
.help-content p{margin:8px 0;font-size:13.5px;color:#c8d2de}
.help-content table{width:100%;border-collapse:collapse;margin:10px 0;font-size:12.5px}
.help-content th{text-align:left;padding:7px 10px;background:rgba(201,150,58,.08);color:var(--gold2);font-family:var(--font-m);font-size:10px;letter-spacing:.5px;border-bottom:1px solid rgba(201,150,58,.2)}
.help-content td{padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.05);color:#c8d2de;vertical-align:top}
.help-content td:first-child{color:var(--cream);font-weight:600}
.help-intro{font-size:14px;color:#c8d2de;border-left:3px solid var(--gold);padding:4px 0 4px 15px;margin:0 0 18px;line-height:1.6}
.help-warn{background:rgba(214,90,90,.08);border:1px solid rgba(214,90,90,.28);border-radius:var(--r);padding:11px 14px;margin:13px 0;font-size:13px;color:#e8c4c4;line-height:1.55}
.help-note{background:rgba(201,150,58,.06);border:1px solid rgba(201,150,58,.24);border-radius:var(--r);padding:11px 14px;margin:13px 0;font-size:13px;color:#d8c8a8;line-height:1.55}
.help-example{display:inline-flex;flex-direction:column;align-items:center;gap:7px;background:rgba(0,0,0,.18);border:1px solid var(--line);border-radius:var(--r);padding:14px 24px;margin:12px 0}
.help-soon{display:flex;gap:13px;align-items:center;padding:26px;background:rgba(0,0,0,.12);border:1px dashed var(--line);border-radius:var(--r);color:var(--cream);font-size:14px;line-height:1.5}
.help-soon-ic{font-size:24px}
@media(max-width:680px){.help-wrap{flex-direction:column;height:auto;min-height:0}.help-nav{flex:1;width:100%;flex-direction:row;flex-wrap:wrap;overflow:visible;padding-right:0}.help-content{width:100%;max-width:100%;padding:16px 14px;overflow:visible}}

/* ── CHANNEL MANAGER (v582, channel.js) ─────────────────────────────────── */
.cm-box{border:1px solid rgba(201,150,58,.25);border-radius:10px;padding:12px 14px;background:rgba(201,150,58,.04);font-family:var(--font-m);font-size:10.5px;color:var(--cream);line-height:1.6}
.cm-h{font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:var(--gold2);margin-bottom:8px}
.cm-t{border-collapse:collapse;width:100%;font-size:10.5px}
.cm-t th{text-align:left;color:var(--slate);font-weight:400;font-size:9px;letter-spacing:.5px;padding:3px 8px 3px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.cm-t td{padding:3px 8px 3px 0;border-bottom:1px solid rgba(255,255,255,.04);white-space:nowrap}
.cm-note{font-family:var(--font-m);font-size:9.5px;color:var(--slate);line-height:1.6;margin-top:8px}
.cm-warn{font-size:9.5px;color:#d98a3d;margin-bottom:6px}
.cm-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}

/* ══════════════════════════════════════════════════════════════════════════
   v632 · WINDOW CONTROLS OVERLAY (§149) — Η ΜΠΑΡΑ ΜΑΣ ΓΙΝΕΤΑΙ Η ΜΠΑΡΑ ΤΟΥ ΠΑΡΑΘΥΡΟΥ
   Εγκατεστημένη εφαρμογή σε Chrome/Edge υπολογιστή, με "display_override" στο manifest.json:
   ο browser δεν ζωγραφίζει πια δική του γραμμή τίτλου («WisDom RM» πάνω από το λογότυπο —
   το «διπλό»). Κρατά ΜΟΝΟ τα κουμπιά του παραθύρου (και το ⋮), που κάθονται ΠΑΝΩ στη δική μας
   μπάρα — δεξιά σε Linux/Windows, αριστερά σε Mac. Ο browser δίνει τη θέση τους με env(titlebar-area-*):
   ό,τι είναι έξω από το [x, x+width] ανήκει στα κουμπιά του. Το padding κρατά το περιεχόμενό μας εκτός.
   ΕΞΩ ΑΠΟ ΑΥΤΗ ΤΗ ΛΕΙΤΟΥΡΓΙΑ (καρτέλα, κινητό, Firefox/Safari, ή αν ο χρήστης επαναφέρει τη γραμμή
   του browser με το βελάκι) το μπλοκ δεν ισχύει καθόλου — η μπάρα είναι ακριβώς όπως πριν.
   ΣΤΟ ΤΕΛΟΣ ΤΟΥ ΑΡΧΕΙΟΥ ΣΚΟΠΙΜΑ: πρέπει να νικά το .topbar{padding:0 12px} του ≤500px.
   ΣΥΡΣΙΜΟ: η μπάρα «πιάνεται» για να μετακινηθεί το παράθυρο (app-region:drag)· ό,τι πατιέται ή έχει
   tooltip εξαιρείται (no-drag) — σε περιοχή συρσίματος δεν φτάνουν ούτε κλικ ούτε hover.
   ══════════════════════════════════════════════════════════════════════════ */
/* ΤΑ ΒΗΜΑΤΑ ΤΗΣ ΜΠΑΡΑΣ ΜΕΤΡΟΥΝ ΤΟΝ ΧΩΡΟ ΤΗΣ ΜΠΑΡΑΣ, ΟΧΙ ΤΟ ΠΑΡΑΘΥΡΟ (v632). Τα @media των 850/760/640/620px
   (v629) ξέρουν μόνο το πλάτος του παραθύρου· με τα κουμπιά του Chrome πάνω στη μπάρα ο χώρος είναι 140–200px
   λιγότερος και το ρολόι έπεφτε κάτω από αυτά. Container queries = πλάτος περιεχομένου της ίδιας της μπάρας
   (χωρίς το padding, άρα και χωρίς τα κουμπιά). Όρια ΜΕΤΡΗΜΕΝΑ (Chromium, Manrope/JetBrains Mono, «Nafpaktos City
   Hotel» + STRATEGIST + «Τρι 20/10 21:20:52») με περιθώριο ~15px: όλα 696 · Support εικονίδιο 644 · χωρίς ετικέτα
   άδειας 576 · χωρίς ξενοδοχείο 424 · σύντομο ρολόι 378 (το ρολόι: utils.js · updateClock, ≤439).
   ΚΑΙ ΧΩΡΙΣ WCO: έκλεισε κενό της v629 — 641–677px ξεχείλιζε με STRATEGIST (η ετικέτα έμενε ως 640).
   Τα @media μένουν: browser χωρίς container queries (Chrome <105) παίρνει τη συμπεριφορά της v629. */
.topbar{container-type:inline-size;container-name:topbar}
@container topbar (max-width:814px){ .tb-page,.tb-div{display:none} }
@container topbar (max-width:724px){ .tb-sup-t{display:none} .tb-support{padding:5px 7px!important;flex:0 0 auto} .tb-hotel{max-width:140px} }
@container topbar (max-width:659px){ .lic-txt{display:none} #lic-badge{flex:0 0 auto} }
@container topbar (max-width:589px){ .tb-hotel{display:none} }

@media (display-mode: window-controls-overlay){
  :root{
    --wco-l:env(titlebar-area-x, 0px);
    --wco-r:calc(100vw - env(titlebar-area-x, 0px) - env(titlebar-area-width, 100vw));
  }
  .topbar{-webkit-app-region:drag;app-region:drag;
    padding-left:calc(18px + var(--wco-l));padding-right:calc(18px + var(--wco-r))}
  .topbar a,.topbar button,.topbar input,.topbar select,.topbar [onclick],.topbar [title],#lic-badge{
    -webkit-app-region:no-drag;app-region:no-drag}
  /* v635 (§149.6, απόφαση Άλκη): ΤΟ ΡΟΛΟΪ ΔΕΝ ΚΑΛΥΠΤΕΤΑΙ ΠΟΤΕ ΑΠΟ ΤΑ ΚΟΥΜΠΙΑ ΤΟΥ CHROME. Η εφαρμογή δεν μπορεί να
     επαναφέρει μόνη της τη γραμμή του Chrome (το WCO το αλλάζει μόνο ο χρήστης με το βελάκι). Όταν ο χώρος δεν φτάνει
     για λογότυπο + όνομα + σήμα + Support + σύντομο ρολόι (378px, §149.2), φεύγει το ΟΝΟΜΑ — μένει το σήμα (λογότυπο).
     ΜΟΝΟ εδώ, μέσα στο WCO: κινητό και καρτέλα browser δεν αλλάζουν (εκεί ισχύει η v410 — όνομα και ρολόι μένουν). */
  @container topbar (max-width:392px){ .tb-brand{display:none} }
}