/* ATDT terminal page (SPEC §7.1): 640×400 canvas, integer-scaled,
   centered on black, pixelated. */

html, body {
    margin: 0;
    height: 100%;
    background: #000;
    overflow: hidden;
}

body {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#term {
    image-rendering: pixelated;
    image-rendering: crisp-edges;
    transform-origin: center center;
    background: #000;
}

/* Hidden input summons the mobile keyboard (§7.7) without being seen. */
#kbd {
    position: absolute;
    left: -9999px;
    top: 0;
    width: 1px;
    height: 1px;
    opacity: 0;
    border: 0;
    padding: 0;
}

/* Slim on-screen key row, shown only on coarse pointers (§7.7). */
#keyrow {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
    background: #111;
    text-align: center;
}

#keyrow button {
    background: #171b22;
    color: #c4cbd6;
    border: 1px solid #2a323e;
    border-radius: 8px;
    font: 14px/1 ui-monospace, "Cascadia Mono", Consolas, monospace;
    padding: 9px 11px;
    margin: 0 2px;
}

#keyrow button:active {
    background: #232a35;
    border-color: #2dd4bf;
}

@media (pointer: coarse) {
    #keyrow {
        display: block;
    }
}

noscript pre {
    color: #aaaaaa;
    font: 16px/1.2 monospace;
}

/* Sysop broadcast strip (owner round 3): above the canvas, times itself out. */
#banner {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 20;
    background: #3a2a00;
    color: #ffd75f;
    border-bottom: 1px solid #7a5c00;
    font: 16px/1.6 ui-monospace, "Cascadia Mono", Consolas, monospace;
    text-align: center;
    padding: 6px 12px;
    text-shadow: 0 0 6px rgba(255, 215, 95, 0.45);
}

/* The caller's file controls (round C): the one web control a caller
   ever sees, kept quiet so the board stays the whole screen. The VGA
   face matches the screen above it; the accent is the console's. */
@font-face {
    font-family: "Web437";
    font-display: swap;
    src: url("fonts/Web437_IBM_VGA_8x16.woff") format("woff");
}

#ata-xfer-open {
    position: fixed;
    right: 12px;
    bottom: 12px;
    z-index: 8;
    opacity: .55;
    font: 15px/1 "Web437", ui-monospace, Consolas, monospace;
    color: #c4cbd6;
    background: rgba(17, 21, 28, .85);
    border: 1px solid #2a323e;
    border-radius: 999px;
    padding: 7px 14px 6px;
    cursor: pointer;
    transition: opacity .15s ease, border-color .15s ease, color .15s ease;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

#ata-xfer-open:hover,
#ata-xfer-open:focus-visible {
    opacity: 1;
    color: #2dd4bf;
    border-color: rgba(45, 212, 191, .55);
    outline: none;
}

#ata-xfer {
    position: fixed;
    left: 50%;
    bottom: 14px;
    transform: translateX(-50%);
    z-index: 9;
    width: min(760px, calc(100% - 24px));
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 10px;
    padding: 11px 14px;
    font: 16px/1.3 "Web437", ui-monospace, Consolas, monospace;
    color: #d6dce5;
    background: rgba(12, 15, 20, .92);
    border: 1px solid #2a323e;
    border-radius: 14px;
    box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .8), 0 0 0 1px rgba(45, 212, 191, .08);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

#ata-xfer .xf-msg {
    flex: 1 1 220px;
    min-width: 0;
}

#ata-xfer .xf-msg::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 9px;
    border-radius: 50%;
    background: #2dd4bf;
    box-shadow: 0 0 8px rgba(45, 212, 191, .7);
    vertical-align: 1px;
}

#ata-xfer .xf-name,
#ata-xfer .xf-proto {
    font: inherit;
    color: #e9edf3;
    background: #07090d;
    border: 1px solid #2a323e;
    border-radius: 8px;
    padding: 6px 9px 5px;
}

#ata-xfer .xf-name {
    width: 14ch;
    color: #4ade80;
    text-transform: uppercase;
}

#ata-xfer .xf-name:focus,
#ata-xfer .xf-proto:focus {
    outline: none;
    border-color: #2dd4bf;
    box-shadow: 0 0 0 3px rgba(45, 212, 191, .25);
}

#ata-xfer .xf-btn {
    font: inherit;
    color: #e9edf3;
    background: #171b22;
    border: 1px solid #2f3846;
    border-radius: 8px;
    padding: 6px 12px 5px;
    cursor: pointer;
}

#ata-xfer .xf-btn:hover {
    border-color: #4a5566;
}

#ata-xfer .xf-btn.go {
    color: #04201c;
    background: #2dd4bf;
    border-color: #2dd4bf;
}

#ata-xfer .xf-btn.go:hover {
    filter: brightness(1.08);
}

#ata-xfer .xf-btn.quiet {
    color: #8d97a8;
    background: transparent;
}

@media (pointer: coarse) {
    #ata-xfer-open {
        bottom: calc(64px + env(safe-area-inset-bottom));
    }

    #ata-xfer {
        bottom: calc(62px + env(safe-area-inset-bottom));
    }
}

/* The page a visitor meets before the SysOp has installed the board. */
.notready {
    width: min(34em, calc(100% - 32px));
    margin: auto;
    padding: 28px 30px;
    color: #c4cbd6;
    background: #0d1117;
    border: 1px solid #232b37;
    border-radius: 14px;
    font: 16px/1.5 "Web437", ui-monospace, Consolas, monospace;
}

.notready b {
    color: #2dd4bf;
    font-weight: normal;
    text-shadow: 0 0 10px rgba(45, 212, 191, .45);
}

.notready a {
    color: #2dd4bf;
}

.notready p {
    margin: 0 0 12px;
}

.notready p:last-child {
    margin-bottom: 0;
}