/* ──────────────────────────────────────────────────────────────
   The scale.

   Chosen from /static/design-lab.html on 2026-09-08:
   Σκάλα · Ήσυχα caps · Ανάγλυφο · Γεμάτο · Άνετη.

   The app read flat for three measurable reasons, and this sheet answers all
   three at once:

   1. There was no type ladder. Eleven sizes were packed between 9px and 14px
      and then jumped to 17-46px, so nothing in the reading zone was
      meaningfully larger than its neighbour. Worse, pollock-app.css overrode
      .blk-t inside .app-main to mono 10px uppercase, which set a section title
      at the same size and in the same face as a field name. There are four
      steps now with real intervals between them: 29 / 21 / 14 / 11.

   2. Every label was mono caps at 9.5px with .13em tracking, seventy times
      over, doing section titles, field names, column heads, counts, chips and
      statuses all at once. They are one quieter treatment now: the interface
      face, 11px, 600, light tracking.

   3. Every container was the same 1px box on the same ground, so nothing
      receded and nothing advanced. Panels lift off the page now.

   Loaded last, after the page's own stylesheet, so it wins on equal
   specificity without any of the three sheets beneath it having to be
   rewritten. That also makes it one file to read, tune or delete.

   Scoped to .app-main throughout. The public company page is the design this
   was all built from and it already carries the 19-23px heading; it is live
   and it is the SEO surface, so it is not touched here. The app moving to a
   real heading brings the two back together rather than pulling them apart.
   ────────────────────────────────────────────────────────────── */

.app-main {
    /* Four steps, each a clear jump from the last. */
    --t1: clamp(23px, 2.7vw, 29px);   /* the tab's own title      */
    --t2: clamp(18px, 2vw, 21px);     /* a section title          */
    --t3: 14px;                       /* body                     */
    --t4: 12.5px;                     /* secondary                */
    --t5: 11px;                       /* labels                   */

    /* Ήσυχα caps: the interface face rather than the typewriter, a size that
       can actually be read, and weight doing the work that tracking was. */
    --lab-font: var(--ui);
    --lab-size: var(--t5);
    --lab-track: .085em;
    --lab-weight: 600;
    --lab-color: var(--ink-4);

    /* Ανάγλυφο. Two shadows: a hairline contact shadow so the edge is not
       floating, and a wide soft one so the panel sits above the page. Kept
       well under the point where it reads as a card in a phone app. */
    --lift: 0 1px 2px rgba(63, 55, 44, .05), 0 6px 18px -10px rgba(63, 55, 44, .22);
    --lift-r: 3px;

    /* Άνετη. */
    --pad-row: 15px 17px;
    --gap-blk: clamp(34px, 4vw, 52px);
    --gap-panel: clamp(22px, 2.4vw, 30px);
}

/* ── 1. The ladder ───────────────────────────────────────────── */

/* A section title is a title again. This one override is the largest single
   change in the sheet: it is what the app was throwing away. */
.app-main .blk-t {
    font-family: var(--ui);
    font-size: var(--t2);
    font-weight: 700;
    letter-spacing: -.014em;
    text-transform: none;
    color: var(--ink);
    line-height: 1.15;
}
.app-main .blk-hd {
    align-items: baseline;
    padding-bottom: 10px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--line);
}
/* The tab's title stays above the sections inside it. */
.tabhd .pghd-t { font-size: var(--t1); letter-spacing: -.016em; }

/* An overview card is a panel inside the Επισκόπηση section, not a section of
   its own, so it takes the label treatment rather than the heading. Same for
   every other panel head on the page. */
.app-main .ovcols .blk-t,
.app-main .data-card-title,
.app-main .network-entities-header h3,
.app-main .financials-charts-title {
    font-family: var(--lab-font);
    font-size: var(--lab-size);
    font-weight: var(--lab-weight);
    letter-spacing: var(--lab-track);
    text-transform: uppercase;
    color: var(--ink-3);
}
/* Ανάγλυφο carries the panel here too, so the overview card's head gives up
   its tinted ground and its gold leading edge and keeps only the rule. Both
   were the old way of saying «this is a panel»; the shadow says it now, and
   two answers to one question is what made the page busy.
   To put the tint back, this block is the only thing to delete. */
.app-main .ovcols .blk-hd {
    margin: 0;
    padding: 12px 17px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--line-2);
}

/* Body copy comes up to where it can be read without effort. */
.app-main .lede { font-size: var(--t3); line-height: 1.55; margin-bottom: 14px; }
.app-main .fine { font-size: var(--t4); line-height: 1.5; }
.app-main .r-name { font-size: var(--t3); }
.app-main .r-mt,
.app-main .kad-l,
.app-main .dv-nm,
.app-main .hr-t,
.app-main .ser-k { font-size: var(--t4); }
.app-main .kv-v { font-size: var(--t4); }
.app-main .kv-v.mono,
.app-main .ser-v { font-size: var(--t4); }

/* ── 2. Ήσυχα caps ───────────────────────────────────────────── */

.app-main .sub,
.app-main .blk-c,
.app-main .kv-k,
.app-main .data-card-count,
.app-main .fig-k,
.app-main .kad-main-k,
.app-main .kad-p,
.app-main .ser-g .ser-k,
.app-main .financial-chart-title,
.app-main .rfil-k,
.app-main .np-via,
.app-main .np-flag,
.app-main .pr-n i,
.app-main .np-n i,
.app-main .data-table th,
.app-main .panel-k,
.app-main .chip-k,
.app-main .search-section-title,
.app-main .find-filters,
.app-main .bt-key {
    font-family: var(--lab-font);
    font-size: var(--lab-size);
    font-weight: var(--lab-weight);
    letter-spacing: var(--lab-track);
    color: var(--lab-color);
}
/* .sub keeps its gold dash; it is the one label that also marks a division. */
.app-main .sub { color: var(--ink-3); margin-bottom: 14px; }
.app-main .blk-c { color: var(--ink-3); }
.app-main .kv-k { color: var(--ink-4); }

/* A ΚΑΔ division heading was a dark band on the public page, which is right
   where it appears twice. Inside a section that already has an edge it is a
   rule and a change of ground. */
.app-main .kad-grp {
    font-family: var(--lab-font);
    font-size: var(--lab-size);
    font-weight: var(--lab-weight);
    letter-spacing: var(--lab-track);
}

/* Figures and counts stay in the typewriter: they are numbers being compared
   down a column, and tabular mono is what lines them up. */
.app-main .fig-v,
.app-main .ser-v,
.app-main .kv-v.mono,
.app-main .dv-ct,
.app-main .pr-n,
.app-main .np-n { font-family: var(--mono); }

/* ── 3. Ανάγλυφο ─────────────────────────────────────────────── */

.app-main .rows,
.app-main .kv,
.app-main .figs,
.app-main .regs,
.app-main .data-card,
.app-main .ksec,
.app-main .sertab-wrap,
.app-main .kad-main,
.app-main .financials-chart-box,
.app-main .ovcols .blk,
.app-main .network-graph,
.app-main .graph {
    border-radius: var(--lift-r);
    box-shadow: var(--lift);
}
/* Sections of one list must not each cast their own shadow, or a column of
   eight reads as eight floating cards. Consecutive .ksec panels are one
   stack, so only the outer edges are rounded and the shadow is shared. */
.app-main .ksec { border-radius: 0; box-shadow: none; }
.app-main .ksec:first-of-type { border-top-left-radius: var(--lift-r); border-top-right-radius: var(--lift-r); }
.app-main .ksec:last-of-type { border-bottom-left-radius: var(--lift-r); border-bottom-right-radius: var(--lift-r); }
#act-groups, #hist-groups { box-shadow: var(--lift); border-radius: var(--lift-r); }

/* Ανάγλυφο carries the panel, so its head does not also need a tinted ground.
   The gold rule and the tint were the old way of saying «this is a panel» and
   two answers to one question is what made the page busy. */
.app-main .data-card-header {
    background: transparent;
    border-left: 0;
    padding: 12px 17px;
}
.app-main .ksec-h { padding: 13px 17px; }

/* ── 4. Γεμάτο ───────────────────────────────────────────────── */

/* The button at the foot of a long list is the page's main action, so it looks
   like one. */
.app-main .kad-more {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--paper);
    font-size: var(--t4);
    padding: 12px;
    border-radius: var(--lift-r);
    margin-top: 16px;
    transition: background .14s, border-color .14s;
}
.app-main .kad-more:hover { background: var(--gold); border-color: var(--gold); }

/* ── 5. Άνετη ────────────────────────────────────────────────── */

.app-main .row,
.app-main .hr,
.app-main .kad { padding: var(--pad-row); }
.app-main .kv-r { padding: 12px 17px; }
.app-main .ser-k,
.app-main .ser-v { padding-top: 9px; padding-bottom: 9px; }
.app-main .fig { padding: 17px 18px 18px; }
.app-main .blk + .blk { margin-top: var(--gap-blk); }
.app-main .ovcols { gap: var(--gap-panel) clamp(30px, 3.4vw, 46px); }
.app-main .ovcols .blk + .blk { margin-top: var(--gap-panel); }
.app-main .data-card { margin-bottom: var(--gap-panel); }

/* Nothing above changes the masthead, the nav or the tab bar. They are the
   frame, they were not the problem, and moving them would move every page. */

/* ── The person page ────────────────────────────────────────────────────
   Name, ΑΦΜ, and where this person sits. One entry per company, carrying the
   capacities held there, because the register files a row per capacity per
   filing and a reader wants the company. */

.app-main .row.ps { align-items: flex-start; }
.ps-caps { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
/* A capacity and the years it covers, together. Which post someone holds is
   the fact the row exists for, so it is set rather than run into the meta
   line with everything else. */
.ps-cap {
    display: inline-flex;
    align-items: baseline;
    gap: 7px;
    padding: 3px 9px;
    background: var(--paper-2);
    border: 1px solid var(--line-2);
    border-radius: 2px;
    font-size: 12px;
    color: var(--ink-3);
}
.ps-cap i {
    font-style: normal;
    font-family: var(--mono);
    font-size: 10.5px;
    color: var(--ink-4);
}
/* A post still held reads as ink; one that has ended recedes. */
.ps-cap.now {
    background: var(--gold-wash);
    border-color: var(--gold-lift);
    color: var(--ink);
    font-weight: 600;
}
.ps-cap.now i { color: var(--ink-3); }

/* An ΑΦΜ ΓΕΜΗ never recorded. Set apart from a real one so it cannot be
   misread as a value being withheld. */
.idb-v-none {
    font-family: var(--ui);
    font-style: italic;
    font-weight: 400;
    letter-spacing: 0;
    opacity: .65;
}

/* ── The person masthead ────────────────────────────────────────────────
   Two facts, so it is composed for two rather than being the company's band
   with four of its six identifier cells missing and an action row holding
   nothing. A kind above the name, the name, then one baseline row carrying the
   ΑΦΜ and how fresh the record is. */
.pband { padding-bottom: clamp(20px, 2.4vw, 28px); }
.pb-kind {
    font-family: var(--ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--band-mid);
    margin-bottom: clamp(10px, 1.4vw, 15px);
    display: flex;
    align-items: center;
    gap: 9px;
}
/* A short rule instead of a pip. The company band's dot carries a state that
   can change; a person is a person, so the mark is a mark and not a signal. */
.pb-kind::before {
    content: "";
    width: 18px;
    height: 1px;
    background: var(--gold-lift);
    flex: 0 0 auto;
}

/* The name is the page. Nothing else in this band competes with it, so it can
   be set larger than the company's, which shares its masthead with five other
   things. */
.pband .pb-name {
    font-size: clamp(28px, 4.6vw, 50px);
    line-height: 1.03;
    letter-spacing: -.022em;
    margin: 0;
    max-width: 22ch;
}

.pb-foot {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px 28px;
    margin-top: clamp(18px, 2.4vw, 26px);
    padding-top: clamp(14px, 1.8vw, 18px);
    border-top: 1px solid var(--band-line);
}
.pb-afm { display: flex; align-items: baseline; gap: 11px; }
.pb-afm-k {
    font-family: var(--ui);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--band-mid);
}
.pb-afm-v {
    font-family: var(--mono);
    font-size: clamp(15px, 1.7vw, 19px);
    letter-spacing: .01em;
    color: var(--band-txt);
}
/* An ΑΦΜ ΓΕΜΗ never recorded, set apart so it cannot read as one we are
   withholding. */
.pb-afm-v.idb-v-none {
    font-family: var(--ui);
    font-size: 13px;
    font-style: italic;
    color: var(--band-mid);
    opacity: 1;
}
.pband .data-freshness { margin-left: auto; }
@media (max-width: 560px) {
    .pb-foot { flex-direction: column; align-items: flex-start; gap: 10px; }
    .pband .data-freshness { margin-left: 0; }
}

/* ── An ΑΦΜ that cannot be one ──────────────────────────────────────────
   ΓΕΜΗ holds 1.349 company and 4.710 person records whose nine-digit ΑΦΜ
   fails its check digit, plus another 1.078 that are not nine digits and
   34.003 placeholders. The number is still shown, because it is what the
   register holds and hiding it would be worse; what the page owes the reader
   is that it does not check out, before they copy it into a form somewhere
   else. */
.afm-bad {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    margin-left: 10px;
    padding: 2px 8px;
    font-family: var(--ui);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .02em;
    color: var(--clay);
    background: rgba(156, 63, 40, .09);
    border: 1px solid rgba(156, 63, 40, .3);
    border-radius: 2px;
    white-space: nowrap;
    cursor: help;
    vertical-align: middle;
}
.afm-bad::before { content: "!"; font-weight: 700; }
/* On the dark masthead the clay does not carry, so it borrows the band's own
   warning weight instead. */
.band .afm-bad {
    color: #e8a894;
    background: rgba(232, 168, 148, .12);
    border-color: rgba(232, 168, 148, .34);
}
.afm-note {
    margin: 10px 0 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--ink-3);
    max-width: 74ch;
}
.band .afm-note { color: var(--band-mid); }
