/* 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-sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
    --font-mono:ui-monospace,"SF Mono","Cascadia Mono","JetBrains Mono",Consolas,"Liberation Mono",monospace;
    font-size:16px
}
* {
    box-sizing:border-box
}
body {
    margin:0;
    background:var(--shell);
    color:var(--ink);
    font-family:var(--font-sans);
    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:var(--font-mono);
    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:var(--font-mono);
    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:var(--font-mono);
    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:var(--font-mono);
    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:var(--font-mono);
    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:var(--font-mono);
    font-size:.6rem;
    color:#959f8b;
    gap:16px
}
.terminal-bar h2 {
    font:inherit;
    margin:0;
    letter-spacing:.1em
}
.terminal-prompt {
    font-family:var(--font-mono);
    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:var(--font-mono);
    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 var(--font-mono);
    color:#8b9680
}
.portal-footer {
    border-top:1px solid var(--line);
    padding:20px 0;
    display:flex;
    justify-content:space-between;
    font: .6rem var(--font-mono);
    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 var(--font-mono);
    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:var(--font-mono);
    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:4px;
    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:var(--font-mono);
    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:4px;
    left:calc(var(--sidebar-width) - 114px);
    width:104px;
    padding:8px 10px;
    border-color:#bfc7b3;
    background:var(--paper);
}
.curved-menu-icon {
    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 { 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; }
}

/* Public landing page. */
.landing-page .workspace {
    max-width:none;
    margin-left:0;
    padding:0 clamp(20px, 5vw, 72px);
}
.landing-page .topbar {
    height:84px;
}
.landing-brand {
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:var(--ink);
    font-family:var(--font-mono);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.04em;
    text-decoration:none;
}
.landing-brand img {
    width:38px;
    height:38px;
    border-radius:10px;
    background:#111;
    object-fit:contain;
}
.landing-sign-in {
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:10px 14px;
    border:1px solid var(--line);
    border-radius:8px;
    color:var(--ink);
    font-family:var(--font-mono);
    font-size:.76rem;
    font-weight:700;
    letter-spacing:.05em;
    text-decoration:none;
}
.landing-sign-in:hover { background:#e6e9e0; }
.landing-tabs {
    display:flex;
    align-items:center;
    gap:2px;
    margin-left:auto;
    padding:4px;
    border:1px solid var(--line);
    border-radius:9px;
    background:#f8f8f4;
}
.landing-tabs a {
    padding:7px 10px;
    border-radius:5px;
    color:#555a52;
    font-family:var(--font-mono);
    font-size:.7rem;
    font-weight:700;
    letter-spacing:.035em;
    text-decoration:none;
}
.landing-tabs a:hover { color:var(--ink); background:#e6e9e0; }
.landing-tabs a[aria-current="page"] { color:#fff; background:#191b19; }
.landing-hero {
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(240px, .65fr);
    align-items:center;
    gap:clamp(30px, 8vw, 140px);
    min-height:calc(100vh - 190px);
    padding:clamp(48px, 9vw, 120px) 0;
    border-bottom:1px solid var(--line);
}
.landing-hero-copy { max-width:700px; }
.landing-hero h1 {
    margin:0;
    font-size:clamp(4rem, 10vw, 9rem);
    letter-spacing:-.09em;
    line-height:.78;
}
.landing-lede {
    max-width:480px;
    margin:32px 0 0;
    font-size:clamp(1.05rem, 2vw, 1.35rem);
    line-height:1.5;
}
.landing-actions {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:22px;
    margin-top:32px;
}
.landing-actions .btn { padding:12px 20px; }
.landing-text-link {
    color:var(--ink);
    font-family:var(--font-mono);
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.04em;
}
.landing-mark {
    display:grid;
    width:min(100%, 330px);
    aspect-ratio:1;
    justify-self:end;
    place-items:center;
    border:1px solid #bdc1b5;
    border-radius:clamp(32px, 6vw, 64px);
    background:#111;
    box-shadow:inset 0 0 0 12px #1c201b, 12px 12px 0 #dfe2d8;
}
.landing-mark img {
    width:82%;
    height:82%;
    object-fit:contain;
}
.landing-portfolio { padding:clamp(60px, 10vw, 130px) 0; }
.landing-section-heading { max-width:540px; }
.landing-section-heading h2 {
    margin:0;
    font-size:clamp(2.5rem, 5vw, 4.5rem);
}
.landing-section-heading p:last-child { font-size:1.05rem; }
.landing-portfolio-grid {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:16px;
    margin-top:38px;
}
.landing-project-card {
    min-height:230px;
    padding:26px;
    border:1px solid #c9ccc2;
    border-radius:10px;
    background:var(--paper);
}
.landing-project-card h3 { margin:32px 0 12px; }
.landing-project-card p { margin:0; }
@media (max-width:760px) {
    .landing-page .topbar { height:auto; min-height:68px; padding-top:12px; padding-bottom:12px; flex-wrap:wrap; }
    .landing-tabs { order:3; width:100%; margin-left:0; overflow-x:auto; }
    .landing-tabs a { flex:1 0 auto; text-align:center; }
    .landing-hero {
        grid-template-columns:1fr;
        min-height:auto;
        padding:68px 0;
    }
    .landing-mark { justify-self:start; width:min(220px, 70vw); }
    .landing-portfolio-grid { grid-template-columns:1fr; }
}

/* Public blog and its deliberately simple authoring surface. */
.blog-hero {
    max-width:850px;
    padding:clamp(80px, 13vw, 170px) 0 clamp(62px, 9vw, 112px);
    border-bottom:2px solid #111;
}
.blog-hero h1 { margin:0; font-size:clamp(3.7rem, 9vw, 8.6rem); letter-spacing:-.09em; line-height:.82; }
.blog-hero > p:last-child { max-width:520px; margin:32px 0 0; font-size:clamp(1.05rem, 2vw, 1.3rem); line-height:1.55; }
.blog-list { max-width:850px; padding:clamp(56px, 9vw, 120px) 0; }
.blog-post { padding:0 0 58px; margin-bottom:58px; border-bottom:1px solid #bfc3ba; }
.blog-post h2 { margin:15px 0; color:#111; font-size:clamp(2rem, 4vw, 3.75rem); }
.blog-summary { max-width:680px; margin:0 0 26px; color:#333732; font-size:1.1rem; font-weight:700; line-height:1.5; }
.blog-content { max-width:700px; color:#4f534c; line-height:1.72; white-space:pre-wrap; }
.blog-empty { padding:42px 0; }
.blog-empty h2 { max-width:420px; font-size:clamp(2rem, 4vw, 3.4rem); }
.blog-admin-card { max-width:920px; margin-top:28px; }
.blog-editor { display:grid; gap:10px; max-width:760px; }
.blog-editor > label:not(.blog-publish-toggle) { margin-top:10px; font-family:var(--font-mono); font-size:.74rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.blog-editor textarea { resize:vertical; }
.blog-publish-toggle { display:flex; align-items:center; gap:9px; margin:12px 0 8px; color:#343734; }
.blog-editor-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.blog-admin-list { display:grid; gap:0; border-top:1px solid var(--line); }
.blog-admin-list article { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:20px 0; border-bottom:1px solid var(--line); }
.blog-admin-list h3 { margin:9px 0 2px; }
.blog-admin-list p { margin:0; font-size:.86rem; }
.blog-admin-list .status { display:inline-block; padding:3px 7px; border:1px solid var(--line); border-radius:999px; color:#686d65; }
.blog-admin-list .status.is-ok { border-color:#54a52a; color:#306d17; background:#f2fff0; }
@media (max-width:760px) {
    .blog-hero { padding-top:68px; }
    .blog-admin-list article { align-items:flex-start; flex-direction:column; gap:14px; }
}

/* Recruiter-facing portfolio landing page. */
.landing-page main { padding:0; }
.portfolio-hero {
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(240px, .42fr);
    align-items:end;
    gap:48px;
    min-height:calc(100vh - 168px);
    padding:clamp(72px, 12vw, 150px) 0 clamp(64px, 9vw, 120px);
    border-bottom:2px solid #111;
}
.portfolio-hero h1 {
    max-width:850px;
    margin:0;
    color:#111;
    font-size:clamp(4rem, 11vw, 10rem);
    letter-spacing:-.095em;
    line-height:.76;
}
.portfolio-lede {
    max-width:680px;
    margin:36px 0 0;
    color:#242624;
    font-size:clamp(1.08rem, 2vw, 1.42rem);
    line-height:1.55;
}
.portfolio-actions {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:18px;
    margin-top:34px;
}
.portfolio-actions .btn,
.portfolio-contact .btn { padding:12px 18px; }
.portfolio-sign-in {
    padding:11px 14px;
    border:1px solid #111;
    border-radius:7px;
    color:#111;
    font-family:var(--font-mono);
    font-size:.75rem;
    font-weight:700;
    letter-spacing:.04em;
    text-decoration:none;
}
.portfolio-sign-in:hover { background:#111; color:#fff; }
.portfolio-hero-note {
    margin:0;
    padding:22px;
    border:1px solid #111;
    border-radius:12px;
    background:#fff;
}
.portfolio-hero-note p:last-child { margin:12px 0 0; color:#252825; }
.portfolio-profile {
    display:grid;
    grid-template-columns:minmax(0, .85fr) minmax(0, 1.15fr);
    gap:48px;
    padding:clamp(70px, 10vw, 130px) 0;
    border-bottom:1px solid #111;
}
.portfolio-profile h2,
.portfolio-section-heading h2,
.portfolio-contact h2 {
    margin:0;
    color:#111;
    font-size:clamp(2.55rem, 5vw, 5rem);
    letter-spacing:-.065em;
}
.portfolio-profile > p {
    max-width:720px;
    margin:0;
    color:#242624;
    font-size:clamp(1.12rem, 2vw, 1.44rem);
    line-height:1.55;
}
.career-roadmap,
.portfolio-projects,
.portfolio-skills,
.portfolio-contact { padding:clamp(72px, 11vw, 145px) 0; }
.portfolio-section-heading { max-width:740px; }
.portfolio-section-heading > p:last-child { max-width:520px; font-size:1.05rem; }
.career-timeline {
    position:relative;
    margin-top:54px;
}
.timeline-entry {
    position:relative;
    display:grid;
    grid-template-columns:minmax(0, 1fr) 90px minmax(0, 1fr);
    min-height:176px;
    padding:0 0 28px;
}
.timeline-entry::before {
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:calc(50% - 2px);
    width:4px;
}
.era-high-school::before { background:linear-gradient(#174d9d 0 56%, #c69b28 56% 100%); }
.era-college::before { background:linear-gradient(#ba222c 0 76%, #fff 76% 82%, #ba222c 82% 100%); }
.era-career::before { background:linear-gradient(#1f7a43 0 76%, #fff 76% 82%, #1f7a43 82% 100%); }
.timeline-card {
    align-self:start;
    padding:24px;
    border:1px solid #171917;
    border-radius:10px;
    background:#fff;
    box-shadow:6px 6px 0 #e2e4df;
}
.timeline-entry:nth-child(odd) .timeline-card { grid-column:1; text-align:right; }
.timeline-entry:nth-child(even) .timeline-card { grid-column:3; }
.timeline-card h3 { margin:10px 0 10px; color:#111; font-size:1.3rem; }
.timeline-card p:last-child { margin:0; color:#343734; }
.timeline-year {
    margin:0;
    color:#111 !important;
    font-family:var(--font-mono);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.07em;
}
.timeline-marker {
    position:relative;
    z-index:1;
    grid-column:2;
    align-self:start;
    justify-self:center;
    width:22px;
    height:22px;
    margin-top:26px;
    border:4px solid #111;
    border-radius:50%;
    background:#fff;
}
.era-high-school .timeline-marker { box-shadow:inset 0 0 0 4px #174d9d, 0 0 0 3px #c69b28; }
.era-college .timeline-marker { box-shadow:inset 0 0 0 4px #ba222c, 0 0 0 3px #fff; }
.era-career .timeline-marker { box-shadow:inset 0 0 0 4px #1f7a43, 0 0 0 3px #fff; }
.portfolio-projects { border-top:2px solid #111; background:#111; color:#fff; }
.portfolio-projects .eyebrow,
.portfolio-projects h2 { color:#fff; }
.portfolio-project-grid {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px;
    margin-top:44px;
}
.portfolio-project {
    min-height:280px;
    padding:28px;
    border:1px solid #fff;
    border-radius:10px;
    background:#171917;
}
.portfolio-project.featured-project { grid-row:span 2; }
.portfolio-project h3 { margin:28px 0 14px; color:#fff; font-size:clamp(1.5rem, 3vw, 2.25rem); }
.portfolio-project p,
.portfolio-project li { color:#e3e5de; }
.portfolio-project ul { padding-left:20px; }
.portfolio-project li + li { margin-top:8px; }
.project-note {
    margin-top:24px !important;
    padding-top:16px;
    border-top:1px solid #5e645c;
    font-family:var(--font-mono);
    font-size:.76rem;
}
.portfolio-skills { border-bottom:1px solid #111; }
.skills-grid {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:0;
    margin-top:42px;
    border-top:1px solid #111;
    border-left:1px solid #111;
}
.skills-grid article {
    min-height:158px;
    padding:24px;
    border-right:1px solid #111;
    border-bottom:1px solid #111;
}
.skills-grid h3 { margin:0 0 16px; color:#111; font-size:1.1rem; }
.skills-grid p { margin:0; }
.skills-grid .skills-coursework { grid-column:1 / -1; min-height:0; }
.portfolio-contact {
    max-width:760px;
    padding-bottom:clamp(88px, 13vw, 160px);
}
.portfolio-contact > p:not(.eyebrow) { margin:18px 0 28px; font-size:1.08rem; }
@media (prefers-reduced-motion:no-preference) {
    .timeline-card { transition:transform 180ms ease, box-shadow 180ms ease; }
    .timeline-card:hover { transform:translate(-3px, -3px); box-shadow:9px 9px 0 #d8dbd3; }
}
@media (max-width:760px) {
    .portfolio-hero,
    .portfolio-profile { grid-template-columns:1fr; gap:30px; }
    .portfolio-hero { min-height:auto; padding-top:72px; }
    .timeline-entry {
        grid-template-columns:38px minmax(0, 1fr);
        min-height:0;
        padding-bottom:28px;
    }
    .timeline-entry::before { left:17px; }
    .timeline-entry .timeline-card,
    .timeline-entry:nth-child(odd) .timeline-card,
    .timeline-entry:nth-child(even) .timeline-card { grid-column:2; text-align:left; }
    .timeline-marker { grid-column:1; width:20px; height:20px; margin-top:22px; }
    .portfolio-project-grid,
    .skills-grid { grid-template-columns:1fr; }
    .portfolio-project.featured-project { grid-row:auto; }
    .skills-grid .skills-coursework { grid-column:auto; }
}

/* Portfolio refinement: editorial hierarchy and a more legible career story. */
.portfolio-profile {
    position:relative;
    padding-top:clamp(94px, 13vw, 164px);
    padding-bottom:clamp(94px, 13vw, 164px);
}
.portfolio-profile::before {
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:72px;
    height:8px;
    background:#111;
}
.portfolio-profile h2 { max-width:520px; }
.career-roadmap {
    margin:0 calc(clamp(20px, 5vw, 72px) * -1);
    padding-right:clamp(20px, 5vw, 72px);
    padding-left:clamp(20px, 5vw, 72px);
    background:linear-gradient(90deg, #f5f5f1 0 50%, #eceee8 50% 100%);
    border-bottom:1px solid #111;
}
.career-roadmap .portfolio-section-heading {
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(220px, .45fr);
    column-gap:60px;
    align-items:end;
    max-width:100%;
}
.career-roadmap .portfolio-section-heading .eyebrow,
.career-roadmap .portfolio-section-heading h2 { grid-column:1; }
.career-roadmap .portfolio-section-heading > p:last-child {
    grid-column:2;
    grid-row:1 / span 2;
    align-self:end;
    margin:0;
    padding:18px 0 0 18px;
    border-left:2px solid #111;
    color:#343734;
}
.career-timeline {
    max-width:1180px;
    margin:72px auto 0;
    padding:24px 0 0;
    counter-reset:milestone;
}
.timeline-entry {
    min-height:210px;
    padding-bottom:40px;
    counter-increment:milestone;
}
.timeline-entry::before { width:6px; left:calc(50% - 3px); }
.timeline-card {
    position:relative;
    min-height:156px;
    padding:28px 32px 26px;
    border:1px solid #111;
    border-radius:14px;
    box-shadow:10px 10px 0 #d9dcd5;
}
.timeline-card::after {
    content:"0" counter(milestone);
    position:absolute;
    top:15px;
    right:18px;
    color:#aeb3aa;
    font-family:var(--font-mono);
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.08em;
}
.timeline-entry:nth-child(odd) .timeline-card { border-radius:14px 14px 4px 14px; }
.timeline-entry:nth-child(even) .timeline-card { border-radius:14px 14px 14px 4px; }
.timeline-card h3 { max-width:390px; margin-top:14px; font-size:clamp(1.3rem, 2vw, 1.62rem); }
.timeline-card p:last-child { max-width:440px; line-height:1.58; }
.timeline-era-label {
    display:table;
    margin:0 0 13px;
    padding:5px 8px;
    border:1px solid currentColor;
    border-radius:999px;
    font-family:var(--font-mono);
    font-size:.58rem;
    font-weight:700;
    letter-spacing:.07em;
}
.timeline-entry:nth-child(odd) .timeline-era-label { margin-left:auto; }
.era-high-school .timeline-card { border-top:6px solid #174d9d; }
.era-high-school .timeline-era-label { color:#174d9d; background:#fff9e7; }
.era-college .timeline-card { border-top:6px solid #ba222c; }
.era-college .timeline-era-label { color:#9e1721; background:#fff; }
.era-career .timeline-card { border-top:6px solid #1f7a43; }
.era-career .timeline-era-label { color:#1f6a3d; background:#f4fff5; }
.timeline-marker {
    width:28px;
    height:28px;
    margin-top:32px;
    border-width:5px;
    background:#f7f8f4;
}
.portfolio-projects { position:relative; overflow:hidden; }
.portfolio-projects::before {
    content:"PROJECTS";
    position:absolute;
    top:-18px;
    right:-10px;
    color:#202320;
    font-family:'Arial Black', Impact, sans-serif;
    font-size:clamp(5rem, 16vw, 16rem);
    letter-spacing:-.12em;
    line-height:1;
    pointer-events:none;
}
.portfolio-projects > * { position:relative; z-index:1; }
.portfolio-project-grid { gap:20px; }
.portfolio-project {
    min-height:300px;
    padding:32px;
    border-color:#737a70;
    border-radius:14px;
    background:linear-gradient(145deg, #202420, #141614 72%);
}
.portfolio-project.featured-project {
    background:linear-gradient(145deg, #30362d, #171a16 70%);
    border-color:#d6ddd0;
}
.portfolio-project .micro { color:#c4f4ac; }
.portfolio-project h3 { max-width:520px; }
.portfolio-project ul {
    display:grid;
    gap:10px;
    margin:26px 0 0;
    padding:0;
    list-style:none;
}
.portfolio-project li {
    position:relative;
    padding-left:17px;
}
.portfolio-project li::before {
    content:"";
    position:absolute;
    top:.56em;
    left:0;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--signal);
}
.portfolio-skills { background:#fafaf7; }
.skills-grid { gap:12px; margin-top:48px; border:0; }
.skills-grid article {
    min-height:178px;
    padding:28px;
    border:1px solid #bfc3ba;
    border-radius:12px;
    background:#fff;
}
.skills-grid h3 {
    display:flex;
    align-items:center;
    gap:10px;
    font-family:var(--font-mono);
    font-size:.76rem;
    letter-spacing:.06em;
    text-transform:uppercase;
}
.skills-grid h3::before {
    content:"";
    width:10px;
    height:10px;
    border-radius:50%;
    background:#111;
}
.skills-grid .skills-coursework {
    min-height:126px;
    background:#f0f2ec;
}
.portfolio-contact {
    max-width:none;
    margin:0 calc(clamp(20px, 5vw, 72px) * -1);
    padding:clamp(78px, 12vw, 150px) clamp(20px, 5vw, 72px);
    color:#fff;
    background:#111;
}
.portfolio-contact .eyebrow,
.portfolio-contact h2,
.portfolio-contact > p:not(.eyebrow) { color:#fff; }
.portfolio-contact h2 { max-width:760px; }
.portfolio-contact > p:not(.eyebrow) { color:#d6dbd1; }
.portfolio-contact .btn { background:var(--signal); color:#111; }
.portfolio-contact .btn:hover { background:#c2ff9f; }
@media (prefers-reduced-motion:no-preference) {
    .timeline-entry { animation:timeline-enter 400ms ease both; }
    .timeline-entry:nth-child(2) { animation-delay:40ms; }
    .timeline-entry:nth-child(3) { animation-delay:80ms; }
    .timeline-entry:nth-child(4) { animation-delay:120ms; }
    .timeline-entry:nth-child(5) { animation-delay:160ms; }
    .timeline-entry:nth-child(6) { animation-delay:200ms; }
    .timeline-entry:nth-child(7) { animation-delay:240ms; }
    .timeline-entry:nth-child(8) { animation-delay:280ms; }
    @keyframes timeline-enter { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
}
@media (max-width:760px) {
    .career-roadmap .portfolio-section-heading { display:block; }
    .career-roadmap .portfolio-section-heading > p:last-child { margin-top:24px; }
    .career-timeline { margin-top:46px; }
    .timeline-entry { min-height:0; padding-bottom:32px; }
    .timeline-entry::before { left:17px; width:5px; }
    .timeline-card { min-height:0; padding:24px 23px; box-shadow:6px 6px 0 #d9dcd5; }
    .timeline-entry:nth-child(odd) .timeline-era-label { margin-left:0; }
    .timeline-marker { width:24px; height:24px; margin-top:27px; }
    .portfolio-project { min-height:0; padding:26px; }
    .portfolio-projects::before { top:2px; font-size:5rem; }
}

/* Recruiter scan path: identity, credibility, then supporting detail. */
.landing-hero .eyebrow {
    max-width:520px;
    color:#343734;
    line-height:1.55;
}
.landing-hero h1 {
    position:relative;
    z-index:1;
    font-size:clamp(4.4rem, 10.8vw, 9.8rem);
}
.landing-hero-copy::after {
    content:"PRIVATE SYSTEMS / PUBLIC PORTFOLIO";
    display:block;
    width:max-content;
    max-width:100%;
    margin-top:30px;
    padding:7px 10px;
    border:1px solid #b7bcb1;
    border-radius:999px;
    color:#555b53;
    font-family:var(--font-mono);
    font-size:.62rem;
    font-weight:700;
    letter-spacing:.07em;
}
.portfolio-proof {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    margin:0;
    border-top:1px solid #111;
    border-bottom:1px solid #111;
    background:#fff;
}
.portfolio-proof article {
    min-height:240px;
    padding:30px;
    border-right:1px solid #111;
}
.portfolio-proof article:last-child { border-right:0; }
.portfolio-proof .micro { color:#4f574c; }
.portfolio-proof h3 {
    max-width:250px;
    margin:34px 0 12px;
    color:#111;
    font-size:clamp(1.35rem, 2.5vw, 1.8rem);
    letter-spacing:-.045em;
}
.portfolio-proof p:last-child { max-width:330px; margin:0; line-height:1.55; }
.portfolio-projects .portfolio-section-heading h2 { max-width:760px; }
.portfolio-project.featured-project h3::after {
    content:"Independent platform";
    display:block;
    margin-top:10px;
    color:#c4f4ac;
    font-family:var(--font-mono);
    font-size:.65rem;
    font-weight:700;
    letter-spacing:.07em;
    text-transform:uppercase;
}
.portfolio-contact h2 { font-size:clamp(3rem, 6vw, 6rem); }
@media (max-width:760px) {
    .portfolio-proof { grid-template-columns:1fr; }
    .portfolio-proof article {
        min-height:0;
        padding:26px;
        border-right:0;
        border-bottom:1px solid #111;
    }
    .portfolio-proof article:last-child { border-bottom:0; }
    .portfolio-proof h3 { margin-top:24px; }
}

/* ------------------------------------------------------------------
   Polish pass: same hardware-console language, tighter finish.
   ------------------------------------------------------------------ */
:root {
    --signal-soft:#c4f4ac;
    --card-shadow:0 1px 0 #fff inset, 0 1px 2px #1a1d1508, 0 6px 18px -10px #1a1d1522;
    --card-shadow-hover:0 1px 0 #fff inset, 0 2px 4px #1a1d150d, 0 18px 34px -16px #1a1d153d;
    --ease:cubic-bezier(.2,.7,.2,1);
}
html { scroll-behavior:smooth; }
body { -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; }
::selection { background:#b8f59a; color:#111; }
section[id] { scroll-margin-top:96px; }

/* Buttons and links */
.btn, .primary-button, .landing-sign-in, .landing-tabs a, .portfolio-sign-in, .sidebar nav a, .sidebar-toggle {
    transition:background-color 160ms var(--ease), color 160ms var(--ease), border-color 160ms var(--ease), box-shadow 160ms var(--ease), transform 160ms var(--ease);
}
.btn-primary, .primary-button { font-weight:600; box-shadow:0 1px 0 #ffffff1f inset, 0 2px 6px -2px #0006; }
.btn-primary:active, .primary-button:active { transform:translateY(1px); }
.landing-text-link { text-decoration-thickness:1px; transition:text-underline-offset 160ms var(--ease); }
.landing-text-link:hover { text-underline-offset:7px; }

/* Landing header: sticky glass bar */
.landing-page .topbar {
    position:sticky;
    top:0;
    z-index:120;
    margin:0 calc(clamp(20px, 5vw, 72px) * -1);
    padding:0 clamp(20px, 5vw, 72px);
    background:color-mix(in srgb, var(--shell) 86%, transparent);
    -webkit-backdrop-filter:saturate(1.4) blur(12px);
    backdrop-filter:saturate(1.4) blur(12px);
}
.landing-brand img { box-shadow:0 0 0 1px #0000000f, 0 4px 10px -4px #0005; }
.landing-tabs a[aria-current="page"] { box-shadow:0 1px 3px #0003; }

/* Hero: capped height on tall screens, glowing mark */
.landing-hero { min-height:min(calc(100vh - 190px), 780px); }
.landing-mark { position:relative; isolation:isolate; }
.landing-mark::before {
    content:"";
    position:absolute;
    inset:-14%;
    z-index:-1;
    border-radius:50%;
    background:radial-gradient(closest-side, #69f52c2e, transparent 72%);
}
.landing-mark::after {
    content:"";
    position:absolute;
    top:18px;
    right:18px;
    width:9px;
    height:9px;
    border-radius:50%;
    background:var(--signal);
    box-shadow:0 0 0 3px #69f52c33, 0 0 12px #69f52c;
}

/* Strength row */
.portfolio-proof article { transition:background-color 200ms var(--ease); }
.portfolio-proof article:hover { background:#f6f8f2; }
.portfolio-proof .micro::before {
    content:"";
    display:inline-block;
    width:7px;
    height:7px;
    margin-right:9px;
    border-radius:50%;
    background:var(--signal);
    box-shadow:0 0 6px #69f52c99;
    vertical-align:1px;
}

/* Latest updates: a log on black glass */
.portfolio-updates { padding:clamp(72px, 11vw, 145px) 0; border-bottom:1px solid #111; }
.portfolio-updates .portfolio-section-heading a { color:var(--ink); font-weight:700; }
.updates-console {
    margin-top:44px;
    padding:26px clamp(18px, 3vw, 34px) 10px;
    background:#121512;
    color:#eef1ea;
    border:9px solid #d9dbd2;
    outline:1px solid #babdb3;
    border-radius:24px;
    box-shadow:inset 0 0 0 2px #080a08, inset 0 0 60px #69f52c0a, 0 14px 30px -18px #0007;
}
.updates-console .terminal-bar { color:#9aa491; }
.updates-console .terminal-bar .led { margin:0 6px 0 0; box-shadow:0 0 8px #69f52c; }
.updates-feed { margin:0; padding:0; list-style:none; }
.update-entry {
    position:relative;
    display:grid;
    grid-template-columns:110px minmax(0, 1fr);
    gap:24px;
    padding:24px 0 24px;
    border-bottom:1px solid #2a3027;
}
.update-entry:last-child { border-bottom:0; }
.update-entry::before {
    content:"";
    position:absolute;
    top:31px;
    left:-14px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:#59604f;
}
.update-entry:first-child::before { background:var(--signal); box-shadow:0 0 8px var(--signal); }
.update-date {
    margin:4px 0 0;
    color:#9aa491;
    font-family:var(--font-mono);
    font-size:.75rem;
    letter-spacing:.08em;
}
.update-entry h3 { margin:10px 0 6px; color:#fff; font-size:clamp(1.15rem, 2vw, 1.4rem); letter-spacing:-.03em; }
.update-entry p:last-child { margin:0; max-width:680px; color:#c3c9bc; line-height:1.55; }
.update-tag {
    display:inline-block;
    padding:3px 8px;
    border:1px solid currentColor;
    border-radius:999px;
    font-family:var(--font-mono);
    font-size:.66rem;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.tag-site { color:var(--signal-soft); }
.tag-game { color:#ffd27a; }
.tag-portal { color:#9fd3ff; }
.tag-milestone { color:#f2a7ae; }
@media (prefers-reduced-motion:no-preference) {
    .update-entry { transition:background-color 180ms var(--ease); }
    .update-entry:hover { background:linear-gradient(90deg, #69f52c0d, transparent 70%); }
}

/* Projects */
.portfolio-project {
    position:relative;
    transition:transform 220ms var(--ease), border-color 220ms var(--ease), box-shadow 220ms var(--ease);
}
.portfolio-project:hover { border-color:#c9d3c2; box-shadow:0 22px 40px -24px #000, 0 0 0 1px #69f52c33; }
@media (prefers-reduced-motion:no-preference) {
    .portfolio-project:hover { transform:translateY(-4px); }
}
.project-stack { display:flex; flex-wrap:wrap; gap:6px; margin:18px 0 0 !important; }
.project-stack span {
    padding:4px 9px;
    border:1px solid #4b5248;
    border-radius:999px;
    background:#ffffff08;
    color:#dfe4d9;
    font-family:var(--font-mono);
    font-size:.68rem;
    letter-spacing:.04em;
}
.portfolio-project.game-project { background:linear-gradient(145deg, #262b22, #141614 72%); }
.portfolio-project.game-project .micro { color:#ffd27a; }

/* Skills and contact */
.skills-grid article { transition:border-color 180ms var(--ease), box-shadow 180ms var(--ease); }
.skills-grid article:hover { border-color:#8b9282; box-shadow:var(--card-shadow); }
.portfolio-contact .btn { box-shadow:0 0 0 1px #69f52c, 0 8px 22px -8px #69f52c88; }

/* Scroll reveal (added by site.js only when motion is allowed) */
.reveal { opacity:0; transform:translateY(18px); transition:opacity 600ms var(--ease), transform 600ms var(--ease); }
.reveal.is-visible { opacity:1; transform:none; }

/* ---- Portal ---- */
.sidebar { background:linear-gradient(180deg, #fbfbf8, #f4f4ef); }
.brand img { box-shadow:0 0 0 1px #0000000f, 0 10px 22px -12px #000a; }
.sidebar nav a { color:#30342e; }
.sidebar nav a:hover { transform:translateX(2px); }
.sidebar nav a[aria-current=page] { color:#111; font-weight:600; }
.sidebar nav a[aria-current=page] span { color:#2f7a12; }
.physical-led.authenticated { box-shadow:0 0 0 1px #b7bab1, inset 0 2px 4px #0003, 0 0 14px #69f52c99; }

.console-hero { box-shadow:inset 0 0 0 2px #080a08, inset 0 0 80px #69f52c0d, 0 14px 30px -18px #0008; }
.console-hero::after {
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:repeating-linear-gradient(0deg, #ffffff05 0 1px, transparent 1px 3px);
    border-radius:inherit;
}

.module, .project-card { box-shadow:var(--card-shadow); }
.module { position:relative; overflow:hidden; }
.module::before {
    content:"";
    position:absolute;
    inset:0 0 auto;
    height:3px;
    background:linear-gradient(90deg, #c9ccc2, transparent);
}
.portal-card {
    position:relative;
    transition:transform 200ms var(--ease), border-color 200ms var(--ease), box-shadow 200ms var(--ease);
}
.portal-card:hover, .portal-card:focus-visible {
    border-color:#6c7561;
    box-shadow:var(--card-shadow-hover), inset 3px 0 var(--signal);
}
@media (prefers-reduced-motion:no-preference) {
    .portal-card:hover, .portal-card:focus-visible { transform:translateY(-3px); }
}
.portal-card .card-action { display:inline-block; margin-top:4px; color:#3b4334; transition:transform 200ms var(--ease); }
.portal-card:hover .card-action { transform:translateX(3px); color:#111; }
.project-card { border-radius:16px; }

.terminal { box-shadow:inset 0 1px 5px #000a, inset 0 0 60px #69f52c08, 0 14px 30px -20px #0008; }
.cursor { animation:cursor-blink 1.1s steps(1) infinite; }
@keyframes cursor-blink { 50% { opacity:0; } }

.table tbody tr { transition:background-color 140ms var(--ease); }
.table tbody tr:hover { background:#e9ece3; }

.login-panel { padding:34px; border-radius:20px; box-shadow:var(--card-shadow-hover); }
.login-panel .btn-primary { padding:12px 20px; }
.form-control { border-radius:9px; padding:10px 12px; }

.portal-footer { color:#6d7466; }

@media (max-width:760px) {
    .landing-page .topbar { position:sticky; }
    .update-entry { grid-template-columns:1fr; gap:6px; padding:20px 0; }
    .update-entry::before { display:none; }
    .updates-console { border-width:6px; border-radius:18px; }
    .login-panel { padding:24px; }
}
.portfolio-projects,
.portfolio-skills {
    margin:0 calc(clamp(20px, 5vw, 72px) * -1);
    padding-right:clamp(20px, 5vw, 72px);
    padding-left:clamp(20px, 5vw, 72px);
}
.portfolio-section-heading h2 + p { margin-top:18px; }
/* Keep the floating menu button clear of the breadcrumb when the sidebar is closed. */
.topbar { transition:padding-left 225ms ease-in-out; }
.sidebar-collapsed .topbar { padding-left:58px; }

/* Live status from the host collector snapshot. */
.terminal-lines .status-ok dt, .terminal-lines .status-ok .status-word { color:var(--signal); }
.terminal-lines .status-warn dt, .terminal-lines .status-warn .status-word { color:#ffd27a; }
.terminal-lines .status-fail dt, .terminal-lines .status-fail .status-word { color:#ff8a8a; }
.terminal-lines .status-summary { color:#7d8774; }
.status-pill {
    display:inline-block;
    padding:3px 8px;
    border:1px solid var(--line);
    border-radius:999px;
    font-family:var(--font-mono);
    font-size:.7rem;
    font-weight:700;
    letter-spacing:.05em;
    color:#5d6357;
    white-space:nowrap;
}
.status-ok .status-pill { color:#2b6b12; border-color:#7fc35a; background:#f0fde9; }
.status-warn .status-pill { color:#7a5300; border-color:#e6b84f; background:#fff8e6; }
.status-fail .status-pill { color:#9e1721; border-color:#e48a90; background:#fff0f1; }
.module.status-ok::before { background:linear-gradient(90deg, var(--signal), transparent); }
.module.status-warn::before { background:linear-gradient(90deg, #e6b84f, transparent); }
.module.status-fail::before { background:linear-gradient(90deg, #d9434e, transparent); }
.led:not(.inactive) { box-shadow:0 0 6px var(--signal); }

/* Markets page */
.markets-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; margin:0 0 18px; }
.markets-range { display:inline-flex; gap:2px; padding:4px; border:1px solid var(--line); border-radius:9px; background:var(--paper); }
.markets-range button { padding:6px 12px; border:0; border-radius:6px; background:transparent; color:#555a52; font-family:var(--font-mono); font-size:.75rem; font-weight:700; letter-spacing:.04em; cursor:pointer; }
.markets-range button:hover { background:#e6e9e0; color:var(--ink); }
.markets-range button[aria-pressed="true"] { background:#191b19; color:#fff; }
.markets-legend { display:flex; flex-wrap:wrap; gap:16px; margin:0; padding:0; list-style:none; font-family:var(--font-mono); font-size:.72rem; color:#5d6357; }
.markets-legend li { display:inline-flex; align-items:center; gap:7px; }
.swatch { display:inline-block; width:22px; height:0; border-top:2px solid var(--ink); }
.swatch-forecast { border-top:2px dashed #2f7a12; }
.swatch-band { height:10px; border:0; border-radius:2px; background:rgba(105, 245, 44, 0.28); }
.markets-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px; }
.market-card { padding:20px 20px 14px; }
.market-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.market-head h2 { margin:0 0 4px; font-size:1.35rem; }
.market-head .micro { margin:0; color:#6d7466; }
.market-price { text-align:right; }
.market-price strong { display:block; font-size:1.35rem; letter-spacing:-.03em; }
.market-change { font-family:var(--font-mono); font-size:.75rem; color:#6d7466; }
.market-change.is-up { color:#2b6b12; }
.market-change.is-down { color:#a4212b; }
.market-chart { position:relative; height:220px; margin:14px 0 8px; }
.market-foot { margin:0; color:#6d7466; line-height:1.5; }
.markets-note { max-width:860px; }
@media (min-width:1600px) { .markets-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); } }
@media (max-width:900px) { .markets-grid { grid-template-columns:1fr; } .market-chart { height:200px; } }
.swatch-previous { border-top:2px dashed rgba(120, 126, 114, 0.6); }

/* Weather page */
.weather-chart-card { margin-bottom:16px; }
.weather-chart { position:relative; height:360px; margin-top:8px; }
@media (max-width:760px) { .weather-chart { height:300px; } }

/* $30 rule what-if */
.markets-rule { margin-bottom:18px; }
.rule-stats { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; margin:6px 0 14px; }
.rule-tile { padding:16px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.rule-tile .micro { margin:0 0 8px; color:#5d6357; }
.rule-tile strong { display:block; font-size:1.3rem; letter-spacing:-.03em; }
.rule-tile p:last-child { margin:6px 0 0; font-size:.82rem; }
.market-forward { margin-top:6px; color:#2f5f1c; }
.market-rule-line { margin-top:6px; }
.marker { display:inline-block; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; }
.marker-buy { border-bottom:10px solid #2f7a12; }
.marker-sell { border-top:10px solid #a4212b; }
@media (max-width:1100px) { .rule-stats { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:520px) { .rule-stats { grid-template-columns:1fr; } }
.section-heading { flex-wrap:wrap; }
.markets-range { flex-wrap:wrap; max-width:100%; }
.rule-slider { display:flex; align-items:center; gap:14px; margin:4px 0 16px; flex-wrap:wrap; }
.rule-slider label { font-family:var(--font-mono); font-size:.75rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:#5d6357; }
.rule-slider input[type=range] { flex:1 1 260px; max-width:520px; accent-color:#2f7a12; }
.rule-slider output { min-width:64px; padding:4px 10px; border-radius:999px; background:#191b19; color:#fff; font-family:var(--font-mono); font-size:.85rem; font-weight:700; text-align:center; }

/* Strategy lab */
.lab-card { margin-bottom:18px; }
.lab-verdict { margin:4px 0 16px; padding:14px 16px; border-left:4px solid #a4212b; background:#fff6f6; color:#3a2a2a; font-size:1.02rem; border-radius:0 10px 10px 0; }
.lab-verdict.is-positive { border-left-color:#2f7a12; background:#f3fbef; color:#23361a; }
.lab-table td, .lab-years td { white-space:nowrap; }
.lab-table .is-up, .lab-years .is-up { color:#2b6b12; font-weight:600; }
.lab-table .is-down, .lab-years .is-down { color:#a4212b; }
.lab-baseline td { font-weight:700; background:#f2f4ee; }
.lab-hindsight { color:#6d7466; font-size:.8rem; }
.lab-years { font-size:.78rem; }
.signal-progress { margin:4px 0 16px; }
.signal-progress-bar { height:10px; border-radius:999px; background:#e3e6dd; overflow:hidden; }
.signal-progress-bar span { display:block; height:100%; width:0; background:linear-gradient(90deg, #2f7a12, var(--signal)); }
.signal-progress .micro { margin:8px 0 0; color:#5d6357; }
#signals .is-up { color:#2b6b12; font-weight:600; }
#signals .is-down { color:#a4212b; }

/* Public research page */
.research-page { padding:0 0 clamp(64px, 9vw, 120px); }
.research-hero { max-width:820px; padding:clamp(56px, 9vw, 120px) 0 clamp(40px, 6vw, 72px); }
.research-hero h1 { margin:0; color:#111; font-size:clamp(3rem, 8vw, 6.6rem); letter-spacing:-.08em; line-height:.86; }
.research-method { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; margin:0 0 28px; }
.research-method article { padding:22px; border:1px solid #bfc3ba; border-radius:12px; background:#fff; }
.research-method h3 { margin:12px 0 8px; color:#111; font-size:1.2rem; }
.research-method p:last-child { margin:0; }
.research-section { margin-top:clamp(48px, 7vw, 88px); }
.research-section .portfolio-section-heading { margin-bottom:24px; }
.research-disclaimer { margin-top:32px; }
@media (max-width:760px) { .research-method { grid-template-columns:1fr; } }