/* ==============================
   CLUB 99
   Sistema visual principal
================================= */

:root {
    --desktop-blue: #087b9f;
    --desktop-blue-dark: #04536f;

    --window-gray: #c7c7c7;
    --window-light: #ffffff;
    --window-shadow: #767676;
    --window-dark: #161616;

    --title-blue: #000080;
    --title-blue-light: #1084d0;

    --pink: #ff4fa3;
    --purple: #7559d9;
    --green: #29c66f;
    --yellow: #ffe268;

    --black: #111111;
    --white: #ffffff;

    --taskbar-height: 48px;
}

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

html,
body {
    width: 100%;
    min-height: 100%;
}

body {
    font-family:
        "Trebuchet MS",
        Verdana,
        Arial,
        sans-serif;

    color: var(--black);
    overflow: hidden;
}

button,
input {
    font: inherit;
}

button {
    cursor: pointer;
}

.hidden {
    display: none !important;
}


/* ==============================
   Pantalla de arranque
================================= */

.boot-screen {
    position: fixed;
    inset: 0;
    z-index: 9999;

    display: grid;
    place-items: center;

    background:
        radial-gradient(
            circle at center,
            #1c2151 0%,
            #08091d 55%,
            #02030a 100%
        );

    color: var(--white);
}

.boot-content {
    width: min(88%, 520px);
    text-align: center;
}

.boot-logo {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 8px;

    margin-bottom: 12px;

    text-shadow:
        4px 4px 0 rgba(0, 0, 0, 0.45);
}

.boot-logo-club {
    font-size: clamp(3rem, 12vw, 6.5rem);
    font-weight: 900;
    letter-spacing: -5px;
}

.boot-logo-number {
    color: var(--pink);
    font-size: clamp(3.5rem, 14vw, 7.5rem);
    font-weight: 900;
    line-height: 0.9;
}

.boot-subtitle {
    margin-bottom: 40px;
    color: #d5d7ff;
    letter-spacing: 2px;
}

.boot-loader {
    width: 100%;
    height: 22px;
    padding: 3px;

    border: 2px solid var(--white);
    background: #111111;
}

.boot-loader-bar {
    width: 0;
    height: 100%;

    background:
        repeating-linear-gradient(
            90deg,
            var(--pink) 0 14px,
            #ff86c2 14px 18px
        );

    transition: width 0.35s linear;
}

.boot-status {
    min-height: 24px;
    margin-top: 14px;

    color: #a9ffcc;
    font-family: monospace;
}

.skip-button {
    margin-top: 30px;

    color: #d9d9d9;
    background: transparent;
    border: 0;
    text-decoration: underline;
}


/* ==============================
   Escritorio
================================= */

.desktop {
    position: fixed;
    inset: 0;

    min-height: 100vh;
    padding: 28px 28px calc(var(--taskbar-height) + 28px);

    background:
        radial-gradient(
            circle at 20% 15%,
            rgba(255, 255, 255, 0.16),
            transparent 20%
        ),
        linear-gradient(
            145deg,
            var(--desktop-blue),
            var(--desktop-blue-dark)
        );

    overflow: hidden;
}

.desktop::before {
    content: "CLUB 99";
    position: absolute;
    right: 4%;
    bottom: 9%;

    color: rgba(255, 255, 255, 0.08);
    font-size: clamp(5rem, 17vw, 14rem);
    font-weight: 900;
    letter-spacing: -10px;
    pointer-events: none;
}

.desktop-icons {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;
    gap: 22px;

    width: 100px;
}

.desktop-icon {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;

    width: 100px;
    padding: 6px;

    color: var(--white);
    background: transparent;
    border: 1px solid transparent;

    font-size: 0.78rem;
    text-align: center;
    text-shadow: 1px 1px 2px #000000;
}

.desktop-icon:hover,
.desktop-icon:focus {
    border: 1px dotted var(--white);
    background: rgba(0, 0, 128, 0.25);
}

.desktop-icon-image {
    display: grid;
    place-items: center;

    width: 48px;
    height: 48px;

    font-size: 2rem;
    filter: drop-shadow(2px 3px 1px rgba(0, 0, 0, 0.4));
}


/* ==============================
   Ventanas
================================= */

.window {
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;

    width: min(900px, calc(100% - 220px));
    min-height: 520px;

    transform: translate(-50%, -50%);

    border-top: 3px solid var(--window-light);
    border-left: 3px solid var(--window-light);
    border-right: 3px solid var(--window-dark);
    border-bottom: 3px solid var(--window-dark);

    background: var(--window-gray);
    box-shadow: 14px 16px 0 rgba(0, 0, 0, 0.28);
}

.secondary-window {
    width: min(560px, calc(100% - 230px));
    min-height: 320px;
}

.active-window {
    z-index: 30;
}

.window-titlebar {
    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 38px;
    padding: 4px 5px 4px 10px;

    color: var(--white);

    background:
        linear-gradient(
            90deg,
            var(--title-blue),
            var(--title-blue-light)
        );
}

.window-title {
    display: flex;
    align-items: center;
    gap: 8px;

    font-weight: bold;
}

.window-controls {
    display: flex;
    gap: 4px;
}

.window-control {
    display: grid;
    place-items: center;

    width: 28px;
    height: 27px;

    color: var(--black);
    background: var(--window-gray);

    border-top: 2px solid var(--window-light);
    border-left: 2px solid var(--window-light);
    border-right: 2px solid var(--window-dark);
    border-bottom: 2px solid var(--window-dark);

    font-weight: 900;
    line-height: 1;
}

.window-control:active,
.primary-button:active,
.start-button:active {
    border-top-color: var(--window-dark);
    border-left-color: var(--window-dark);
    border-right-color: var(--window-light);
    border-bottom-color: var(--window-light);
}

.window-body {
    min-height: 438px;
}

.login-layout {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
}

.login-brand {
    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 50px;

    color: var(--white);

    background:
        linear-gradient(
            145deg,
            #1e1b61,
            #5a2485 55%,
            #d33a8e
        );
}

.main-logo {
    display: flex;
    align-items: flex-end;
    gap: 7px;
}

.main-logo-club {
    font-size: clamp(3rem, 7vw, 5.3rem);
    font-weight: 900;
    letter-spacing: -5px;
}

.main-logo-number {
    color: var(--yellow);
    font-size: clamp(3.6rem, 8vw, 6.2rem);
    font-weight: 900;
    line-height: 0.9;
}

.main-tagline {
    margin-top: 14px;
    font-size: 1.1rem;
    letter-spacing: 1px;
}

.connection-card {
    display: flex;
    align-items: center;
    gap: 12px;

    margin-top: 40px;
    padding: 14px;

    color: var(--black);
    background: rgba(255, 255, 255, 0.88);

    border: 2px solid rgba(255, 255, 255, 0.8);
}

.connection-card p {
    margin-top: 3px;
    font-size: 0.85rem;
}

.connection-light {
    width: 13px;
    height: 13px;

    background: var(--green);
    border: 1px solid #087f3b;
    border-radius: 50%;

    box-shadow: 0 0 12px var(--green);
}

.login-panel {
    padding: 30px;
    background: var(--window-gray);
}

.tabs {
    display: flex;
    align-items: flex-end;
    gap: 4px;

    margin-bottom: 24px;
    border-bottom: 2px solid var(--window-shadow);
}

.tab-button {
    padding: 10px 16px;

    background: #adadad;

    border-top: 2px solid var(--window-light);
    border-left: 2px solid var(--window-light);
    border-right: 2px solid var(--window-dark);
    border-bottom: 0;
}

.tab-button.active {
    position: relative;
    top: 2px;

    background: var(--window-gray);
    font-weight: bold;
}

.form-panel {
    display: none;
}

.form-panel.active {
    display: block;
}

.field-group {
    margin-bottom: 18px;
}

.field-group label {
    display: block;
    margin-bottom: 7px;
    font-weight: bold;
}

.field-group input {
    width: 100%;
    min-height: 42px;
    padding: 8px 10px;

    color: var(--black);
    background: var(--white);

    border-top: 2px solid var(--window-dark);
    border-left: 2px solid var(--window-dark);
    border-right: 2px solid var(--window-light);
    border-bottom: 2px solid var(--window-light);

    outline: none;
}

.field-group input:focus {
    outline: 2px dotted var(--title-blue);
    outline-offset: -5px;
}

.checkbox-row {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 18px;
    font-size: 0.9rem;
}

.primary-button {
    width: 100%;
    min-height: 43px;
    padding: 9px 18px;

    color: var(--black);
    background: var(--window-gray);

    border-top: 3px solid var(--window-light);
    border-left: 3px solid var(--window-light);
    border-right: 3px solid var(--window-dark);
    border-bottom: 3px solid var(--window-dark);

    font-weight: bold;
}

.primary-button:hover {
    background: #dddddd;
}

.text-button {
    display: block;
    margin: 18px auto 0;

    color: var(--title-blue);
    background: transparent;
    border: 0;

    text-decoration: underline;
}

.window-statusbar {
    display: flex;
    justify-content: space-between;
    gap: 15px;

    min-height: 35px;
    padding: 7px 10px;

    border-top: 2px solid var(--window-shadow);
    background: var(--window-gray);

    font-family: monospace;
    font-size: 0.78rem;
}

.simple-window-content {
    padding: 35px;
}

.simple-window-content h2 {
    margin-bottom: 20px;
    color: var(--title-blue);
}

.simple-window-content p {
    margin-bottom: 18px;
    line-height: 1.6;
}

.simple-window-content .primary-button {
    max-width: 240px;
    margin-top: 10px;
}

.system-message {
    margin-top: 24px;
    padding: 16px;

    border-top: 2px solid var(--window-shadow);
    border-left: 2px solid var(--window-shadow);
    border-right: 2px solid var(--window-light);
    border-bottom: 2px solid var(--window-light);

    background: #eeeeee;
}


/* ==============================
   Barra inferior
================================= */

.taskbar {
    position: fixed;
    z-index: 200;
    right: 0;
    bottom: 0;
    left: 0;

    display: flex;
    align-items: center;
    gap: 7px;

    min-height: var(--taskbar-height);
    padding: 5px;

    background: var(--window-gray);

    border-top: 3px solid var(--window-light);
}

.start-button {
    display: flex;
    align-items: center;
    gap: 7px;

    min-height: 36px;
    padding: 5px 12px;

    background: var(--window-gray);

    border-top: 2px solid var(--window-light);
    border-left: 2px solid var(--window-light);
    border-right: 2px solid var(--window-dark);
    border-bottom: 2px solid var(--window-dark);

    font-weight: 900;
}

.start-symbol {
    color: var(--pink);
    font-size: 1.2rem;
}

.taskbar-apps {
    flex: 1;
}

.taskbar-app {
    min-width: 150px;
    min-height: 34px;
    padding: 5px 12px;

    text-align: left;

    background: #b7b7b7;

    border-top: 2px solid var(--window-shadow);
    border-left: 2px solid var(--window-shadow);
    border-right: 2px solid var(--window-light);
    border-bottom: 2px solid var(--window-light);
}

.taskbar-tray {
    display: flex;
    align-items: center;
    gap: 8px;

    min-height: 34px;
    padding: 5px 12px;

    border-top: 2px solid var(--window-shadow);
    border-left: 2px solid var(--window-shadow);
    border-right: 2px solid var(--window-light);
    border-bottom: 2px solid var(--window-light);

    font-family: monospace;
}

.online-indicator {
    width: 9px;
    height: 9px;

    background: var(--green);
    border-radius: 50%;
    box-shadow: 0 0 6px var(--green);
}


/* ==============================
   Menú inicio
================================= */

.start-menu {
    position: fixed;
    z-index: 300;
    left: 5px;
    bottom: var(--taskbar-height);

    display: grid;
    grid-template-columns: 48px 250px;

    width: 298px;

    background: var(--window-gray);

    border-top: 3px solid var(--window-light);
    border-left: 3px solid var(--window-light);
    border-right: 3px solid var(--window-dark);
    border-bottom: 3px solid var(--window-dark);

    box-shadow: 8px 8px 0 rgba(0, 0, 0, 0.25);
}

.start-menu-brand {
    display: flex;
    align-items: flex-end;
    justify-content: center;

    padding: 12px 0;

    color: rgba(255, 255, 255, 0.75);
    background: linear-gradient(#18296e, #6541a5);

    font-weight: 900;
    letter-spacing: 3px;

    writing-mode: vertical-rl;
    transform: rotate(180deg);
}

.start-menu-options {
    padding: 6px;
}

.start-menu-options button {
    display: block;

    width: 100%;
    padding: 13px 12px;

    text-align: left;

    background: transparent;
    border: 0;
}

.start-menu-options button:hover {
    color: var(--white);
    background: var(--title-blue);
}


/* ==============================
   Diseño adaptable
================================= */

@media (max-width: 800px) {

    body {
        overflow: auto;
    }

    .desktop {
        padding: 14px 14px 76px;
        overflow-y: auto;
    }

    .desktop-icons {
        flex-direction: row;
        width: 100%;
    }

    .desktop-icon {
        width: 88px;
    }

    .window,
    .secondary-window {
        position: relative;
        top: auto;
        left: auto;

        width: 100%;
        min-height: auto;
        margin: 20px auto;

        transform: none;
    }

    .login-layout {
        grid-template-columns: 1fr;
    }

    .login-brand {
        padding: 30px;
    }

    .window-body {
        min-height: auto;
    }

    .login-panel {
        padding: 24px 18px;
    }

    .taskbar-apps {
        display: none;
    }

    .start-menu {
        right: 5px;
        width: auto;
        grid-template-columns: 42px 1fr;
    }

    .boot-logo {
        gap: 5px;
    }

}

@media (max-width: 480px) {

    .desktop-icons {
        justify-content: space-between;
        gap: 5px;
    }

    .desktop-icon {
        width: 31%;
        font-size: 0.7rem;
    }

    .login-brand {
        padding: 25px 20px;
    }

    .main-logo-club {
        letter-spacing: -3px;
    }

    .tabs {
        align-items: stretch;
    }

    .tab-button {
        flex: 1;
        padding: 10px 7px;
        font-size: 0.8rem;
    }

    .window-statusbar span:first-child {
        display: none;
    }

    .window-statusbar {
        justify-content: flex-end;
    }

}
.window-maximized {
    position: fixed;
    top: 12px;
    right: 12px;
    bottom: calc(var(--taskbar-height) + 12px);
    left: 12px;

    width: auto;
    min-height: auto;

    transform: none;
}
/* ===== CLUB 99 v0.1: mensajes y escritorio ===== */
.form-message{display:none;margin:0 0 16px;padding:12px;border:2px inset #fff;background:#fff;font-size:.9rem;line-height:1.4}
.form-message.show{display:block}
.form-message.success{background:#dfffe8;color:#084c23}
.form-message.error{background:#ffe2e2;color:#761313}
.user-desktop{min-height:100vh;padding:26px 26px 76px;background:linear-gradient(145deg,#087b9f,#04536f);color:#fff}
.user-topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px;padding:12px 16px;background:#c7c7c7;color:#111;border:3px outset #fff}
.user-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px;max-width:1000px}
.user-card{padding:22px;background:#c7c7c7;color:#111;border:3px outset #fff;box-shadow:8px 8px 0 rgba(0,0,0,.2)}
.user-card h2{margin:0 0 8px;color:#000080}
.logout-link{display:inline-block;padding:8px 12px;background:#c7c7c7;color:#111;text-decoration:none;border:2px outset #fff;font-weight:700}
.version-badge{font-family:monospace;font-size:.8rem}

/* =====================================================
   NINETYNINE v1.0 REBIRTH · ROOM ENGINE
===================================================== */

/* ==============================
   NINETYNINE — ROOM OS v0.2.0
================================= */
body.room-page{overflow:hidden;background:#0c0d10;font-family:Tahoma,Verdana,Arial,sans-serif}
.room-desktop{position:fixed;inset:0;overflow:hidden;color:#171717;background:#17191d}
.room-systembar{position:absolute;z-index:500;top:0;left:0;right:0;height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;color:#e9edf0;background:#111318;border-bottom:1px solid #4d535c;box-shadow:0 2px 0 #050505;font-size:12px}
.room-brand,.room-session{display:flex;align-items:center;gap:9px}.room-brand strong{letter-spacing:2px}.room-brand small{color:#8e98a5;text-transform:lowercase}.signal-dot{width:8px;height:8px;border-radius:50%;background:#8fd37f;box-shadow:0 0 8px #8fd37f}.room-session a{padding:5px 8px;color:#dfe4e9;text-decoration:none;border:1px solid #656c75;background:#272b31}.room-session a:hover{background:#e7e7e7;color:#111}.room-handle{color:#95a5b4}
.room-scene{position:absolute;inset:42px 0 46px;overflow:hidden;background:linear-gradient(to bottom,#b6ad9c 0 67%,#51443c 67% 100%)}
.room-scene:before{content:"";position:absolute;inset:0 0 33%;background:repeating-linear-gradient(90deg,rgba(255,255,255,.045) 0 2px,transparent 2px 72px),linear-gradient(90deg,rgba(75,56,42,.13),transparent 30%,rgba(255,255,255,.08) 55%,transparent)}
.room-scene:after{content:"";position:absolute;left:0;right:0;bottom:0;height:34%;background:repeating-linear-gradient(100deg,#473a32 0 58px,#59483c 58px 61px);clip-path:polygon(0 17%,100% 0,100% 100%,0 100%)}
.room-wall-copy{position:absolute;left:8%;top:10%;display:flex;align-items:flex-end;gap:16px;color:#33312f;transform:rotate(-2deg)}.room-wall-copy span{padding:7px 10px;border:2px solid #33312f;font:700 12px monospace;letter-spacing:2px}.room-wall-copy strong{font-size:64px;line-height:.75;opacity:.13}
.room-object{position:absolute;z-index:3;border:0;background:transparent;color:#171717;text-align:center;filter:drop-shadow(5px 8px 4px rgba(0,0,0,.25));transition:transform .15s,filter .15s}.room-object:hover{transform:translateY(-4px) scale(1.03);filter:drop-shadow(7px 11px 5px rgba(0,0,0,.3))}.room-object:focus-visible{outline:2px dashed #111;outline-offset:5px}.room-object span{display:block}.room-object small,.crt-computer small,.console-object small{display:inline-block;margin-top:4px;padding:3px 7px;background:#15171b;color:#fff;font:10px monospace;letter-spacing:1px}
.poster-object{left:22%;top:13%;width:132px;height:175px;background:#20242c!important;color:#ecedf0!important;border:8px solid #ddd1ba!important;box-shadow:0 0 0 2px #262626}.poster-object span{font-size:65px;margin-top:30px}.camera-object{right:18%;top:19%;font-size:42px}.cd-object{right:8%;bottom:19%;font-size:48px}
.window-object{left:4%;top:35%;width:145px}.window-sky{position:relative;width:145px;height:105px;overflow:hidden;background:linear-gradient(#53718e 0 55%,#222b33 55%);border:10px solid #4e382a;box-shadow:inset 0 0 0 3px #251c16}.window-sky:before,.window-sky:after{content:"";position:absolute;background:#4e382a;z-index:2}.window-sky:before{left:50%;top:0;width:8px;height:100%;transform:translateX(-50%)}.window-sky:after{left:0;top:50%;width:100%;height:8px;transform:translateY(-50%)}.window-sky i{position:absolute;right:18px;top:14px;width:16px;height:16px;border-radius:50%;background:#d8d5b6;box-shadow:0 0 12px #fff}
.tv-object{right:28%;bottom:14%;width:155px}.tv-screen{display:grid!important;place-items:center;width:155px;height:105px;color:#b8c9c1;background:repeating-linear-gradient(0deg,#1b2522 0 2px,#111916 2px 4px);border:12px solid #463a31;border-radius:12px;font:10px monospace;letter-spacing:1px;box-shadow:inset 0 0 20px #000}.tv-object:after{content:"";display:block;width:90px;height:10px;margin:auto;background:#463a31}
.door-object{right:2%;top:8%;width:105px;height:285px;background:linear-gradient(90deg,#5e3927,#89583c 55%,#4a2c20)!important;border:8px solid #342018!important}.door-knob{width:8px;height:8px;margin:132px 0 0 74px;border-radius:50%;background:#c39a58;box-shadow:0 0 0 3px #51351d}.door-object small{margin-top:105px}
.desk-unit{position:absolute;z-index:4;left:38%;bottom:9%;width:320px;height:190px;background:#5e4635;border-top:10px solid #39281e;box-shadow:inset 0 -18px #3c2b21,12px 16px 10px rgba(0,0,0,.3)}.desk-unit:before,.desk-unit:after{content:"";position:absolute;top:100%;width:24px;height:125px;background:#3d2b22}.desk-unit:before{left:20px}.desk-unit:after{right:20px}
.crt-computer{position:absolute;left:42px;bottom:95px;width:160px;border:0;background:transparent}.crt-screen{display:flex;flex-direction:column;justify-content:center;width:150px;height:108px;padding:12px;color:#cfe7d2;background:radial-gradient(circle,#33473e,#101916 70%);border:13px solid #b5ae9c;border-radius:8px;box-shadow:inset 0 0 18px #000,5px 6px 0 rgba(0,0,0,.25);font:11px monospace}.crt-screen i{margin-top:10px;color:#7ae483;font-style:normal;animation:crtBlink 1.2s steps(1) infinite}.crt-base{display:block;width:90px;height:22px;margin:auto;background:#aaa391;clip-path:polygon(25% 0,75% 0,100% 100%,0 100%)}.console-object{position:absolute;right:25px;bottom:105px;border:0;background:transparent;font-size:35px}.console-object span{display:block}
@keyframes crtBlink{50%{opacity:.25}}
.bed-unit{position:absolute;z-index:3;left:5%;bottom:4%;width:260px;height:105px;background:#252b36;border:12px solid #3c2e27;transform:skewY(-3deg);box-shadow:10px 15px 8px rgba(0,0,0,.3)}.pillow{position:absolute;left:18px;top:10px;width:78px;height:42px;background:#d8d1c2;border-radius:45%}.blanket{position:absolute;right:0;bottom:0;width:145px;height:78px;padding:26px 22px;color:#d5dae1;background:#20365d;font-weight:900;letter-spacing:4px}.floor-shadow{position:absolute;z-index:2;left:31%;bottom:1%;width:430px;height:70px;background:rgba(0,0,0,.23);border-radius:50%;filter:blur(8px)}
.room-window{position:absolute;z-index:30;top:50%;left:50%;width:min(850px,74vw);min-height:470px;transform:translate(-50%,-50%);background:#c7c7c7;border:3px outset #eee;box-shadow:14px 16px 0 rgba(0,0,0,.34)}.room-window-small{width:min(500px,64vw);min-height:310px}.room-window-bar{height:34px;display:flex;align-items:center;justify-content:space-between;padding:3px 4px 3px 9px;color:#d8dde5;background:#4e5561;font-weight:700;font-size:13px;user-select:none;cursor:move}.active-room-window .room-window-bar{color:#fff;background:linear-gradient(90deg,#17295c,#526998)}.window-controls{display:flex;gap:3px}.room-window-bar button{width:26px;height:24px;background:#c7c7c7;border:2px outset #fff;font-weight:900;cursor:pointer}.room-window-bar button:active{border-style:inset}.room-window-body{min-height:392px}.room-window-small .room-window-body{min-height:270px}.room-window-status{display:flex;justify-content:space-between;padding:6px 9px;border-top:2px inset #fff;background:#c7c7c7;font:11px monospace}
.computer-home{display:grid;grid-template-columns:190px 1fr;background:#e5e2dc}.computer-sidebar{padding:18px;background:#28303b;color:#fff}.mini-user{display:flex;flex-direction:column;align-items:center;padding-bottom:18px;border-bottom:1px solid #657080}.mini-user>span{display:grid;place-items:center;width:68px;height:68px;margin-bottom:10px;background:#dad4c7;color:#24304a;border:4px solid #fff;font-size:32px;font-weight:900}.mini-user small{color:#aeb9c4}.computer-sidebar button{width:100%;margin-top:12px;padding:9px;text-align:left;color:#fff;background:#3a4553;border:1px solid #77818c}.online-indicator{display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:#8fd37f;box-shadow:0 0 7px #8fd37f}
.computer-explorer{min-width:0}.explorer-toolbar{display:flex;gap:5px;padding:7px;background:#c7c7c7;border-bottom:2px groove #fff}.explorer-toolbar button{width:29px;height:25px;background:#c7c7c7;border:2px outset #fff}.explorer-address{flex:1;min-width:0;padding:5px 8px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;background:#fff;border:2px inset #fff;font:11px monospace}.computer-apps{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;padding:20px}.computer-apps button{min-height:118px;padding:14px;background:#d4d0c8;border:3px outset #fff;text-align:left}.computer-apps button:hover{background:#e3e0d9}.computer-apps button:active{border-style:inset}.computer-apps span{display:block;font-size:31px}.computer-apps b,.computer-apps small{display:block;margin-top:6px}.computer-apps b{text-transform:uppercase;font:700 12px monospace}.computer-apps small{color:#676767;font:10px monospace}
.placeholder-module{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px;text-align:center;background:#dedbd4}.placeholder-module>span{font-size:60px}.placeholder-module h2{margin:12px 0 8px;font:900 24px monospace;letter-spacing:2px}.placeholder-module p{max-width:340px;line-height:1.5}.placeholder-module small{color:#5c5c5c;font-family:monospace}.module-progress{width:240px;height:18px;margin:22px 0 10px;padding:2px;border:2px inset #fff;background:#fff}.module-progress i{display:block;width:35%;height:100%;background:repeating-linear-gradient(90deg,#223d73 0 12px,#7286ae 12px 15px)}
.room-window-maximized{position:fixed;inset:50px 12px 58px;width:auto!important;min-height:0;transform:none!important}.room-window-maximized .room-window-body{height:calc(100% - 62px)}
.room-taskbar{position:absolute;z-index:450;left:0;right:0;bottom:0;height:46px;display:flex;align-items:center;gap:7px;padding:5px;background:#bfbfbf;border-top:3px outset #fff}.room-start,.room-running button{height:34px;padding:0 12px;background:#c7c7c7;border:2px outset #fff;font-weight:700}.room-start:active,.room-running button.active{border-style:inset;background:#aaa}.room-running{display:flex;gap:5px;flex:1;min-width:0;overflow:hidden}.room-running button{min-width:145px;max-width:210px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-tray{display:flex;align-items:center;gap:12px;height:34px;padding:0 10px;border:2px inset #fff;font:11px monospace}.room-tray span:first-child{color:#286532}
.room-start-menu{position:absolute;z-index:600;left:5px;bottom:46px;width:270px;padding:7px;background:#c7c7c7;border:3px outset #fff;box-shadow:8px 8px rgba(0,0,0,.25)}.room-start-menu strong{display:flex;justify-content:space-between;padding:13px;color:#fff;background:#1d2f5d;letter-spacing:2px}.room-start-menu strong small{color:#b8c5dc;letter-spacing:0}.room-start-menu button,.room-start-menu a{display:block;width:100%;padding:12px;border:0;background:transparent;color:#111;text-align:left;text-decoration:none}.room-start-menu button:hover,.room-start-menu a:hover{background:#152b63;color:#fff}
@media(max-width:900px){.tv-object{display:none}.computer-apps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.room-session span{display:none}.room-scene{overflow:auto}.poster-object{left:8%;transform:scale(.8)}.window-object{display:none}.door-object{right:-25px}.desk-unit{left:32%;transform:scale(.82);transform-origin:bottom}.bed-unit{left:-45px;transform:scale(.75)}.room-window,.room-window-small{width:94vw;min-height:420px}.computer-home{grid-template-columns:1fr}.computer-sidebar{display:none}.computer-apps{padding:12px}.room-tray span:first-child{display:none}.room-running button{min-width:110px}.room-brand small{display:none}}

/* =====================================================
   NINETYNINE v0.3.0 · FEED.EXE · ETAPA 1
===================================================== */
.room-window-feed{width:min(980px,86vw);min-height:560px}
.room-window-feed .room-window-body{min-height:478px}
.feed-module{display:grid;grid-template-columns:320px minmax(0,1fr);background:#d4d0c8}
.feed-compose-panel{padding:18px;background:linear-gradient(180deg,#283545,#202a36);color:#fff;border-right:2px inset #fff}
.feed-module-title{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #657080}.feed-module-title>span{font-size:34px}.feed-module-title strong,.feed-module-title small{display:block}.feed-module-title strong{font:900 15px monospace;letter-spacing:1px}.feed-module-title small{margin-top:4px;color:#aeb9c4;font-size:11px}
.feed-form label{display:block;margin-bottom:7px;font-weight:700;font-size:12px}.feed-form textarea{width:100%;min-height:160px;resize:vertical;padding:11px;color:#111;background:#fff;border:3px inset #fff;outline:none;font:13px/1.45 Tahoma,Verdana,sans-serif}.feed-form textarea:focus{box-shadow:0 0 0 2px #86a8ff}.feed-form-meta{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.feed-form-meta span{color:#abb6c1;font:11px monospace}.feed-form-meta button,.feed-stream-panel>header button{padding:8px 12px;background:#c7c7c7;border:2px outset #fff;font-weight:800;cursor:pointer}.feed-form-meta button:active,.feed-stream-panel>header button:active{border-style:inset}.feed-form-meta button:disabled{cursor:wait;opacity:.65}.feed-message{display:none;margin-top:12px;padding:9px;background:#fff;color:#111;border:2px inset #fff;font-size:12px}.feed-message.show{display:block}.feed-message.success{background:#dfffe8;color:#174f29}.feed-message.error{background:#ffe0e0;color:#7a1515}
.feed-stream-panel{min-width:0;display:flex;flex-direction:column;background:#e6e2db}.feed-stream-panel>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:#c7c7c7;border-bottom:2px groove #fff}.feed-stream-panel>header strong,.feed-stream-panel>header small{display:block}.feed-stream-panel>header strong{font:900 13px monospace}.feed-stream-panel>header small{margin-top:2px;color:#555;font-size:10px}.feed-stream{height:405px;overflow-y:auto;padding:14px;background-image:linear-gradient(rgba(0,0,0,.025) 1px,transparent 1px);background-size:100% 24px}.feed-stream[aria-busy=true]{cursor:wait;opacity:.7}
.feed-post{position:relative;margin-bottom:15px;background:#f8f8f3;border:2px outset #fff;box-shadow:4px 4px 0 rgba(0,0,0,.16);transition:transform .12s ease,box-shadow .12s ease}.feed-post:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 rgba(0,0,0,.18)}.feed-post.is-own-post{border-left:5px solid #2f4e84}.feed-post-topline{display:flex;justify-content:space-between;padding:5px 9px;background:#dedbd3;border-bottom:1px solid #aaa;color:#565656;font:8px monospace;letter-spacing:.4px}.feed-signal{color:#1f6c36}.feed-post-header{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 12px 9px}.feed-avatar{display:grid;place-items:center;width:40px;height:40px;background:linear-gradient(135deg,#314d81,#1d2943);color:#fff;border:2px outset #9da8ba;text-shadow:1px 1px #000;font:900 18px monospace}.feed-author{min-width:0}.feed-author-name{display:flex;align-items:center;gap:7px}.feed-author strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.feed-author>span{display:block;margin-top:3px;color:#666;font:10px monospace}.feed-own-badge{padding:2px 5px;background:#314d81;color:#fff;font:8px monospace}.feed-post-header time{align-self:start;color:#777;font:9px monospace;white-space:nowrap}.feed-post-content{margin:0 12px;padding:13px 12px;background:#fff;border:1px solid #d2d2cc;box-shadow:inset 1px 1px #eee}.feed-post-content p{margin:0;white-space:normal;overflow-wrap:anywhere;color:#151515;font-size:13px;line-height:1.55}.feed-post-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 11px;color:#686868;font:8px monospace}.feed-post-actions>div{display:flex;gap:6px}.feed-action-button,.feed-delete-button{padding:4px 7px;background:#d4d0c8;border:2px outset #fff;color:#333;cursor:pointer;font:8px monospace}.feed-action-button:active,.feed-delete-button:active{border-style:inset}.feed-action-button{opacity:.7}.feed-delete-button{color:#7a1515}.feed-delete-button:disabled{cursor:wait;opacity:.6}.feed-empty{display:flex;min-height:250px;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center;color:#555;border:2px dashed #aaa;background:rgba(255,255,255,.35)}.feed-empty-icon{font-size:45px}.feed-empty strong{margin-top:8px;color:#222;font:900 15px monospace}.feed-empty p{max-width:300px;font-size:12px;line-height:1.5}
@media(max-width:760px){.room-window-feed{width:94vw}.feed-module{grid-template-columns:1fr}.feed-compose-panel{padding:12px}.feed-form textarea{min-height:100px}.feed-stream{height:270px}.feed-stream-panel>header{padding:9px}.room-window-feed .room-window-body{overflow:auto}}


/* NINETYNINE v0.3.0 · Window Manager */
.room-window-opening{animation:n99WindowOpen .22s steps(4,end)}
@keyframes n99WindowOpen{
  0%{opacity:0;filter:contrast(1.8);transform:translate(-50%,-50%) scale(.96)}
  55%{opacity:1;filter:contrast(1.2);transform:translate(-50%,-50%) scale(1.01)}
  100%{opacity:1;filter:none;transform:translate(-50%,-50%) scale(1)}
}
.room-window-maximized.room-window-opening{animation:n99WindowOpenMax .22s steps(4,end)}
@keyframes n99WindowOpenMax{0%{opacity:0}100%{opacity:1}}
@media (prefers-reduced-motion:reduce){.room-window-opening{animation:none}}
