/* aliens-site — white molded hardware, black glass, restrained signal green. */
:root {
    --shell:#efeee9;
    --paper:#fafaf7;
    --ink:#191b19;
    --muted:#656862;
    --line:#cecec6;
    --signal:#69f52c;
    --bs-body-bg:var(--shell);
    --bs-body-color:var(--ink);
    --bs-link-color:#20231e;
    --bs-link-hover-color:#42483b;
    --bs-border-color:var(--line);
    font-size:16px
}
* {
    box-sizing:border-box
}
body {
    margin:0;
    background:var(--shell);
    color:var(--ink);
    font-family:Arial,Helvetica,sans-serif;
    line-height:1.5
}
a {
    color:inherit;
    text-underline-offset:4px
}
button,input,select,textarea {
    font:inherit
}
h1,h2,h3 {
    font-weight:750;
    letter-spacing:-.045em;
    line-height:1.1
}
h1 {
    font-size:clamp(2.2rem,4.5vw,4rem)
}
h2 {
    font-size:1.8rem
}
h3 {
    font-size:1.3rem
}
p {
    color:var(--muted)
}
.micro,.eyebrow,.specimen-number,.specimen-meta,.field-list dt,.status {
    font-family:Consolas,'Courier New',monospace;
    font-size:.75rem;
    letter-spacing:.065em
}
.eyebrow {
    margin-bottom:20px
}
.sidebar {
    width:238px;
    position:fixed;
    inset:0 auto 0 0;
    padding:28px 22px 20px;
    background:#f9f9f5;
    border-right:1px solid #c8c9c1;
    box-shadow:3px 0 10px #171a0d05;
    display:flex;
    flex-direction:column;
    z-index:100
}
.brand {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    text-decoration:none;
    font-size:1.9rem;
    font-weight:800;
    letter-spacing:-.06em;
    line-height:1.2
}
.brand img {
    width:112px;
    height:112px;
    object-fit:contain;
    background:#111;
    border-radius:22px;
    margin-bottom:18px
}
.brand-caption {
    display:block;
    font-family:Consolas,monospace;
    font-size:.62rem;
    letter-spacing:.08em;
    line-height:1.6;
    margin-top:15px;
    color:#666
}
.sidebar-content {
    display:flex!important;
    flex-direction:column;
    flex:1;
    min-height:0
}
.sidebar nav {
    margin-top:35px;
    display:grid;
    gap:4px
}
.sidebar nav a {
    padding:10px 12px;
    text-decoration:none;
    border:1px solid transparent;
    border-radius:7px;
    font-size:.9rem;
    display:flex;
    align-items:center;
    gap:14px
}
.sidebar nav a span {
    font-size:1.05rem;
    width:20px;
    text-align:center
}
.sidebar nav a:hover {
    background:#eaece4;
    border-color:#d3d7c9
}
.sidebar nav a[aria-current=page] {
    background:#e5e9df;
    border-color:#c7cdbd;
    box-shadow:inset 3px 0 var(--signal)
}
.account-nav {
    border-top:1px solid var(--line);
    margin-top:24px;
    padding:16px 10px
}
.navbar-nav {
    gap:10px;
    font-size:.85rem
}
.nav-link {
    color:var(--ink)!important;
    padding:0!important;
    text-align:left
}
.sidebar-foot {
    margin-top:auto;
    display:flex;
    align-items:center;
    gap:12px;
    padding:22px 6px 0
}
.sidebar-foot .micro {
    font-size:.6rem;
    line-height:1.8
}
.sidebar-foot small {
    color:#767972
}
.physical-led {
    width:32px;
    height:32px;
    border:7px solid #dddeda;
    border-radius:50%;
    background:#969b91;
    box-shadow:0 0 0 1px #b7bab1,inset 0 2px 4px #0005,0 3px 4px #0002;
    flex-shrink:0
}
.physical-led.authenticated {
    background:var(--signal)
}
.nav-toggle {
    display:none
}
.workspace {
    margin-left:238px;
    padding:0 36px;
    max-width:1800px
}
.topbar {
    height:74px;
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px
}
.topbar .micro {
    font-size:.65rem;
    color:#60635c
}
main {
    padding:28px 0 45px;
    min-height:calc(100vh - 150px)
}
.console-hero {
    position:relative;
    overflow:hidden;
    min-height:360px;
    background:#121512;
    color:#f8f9f2;
    border:9px solid #d9dbd2;
    outline:1px solid #babdb3;
    border-radius:24px;
    box-shadow:inset 0 0 0 2px #080a08,0 5px 9px #00000015;
    padding:35px 36px;
    margin-bottom:28px
}
.screen-copy {
    position:relative;
    z-index:2;
    width:65%
}
.screen-copy>.micro {
    color:#a2a99c;
    font-size:.65rem
}
.screen-id {
    margin-left:20px;
    color:#747d6c
}
.screen-copy h1 {
    font-size:clamp(2rem,3.5vw,3.8rem);
    letter-spacing:-.05em;
    line-height:.98;
    margin:30px 0 24px
}
.screen-copy h1>span {
    font-size:.65em;
    letter-spacing:-.015em;
    display:inline-block
}
.screen-caption {
    font-family:Consolas,monospace;
    color:#d5dbce;
    font-size:.65rem;
    letter-spacing:.12em
}
.screen-note {
    font-size:.8rem;
    color:#a9b1a2;
    max-width:300px
}
.hero-creature {
    position:absolute;
    right:-26px;
    top:-24px;
    width:46%;
    height:118%;
    object-fit:contain;
    opacity:.9
}
.screen-screw {
    width:8px;
    height:8px;
    border-radius:50%;
    border:1px solid #62685c;
    position:absolute;
    bottom:14px;
    background:linear-gradient(45deg,#131613 42%,#747d6c 44%,#747d6c 53%,#131613 55%)
}
.screw-left {
    left:14px
}
.screw-right {
    right:14px
}
.led {
    display:inline-block;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--signal);
    margin-left:9px;
    vertical-align:middle
}
.led.inactive {
    background:#8b9185
}
.system-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin-bottom:36px
}
.module {
    background:linear-gradient(#fafaf7,#f2f2eb);
    border:1px solid #c9ccc2;
    box-shadow:inset 0 1px #fff,0 2px 3px #00000008;
    border-radius:12px;
    padding:20px
}
.module>.micro {
    display:flex;
    justify-content:space-between;
    color:#4b5146;
    font-size:.65rem
}
.module strong {
    display:block;
    font-size:2.8rem;
    letter-spacing:-.07em;
    margin:13px 0 5px;
    line-height:1.2
}
.module strong.word-value {
    font-size:1.25rem;
    letter-spacing:-.04em;
    min-height:54px;
    display:flex;
    align-items:center
}
.module p:not(.micro) {
    font-size:.8rem;
    margin:0 0 12px
}
.module>span {
    font-size:.55rem;
    color:#757c6e;
    letter-spacing:0
}
.section-heading {
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px;
    margin:0 0 20px
}
.section-heading p {
    margin:0 0 8px
}
.section-heading h2 {
    margin:0
}
.section-heading>a {
    font-family:Consolas,monospace;
    font-size:.75rem;
    white-space:nowrap
}
.specimen-grid {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:12px
}
.specimen-card {
    display:block;
    min-width:0;
    border:1px solid #c5c8bc;
    background:#fafaf7;
    border-radius:13px;
    text-decoration:none;
    padding:13px;
    box-shadow:0 3px 4px #00000008;
    transition:transform .18s,border-color .18s
}
.specimen-number {
    display:flex;
    justify-content:space-between;
    font-size:.55rem;
    color:#5e6657
}
.specimen-art {
    aspect-ratio:1/1;
    margin:17px 0 15px;
    transition:transform .2s;
    overflow:hidden;
    border-radius:7px
}
.logo-art {
    background:#101310
}
.logo-art img {
    width:100%;
    height:100%;
    object-fit:contain
}
.ink-art {
    background-image:url('/Images/specimens.png');
    background-repeat:no-repeat;
    background-size:400% 100%;
    mix-blend-mode:multiply
}
.oracle {
    background-position:0% 50%
}
.skully {
    background-position:33.333% 50%
}
.drip {
    background-position:66.666% 50%
}
.the-hand {
    background-position:100% 50%
}
.specimen-caption h3 {
    font-size:1.08rem;
    letter-spacing:-.04em;
    margin:0 0 5px
}
.specimen-caption p {
    font-size:.7rem;
    margin:0
}
.specimen-meta {
    border-top:1px solid #dedfd6;
    margin-top:14px;
    padding-top:10px;
    font-size:.55rem;
    letter-spacing:0;
    color:#697160;
    display:grid;
    gap:8px
}
.specimen-meta .led {
    margin:0 6px 0 0;
    width:5px;
    height:5px
}
.specimen-card:hover,.specimen-card:focus-visible {
    transform:translateY(-3px);
    border-color:#626e55
}
.specimen-card:hover .specimen-art {
    transform:translateY(-3px)
}
.specimen-card:hover .specimen-meta,.specimen-card:focus-visible .specimen-meta {
    color:#20261b
}
.crew-section {
    margin-bottom:42px
}
.applications {
    margin:38px 0
}
.project-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px
}
.project-card {
    padding:25px;
    border:1px solid #c9ccc2;
    border-radius:14px;
    background:#f9f9f5;
    box-shadow:inset 0 1px white,0 2px 3px #00000008;
    margin-bottom:0
}
.portal-card {
    display:block;
    text-decoration:none
}
.portal-card:hover {
    border-color:#69715e;
    color:#111
}
.project-card h2,.project-card h3 {
    margin:18px 0 13px
}
.project-card p {
    font-size:.9rem
}
.card-action {
    font-family:Consolas,monospace;
    font-size:.7rem
}
.portal-heading {
    padding:10px 0 28px
}
.portal-heading .subtitle {
    font-size:1rem;
    max-width:720px;
    margin:18px 0 0
}
.portal-heading h1 {
    margin:0
}
.status {
    display:inline-block;
    padding:5px 8px;
    border:1px solid #b7bfad;
    border-radius:4px;
    color:#464e3e;
    font-size:.7rem
}
.terminal {
    background:#141713;
    color:#e3e8dd;
    border:7px solid #d9dbd2;
    border-radius:16px;
    margin-top:28px;
    padding:25px 28px;
    box-shadow:inset 0 1px 5px #000a;
    overflow:auto
}
.terminal-bar {
    display:flex;
    justify-content:space-between;
    border-bottom:1px solid #404739;
    padding-bottom:14px;
    font-family:Consolas,monospace;
    font-size:.6rem;
    color:#959f8b;
    gap:16px
}
.terminal-bar h2 {
    font:inherit;
    margin:0;
    letter-spacing:.1em
}
.terminal-prompt {
    font-family:Consolas,monospace;
    font-size:.85rem;
    color:#e3e8dd;
    margin:24px 0 18px
}
.cursor {
    display:inline-block;
    width:7px;
    height:13px;
    background:var(--signal);
    vertical-align:middle
}
.terminal-lines {
    font-family:Consolas,monospace;
    font-size:.8rem
}
.terminal-lines div {
    display:grid;
    grid-template-columns:minmax(170px,260px) 1fr;
    gap:15px
}
.terminal-lines dt {
    font-weight:400
}
.terminal-lines dd {
    color:#969f8d;
    margin:0 0 8px
}
.terminal-note {
    font: .7rem Consolas,monospace;
    color:#8b9680
}
.portal-footer {
    border-top:1px solid var(--line);
    padding:20px 0;
    display:flex;
    justify-content:space-between;
    font: .6rem Consolas,monospace;
    color:#676e5e;
    gap:20px
}
.specimen-detail {
    display:grid;
    grid-template-columns:260px 1fr;
    gap:24px;
    align-items:start
}
.specimen-detail .specimen-card {
    pointer-events:none
}
.field-list div {
    display:grid;
    grid-template-columns:150px 1fr;
    padding:12px 0;
    border-bottom:1px solid var(--line);
    gap:16px
}
.field-list dt {
    text-transform:uppercase;
    color:#626b56;
    font-weight:400
}
.field-list dd {
    margin:0
}
.table {
    --bs-table-bg:transparent;
    --bs-table-color:var(--ink);
    --bs-table-border-color:#d3d6ca;
    font-size:.85rem
}
.table th {
    font: .65rem Consolas,monospace;
    text-transform:uppercase;
    padding:16px 10px
}
.table td {
    padding:18px 10px;
    min-width:100px
}
caption {
    font-size:.75rem;
    color:#626b56
}
.hero-actions {
    display:flex;
    gap:20px;
    flex-wrap:wrap
}
.primary-button,.secondary-button,.btn-primary {
    display:inline-block;
    padding:12px 20px;
    border-radius:7px;
    text-decoration:none;
    background:#20251c;
    color:#fff;
    border:1px solid #20251c
}
.primary-button:hover,.btn-primary:hover {
    background:#363e2e;
    color:white;
    border-color:#363e2e
}
.login-panel {
    max-width:480px;
    margin:22px auto 45px
}
.login-panel h1 {
    font-size:2.6rem;
    margin:15px 0 25px
}
.login-panel h2 {
    margin:0 0 10px;
    font-size:1.35rem;
}
.login-intro {
    max-width:760px;
    margin:52px auto 0;
    padding:0 20px;
    text-align:center;
}
.acronym-expansion {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:7px 16px;
    margin-top:0;
    color:var(--muted);
    font-family:Consolas, 'Courier New', monospace;
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
}
.acronym-expansion strong {
    color:var(--ink);
    font-size:1.1em;
}
.form-control {
    background:#fff;
    border-color:#aab39e;
    color:#171c13
}
.form-control:focus {
    box-shadow:0 0 0 3px #b8d8a080;
    border-color:#596e45
}
.nav-pills .nav-link {
    padding:10px!important
}
.nav-pills .nav-link.active {
    background:#e0e7d8
}
.text-danger {
    color:#a4212b!important
}
.portal-note {
    margin-top:24px;
    font-size:.85rem
}
.skip-link {
    position:absolute;
    top:-100px;
    left:12px;
    z-index:1000;
    background:#fff;
    padding:12px
}
.skip-link:focus {
    top:12px
}
:focus-visible {
    outline:3px solid #4b7c2d;
    outline-offset:4px
}
img {
    max-width:100%
}
@media(min-width:1600px) {
    .workspace {
        padding-left:50px;
        padding-right:50px
    }
    .console-hero {
        min-height:400px
    }
}
@media(max-width:1200px) {
    .sidebar {
        width:210px;
        padding:25px 18px
    }
    .workspace {
        margin-left:210px;
        padding:0 24px
    }
    .specimen-grid {
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
    .project-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .system-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .hero-creature {
        opacity:.65
    }
    .screen-copy {
        width:75%
    }
}
@media(max-width:760px) {
    .sidebar {
        position:relative;
        width:100%;
        padding:16px 20px;
        border-right:0;
        border-bottom:1px solid var(--line)
    }
    .brand {
        flex-direction:row;
        align-items:center;
        gap:14px;
        font-size:1.7rem
    }
    .brand img {
        width:60px;
        height:60px;
        border-radius:12px;
        margin:0
    }
    .brand-caption {
        font-size:.5rem;
        margin-top:6px
    }
    .nav-toggle {
        display:flex;
        justify-content:space-between;
        align-items:center;
        position:absolute;
        right:20px;
        top:35px;
        border:1px solid #bcc3b2;
        background:#f5f7f0;
        border-radius:6px;
        padding:7px 9px;
        font-size:0;
        gap:8px
    }
    .nav-toggle span {
        font-size:1.2rem
    }
    .sidebar-content:not(.show) {
        display:none!important
    }
    .sidebar nav {
        margin-top:22px;
        grid-template-columns:1fr 1fr
    }
    .sidebar-foot {
        padding-top:5px
    }
    .workspace {
        margin-left:0;
        padding:0 18px
    }
    .topbar {
        height:55px
    }
    .topbar>span:last-child {
        display:none
    }
    main {
        padding-top:20px
    }
    .console-hero {
        min-height:330px;
        padding:25px 20px;
        border-width:6px;
        border-radius:18px
    }
    .screen-copy {
        width:100%
    }
    .screen-copy h1 {
        font-size:2.6rem;
        margin-top:40px
    }
    .screen-copy h1>span {
        font-size:.58em
    }
    .hero-creature {
        width:60%;
        height:95%;
        right:-55px;
        top:-15px;
        opacity:.2
    }
    .screen-note {
        max-width:230px
    }
    .system-grid {
        gap:10px
    }
    .module {
        padding:15px
    }
    .module strong.word-value {
        font-size:1rem
    }
    .module .micro {
        font-size:.6rem
    }
    .specimen-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .project-grid {
        grid-template-columns:1fr
    }
    .section-heading {
        align-items:start
    }
    .section-heading h2 {
        font-size:1.6rem
    }
    .section-heading>a {
        font-size:.65rem
    }
    .specimen-detail {
        grid-template-columns:1fr
    }
    .specimen-detail>.specimen-card {
        max-width:300px
    }
    .field-list div {
        grid-template-columns:110px 1fr
    }
    .terminal {
        padding:20px 15px;
        border-width:5px
    }
    .terminal-lines {
        font-size:.68rem
    }
    .terminal-lines div {
        grid-template-columns:1fr 1fr;
        gap:5px
    }
    .terminal-note {
        line-height:1.5
    }
    .portal-footer {
        flex-direction:column;
        gap:6px
    }
    .login-panel {
        margin:20px auto
    }
    .portal-heading h1 {
        font-size:2.2rem
    }
}
@media(prefers-reduced-motion:reduce) {
    *,*::before,*::after {
        transition:none!important;
        animation:none!important
    }
}
/* Keep the generated ink specimens at their original proportions. */
.specimen-art {
    aspect-ratio: 11 / 16;
}
/* Faint contour rings stay behind the shell rather than the content. */
.workspace {
    background-image: repeating-radial-gradient(ellipse at 110% 10%,transparent 0 26px,#30372803 27px 28px,transparent 29px 54px);
}
/* Readable technical labels and a scrollable console rail on short screens. */
.sidebar {
    overflow-y: auto;
}
.micro, .eyebrow, .specimen-number, .specimen-meta, .status,
.topbar .micro, .screen-copy > .micro, .screen-caption,
.module > .micro, .module > span, .terminal-bar, .terminal-note,
.portal-footer, .brand-caption, .sidebar-foot .micro, .card-action,
.section-heading > a, .table th {
    font-size: .75rem;
}
.specimen-caption p, .module p:not(.micro) {
    font-size: .875rem;
}
.specimen-card:hover .specimen-number > span:last-child,
.specimen-card:focus-visible .specimen-number > span:last-child {
    color: #294d17;
    background: #adf18d;
    border-radius: 3px;
}
@media (max-width: 480px) {
    .system-grid, .specimen-grid {
        grid-template-columns: 1fr;
    }
    .specimen-art {
        max-width: 180px;
        margin-left: auto;
        margin-right: auto;
    }
    .module strong.word-value {
        min-height: 0;
    }
}

.account-notice {
    padding: 14px 18px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--paper);
    color: var(--ink);
}

/* Connected, collapsible navigation. */
:root { --sidebar-width:238px; }
.sidebar-toggle[hidden] { display:none !important; }
.sidebar,
.workspace,
.sidebar-toggle {
    transition-duration:225ms;
    transition-timing-function:ease-in-out;
}
.sidebar {
    transition-property:transform;
    will-change:transform;
}
.sidebar.is-collapsed {
    transform:translateX(-100%);
    pointer-events:none;
}
.workspace { transition-property:margin-left; }
.sidebar-collapsed .workspace { margin-left:0; }
.sidebar-toggle {
    position:fixed;
    z-index:111;
    top:14px;
    left:12px;
    display:inline-flex;
    align-items:center;
    gap:9px;
    width:46px;
    min-height:44px;
    padding:8px 10px;
    overflow:visible;
    border:1px solid var(--line);
    border-radius:8px;
    background:var(--paper);
    color:var(--ink);
    font-family:Consolas, 'Courier New', monospace;
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.08em;
    transition-property:left, top, width, min-height, padding, background, border-color, border-radius;
}
.sidebar-toggle:hover { background:#e6e9e0; }
.sidebar-toggle.is-expanded {
    top:5px;
    left:var(--sidebar-width);
    width:152px;
    min-height:66px;
    padding:0 18px;
    border:0;
    border-radius:0;
    background:transparent;
}
.molded-menu-edge {
    position:absolute;
    z-index:0;
    inset:0;
    width:152px;
    height:66px;
    opacity:0;
    pointer-events:none;
    transition:opacity 160ms ease-in-out;
}
.molded-menu-fill { fill:var(--paper); }
.molded-menu-outline {
    fill:none;
    stroke:#bfc7b3;
    stroke-width:1;
    vector-effect:non-scaling-stroke;
}
.sidebar-toggle.is-expanded .molded-menu-edge { opacity:1; }
.curved-menu-icon {
    position:relative;
    z-index:1;
    display:grid;
    width:24px;
    gap:4px;
    flex:0 0 24px;
}
.curved-menu-icon span {
    display:block;
    width:24px;
    height:2px;
    margin:0;
    border-radius:999px;
    background:#111;
}
.menu-label { position:relative; z-index:1; display:none; min-width:34px; }
.sidebar-toggle.is-expanded .menu-label { display:inline; }
.topbar > .micro:last-child { margin-left:auto; }
@media (max-width:760px) {
    :root { --sidebar-width:min(320px, 100vw); }
    .topbar { position:sticky; top:0; z-index:110; background:var(--shell); gap:12px; }
    .sidebar { position:fixed; top:55px; bottom:0; width:var(--sidebar-width); overflow-y:auto; }
    .sidebar nav { grid-template-columns:1fr; }
    .sidebar-toggle.is-expanded { left:calc(100vw - 146px); }
}