/* Shared chrome for every scroll surface, including dynamically mounted scene content. */
:root {
    --port-scroll-track: #03111d;
    --port-scroll-thumb: #64ffda;
    --port-scroll-hover: #a3ffe8;
}
html, body, body *, .world-view {
    scrollbar-color: var(--port-scroll-thumb) var(--port-scroll-track);
    scrollbar-width: thin;
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner { background: var(--port-scroll-track); }
::-webkit-scrollbar-thumb {
    background: var(--port-scroll-thumb);
    border: 3px solid var(--port-scroll-track);
    border-radius: 10px;
}
@media (hover: hover) {
    ::-webkit-scrollbar-thumb:hover { background: var(--port-scroll-hover); }
}
.terminal-content { overscroll-behavior: contain; scrollbar-gutter: stable; }

/* A native cursor stays at the system pointer: no DOM follower, rAF or smoothing lag.
   Small, explicit hotspots retain precise selection. Text and resize keep native affordances. */
@media (hover: hover) and (pointer: fine) {
    body {
        cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='32' viewBox='0 0 28 32'%3E%3Cpath d='M3 2L23 18L14 19L10 28Z' fill='%2303111d' stroke='%2364ffda' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M7 8L17 16L12 17Z' fill='%2364ffda'/%3E%3C/svg%3E") 3 2, auto;
    }
    a[href], button:not(:disabled), [role='button']:not([aria-disabled='true']), summary,
    .terminal-toggle {
        cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='32' viewBox='0 0 28 32'%3E%3Cpath d='M3 2L23 18L14 19L10 28Z' fill='%2364ffda' stroke='%2303111d' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M3 2L23 18L14 19L10 28Z' fill='none' stroke='%23a3ffe8' stroke-width='1'/%3E%3C/svg%3E") 3 2, pointer !important;
    }
    input:not([type='button']):not([type='submit']):not([type='checkbox']):not([type='radio']):not([type='range']),
    textarea, [contenteditable='true'] { cursor: text; }
    button:disabled, [aria-disabled='true'] { cursor: not-allowed; }
}

.terminal-toggle {
    display: grid !important;
    grid-template-columns: auto auto auto;
    column-gap: .6rem !important;
    row-gap: .2rem !important;
    border: 1px solid #a3ffe8 !important;
    transition: background-color 150ms ease-out, box-shadow 150ms ease-out !important;
    transform: none !important;
}
.terminal-toggle kbd {
    border: 1px solid currentColor;
    border-bottom-width: 2px;
    padding: .15rem .3rem;
    border-radius: 2px;
    font: inherit;
    font-size: .68rem;
    line-height: 1;
}
.terminal-invite {
    grid-column: 1 / -1;
    font-size: .62rem;
    letter-spacing: .06em;
    line-height: 1.25;
    opacity: .8;
}
.terminal-toggle:focus-visible {
    outline: 2px solid #e1edf0 !important;
    outline-offset: 4px !important;
}
@media (hover: hover) {
    .terminal-toggle:hover {
        background-color: #a3ffe8 !important;
        box-shadow: 0 0 0 4px rgb(100 255 218 / .13) !important;
        transform: none !important;
    }
}
@media (prefers-reduced-motion: no-preference) {
    .terminal-toggle:not([data-discovered]) { animation: terminal-invitation 1600ms ease-out 900ms 1; }
    .terminal-toggle:not(:disabled):active { scale: .96; transition: scale 150ms ease-out !important; }
    @keyframes terminal-invitation {
        0%, 100% { box-shadow: 0 0 0 0 rgb(100 255 218 / 0); }
        45% { box-shadow: 0 0 0 7px rgb(100 255 218 / .2); }
    }
}
@media (prefers-reduced-motion: reduce) {
    .terminal-toggle { animation: none !important; transform: none !important; }
}
@media (forced-colors: active) {
    html, body, body *, .world-view { scrollbar-color: auto; }
    body { cursor: auto; }
    a[href], button:not(:disabled), [role='button'], summary, .terminal-toggle { cursor: pointer !important; }
    .terminal-toggle { border-color: ButtonText !important; }
}