/* The site's palette and typeface, on their own.

   The guest panel, the account pages, the staff panel and the ticket check are
   not built on the website's stylesheet: each carries its own layout. They
   should still read as the same place, so this file is the palette alone, with
   no layout attached. It can be loaded anywhere and cannot drag the whole site
   in behind it.

   The values are the template's own design tokens, under the names these pages
   already ask for. If the template's colours change, they change here, in one
   block, and every panel follows.

       --primary-color   #FFFFFF   headings, and anything sitting on the accent
       --secondary-color #1F2120   a raised surface
       --text-color      #AEB0B4   body copy
       --accent-color    #A6A182   the brand accent
       --dark-divider    #0E110D   the ground the whole site sits on
*/

:root {
    --night:      #0e110d;
    --panel:      #1f2120;
    --panel-2:    #262827;
    --panel-3:    #2f322f;

    --gold:       #a6a182;
    --gold-hi:    #cbc7ae;
    --gold-deep:  #7d795f;
    --rose:       #c6c2a9;
    --brass:      linear-gradient(120deg, #7d795f 0%, #cbc7ae 46%, #a6a182 100%);

    --cream:      #ffffff;
    --body:       #aeb0b4;
    --muted:      #8b8d90;
    --faint:      #63666a;

    --line:       rgba(166, 161, 130, .28);
    --line-2:     rgba(255, 255, 255, .10);

    /* One face across the whole product, the template's own. */
    --serif:      "Hanken Grotesk", "Segoe UI", system-ui, sans-serif;
    --sc:         "Hanken Grotesk", "Segoe UI", system-ui, sans-serif;
    --sans:       "Hanken Grotesk", "Segoe UI", system-ui, sans-serif;

    --ease:       cubic-bezier(.22, .61, .36, 1);
    --ease-out:   cubic-bezier(.16, 1, .3, 1);
    --lift:       0 26px 60px -34px rgba(0, 0, 0, .95);
    --glow:       0 18px 46px -24px rgba(166, 161, 130, .45);

    /* The names the guest-facing pages still ask for.
    
       The run a guest walks after scanning the code on a table names its own
       colours, and nothing declared them. A var() with no fallback and no
       declaration is not a default: the property is thrown away and the element
       keeps whatever it inherited, silently, so a card could have no surface
       under it on a page that answered 200.
    
       They carry the same roles as the palette above: the card is a raised
       panel, the ink is what is written on it, the brand is the gold. */
    --brand:      #a6a182;
    --brand-2:    #cbc7ae;
    --card:       #1f2120;
    --ink:        #ffffff;
    --gt-bg:      #0e110d;
    --gt-ink:     #ffffff;
    --gt-muted:   #8b8d90;
    --gt-line:    rgba(166, 161, 130, .28);
}