/*
 * Carbisdale - Hauptstylesheet
 *
 * Definiert die Font-Faces für die Terminal-Fonts und
 * das grundlegende Layout für den Fullscreen-Canvas.
 */

/* === Font Definitionen === */

@font-face {
    font-family: 'DinaRemasterII';
    src: url('../fonts/DinaRemasterII.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: block; /* Warten bis Font geladen ist */
}

@font-face {
    font-family: 'DinaRemasterII';
    src: url('../fonts/DinaRemasterII-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: block;
}

@font-face {
    font-family: 'NotoSansMono';
    src: url('../fonts/NotoSansMono-VariableFont_wdth,wght.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: block;
}

@font-face {
    font-family: 'NotoSans';
    src: url('../fonts/NotoSans-VariableFont_wdth,wght.woff2') format('woff2');
    font-weight: 100 900;
    font-display: swap;
}

@font-face {
    font-family: 'NotoSansItalic';
    src: url('../fonts/NotoSans-Italic-VariableFont_wdth,wght.woff2') format('woff2');
    font-weight: 100 900;
    font-display: swap;
}

@font-face {
    font-family: 'EBGaramond';
    src: url('../fonts/EBGaramond-VariableFont_wght.woff2') format('woff2');
    font-weight: 100 900;
    font-display: swap;
}

@font-face {
    font-family: 'EBGaramondItalic';
    src: url('../fonts/EBGaramond-Italic-VariableFont_wght.woff2') format('woff2');
    font-weight: 100 900;
    font-display: swap;
}

/* === Reset & Grundlagen === */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    width: 100%;
    height: 100%;
    overflow: hidden; /* Kein Scrollen auf der Seite selbst */
    background-color: #000000; /* Schwarzer Hintergrund als Fallback */
}

body {
    /* iPhone Notch / iPad Home-Indicator: Inhalt aus der Safe-Area heraushalten.
       Auf Geraeten ohne Notch (iPad Pre-2020, Desktop) liefert env() 0 → kein
       Effekt. viewport-fit=cover im HTML-Meta ist Voraussetzung. */
    padding-top:    env(safe-area-inset-top);
    padding-right:  env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left:   env(safe-area-inset-left);
}

/* === App Container === */

#app {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* === Canvas === */

#screen-canvas {
    display: block;
    /* Canvas oben kleben — bei eingeblendeter iOS-System-Tastatur setzt JS die
       Hoehe auf visualViewport.height. Mit dem default Flex-Center wuerde das
       Canvas dann nach unten in die Tastatur rutschen. */
    position: absolute;
    top: 0;
    left: 0;
    /* Canvas füllt den gesamten Viewport (JS override bei visualViewport-Resize) */
    width: 100%;
    height: 100%;
    /* Kein Smoothing für pixelgenaue Schrift */
    image-rendering: pixelated;
    image-rendering: crisp-edges;
    /* Alle Default-Touch-Gesten abschalten: kein Pinch-Zoom, kein
       Double-Tap-Zoom, kein Scroll-Bounce. Wir handhaben Touch selbst. */
    touch-action: none;
    /* iOS Safari behandelt <canvas> wie ein Bild — Long-Press öffnet sonst
       das Image-Callout (Speichern/Teilen). Wir haben unser eigenes
       Long-Press-Handling (Phase 3 Touch-Spec) und wollen das System-Callout
       komplett unterdrücken. Plus user-select: none, weil iOS in manchen
       Overlays trotzdem den Inhalt als "Bild" selektieren würde. */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

/* Cursor-Layer: transparentes Canvas über dem Hauptcanvas */
#cursor-canvas {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    image-rendering: pixelated;
    image-rendering: crisp-edges;
}