/* PAAL COMMUNITY PORTAL — visual layer aligned with the main website. */

body.portal-page{
    overflow:auto;
    min-height:100svh;
    color:#b8c8d4;
    background:#02070d;
}

body.portal-page::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
    opacity:1;
    background:
        linear-gradient(90deg,rgba(0,0,0,.66),rgba(0,0,0,.22) 42%,rgba(0,0,0,.28) 68%,rgba(0,0,0,.66)),
        linear-gradient(180deg,rgba(1,5,10,.24),rgba(1,5,10,.66)),
        url("/img/paal/paal_bg_base.png") center/cover no-repeat;
}

body.portal-page::after{
    content:"";
    position:fixed;
    inset:0;
    z-index:1;
    pointer-events:none;
    opacity:.20;
    background:url("/img/paal/paal_embers_overlay.png") center/cover no-repeat;
}

.portal-page a{
    color:#bcd7e6;
    text-decoration:none;
}
.portal-page a:hover{color:#f1f7fa}

/* =========================================================
   PORTAL HEADER — same visual family as the main website.
========================================================= */
@media(min-width:901px){
    .portal-page .site-header{
        top:28px;
        left:50%;
        right:auto;
        transform:translateX(-50%);
        width:min(1100px,calc(100vw - 64px));
        height:44px;

        grid-template-columns:126px minmax(0,1fr) auto;
        gap:8px;
        padding:0 28px 0 40px;

        border:0;
        border-radius:0;
        overflow:visible;

        background:url("/images/ui/web/paal_header_center_v2.png") center -15px / 100% 74px no-repeat;
        backdrop-filter:none;
        -webkit-backdrop-filter:none;
        box-shadow:none;
        isolation:isolate;
    }

    .portal-page .site-header::before,
    .portal-page .site-header::after{
        content:"";
        position:absolute;
        top:-15px;
        width:107px;
        height:74px;
        z-index:0;
        pointer-events:none;
        opacity:1;
        background-size:100% 100%;
        background-repeat:no-repeat;
    }

    .portal-page .site-header::before{
        left:-30px;
        background-image:url("/images/ui/web/paal_header_left_v2.png");
        -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 52%,transparent 100%);
        mask-image:linear-gradient(90deg,#000 0%,#000 52%,transparent 100%);
    }

    .portal-page .site-header::after{
        right:-30px;
        background-image:url("/images/ui/web/paal_header_right_v2.png");
        -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 52%,transparent 100%);
        mask-image:linear-gradient(270deg,#000 0%,#000 52%,transparent 100%);
    }

    .portal-page .site-header > *{
        position:relative;
        z-index:1;
        min-width:0;
    }

    .portal-page .brand{
        height:100%;
        justify-self:center;
        display:flex;
        align-items:center;
        justify-content:center;
        padding:0;
    }

    .portal-page .brand-wordmark{
        width:70px;
        max-height:30px;
        object-fit:contain;
    }

    /* No separator between PAAL and ACASĂ. */
    .portal-page .brand::after{display:none!important}

    .portal-page .top-nav{
        height:100%;
        display:flex;
        align-items:stretch;
        justify-content:center;
        background:none;
    }

    .portal-page .top-nav a{
        position:relative;
        display:flex;
        align-items:center;
        justify-content:center;
        min-width:0;
        height:100%;
        padding:0 18px;
        color:#a3b5c1;
        background:transparent;
        font-size:8px;
        font-weight:700;
        letter-spacing:.10em;
        text-transform:uppercase;
        white-space:nowrap;
        transition:color .18s ease,background .18s ease,text-shadow .18s ease;
    }

    /* very short, soft nav separators — center only */
    .portal-page .top-nav a + a::before{
        content:"";
        position:absolute;
        left:0;
        top:50%;
        width:1px;
        height:12px;
        transform:translateY(-50%);
        background:linear-gradient(
            180deg,
            transparent,
            rgba(136,182,204,.10) 30%,
            rgba(136,182,204,.20) 50%,
            rgba(136,182,204,.10) 70%,
            transparent
        );
    }

    .portal-page .top-nav a:hover{
        color:#eaf3f7;
        background:rgba(20,74,99,.07);
    }

    .portal-page .top-nav a.active,
    .portal-page .top-nav a[aria-current="page"]{
        color:#fff;
        background:linear-gradient(180deg,rgba(35,118,154,.18),rgba(3,32,47,.10));
        text-shadow:0 0 8px rgba(134,218,250,.18);
    }

    .portal-page .top-nav a.active::after,
    .portal-page .top-nav a[aria-current="page"]::after{
        content:"";
        position:absolute;
        left:24%;
        right:24%;
        bottom:5px;
        height:1px;
        background:linear-gradient(90deg,transparent,#69d9ff,transparent);
        box-shadow:0 0 5px rgba(78,205,250,.30);
    }

    .portal-page .header-actions{
        height:100%;
        display:flex;
        align-items:center;
        gap:6px;
    }

    .portal-page .header-btn,
    .portal-page .server-pill{
        height:24px;
        min-height:24px;
        max-height:24px;
        margin:0;
        border:0;
        box-shadow:none;
        background-position:center;
        background-repeat:no-repeat;
        background-size:100% 100%;
        font-size:6.7px;
        font-weight:700;
        letter-spacing:.10em;
        line-height:1;
        text-transform:uppercase;
    }

    .portal-page .header-btn{
        width:82px;
        padding:0 10px;
        color:#e1eaf0;
        background-image:url("/images/ui/web/paal_header_login_panel_v2.png");
    }

    .portal-page .server-pill{
        position:relative;
        width:108px;
        padding:0 10px 0 25px;
        color:#afc0cc;
        background-image:url("/images/ui/web/paal_header_status_panel_v2.png");
    }

    .portal-page .server-pill::before{
        content:"";
        position:absolute;
        left:14px;
        top:50%;
        transform:translateY(-50%);
        width:4px;
        height:4px;
        margin:0;
        border-radius:50%;
        background:#8297a6;
        box-shadow:none;
    }

    .portal-page .server-pill[data-state="online"]{
        color:#bcebdc;
    }
    .portal-page .server-pill[data-state="online"]::before{
        background:#76e5c8;
        box-shadow:0 0 6px rgba(118,229,200,.35);
    }
    .portal-page .server-pill[data-state="offline"]::before{background:#cc8790}
    .portal-page .server-pill[data-state="maintenance"]::before{background:#d0b476}
}

/* =========================================================
   PORTAL LAYOUT
========================================================= */
.portal-layout{
    position:relative;
    inset:auto;
    z-index:5;
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:42px;
    align-items:start;

    width:min(1280px,calc(100vw - 80px));
    max-width:none;
    min-height:0;
    height:auto;
    overflow:visible;

    margin:154px auto 64px;
    padding:0 18px;
}

.portal-menu,
.portal-surface{
    position:relative;
    min-width:0;
    border:1px solid rgba(76,135,164,.10);
    border-radius:0;
    background:
        linear-gradient(180deg,rgba(5,18,29,.82),rgba(1,8,14,.86)),
        url("/images/ui/web/paal_web_panel_fill_seamless.png") 0 0 / 420px 420px repeat;
    background-origin:border-box;
    background-clip:border-box;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.018),
        inset 0 -18px 30px rgba(0,0,0,.18),
        0 26px 64px rgba(0,0,0,.22);
}

.portal-menu::before,
.portal-surface::before{
    content:"";
    position:absolute;
    z-index:4;
    pointer-events:none;
    opacity:.92;

    border-style:solid;
    border-color:transparent;
    border-image-source:url("/images/ui/web/paal_web_center_frame.png");
    border-image-slice:92 92 92 92;
    border-image-repeat:round;
}

.portal-menu::before{
    inset:-10px;
    border-width:18px;
    border-image-width:18px;
}

.portal-surface::before{
    inset:-13px;
    border-width:24px;
    border-image-width:24px;
}

.portal-menu > *,
.portal-surface > *{
    position:relative;
    z-index:5;
}

.portal-menu{
    position:sticky;
    top:120px;
    padding:25px 18px 28px;
}

.section-kicker{
    margin:0;
    color:#65c9eb;
    font-size:8px;
    font-weight:800;
    letter-spacing:.20em;
    text-transform:uppercase;
}

.portal-menu nav{
    display:flex;
    flex-direction:column;
    gap:2px;
    margin-top:18px;
}

.portal-menu a{
    position:relative;
    display:block;
    padding:11px 12px;
    border:0;
    color:#879fac;
    font-size:11px;
    transition:background .18s ease,color .18s ease,padding .18s ease;
}

.portal-menu a + a{
    border-top:1px solid rgba(72,128,157,.07);
}

.portal-menu a:hover{
    color:#d9e8ee;
    background:rgba(18,65,88,.09);
    padding-left:15px;
}

.portal-menu a[aria-current]{
    color:#f0f7fa;
    background:linear-gradient(90deg,rgba(19,85,114,.24),rgba(7,27,40,.06));
    padding-left:17px;
}

.portal-menu a[aria-current]::before{
    content:"";
    position:absolute;
    left:0;
    top:25%;
    bottom:25%;
    width:1px;
    background:#62d3f6;
    box-shadow:0 0 6px rgba(98,211,246,.28);
}

.portal-surface{
    padding:34px 38px 38px;
    min-height:360px;
}

.portal-heading{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:20px;
    margin:0 0 28px;
    padding:0 0 25px;
    border-bottom:1px solid rgba(71,127,155,.16);
}

.portal-heading h1{
    margin:8px 0 0;
    color:#edf2f5;
    font:42px Georgia,serif;
    font-weight:400;
    letter-spacing:.015em;
    line-height:1;
}

.portal-back{
    position:relative;
    bottom:2px;
    padding:7px 0;
    color:#8ca8b8;
    font-size:10px;
    white-space:nowrap;
}

.portal-back:hover{color:#d9edf5}

.portal-card{
    padding:22px 0;
    border-bottom:1px solid rgba(63,111,137,.14);
}
.portal-card:first-child{padding-top:0}
.portal-card:last-child{border-bottom:0}

.portal-card h2{
    margin:8px 0 12px;
    color:#e3edf3;
    font:22px Georgia,serif;
}

.portal-card p,
.portal-text{
    color:#9fb3bf;
    font-size:13px;
    line-height:1.82;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
}

.portal-meta{
    color:#65a9c7;
    font-size:9px;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.portal-empty{
    padding:28px 0;
    color:#829aaa;
    font-size:13px;
    line-height:1.8;
}

/* Forms, tables and portal actions */
.portal-controls{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
    margin-bottom:22px;
}

.portal-page input,
.portal-page select,
.portal-page textarea{
    width:100%;
    padding:12px 13px;
    border:1px solid rgba(71,130,159,.28);
    border-radius:0;
    background:rgba(1,9,16,.72);
    color:#e0eaf0;
    font:13px Arial,sans-serif;
}

.portal-page input:focus,
.portal-page select:focus,
.portal-page textarea:focus{
    outline:1px solid rgba(99,201,236,.65);
    outline-offset:1px;
}

.portal-page textarea{min-height:140px;resize:vertical}

.portal-page button,
.portal-action{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:9px 16px;
    border:1px solid rgba(73,143,176,.30);
    border-radius:0;
    background:linear-gradient(180deg,rgba(12,35,50,.88),rgba(3,15,25,.92));
    color:#d9e8ef;
    font-size:10px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
    cursor:pointer;
}

.portal-page button:hover,
.portal-action:hover{
    border-color:rgba(105,205,240,.55);
    background:linear-gradient(180deg,rgba(18,52,71,.94),rgba(4,20,31,.96));
}

.portal-page button:disabled{opacity:.45;cursor:default}
.portal-page button[aria-pressed="true"]{
    border-color:rgba(104,210,245,.62);
    background:linear-gradient(180deg,rgba(18,61,83,.95),rgba(5,25,38,.98));
}

.portal-page label{
    display:block;
    margin-bottom:7px;
    color:#a8bdca;
    font-size:11px;
}

.portal-field{margin-bottom:18px}
.portal-search{flex:1;min-width:160px}
.portal-note{color:#7f9eaf;font-size:11px;line-height:1.75}

.portal-page details{
    padding:16px 0;
    border-bottom:1px solid rgba(67,117,144,.16);
}
.portal-page summary{
    color:#d5e5ee;
    font-size:14px;
    line-height:1.6;
    cursor:pointer;
}

.portal-table-wrap{overflow:auto}
.portal-table{width:100%;border-collapse:collapse;font-size:12px}
.portal-table th{
    padding:13px 10px;
    border-bottom:1px solid rgba(77,143,176,.34);
    color:#79b7d4;
    font-size:9px;
    letter-spacing:.09em;
    text-align:left;
    text-transform:uppercase;
}
.portal-table td{
    padding:13px 10px;
    border-bottom:1px solid rgba(42,78,99,.24);
    color:#c3d2db;
}

.portal-pager{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-top:20px;
    color:#809baa;
    font-size:11px;
}

.portal-ticket{
    display:block;
    margin:10px 0;
    padding:16px;
    border:1px solid rgba(67,126,156,.24);
    background:rgba(4,18,29,.64);
}

.portal-badge{
    display:inline-block;
    margin-left:8px;
    padding:4px 8px;
    border:1px solid rgba(79,145,177,.32);
    color:#9bcce2;
    font-size:9px;
}

.portal-message{
    margin:14px 0;
    padding:15px;
    border-left:1px solid #567a8d;
    background:rgba(4,17,28,.70);
}
.portal-message.staff{
    border-left-color:#7ec8e8;
    background:rgba(8,30,44,.72);
}

#portalMessage{
    padding:13px 14px;
    border:1px solid rgba(90,156,187,.28);
    background:rgba(11,31,43,.78);
    color:#b8cbd5;
    font-size:12px;
    line-height:1.6;
}

.portal-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.portal-metric{
    padding:20px;
    border:1px solid rgba(65,122,151,.22);
    background:rgba(3,16,26,.38);
    color:#7899ab;
    font-size:11px;
}
.portal-metric strong{
    display:block;
    margin-top:8px;
    color:#d9e8f0;
    font-size:28px;
    font-weight:400;
}

.portal-admin-form{
    margin-top:20px;
    padding:20px 0;
    border-top:1px solid rgba(66,121,149,.20);
}
.portal-admin-item{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin:8px 0;
    padding:14px;
    border:1px solid rgba(65,122,151,.23);
    background:rgba(3,16,26,.34);
    font-size:11px;
}

.portal-page [hidden]{display:none!important}

.portal-footer{
    position:relative;
    z-index:5;
    width:min(1244px,calc(100vw - 80px));
    max-width:none;
    margin:0 auto 34px;
    padding:0 26px;
    color:#638192;
    font-size:9px;
    line-height:2;
}

#portalTime{float:right}

.skip-link{
    position:fixed;
    left:12px;
    top:-100px;
    z-index:2000;
    padding:14px;
    background:#0c2433;
}
.skip-link:focus{top:12px}

/* =========================================================
   RESPONSIVE
========================================================= */
@media(max-width:1100px) and (min-width:901px){
    .portal-page .site-header{
        width:min(96vw,1050px);
        grid-template-columns:92px minmax(0,1fr) auto;
        gap:4px;
        padding-left:28px;
        padding-right:20px;
        top:22px;
    }
    .portal-page .brand-wordmark{width:62px}
    .portal-page .top-nav a{
        padding:0 10px;
        font-size:7.4px;
        letter-spacing:.06em;
    }
    .portal-page .header-btn{width:70px}
    .portal-page .server-pill{width:98px;padding-left:23px}
}

@media(max-width:900px){
    .portal-page .site-header{
        top:0;
        left:0;
        right:0;
        width:100%;
        height:116px;
        transform:none;
        grid-template-columns:1fr auto;
        grid-template-rows:64px 52px;
        padding:0 16px;
        border:0;
        border-bottom:1px solid rgba(86,145,177,.18);
        background:linear-gradient(180deg,#06121d,#020910);
        box-shadow:none;
    }

    .portal-page .site-header::before,
    .portal-page .site-header::after{display:none}

    .portal-page .brand{justify-self:start}
    .portal-page .brand-wordmark{width:76px}

    .portal-page .top-nav{
        grid-column:1 / -1;
        overflow-x:auto;
        justify-content:flex-start;
    }
    .portal-page .top-nav a{
        flex:0 0 auto;
        padding:0 16px;
        font-size:8px;
    }

    .portal-page .header-actions{
        justify-self:end;
    }

    .portal-page .server-pill{display:none}

    .portal-layout{
        width:100%;
        grid-template-columns:minmax(0,1fr);
        gap:24px;
        margin-top:148px;
        padding:0 22px;
    }

    .portal-menu{
        position:static;
        padding:18px;
    }

    .portal-menu::before,
    .portal-surface::before{
        display:none;
    }

    .portal-menu nav{
        flex-direction:row;
        overflow-x:auto;
        margin-top:10px;
        gap:4px;
    }
    .portal-menu nav a{
        flex:none;
        white-space:nowrap;
        border-top:0;
        border-bottom:1px solid transparent;
    }
    .portal-menu nav a[aria-current]{
        border-bottom-color:#62d3f6;
    }
    .portal-menu nav a[aria-current]::before{display:none}

    .portal-surface{
        padding:26px;
    }

    .portal-heading h1{font-size:34px}

    .portal-footer{
        width:100%;
        padding:0 22px;
    }
    #portalTime{
        float:none;
        display:block;
    }
}

@media(max-width:500px){
    .portal-layout{padding:0 14px}
    .portal-surface{padding:22px 18px}
    .portal-heading{
        align-items:flex-start;
        flex-direction:column;
        gap:12px;
    }
    .portal-heading h1{font-size:30px}
    .portal-grid{grid-template-columns:1fr}
    .portal-controls button{flex:1}
}


/* =========================================================
   COMMUNITY MENU — compact controls
========================================================= */
.portal-menu{
    padding:21px 14px 24px;
}

.portal-menu nav{
    gap:1px;
    margin-top:14px;
}

.portal-menu a{
    min-height:0;
    padding:7px 9px;
    font-size:9.5px;
    line-height:1.25;
}

.portal-menu a:hover{
    padding-left:11px;
}

.portal-menu a[aria-current]{
    padding-left:12px;
}

.portal-menu a[aria-current]::before{
    top:28%;
    bottom:28%;
}

@media(max-width:900px){
    .portal-menu nav a{
        padding:7px 10px;
        font-size:9px;
    }
}


/* =========================================================
   PORTAL HEADER — EXACT SAME PAAL SILVER MINIMAL FAMILY
   AS THE MAIN INNER PAGES
========================================================= */
@media(min-width:901px){
    .portal-page .site-header{
        top:28px !important;
        left:50% !important;
        right:auto !important;
        transform:translateX(-50%) !important;

        width:min(1100px,calc(100vw - 64px)) !important;
        height:44px !important;

        display:grid !important;
        grid-template-columns:112px minmax(0,1fr) auto !important;
        align-items:center !important;
        gap:6px !important;
        padding:0 34px 0 38px !important;

        border:0 !important;
        border-radius:0 !important;
        overflow:visible !important;

        background:url("/images/ui/web/paal_header_center_v2.png") center -15px / 100% 74px no-repeat !important;
        box-shadow:none !important;
        backdrop-filter:none !important;
        -webkit-backdrop-filter:none !important;
        isolation:isolate !important;
    }

    .portal-page .site-header::before,
    .portal-page .site-header::after{
        content:"" !important;
        display:block !important;
        position:absolute !important;
        top:-15px !important;
        width:107px !important;
        height:74px !important;
        z-index:0 !important;
        pointer-events:none !important;
        opacity:1 !important;
        background-size:100% 100% !important;
        background-repeat:no-repeat !important;
    }

    .portal-page .site-header::before{
        left:-30px !important;
        right:auto !important;
        background-image:url("/images/ui/web/paal_header_left_v2.png") !important;
        -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 52%,transparent 100%) !important;
        mask-image:linear-gradient(90deg,#000 0%,#000 52%,transparent 100%) !important;
    }

    .portal-page .site-header::after{
        right:-30px !important;
        left:auto !important;
        background-image:url("/images/ui/web/paal_header_right_v2.png") !important;
        -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 52%,transparent 100%) !important;
        mask-image:linear-gradient(270deg,#000 0%,#000 52%,transparent 100%) !important;
    }

    .portal-page .site-header > *{
        position:relative !important;
        z-index:1 !important;
        min-width:0 !important;
    }

    .portal-page .brand{
        width:100% !important;
        height:30px !important;
        justify-self:center !important;
        align-self:center !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        padding:0 10px 0 6px !important;
    }

    .portal-page .brand::after{
        display:none !important;
    }

    .portal-page .brand-wordmark{
        width:68px !important;
        max-height:28px !important;
        object-fit:contain !important;
        object-position:center !important;
    }

    .portal-page .top-nav{
        height:100% !important;
        display:flex !important;
        align-items:stretch !important;
        justify-content:center !important;
        gap:0 !important;
        padding:0 5px !important;
        background:none !important;
    }

    .portal-page .top-nav a{
        position:relative !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        flex:1 0 auto !important;
        height:100% !important;
        padding:0 13px !important;

        color:#9aadb9 !important;
        background:transparent !important;
        font-size:8px !important;
        font-weight:700 !important;
        letter-spacing:.10em !important;
        text-transform:uppercase !important;
        white-space:nowrap !important;
    }

    .portal-page .top-nav a + a::before{
        content:"" !important;
        position:absolute !important;
        left:0 !important;
        top:50% !important;
        width:1px !important;
        height:14px !important;
        transform:translateY(-50%) !important;
        background:linear-gradient(
            180deg,
            transparent,
            rgba(131,174,196,.14) 28%,
            rgba(131,174,196,.24) 50%,
            rgba(131,174,196,.14) 72%,
            transparent
        ) !important;
    }

    .portal-page .top-nav a:hover{
        color:#dfeaf0 !important;
        background:rgba(19,67,91,.10) !important;
    }

    .portal-page .top-nav a.active,
    .portal-page .top-nav a[aria-current="page"]{
        color:#fff !important;
        background:linear-gradient(180deg,rgba(35,118,154,.18),rgba(3,32,47,.10)) !important;
        text-shadow:0 0 8px rgba(134,218,250,.18) !important;
    }

    .portal-page .top-nav a.active::after,
    .portal-page .top-nav a[aria-current="page"]::after{
        content:"" !important;
        position:absolute !important;
        left:24% !important;
        right:24% !important;
        bottom:4px !important;
        height:1px !important;
        background:linear-gradient(90deg,transparent,#69d9ff,transparent) !important;
        box-shadow:0 0 5px rgba(78,205,250,.30) !important;
    }

    .portal-page .header-actions{
        height:100% !important;
        display:flex !important;
        align-items:center !important;
        gap:6px !important;
    }

    .portal-page .header-btn,
    .portal-page .server-pill{
        position:relative !important;
        height:24px !important;
        min-height:24px !important;
        max-height:24px !important;
        margin:0 !important;
        padding:0 10px !important;
        border:0 !important;
        box-shadow:none !important;
        background-position:center !important;
        background-repeat:no-repeat !important;
        background-size:100% 100% !important;
        font-size:6.7px !important;
        font-weight:700 !important;
        letter-spacing:.11em !important;
        line-height:1 !important;
        text-transform:uppercase !important;
    }

    .portal-page .header-btn{
        width:82px !important;
        color:#e1eaf0 !important;
        background-image:url("/images/ui/web/paal_header_login_panel_v2.png") !important;
    }

    .portal-page .server-pill{
        width:108px !important;
        padding-left:25px !important;
        color:#afc0cc !important;
        background-image:url("/images/ui/web/paal_header_status_panel_v2.png") !important;
    }

    .portal-page .server-pill::before{
        content:"" !important;
        position:absolute !important;
        left:14px !important;
        top:50% !important;
        transform:translateY(-50%) !important;
        width:4px !important;
        height:4px !important;
        border-radius:50% !important;
        background:#8297a6 !important;
        box-shadow:none !important;
    }

    .portal-page .server-pill[data-state="online"]::before{
        background:#76e5c8 !important;
        box-shadow:0 0 6px rgba(118,229,200,.35) !important;
    }
    .portal-page .server-pill[data-state="offline"]::before{background:#cc8790 !important}
    .portal-page .server-pill[data-state="maintenance"]::before{background:#d0b476 !important}
}

@media(min-width:901px) and (max-width:1100px){
    .portal-page .site-header{
        grid-template-columns:86px minmax(0,1fr) auto !important;
        padding-left:30px !important;
        padding-right:22px !important;
        top:22px !important;
    }
    .portal-page .brand-wordmark{width:60px !important}
    .portal-page .top-nav a{
        padding:0 7px !important;
        font-size:7px !important;
        letter-spacing:.055em !important;
    }
    .portal-page .header-btn{width:68px !important}
    .portal-page .server-pill{
        width:98px !important;
        padding-left:23px !important;
    }
}

/* =========================================================
   PAAL BUTTON SYSTEM — same depth and logic everywhere
========================================================= */
.portal-page button,
.portal-action{
    position:relative;
    isolation:isolate;
    min-height:36px;
    padding:9px 16px;

    border:1px solid rgba(85,157,190,.36) !important;
    border-radius:0 !important;

    background:
        linear-gradient(180deg,rgba(16,43,60,.96),rgba(3,16,26,.98)) !important;

    color:#e8f0f4 !important;
    text-decoration:none !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.075),
        inset 0 -2px 0 rgba(0,0,0,.28),
        inset 0 0 0 1px rgba(34,92,119,.10),
        0 4px 10px rgba(0,0,0,.36) !important;

    text-shadow:0 1px 0 rgba(0,0,0,.45);
    transition:
        transform .14s ease,
        border-color .16s ease,
        background .16s ease,
        box-shadow .16s ease !important;
}

.portal-page button::before,
.portal-action::before{
    content:"";
    position:absolute;
    z-index:-1;
    left:7px;
    right:7px;
    top:3px;
    height:1px;
    pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(180,226,244,.16),transparent);
}

.portal-page button:hover,
.portal-action:hover{
    transform:translateY(-1px);
    border-color:rgba(103,207,241,.58) !important;
    background:
        linear-gradient(180deg,rgba(23,59,80,.98),rgba(4,21,33,.99)) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10),
        inset 0 -2px 0 rgba(0,0,0,.30),
        0 6px 14px rgba(0,0,0,.42),
        0 0 9px rgba(66,190,235,.08) !important;
}

.portal-page button:active,
.portal-action:active{
    transform:translateY(1px);
    box-shadow:
        inset 0 2px 5px rgba(0,0,0,.45),
        inset 0 0 0 1px rgba(76,157,193,.12),
        0 2px 4px rgba(0,0,0,.28) !important;
}

.portal-page button:disabled{
    opacity:.45;
    transform:none;
    cursor:default;
}

/* Tabs remain compact, but now still have visible depth. */
.portal-controls button{
    min-height:32px;
    padding:7px 13px;
}

.portal-page button[aria-pressed="true"]{
    border-color:rgba(104,210,245,.66) !important;
    background:
        linear-gradient(180deg,rgba(24,68,91,.98),rgba(5,26,40,.99)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.09),
        inset 0 -2px 0 rgba(0,0,0,.32),
        0 4px 11px rgba(0,0,0,.35),
        0 0 10px rgba(69,196,236,.09) !important;
}

/* Portal menu remains navigation, not big buttons. */
.portal-menu nav a{
    box-shadow:none !important;
    text-shadow:none !important;
}


/* =========================================================
   PORTAL V4 — SAME HEADER + FRAMES + DEPTH AS MAIN SITE
========================================================= */

/* SAME HEADER GEOMETRY / STYLE AS INNER PAGES */
@media(min-width:901px){
    .portal-page .site-header{
        top:28px !important;
        left:50% !important;
        right:auto !important;
        transform:translateX(-50%) !important;

        width:min(1100px,calc(100vw - 64px)) !important;
        height:44px !important;

        display:grid !important;
        grid-template-columns:112px minmax(0,1fr) auto !important;
        align-items:center !important;
        gap:6px !important;

        padding:0 34px 0 38px !important;
        overflow:visible !important;

        border:0 !important;
        border-radius:0 !important;

        background:
            url("/images/ui/web/paal_header_center_v2.png")
            center -15px / 100% 74px no-repeat !important;

        box-shadow:none !important;
        backdrop-filter:none !important;
        -webkit-backdrop-filter:none !important;
        isolation:isolate !important;
    }

    .portal-page .site-header::before,
    .portal-page .site-header::after{
        content:"" !important;
        display:block !important;
        position:absolute !important;
        top:-15px !important;
        width:107px !important;
        height:74px !important;
        z-index:0 !important;
        pointer-events:none !important;
        opacity:1 !important;
        background-size:100% 100% !important;
        background-repeat:no-repeat !important;
    }

    .portal-page .site-header::before{
        left:-30px !important;
        background-image:url("/images/ui/web/paal_header_left_v2.png") !important;
        -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 52%,transparent 100%) !important;
        mask-image:linear-gradient(90deg,#000 0%,#000 52%,transparent 100%) !important;
    }

    .portal-page .site-header::after{
        right:-30px !important;
        background-image:url("/images/ui/web/paal_header_right_v2.png") !important;
        -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 52%,transparent 100%) !important;
        mask-image:linear-gradient(270deg,#000 0%,#000 52%,transparent 100%) !important;
    }

    .portal-page .site-header > *{
        position:relative !important;
        z-index:2 !important;
        min-width:0 !important;
    }

    .portal-page .brand{
        width:100% !important;
        height:30px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        padding:0 !important;
    }

    .portal-page .brand::after{
        display:none !important;
    }

    .portal-page .brand-wordmark{
        width:68px !important;
        max-height:28px !important;
        object-fit:contain !important;
    }

    .portal-page .top-nav{
        height:100% !important;
        display:flex !important;
        align-items:stretch !important;
        justify-content:center !important;
        gap:0 !important;
        padding:0 5px !important;
        background:transparent !important;
    }

    .portal-page .top-nav a{
        position:relative !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        height:100% !important;
        padding:0 13px !important;

        color:#9aadb9 !important;
        background:transparent !important;

        font-size:8px !important;
        font-weight:700 !important;
        letter-spacing:.10em !important;
        text-transform:uppercase !important;
        white-space:nowrap !important;
    }

    .portal-page .top-nav a + a::before{
        content:"" !important;
        position:absolute !important;
        left:0 !important;
        top:50% !important;
        width:1px !important;
        height:14px !important;
        transform:translateY(-50%) !important;
        background:linear-gradient(
            180deg,
            transparent,
            rgba(131,174,196,.12) 28%,
            rgba(131,174,196,.22) 50%,
            rgba(131,174,196,.12) 72%,
            transparent
        ) !important;
    }

    .portal-page .top-nav a:hover{
        color:#dfeaf0 !important;
        background:rgba(19,67,91,.08) !important;
    }

    .portal-page .top-nav a.active,
    .portal-page .top-nav a[aria-current="page"]{
        color:#fff !important;
        background:
            linear-gradient(180deg,rgba(35,118,154,.18),rgba(3,32,47,.10)) !important;
        text-shadow:0 0 8px rgba(134,218,250,.18) !important;
    }

    .portal-page .top-nav a.active::after,
    .portal-page .top-nav a[aria-current="page"]::after{
        content:"" !important;
        position:absolute !important;
        left:24% !important;
        right:24% !important;
        bottom:4px !important;
        height:1px !important;
        background:linear-gradient(90deg,transparent,#69d9ff,transparent) !important;
        box-shadow:0 0 5px rgba(78,205,250,.30) !important;
    }

    .portal-page .header-actions{
        height:100% !important;
        display:flex !important;
        align-items:center !important;
        gap:6px !important;
    }

    .portal-page .header-btn,
    .portal-page .server-pill{
        position:relative !important;
        height:24px !important;
        min-height:24px !important;
        max-height:24px !important;
        margin:0 !important;
        border:0 !important;
        box-shadow:none !important;
        background-position:center !important;
        background-repeat:no-repeat !important;
        background-size:100% 100% !important;
        font-size:6.7px !important;
        font-weight:700 !important;
        letter-spacing:.11em !important;
        line-height:1 !important;
        text-transform:uppercase !important;
    }

    .portal-page .header-btn{
        width:82px !important;
        padding:0 10px !important;
        color:#e1eaf0 !important;
        background-image:url("/images/ui/web/paal_header_login_panel_v2.png") !important;
    }

    .portal-page .server-pill{
        width:108px !important;
        padding:0 10px 0 25px !important;
        color:#afc0cc !important;
        background-image:url("/images/ui/web/paal_header_status_panel_v2.png") !important;
    }

    .portal-page .server-pill::before{
        content:"" !important;
        position:absolute !important;
        left:14px !important;
        top:50% !important;
        transform:translateY(-50%) !important;
        width:4px !important;
        height:4px !important;
        border-radius:50% !important;
        background:#8297a6 !important;
        box-shadow:none !important;
    }

    .portal-page .server-pill[data-state="online"]::before{
        background:#76e5c8 !important;
        box-shadow:0 0 6px rgba(118,229,200,.35) !important;
    }
}

/* PORTAL BACKGROUND MATCHES MAIN WEBSITE MORE CLOSELY */
body.portal-page::before{
    background:
        linear-gradient(90deg,rgba(0,0,0,.54),rgba(0,0,0,.18) 42%,rgba(0,0,0,.20) 68%,rgba(0,0,0,.56)),
        linear-gradient(180deg,rgba(1,5,10,.14),rgba(1,5,10,.56)),
        url("/img/paal/paal_bg_base.png") center / cover no-repeat !important;
}

/* =========================================================
   PAAL FRAMES ON PORTAL
========================================================= */
.portal-menu,
.portal-surface{
    position:relative !important;
    border:1px solid rgba(71,132,161,.10) !important;
    background:
        linear-gradient(180deg,rgba(5,18,29,.80),rgba(1,8,14,.84)),
        url("/images/ui/web/paal_web_panel_fill_seamless.png")
        0 0 / 420px 420px repeat !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.018),
        inset 0 -18px 30px rgba(0,0,0,.18),
        0 26px 64px rgba(0,0,0,.20) !important;

    overflow:visible !important;
}

.portal-menu::before,
.portal-surface::before{
    content:"" !important;
    position:absolute !important;
    z-index:4 !important;
    pointer-events:none !important;

    border-style:solid !important;
    border-color:transparent !important;
    border-image-source:url("/images/ui/web/paal_web_center_frame.png") !important;
    border-image-slice:92 92 92 92 !important;
    border-image-repeat:round !important;

    opacity:.92 !important;
}

.portal-menu::before{
    inset:-10px !important;
    border-width:18px !important;
    border-image-width:18px !important;
}

.portal-surface::before{
    inset:-13px !important;
    border-width:24px !important;
    border-image-width:24px !important;
}

.portal-menu > *,
.portal-surface > *{
    position:relative !important;
    z-index:5 !important;
}

/* Portal layout slightly tighter and more centered */
.portal-layout{
    width:min(1260px,calc(100vw - 110px)) !important;
    grid-template-columns:230px minmax(0,1fr) !important;
    gap:34px !important;
    margin-top:156px !important;
}

/* Left portal navigation gets actual button depth */
.portal-menu{
    padding:22px 16px 25px !important;
}

.portal-menu nav{
    gap:5px !important;
    margin-top:14px !important;
}

.portal-menu nav a{
    position:relative !important;
    min-height:32px !important;
    display:flex !important;
    align-items:center !important;

    padding:0 11px !important;
    border:1px solid rgba(72,132,161,.12) !important;

    background:
        linear-gradient(180deg,rgba(10,29,42,.38),rgba(3,15,24,.46)) !important;

    color:#95abb8 !important;
    font-size:9px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.016),
        inset 0 -1px 0 rgba(0,0,0,.20),
        0 2px 5px rgba(0,0,0,.07) !important;
}

.portal-menu nav a:hover{
    padding-left:12px !important;
    color:#e0edf2 !important;
    border-color:rgba(84,178,217,.24) !important;
    background:
        linear-gradient(180deg,rgba(14,40,57,.50),rgba(4,19,30,.57)) !important;
}

.portal-menu nav a[aria-current]{
    padding-left:12px !important;
    color:#f3f8fa !important;
    border-color:rgba(84,190,230,.30) !important;
    background:
        linear-gradient(180deg,rgba(18,55,75,.58),rgba(5,23,35,.62)) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.028),
        inset 0 -1px 0 rgba(0,0,0,.22),
        0 3px 7px rgba(0,0,0,.09) !important;
}

.portal-menu nav a[aria-current]::before{
    left:7px !important;
    top:24% !important;
    bottom:24% !important;
    width:1px !important;
    background:#62d3f6 !important;
    box-shadow:0 0 5px rgba(98,211,246,.22) !important;
}

/* Main portal content gets same depth language */
.portal-surface{
    padding:34px 38px 38px !important;
}

.portal-heading{
    border-bottom:1px solid rgba(71,127,155,.15) !important;
}

.portal-card,
.portal-ticket,
.portal-admin-item,
.portal-metric{
    background:
        linear-gradient(180deg,rgba(7,23,35,.34),rgba(2,14,22,.40)) !important;

    border-color:rgba(68,125,154,.16) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.012),
        inset 0 -1px 0 rgba(0,0,0,.18) !important;
}

/* Unified buttons on portal: subtle, like main site */
.portal-page button,
.portal-action{
    border:1px solid rgba(92,154,184,.28) !important;
    background:
        linear-gradient(180deg,rgba(13,34,48,.54),rgba(3,16,25,.66)) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.045),
        inset 0 -1px 0 rgba(0,0,0,.30),
        0 2px 5px rgba(0,0,0,.16) !important;

    color:#dfe9ee !important;
}

.portal-page button:hover,
.portal-action:hover{
    border-color:rgba(71,190,231,.44) !important;
    background:
        linear-gradient(180deg,rgba(18,46,64,.62),rgba(5,21,32,.72)) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        inset 0 -1px 0 rgba(0,0,0,.32),
        0 3px 7px rgba(0,0,0,.20) !important;
}

/* Mobile: frames off to avoid clipping */
@media(max-width:900px){
    .portal-menu::before,
    .portal-surface::before{
        display:none !important;
    }

    .portal-layout{
        width:100% !important;
        grid-template-columns:1fr !important;
        gap:24px !important;
        margin-top:148px !important;
        padding:0 22px !important;
    }
}


/* =========================================================
   PORTAL V5 — EXACT INDEX HEADER
   Same geometry, nav sizing, separators and controls.
========================================================= */
@media(min-width:901px){

    .portal-page .site-header{
        position:fixed !important;
        top:28px !important;
        left:50% !important;
        right:auto !important;
        transform:translateX(-50%) !important;

        width:min(1100px,calc(100vw - 64px)) !important;
        height:44px !important;

        display:grid !important;
        grid-template-columns:112px minmax(0,1fr) auto !important;
        align-items:center !important;
        gap:6px !important;

        padding:0 34px 0 38px !important;

        border:0 !important;
        border-radius:0 !important;
        overflow:visible !important;

        background:
            url("/images/ui/web/paal_header_center_v2.png")
            center -15px / 100% 74px no-repeat !important;

        backdrop-filter:none !important;
        -webkit-backdrop-filter:none !important;
        box-shadow:none !important;
        isolation:isolate !important;
    }

    .portal-page .site-header::before,
    .portal-page .site-header::after{
        content:"" !important;
        display:block !important;
        position:absolute !important;
        top:-15px !important;
        bottom:auto !important;

        width:107px !important;
        height:74px !important;

        z-index:0 !important;
        pointer-events:none !important;
        opacity:1 !important;

        background-size:100% 100% !important;
        background-repeat:no-repeat !important;
    }

    .portal-page .site-header::before{
        left:-30px !important;
        right:auto !important;

        background-image:url("/images/ui/web/paal_header_left_v2.png") !important;

        -webkit-mask-image:
            linear-gradient(90deg,#000 0%,#000 52%,transparent 100%) !important;
        mask-image:
            linear-gradient(90deg,#000 0%,#000 52%,transparent 100%) !important;
    }

    .portal-page .site-header::after{
        left:auto !important;
        right:-30px !important;

        background-image:url("/images/ui/web/paal_header_right_v2.png") !important;

        -webkit-mask-image:
            linear-gradient(270deg,#000 0%,#000 52%,transparent 100%) !important;
        mask-image:
            linear-gradient(270deg,#000 0%,#000 52%,transparent 100%) !important;
    }

    .portal-page .site-header > *{
        position:relative !important;
        z-index:2 !important;
        min-width:0 !important;
    }

    /* PAAL logo zone — no vertical separator before ACASĂ */
    .portal-page .brand{
        width:100% !important;
        height:30px !important;

        justify-self:center !important;
        align-self:center !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        padding:0 10px 0 6px !important;
    }

    .portal-page .brand::after{
        display:none !important;
        content:none !important;
    }

    .portal-page .brand-wordmark{
        width:68px !important;
        max-height:28px !important;
        object-fit:contain !important;
        object-position:center !important;
    }

    /* Exact compact navigation from index */
    .portal-page .top-nav{
        height:100% !important;
        min-width:0 !important;

        display:flex !important;
        align-items:stretch !important;
        justify-content:center !important;

        gap:0 !important;
        padding:0 5px !important;
        background:transparent !important;
    }

    .portal-page .top-nav a{
        position:relative !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        flex:0 1 auto !important;
        min-width:112px !important;
        height:100% !important;

        padding:0 13px !important;

        border:0 !important;

        color:#9aadb9 !important;
        background:transparent !important;

        font-size:7.5px !important;
        font-weight:700 !important;
        letter-spacing:.13em !important;
        text-transform:uppercase !important;
        white-space:nowrap !important;

        transition:
            color .18s ease,
            background .18s ease,
            text-shadow .18s ease !important;
    }

    /* Same short subtle separator as index.
       It exists only in the middle, not top-to-bottom. */
    .portal-page .top-nav a + a{
        border-left:0 !important;
    }

    .portal-page .top-nav a + a::before{
        content:"" !important;
        display:block !important;

        position:absolute !important;
        left:0 !important;
        top:50% !important;

        width:1px !important;
        height:14px !important;

        transform:translateY(-50%) !important;

        background:
            linear-gradient(
                180deg,
                transparent,
                rgba(131,174,196,.14) 28%,
                rgba(131,174,196,.24) 50%,
                rgba(131,174,196,.14) 72%,
                transparent
            ) !important;

        box-shadow:none !important;
    }

    .portal-page .top-nav a:hover{
        color:#dfeaf0 !important;
        background:rgba(19,67,91,.10) !important;
    }

    .portal-page .top-nav a.active,
    .portal-page .top-nav a[aria-current="page"]{
        color:#fff !important;

        background:
            linear-gradient(
                180deg,
                rgba(35,118,154,.18),
                rgba(3,32,47,.10)
            ) !important;

        text-shadow:
            0 0 8px rgba(134,218,250,.18) !important;
    }

    .portal-page .top-nav a.active::after,
    .portal-page .top-nav a[aria-current="page"]::after{
        content:"" !important;
        display:block !important;

        position:absolute !important;
        left:24% !important;
        right:24% !important;
        bottom:4px !important;

        width:auto !important;
        height:1px !important;

        background:
            linear-gradient(
                90deg,
                transparent,
                rgba(118,211,244,.55) 18%,
                #69d9ff 50%,
                rgba(118,211,244,.55) 82%,
                transparent
            ) !important;

        box-shadow:
            0 0 4px rgba(78,205,250,.40),
            0 0 9px rgba(78,205,250,.20) !important;
    }

    /* Same small LOGIN / STATUS controls */
    .portal-page .header-actions{
        height:100% !important;

        display:flex !important;
        align-items:center !important;

        gap:6px !important;
    }

    .portal-page .header-btn,
    .portal-page .server-pill{
        position:relative !important;

        height:24px !important;
        min-height:24px !important;
        max-height:24px !important;

        margin:0 !important;
        align-self:center !important;

        border:0 !important;
        box-shadow:none !important;

        background-position:center !important;
        background-repeat:no-repeat !important;
        background-size:100% 100% !important;

        font-size:6.7px !important;
        font-weight:700 !important;
        letter-spacing:.11em !important;
        line-height:1 !important;
        text-transform:uppercase !important;
    }

    .portal-page .header-btn{
        width:82px !important;
        padding:0 10px !important;

        color:#e1eaf0 !important;

        background-image:
            url("/images/ui/web/paal_header_login_panel_v2.png") !important;
    }

    .portal-page .server-pill{
        width:108px !important;
        padding:0 10px 0 25px !important;

        color:#afc0cc !important;

        background-image:
            url("/images/ui/web/paal_header_status_panel_v2.png") !important;
    }

    .portal-page .server-pill::before{
        content:"" !important;
        display:block !important;

        position:absolute !important;
        left:14px !important;
        top:50% !important;

        width:4px !important;
        height:4px !important;

        margin:0 !important;

        transform:translateY(-50%) !important;
        border-radius:50% !important;

        background:#8297a6 !important;
        box-shadow:none !important;
    }

    .portal-page .server-pill[data-state="online"]::before{
        background:#76e5c8 !important;
        box-shadow:0 0 6px rgba(118,229,200,.35) !important;
    }

    .portal-page .server-pill[data-state="offline"]::before{
        background:#cc8790 !important;
    }

    .portal-page .server-pill[data-state="maintenance"]::before{
        background:#d0b476 !important;
    }

    .portal-page .header-btn:hover{
        filter:brightness(1.12) !important;
    }
}

/* Same compact desktop fallback */
@media(min-width:901px) and (max-width:1100px){
    .portal-page .site-header{
        grid-template-columns:86px minmax(0,1fr) auto !important;
        padding-left:30px !important;
        padding-right:22px !important;
        top:22px !important;
    }

    .portal-page .brand-wordmark{
        width:60px !important;
    }

    .portal-page .top-nav a{
        min-width:auto !important;
        padding:0 7px !important;
        font-size:7px !important;
        letter-spacing:.055em !important;
    }

    .portal-page .header-btn{
        width:68px !important;
    }

    .portal-page .server-pill{
        width:98px !important;
        padding-left:23px !important;
    }
}

/* Portal article images / admin image editor */
.portal-article-image{
    display:block;
    width:100%;
    max-height:620px;
    object-fit:contain;
    margin:18px 0 20px;
    border:1px solid rgba(84,151,185,.22);
    background:rgba(0,7,12,.36);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 14px 34px rgba(0,0,0,.18);
}
.portal-image-field{grid-column:1 / -1}
.portal-image-preview{
    display:flex;
    align-items:flex-start;
    gap:16px;
    margin:8px 0 12px;
    padding:10px;
    border:1px solid rgba(84,151,185,.16);
    background:rgba(1,10,17,.38);
}
.portal-image-preview img{
    display:block;
    width:min(280px,50%);
    max-height:170px;
    object-fit:contain;
    border:1px solid rgba(84,151,185,.18);
}
.portal-image-preview label{
    display:flex;
    align-items:center;
    gap:7px;
    margin-top:4px;
}
.portal-image-field input[type="file"]{
    width:100%;
    padding:10px;
    border:1px solid rgba(84,151,185,.22);
    background:rgba(1,10,17,.44);
    color:#a9bdc8;
}
@media(max-width:700px){
    .portal-image-preview{flex-direction:column}
    .portal-image-preview img{width:100%}
}



/* PAAL DOWNLOAD / BETA */
.portal-download-hero{
    display:grid;
    grid-template-columns:minmax(0,1.4fr) minmax(250px,.6fr);
    gap:16px;
    margin-bottom:16px;
}
.portal-download-facts{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}
.portal-download-facts>div{
    padding:12px;
    border:1px solid rgba(66,124,151,.18);
    background:rgba(0,10,16,.34);
}
.portal-download-facts span{
    display:block;
    color:#5d8398;
    font-size:10px;
    letter-spacing:.11em;
    text-transform:uppercase;
}
.portal-download-facts strong{
    display:block;
    margin-top:5px;
    color:#dfeaf0;
}
.portal-download-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}
.portal-download-warning{margin-top:16px}
.portal-download-beta .portal-controls{margin-top:18px}
@media(max-width:850px){
    .portal-download-hero,
    .portal-download-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
    .portal-download-facts{grid-template-columns:1fr}
}


/* PAAL ABOUT */
.portal-about-intro,
.portal-about-final{
    border:1px solid rgba(68,126,153,.18);
    background:linear-gradient(145deg,rgba(4,20,30,.62),rgba(1,10,16,.58));
    padding:20px;
}
.portal-about-intro h2,
.portal-about-final h2{
    margin:8px 0;
}
.portal-about-tags{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:15px;
}
.portal-about-tags span{
    padding:6px 9px;
    border:1px solid rgba(70,159,197,.22);
    background:rgba(2,22,32,.38);
    color:#68aac8;
    font-size:9px;
    font-weight:700;
    letter-spacing:.10em;
}
.portal-about-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin-top:14px;
}
.portal-about-grid .portal-card{
    min-height:170px;
}
.portal-about-final{
    margin-top:14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}
.portal-about-final .portal-action{
    flex:0 0 auto;
}
@media(max-width:850px){
    .portal-about-grid{grid-template-columns:1fr}
    .portal-about-final{align-items:flex-start;flex-direction:column}
}


/* PAAL SYSTEMS */
.portal-systems-intro{
    padding:20px;
    border:1px solid rgba(68,126,153,.18);
    background:linear-gradient(145deg,rgba(4,20,30,.62),rgba(1,10,16,.58));
}
.portal-systems-intro h2{margin:8px 0}
.portal-systems-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin-top:14px;
}
.portal-system-card{min-height:160px}
@media(max-width:850px){
    .portal-systems-grid{grid-template-columns:1fr}
}


/* CLICKABLE SYSTEM DETAILS */
.portal-system-clickable{
    cursor:pointer;
    transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.portal-system-clickable:hover,
.portal-system-clickable:focus-visible{
    transform:translateY(-2px);
    border-color:rgba(82,187,229,.38);
    outline:none;
}
.portal-system-more{
    display:block;
    margin-top:12px;
    color:#5a98b7;
    font-size:8px;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.portal-system-modal[hidden]{display:none!important}
.portal-system-modal{
    position:fixed;inset:0;z-index:5000;
    display:flex;align-items:center;justify-content:center;padding:28px;
}
.portal-system-modal-backdrop{
    position:absolute;inset:0;background:rgba(0,5,10,.80);backdrop-filter:blur(7px);
}
.portal-system-modal-window{
    position:relative;z-index:1;
    width:min(900px,94vw);max-height:88vh;overflow:auto;
    padding:28px 30px 30px;
    border:1px solid rgba(86,156,190,.28);
    background:linear-gradient(180deg,rgba(5,20,31,.99),rgba(1,9,15,.99));
    box-shadow:0 32px 90px rgba(0,0,0,.62);
}
.portal-system-modal-close{
    position:absolute !important;inset:14px 16px auto auto !important;right:16px !important;left:auto !important;top:14px !important;margin:0 !important;transform:none !important;z-index:6;width:34px;height:34px;
    border:1px solid rgba(100,160,190,.20);background:rgba(2,13,22,.8);
    color:#88a6b7;font-size:20px;cursor:pointer;
}
.portal-system-modal-window h2{margin:9px 44px 8px 0;font-size:28px}
.portal-system-modal-points{display:flex;flex-wrap:wrap;gap:7px;margin:18px 0}
.portal-system-modal-points span{
    padding:7px 10px;border:1px solid rgba(69,150,187,.22);
    background:rgba(2,18,28,.5);color:#7db7d0;font-size:8px;
    font-weight:700;letter-spacing:.09em;text-transform:uppercase;
}
.portal-system-modal-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.portal-system-shot{
    position:relative;aspect-ratio:16/9;overflow:hidden;
    border:1px solid rgba(75,135,163,.18);
    background:radial-gradient(circle at 50% 30%,rgba(0,175,235,.08),transparent 46%),linear-gradient(145deg,rgba(8,27,40,.76),rgba(2,12,20,.82));
}
.portal-system-shot img{width:100%;height:100%;object-fit:cover;display:block}
.portal-system-shot-placeholder{
    position:absolute;inset:0;display:grid;place-items:center;
    color:#456a7d;font-size:8px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
}
body.portal-system-modal-open{overflow:hidden}
@media(max-width:700px){
    .portal-system-modal{padding:14px}
    .portal-system-modal-window{padding:23px 18px 22px}
    .portal-system-modal-gallery{grid-template-columns:1fr}
}


/* PAAL EDITORIAL — NEWS / PATCH NOTES */
.portal-editorial-switch{
    display:flex;
    gap:7px;
    margin:0 0 14px;
}
.portal-editorial-switch a{
    min-width:120px;
    padding:10px 14px;
    border:1px solid rgba(77,139,169,.16);
    background:rgba(3,16,25,.46);
    color:#708c9d;
    text-align:center;
    text-decoration:none;
    font-size:8px;
    font-weight:800;
    letter-spacing:.11em;
    text-transform:uppercase;
}
.portal-editorial-switch a.active{
    color:#edf8fc;
    border-color:rgba(72,190,234,.40);
    background:rgba(12,48,66,.58);
    box-shadow:inset 0 -1px 0 rgba(78,207,248,.35);
}
.portal-editorial-card{
    position:relative;
}
.portal-editorial-card h2,
.portal-editorial-article h2{
    margin-bottom:10px;
}
.portal-editorial-card p{
    line-height:1.7;
}
.portal-editorial-read{
    display:inline-flex;
    margin-top:12px;
    color:#6fb8d6;
    text-decoration:none;
    font-size:8px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.portal-editorial-read:hover{color:#dff6ff}
.portal-pinned{
    display:inline-block;
    margin-right:7px;
    padding:3px 6px;
    border:1px solid rgba(76,192,233,.28);
    color:#6bc9ea;
    font-size:7px;
    font-weight:800;
    letter-spacing:.09em;
}
.portal-editorial-article{
    padding:24px;
}
.portal-editorial-article p{
    white-space:pre-line;
    line-height:1.85;
}
.portal-article-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:20px;
    padding-top:13px;
    border-top:1px solid rgba(70,128,156,.12);
}
@media(max-width:620px){
    .portal-editorial-switch{display:grid;grid-template-columns:1fr 1fr}
    .portal-editorial-switch a{min-width:0}
    .portal-article-actions{align-items:flex-start;flex-direction:column}
}


/* PAAL EVENTS */
.portal-event-card{
    position:relative;
}
.portal-event-card h2{
    margin-bottom:8px;
}
.portal-event-meta{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top:14px;
    padding-top:12px;
    border-top:1px solid rgba(68,128,157,.12);
    color:#718d9d;
    font-size:8px;
}
.portal-event-status{
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:0 9px;
    border:1px solid rgba(85,145,174,.18);
    font-size:7px;
    font-weight:800;
    letter-spacing:.09em;
    text-transform:uppercase;
}
.portal-event-status.upcoming{
    color:#74bfe1;
    border-color:rgba(78,181,225,.28);
    background:rgba(12,49,68,.34);
}
.portal-event-status.live{
    color:#82e5c7;
    border-color:rgba(86,210,172,.30);
    background:rgba(15,65,52,.34);
    box-shadow:0 0 12px rgba(74,220,177,.06);
}
.portal-event-status.ended{
    color:#718794;
    background:rgba(20,25,30,.28);
}



/* PAAL EVENTS V2 */
.portal-events-overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-bottom:22px;background:rgba(67,125,153,.10);border:1px solid rgba(71,137,169,.11)}
.portal-events-overview>div{padding:15px 16px;background:rgba(2,13,22,.72)}
.portal-events-overview span{display:block;color:#638698;font-size:7px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.portal-events-overview strong{display:block;margin-top:6px;color:#e7f2f7;font-size:22px;font-weight:500}
.portal-events-overview .portal-events-time strong{font-size:12px;margin-top:10px;color:#8eb2c4}
.portal-event-section{margin-top:24px}
.portal-event-section:first-of-type{margin-top:0}
.portal-event-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid rgba(69,133,163,.12)}
.portal-event-section-head span{color:#59bfe3;font-size:7px;font-weight:800;letter-spacing:.14em}
.portal-event-section-head h2{margin:4px 0 0;color:#e9f2f6;font:400 25px Georgia,serif}
.portal-event-section-head>strong{color:#587b8f;font-size:18px;font-weight:500}
.portal-event-list{display:grid;gap:10px}
.portal-event-v2{padding:18px!important;border-color:rgba(74,139,170,.16)!important;background:linear-gradient(135deg,rgba(3,18,29,.82),rgba(1,10,17,.76))!important}
.portal-event-v2.live{border-color:rgba(79,211,172,.30)!important;box-shadow:inset 2px 0 0 rgba(86,225,183,.55)}
.portal-event-v2.upcoming{box-shadow:inset 2px 0 0 rgba(79,181,225,.32)}
.portal-event-v2.ended{opacity:.70}
.portal-event-v2-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px}
.portal-event-clock{color:#789aab;font-size:8px;font-weight:700;letter-spacing:.04em}
.portal-event-v2 h2{margin:7px 0 8px!important;color:#edf5f8;font-size:24px}
.portal-event-excerpt{color:#a1bac7!important;font-weight:600}
.portal-event-period{display:flex;align-items:center;gap:14px;margin-top:15px;padding-top:13px;border-top:1px solid rgba(70,128,156,.12)}
.portal-event-period span{display:flex;flex-direction:column;gap:4px;color:#55798d;font-size:6px;font-weight:800;letter-spacing:.12em}
.portal-event-period strong{color:#9cb7c5;font-size:8px;font-weight:600;letter-spacing:0}
.portal-event-period i{color:#39697e;font-style:normal}
@media(max-width:720px){.portal-events-overview{grid-template-columns:repeat(2,1fr)}.portal-event-v2-top{align-items:flex-start;flex-direction:column}.portal-event-period{align-items:flex-start;flex-direction:column;gap:8px}.portal-event-period i{display:none}}

/* =========================================================
   PAAL — RANKING V2
========================================================= */
.portal-ranking-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
    margin-bottom:16px;
}
.portal-ranking-head h2{
    margin:5px 0 7px;
    color:#edf5f8;
    font-family:Georgia,serif;
    font-size:26px;
    font-weight:400;
}
.portal-ranking-tabs{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-bottom:12px;
}
.portal-ranking-tabs button{
    min-height:38px;
    border:1px solid rgba(78,139,168,.16);
    background:rgba(3,16,25,.48);
    color:#708c9d;
    cursor:pointer;
    font-size:8px;
    font-weight:800;
    letter-spacing:.10em;
    text-transform:uppercase;
}
.portal-ranking-tabs button:hover{
    color:#d9edf6;
    border-color:rgba(75,184,226,.30);
}
.portal-ranking-tabs button.active{
    color:#eff9fc;
    border-color:rgba(75,195,237,.42);
    background:linear-gradient(180deg,rgba(16,55,74,.62),rgba(4,22,33,.68));
    box-shadow:inset 0 -1px 0 rgba(86,208,248,.34);
}
.portal-ranking-search{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto auto;
    gap:8px;
    align-items:end;
    margin-bottom:14px;
}
.portal-ranking-search label{
    display:grid;
    gap:6px;
}
.portal-ranking-search label span{
    color:#66879a;
    font-size:7px;
    font-weight:800;
    letter-spacing:.11em;
    text-transform:uppercase;
}
.portal-ranking-search input{
    width:100%;
    height:40px;
    border:1px solid rgba(75,139,170,.20);
    outline:0;
    background:#020c14;
    color:#e7f0f4;
    padding:0 12px;
}
.portal-ranking-search input:focus{
    border-color:rgba(67,190,236,.48);
}
.portal-ranking-search button{
    min-width:92px;
    height:40px;
    border:1px solid rgba(72,167,207,.25);
    background:rgba(5,28,40,.62);
    color:#bfdce8;
    cursor:pointer;
    font-size:8px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.portal-ranking-wrap{
    border:1px solid rgba(70,129,157,.12);
    background:rgba(2,11,18,.30);
}
.portal-ranking-table{
    min-width:680px;
}
.portal-ranking-table th{
    color:#6b93a8;
}
.portal-ranking-table td{
    vertical-align:middle;
}
.portal-ranking-table tbody tr:nth-child(-n+3){
    background:linear-gradient(90deg,rgba(12,44,60,.24),transparent);
}
.portal-rank-number{
    display:inline-flex;
    width:27px;
    height:27px;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(76,136,165,.16);
    color:#7d9aaa;
    font-family:Georgia,serif;
    font-size:10px;
}
.portal-rank-number.rank-1{
    color:#d8f6ff;
    border-color:rgba(86,207,248,.48);
    box-shadow:0 0 10px rgba(65,198,242,.08);
}
.portal-rank-number.rank-2{
    color:#c9dce6;
    border-color:rgba(145,181,199,.34);
}
.portal-rank-number.rank-3{
    color:#9fc0d0;
    border-color:rgba(103,155,180,.28);
}
.portal-rank-name{
    color:#e2edf2!important;
    font-weight:700;
}
.portal-rank-value{
    color:#78c9e7!important;
    font-weight:700;
}
.portal-ranking-pager{
    margin-top:12px;
}
.portal-ranking-focus{
    outline:1px solid rgba(72,202,246,.48);
    outline-offset:-1px;
    background:rgba(11,58,78,.42)!important;
}
@media(max-width:800px){
    .portal-ranking-tabs{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}
@media(max-width:620px){
    .portal-ranking-tabs{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .portal-ranking-search{
        grid-template-columns:1fr 1fr;
    }
    .portal-ranking-search label{
        grid-column:1/-1;
    }
}


/* PAAL PORTAL SYSTEM GALLERY V2 */
.portal-system-shot{
    position:relative !important;
    aspect-ratio:16/9 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:10px !important;
    overflow:hidden !important;
    border:1px solid rgba(91,155,184,.24) !important;
    background:linear-gradient(180deg,rgba(5,19,29,.92),rgba(1,9,15,.96)) !important;
    box-shadow:
        inset 0 0 0 1px rgba(133,173,192,.035),
        inset 0 0 22px rgba(0,170,225,.025),
        0 6px 18px rgba(0,0,0,.16) !important;
}
.portal-system-shot::before{
    content:"";
    position:absolute;
    inset:6px;
    z-index:2;
    pointer-events:none;
    border:1px solid rgba(124,165,184,.20);
    box-shadow:inset 0 0 0 1px rgba(0,186,240,.025),0 0 10px rgba(0,145,205,.025);
}
.portal-system-shot::after{
    content:"";
    position:absolute;
    left:10%;
    right:10%;
    top:6px;
    height:1px;
    z-index:3;
    pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(104,205,240,.28),transparent);
}
.portal-system-shot img{
    position:relative !important;
    z-index:1 !important;
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center center !important;
    background:#020a11;
}
.portal-system-shot-placeholder{
    z-index:0 !important;
}


/* =========================================================
   PAAL SUPPORT V1
========================================================= */
.portal-support-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:22px;
    margin-bottom:14px;
}
.portal-support-head h2,
.portal-support-form-card h2,
.portal-support-detail-head h2{
    margin:5px 0 8px;
    color:#edf6fa;
    font-family:Georgia,serif;
    font-size:25px;
    font-weight:400;
}
.portal-support-warning{
    margin:12px 0;
    padding:11px 13px;
    border:1px solid rgba(125,166,184,.14);
    border-left:2px solid rgba(90,190,226,.46);
    background:rgba(3,17,27,.48);
    color:#7f9cac;
    font-size:10px;
    line-height:1.6;
}
.portal-support-stats{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin:15px 0 18px;
}
.portal-support-stats>div{
    padding:14px 15px;
    border:1px solid rgba(71,130,158,.16);
    background:rgba(3,16,25,.38);
}
.portal-support-stats span{
    display:block;
    color:#668597;
    font-size:8px;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.portal-support-stats strong{
    display:block;
    margin-top:6px;
    color:#dfeef5;
    font-size:20px;
    font-weight:500;
}
.portal-support-list{
    display:grid;
    gap:8px;
}
.portal-support-ticket{
    width:100%;
    margin:0!important;
    text-align:left;
    cursor:pointer;
    transition:border-color .15s ease,background .15s ease;
}
.portal-support-ticket:hover{
    border-color:rgba(77,186,226,.34);
    background:rgba(7,28,41,.68);
}
.portal-support-ticket-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}
.portal-support-ticket-top strong{
    color:#dbeaf1;
    font-size:11px;
}
.portal-support-ticket-meta{
    display:block;
    margin-top:7px;
    color:#668698;
    font-size:9px;
}
.portal-support-status{
    display:inline-flex;
    align-items:center;
    min-height:23px;
    padding:0 8px;
    border:1px solid rgba(100,150,175,.20);
    background:rgba(7,25,36,.55);
    color:#9cb8c7;
    font-size:7px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    white-space:nowrap;
}
.portal-support-status.waiting-staff{
    color:#8eddf6;
    border-color:rgba(65,190,234,.30);
    background:rgba(7,54,72,.36);
}
.portal-support-status.waiting-user{
    color:#d9c995;
    border-color:rgba(188,159,83,.27);
    background:rgba(61,48,16,.25);
}
.portal-support-status.resolved{
    color:#8ed7b5;
    border-color:rgba(73,181,132,.28);
    background:rgba(15,57,39,.28);
}
.portal-support-status.closed{
    color:#778e9c;
    border-color:rgba(89,116,132,.20);
    background:rgba(14,25,32,.34);
}
.portal-support-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:14px;
}
.portal-support-form-card,
.portal-support-detail-head{
    padding:18px;
    border:1px solid rgba(74,136,165,.16);
    background:linear-gradient(145deg,rgba(5,21,32,.66),rgba(2,11,18,.60));
}
.portal-support-form{
    display:grid;
    gap:13px;
    margin-top:17px;
}
.portal-support-form .portal-field,
.portal-support-reply .portal-field{
    display:grid;
    gap:6px;
}
.portal-support-form label,
.portal-support-reply label{
    color:#6c8b9c;
    font-size:8px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.portal-support-form input,
.portal-support-form select,
.portal-support-form textarea,
.portal-support-reply textarea{
    width:100%;
    border:1px solid rgba(75,139,170,.21);
    outline:0;
    background:#020c14;
    color:#e5eef3;
    padding:11px 12px;
    font:inherit;
}
.portal-support-form input,
.portal-support-form select{
    min-height:42px;
}
.portal-support-form textarea{
    min-height:180px;
    resize:vertical;
}
.portal-support-reply textarea{
    min-height:130px;
    resize:vertical;
}
.portal-support-form input:focus,
.portal-support-form select:focus,
.portal-support-form textarea:focus,
.portal-support-reply textarea:focus{
    border-color:rgba(68,194,239,.48);
}
.portal-support-detail-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:15px;
    margin-bottom:14px;
}
.portal-support-thread{
    display:grid;
    gap:9px;
}
.portal-support-thread .portal-message{
    margin:0;
    border:1px solid rgba(70,124,151,.13);
    border-left:2px solid rgba(97,134,153,.52);
}
.portal-support-thread .portal-message.staff{
    border-left-color:rgba(78,198,239,.74);
    background:linear-gradient(90deg,rgba(7,39,54,.62),rgba(4,18,28,.72));
}
.portal-support-message-head{
    display:flex;
    justify-content:space-between;
    gap:12px;
    margin-bottom:9px;
}
.portal-support-message-head strong{
    color:#bdd9e7;
    font-size:9px;
}
.portal-support-message-head span{
    color:#5f7e8f;
    font-size:8px;
}
.portal-support-reply{
    display:grid;
    gap:10px;
    margin-top:15px;
    padding-top:15px;
    border-top:1px solid rgba(70,126,153,.16);
}
.portal-support-close{
    display:flex;
    justify-content:flex-end;
    margin-top:12px;
}
@media(max-width:650px){
    .portal-support-head,
    .portal-support-detail-head{
        flex-direction:column;
    }
    .portal-support-stats{
        grid-template-columns:1fr;
    }
    .portal-support-ticket-top,
    .portal-support-message-head{
        align-items:flex-start;
        flex-direction:column;
    }
}

/* PAAL Rules — structured regulation page */
.portal-rules-intro{
    position:relative;
    margin-bottom:18px;
    padding:26px 28px;
    border:1px solid rgba(121,172,202,.16);
    background:linear-gradient(145deg,rgba(6,22,36,.82),rgba(2,10,18,.86));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}
.portal-rules-intro::before{
    content:"";
    position:absolute;
    left:0;
    top:28px;
    width:2px;
    height:46px;
    background:rgba(0,198,255,.78);
    box-shadow:0 0 14px rgba(0,190,255,.32);
}
.portal-rules-intro h2{margin:8px 0 13px;color:#edf8ff;font-size:26px;font-weight:500;letter-spacing:.7px}
.portal-rules-intro p{max-width:980px;margin:8px 0;color:#819bab;line-height:1.75;font-size:13px}
.portal-rules-list{display:grid;gap:10px}
.portal-rule-group{
    border:1px solid rgba(120,170,200,.14);
    background:rgba(3,13,22,.78);
    overflow:hidden;
}
.portal-rule-group[open]{border-color:rgba(0,176,236,.22);background:linear-gradient(180deg,rgba(5,21,34,.88),rgba(2,10,17,.88))}
.portal-rule-group>summary{
    position:relative;
    min-height:62px;
    display:flex;
    align-items:center;
    gap:14px;
    padding:0 52px 0 22px;
    cursor:pointer;
    list-style:none;
    color:#c8dbe7;
    font-size:11px;
    font-weight:700;
    letter-spacing:1.45px;
    text-transform:uppercase;
    user-select:none;
}
.portal-rule-group>summary::-webkit-details-marker{display:none}
.portal-rule-group>summary::after{
    content:"+";
    position:absolute;
    right:21px;
    top:50%;
    transform:translateY(-50%);
    color:#63879c;
    font-size:20px;
    font-weight:300;
}
.portal-rule-group[open]>summary::after{content:"−";color:#a8eaff}
.portal-rule-group[open]>summary{border-bottom:1px solid rgba(120,170,200,.11);background:linear-gradient(90deg,rgba(0,133,205,.07),transparent 68%)}
.portal-rule-diamond{
    width:9px;
    height:9px;
    flex:0 0 9px;
    transform:rotate(45deg);
    border:1px solid rgba(116,185,219,.70);
    background:rgba(0,144,214,.10);
}
.portal-rule-group[open] .portal-rule-diamond{background:#08bff4;border-color:#bcefff;box-shadow:0 0 10px rgba(0,190,255,.52)}
.portal-rule-count{margin-left:auto;color:#55758a;font-size:8px;font-weight:600;letter-spacing:.9px}
.portal-rule-group-body{padding:4px 24px 12px}
.portal-rule-section{
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:14px;
    padding:22px 2px;
    border-bottom:1px solid rgba(115,160,185,.085);
}
.portal-rule-section:last-child{border-bottom:0}
.portal-rule-number{
    width:32px;
    height:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:2px;
    border:1px solid rgba(0,178,238,.22);
    color:#8ecce8;
    background:rgba(0,117,181,.055);
    font-size:10px;
    font-weight:700;
}
.portal-rule-copy h3{margin:0 0 11px;color:#dcebf3;font-size:15px;font-weight:600;letter-spacing:.3px}
.portal-rule-copy p{margin:7px 0;color:#8098a8;font-size:12px;line-height:1.72}
.portal-rule-copy ul{margin:11px 0 4px;padding:0;list-style:none;display:grid;gap:7px}
.portal-rule-copy li{position:relative;padding-left:17px;color:#738e9f;font-size:12px;line-height:1.55}
.portal-rule-copy li::before{content:"";position:absolute;left:2px;top:.62em;width:5px;height:5px;transform:rotate(45deg);border:1px solid rgba(0,184,241,.55);background:rgba(0,151,217,.11)}
.portal-rules-footer{
    display:flex;
    align-items:center;
    gap:16px;
    margin-top:18px;
    padding:20px 22px;
    border:1px solid rgba(120,170,200,.13);
    background:rgba(3,14,23,.74);
}
.portal-rules-footer strong{color:#dcecf5;font-size:11px;letter-spacing:.5px}
.portal-rules-footer span{color:#668294;font-size:10px;line-height:1.55}
.portal-rules-footer .portal-action{margin-left:auto;white-space:nowrap}
@media(max-width:760px){
    .portal-rules-intro{padding:21px 20px}
    .portal-rules-intro h2{font-size:22px}
    .portal-rule-group>summary{min-height:58px;padding-left:17px;font-size:10px;letter-spacing:1px}
    .portal-rule-count{display:none}
    .portal-rule-group-body{padding:2px 15px 9px}
    .portal-rule-section{grid-template-columns:34px minmax(0,1fr);gap:10px;padding:18px 0}
    .portal-rule-number{width:28px;height:28px}
    .portal-rules-footer{align-items:flex-start;flex-direction:column}
    .portal-rules-footer .portal-action{margin-left:0}
}


/* =========================================================
   PAAL LEGAL — clean legal center
========================================================= */
.portal-legal-intro{
    position:relative;
    overflow:hidden;
    padding:28px 30px 26px;
    margin-bottom:14px;
    background:linear-gradient(145deg,rgba(4,14,22,.94),rgba(2,8,14,.90));
    border:1px solid rgba(135,177,199,.16);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 18px 45px rgba(0,0,0,.18);
}
.portal-legal-intro::before{
    content:"";
    position:absolute;
    left:0;top:0;bottom:0;width:2px;
    background:linear-gradient(180deg,rgba(42,204,255,.15),rgba(42,204,255,.72),rgba(42,204,255,.08));
}
.portal-legal-intro h2{margin:8px 0 12px;color:#edf8ff;font-size:26px;font-weight:500;letter-spacing:.65px}
.portal-legal-intro>p{max-width:980px;margin:7px 0;color:#819bab;line-height:1.75;font-size:13px}
.portal-legal-operator{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:1px;
    margin:22px 0 10px;
    background:rgba(132,176,199,.10);
    border:1px solid rgba(132,176,199,.12);
}
.portal-legal-operator>div{min-width:0;padding:13px 15px;background:rgba(2,9,15,.78)}
.portal-legal-operator span{display:block;margin-bottom:6px;color:#5e7c8e;font-size:9px;letter-spacing:1.2px;text-transform:uppercase}
.portal-legal-operator strong{display:block;overflow:hidden;text-overflow:ellipsis;color:#c9dbe5;font-size:11px;font-weight:600;letter-spacing:.15px}
.portal-legal-note{color:#9a8268!important;font-size:10px!important}
.portal-legal-list{display:grid;gap:10px}
.portal-legal-group{
    background:linear-gradient(145deg,rgba(4,13,21,.91),rgba(2,8,14,.88));
    border:1px solid rgba(128,170,193,.14);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}
.portal-legal-group[open]{border-color:rgba(72,177,219,.24)}
.portal-legal-group>summary{
    list-style:none;
    cursor:pointer;
    display:grid;
    grid-template-columns:40px minmax(0,1fr) auto;
    align-items:center;
    min-height:58px;
    gap:14px;
    padding:0 20px;
    color:#cbdce5;
    font-size:12px;
    letter-spacing:.3px;
    user-select:none;
}
.portal-legal-group>summary::-webkit-details-marker{display:none}
.portal-legal-group>summary::after{content:"+";grid-column:4;color:#5d8396;font-size:17px;font-weight:300}
.portal-legal-group[open]>summary::after{content:"−";color:#83cae8}
.portal-legal-index{display:grid;place-items:center;width:30px;height:30px;border:1px solid rgba(91,156,184,.20);color:#6e99ac;font-size:9px;letter-spacing:.7px}
.portal-legal-hint{color:#587486;font-size:9px;letter-spacing:.65px;text-transform:uppercase}
.portal-legal-body{padding:2px 22px 22px 74px;border-top:1px solid rgba(120,165,188,.08)}
.portal-legal-body section{padding:18px 0 3px;border-bottom:1px solid rgba(119,162,183,.07)}
.portal-legal-body section:last-child{border-bottom:0}
.portal-legal-body h3{margin:0 0 9px;color:#cfe3ed;font-size:12px;font-weight:600;letter-spacing:.25px}
.portal-legal-body p{max-width:1030px;margin:0 0 11px;color:#738e9e;font-size:11px;line-height:1.75}
.portal-legal-body .portal-action{margin:3px 0 10px}
.portal-legal-footer{
    display:flex;
    align-items:center;
    gap:18px;
    margin-top:14px;
    padding:17px 20px;
    background:rgba(3,11,18,.88);
    border:1px solid rgba(125,168,190,.13);
}
.portal-legal-footer>div{display:grid;gap:4px;min-width:0}
.portal-legal-footer strong{color:#d9e9f1;font-size:11px;letter-spacing:.55px}
.portal-legal-footer span{color:#607d8e;font-size:10px;line-height:1.5}
.portal-legal-footer .portal-action{margin-left:auto;white-space:nowrap}
@media(max-width:900px){
    .portal-legal-intro{padding:21px 20px}
    .portal-legal-intro h2{font-size:22px}
    .portal-legal-operator{grid-template-columns:repeat(2,minmax(0,1fr))}
    .portal-legal-group>summary{grid-template-columns:36px minmax(0,1fr) auto;padding:0 14px;gap:10px}
    .portal-legal-group>summary::after{grid-column:3;grid-row:1}
    .portal-legal-hint{display:none}
    .portal-legal-body{padding:2px 17px 18px}
    .portal-legal-footer{align-items:flex-start;flex-direction:column}
    .portal-legal-footer .portal-action{margin-left:0}
}
@media(max-width:560px){
    .portal-legal-operator{grid-template-columns:1fr}
}

/* ================================================================
   PAAL SERVER STATUS
   ================================================================ */
.portal-status-overview{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:18px;
    padding:24px 26px;
    margin-bottom:16px;
    border:1px solid rgba(76,134,163,.22);
    background:linear-gradient(180deg,rgba(7,24,36,.62),rgba(2,13,21,.66));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}
.portal-status-indicator{
    width:12px;
    height:12px;
    border-radius:50%;
    border:1px solid rgba(131,166,183,.6);
    background:#526976;
    box-shadow:0 0 0 5px rgba(82,105,118,.07);
}
.portal-status-copy h2{
    margin:5px 0 5px;
    color:#e7f2f7;
    font-size:20px;
    font-weight:600;
    letter-spacing:.02em;
}
.portal-status-copy p{
    margin:0;
    color:#7898a9;
    font-size:12px;
    line-height:1.65;
}
.portal-status-badge{
    min-width:118px;
    padding:10px 13px;
    border:1px solid rgba(99,145,167,.26);
    background:rgba(4,17,26,.58);
    color:#9eb7c4;
    text-align:center;
    font-size:10px;
    letter-spacing:.16em;
}
.portal-status-overview[data-state="online"] .portal-status-indicator{
    border-color:rgba(83,223,183,.78);
    background:#53dfb7;
    box-shadow:0 0 0 5px rgba(83,223,183,.07),0 0 14px rgba(83,223,183,.22);
}
.portal-status-overview[data-state="online"] .portal-status-badge{
    border-color:rgba(83,223,183,.25);
    color:#70e7c4;
}
.portal-status-overview[data-state="offline"] .portal-status-indicator{
    border-color:rgba(215,102,102,.8);
    background:#d76666;
    box-shadow:0 0 0 5px rgba(215,102,102,.06);
}
.portal-status-overview[data-state="offline"] .portal-status-badge{
    border-color:rgba(215,102,102,.24);
    color:#e28a8a;
}
.portal-status-overview[data-state="maintenance"] .portal-status-indicator{
    border-color:rgba(223,177,88,.8);
    background:#dfb158;
    box-shadow:0 0 0 5px rgba(223,177,88,.06);
}
.portal-status-overview[data-state="maintenance"] .portal-status-badge{
    border-color:rgba(223,177,88,.24);
    color:#e3c37f;
}
.portal-status-metrics{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
}
.portal-status-metrics .portal-metric{
    min-height:92px;
    padding:17px 18px;
}
.portal-status-metrics .portal-metric span{
    display:block;
    color:#6f91a3;
    font-size:10px;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.portal-status-metrics .portal-metric strong{
    margin-top:10px;
    font-size:24px;
}
.portal-status-checkline{
    display:flex;
    justify-content:space-between;
    gap:18px;
    margin:12px 0 30px;
    padding:10px 2px 14px;
    border-bottom:1px solid rgba(66,121,149,.14);
    color:#68899a;
    font-size:10px;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.portal-status-checkline strong{
    color:#91aab7;
    font-weight:500;
}
.portal-status-section-head{
    margin:0 0 12px;
    padding-top:2px;
}
.portal-status-section-head h2{
    margin:5px 0 0;
    color:#dcebf2;
    font-size:18px;
    font-weight:500;
}
.portal-status-incident{
    margin-bottom:10px;
}
.portal-status-empty{
    margin:0 0 14px;
}
.portal-status-actions{
    display:flex;
    justify-content:flex-end;
    margin-top:14px;
}
@media (max-width:900px){
    .portal-status-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:620px){
    .portal-status-overview{grid-template-columns:auto 1fr;padding:20px;}
    .portal-status-badge{grid-column:1 / -1;width:100%;box-sizing:border-box;}
    .portal-status-metrics{grid-template-columns:1fr 1fr;gap:8px;}
    .portal-status-checkline{display:block;}
    .portal-status-checkline strong{display:block;margin-top:6px;}
}


/* =========================================================
   PAAL COMMUNITY HUB + GROUPED PORTAL NAVIGATION
========================================================= */
.portal-menu nav{display:grid;gap:8px}
.portal-menu-group{
    display:block;
    margin:0;
    border:1px solid rgba(62,103,124,.18);
    background:rgba(1,10,17,.24);
}
.portal-menu-group-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:0;
    padding:13px 14px;
    color:#7394a7;
    font-size:9px;
    font-weight:700;
    letter-spacing:1.85px;
    line-height:1.2;
    cursor:pointer;
    list-style:none;
    user-select:none;
    transition:color .18s ease,background .18s ease,border-color .18s ease;
}
.portal-menu-group-title::-webkit-details-marker{display:none}
.portal-menu-group-title:hover{
    color:#d4e5ed;
    background:rgba(8,29,41,.42);
}
.portal-menu-group[open]>.portal-menu-group-title{
    color:#9bdcf4;
    background:linear-gradient(90deg,rgba(0,174,239,.08),rgba(0,174,239,.015));
    border-bottom:1px solid rgba(65,125,151,.18);
}
.portal-menu-group-chevron{
    color:#4f8198;
    font-size:13px;
    line-height:1;
    transform:rotate(-90deg);
    transition:transform .18s ease,color .18s ease;
}
.portal-menu-group[open] .portal-menu-group-chevron{
    transform:rotate(0deg);
    color:#75d8f6;
}
.portal-menu-group-links{
    display:grid;
    gap:5px;
    padding:7px;
}
.portal-menu-group a{margin:0}
.portal-menu-group:not([open])>.portal-menu-group-links{display:none}
.portal-community-intro{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:28px;
    padding:30px 31px;
    border:1px solid rgba(74,130,157,.23);
    background:
      radial-gradient(circle at 12% 0%,rgba(0,190,255,.08),transparent 36%),
      linear-gradient(135deg,rgba(8,23,34,.82),rgba(2,10,17,.88));
}
.portal-community-intro>div{max-width:760px}
.portal-community-intro h2{margin:7px 0 10px;color:#e8f1f5;font-size:27px;line-height:1.14;font-weight:650}
.portal-community-intro p:not(.portal-meta){margin:0;color:#7793a3;font-size:12px;line-height:1.75}
.portal-community-intro .portal-action{flex:0 0 auto;margin:0}
.portal-community-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:14px;
}
.portal-community-social{
    position:relative;
    min-height:168px;
    padding:23px 24px;
    border:1px solid rgba(72,124,149,.19);
    background:linear-gradient(150deg,rgba(7,20,30,.75),rgba(2,9,15,.9));
    overflow:hidden;
}
.portal-community-social::after{
    content:"";
    position:absolute;
    right:-55px;
    bottom:-70px;
    width:170px;
    height:170px;
    border-radius:50%;
    background:rgba(0,194,255,.035);
    filter:blur(4px);
    pointer-events:none;
}
.portal-community-social.is-live{border-color:rgba(0,190,255,.28)}
.portal-community-social-top{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:17px}
.portal-community-social-top span{color:#4f768a;font-size:8px;font-weight:700;letter-spacing:1.65px}
.portal-community-social-top strong{color:#dbe9ef;font-size:15px;font-weight:650;letter-spacing:.2px}
.portal-community-social p{min-height:42px;margin:0 0 20px;color:#6f8c9d;font-size:11px;line-height:1.7}
.portal-community-social .portal-action{margin:0}
.portal-community-pending{
    display:inline-flex;
    min-height:34px;
    align-items:center;
    padding:0 14px;
    border:1px solid rgba(76,111,129,.24);
    color:#567587;
    font-size:9px;
    font-weight:700;
    letter-spacing:1.15px;
}
.portal-community-section{margin-top:28px;padding-top:25px;border-top:1px solid rgba(69,115,137,.16)}
.portal-community-section-head h2{margin:6px 0 17px;color:#d8e7ee;font-size:18px;font-weight:600}
.portal-community-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.portal-community-links a{
    display:grid;
    min-height:126px;
    align-content:start;
    gap:7px;
    padding:18px;
    border:1px solid rgba(68,119,143,.18);
    background:rgba(2,11,18,.62);
    text-decoration:none;
    transition:border-color .18s ease,background .18s ease,transform .18s ease;
}
.portal-community-links a:hover{border-color:rgba(0,190,255,.38);background:rgba(5,22,33,.78);transform:translateY(-1px)}
.portal-community-links span{color:#58a8c6;font-size:8px;font-weight:700;letter-spacing:1.35px}
.portal-community-links strong{color:#d5e5ec;font-size:12px;font-weight:650;line-height:1.35}
.portal-community-links small{color:#617e8e;font-size:10px;line-height:1.55}
@media(max-width:1100px){
    .portal-community-links{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
    .portal-community-intro{align-items:flex-start;flex-direction:column;padding:22px 20px}
    .portal-community-intro h2{font-size:22px}
    .portal-community-grid,.portal-community-links{grid-template-columns:1fr}
    .portal-community-social{min-height:0}
}

/* =========================================================
   PAAL PORTAL SIDEBAR ACCORDION — COMPACT FINAL
========================================================= */
.portal-menu nav{
    gap:3px !important;
}
.portal-menu-group{
    border:0 !important;
    background:transparent !important;
}
.portal-menu-group-title{
    min-height:34px !important;
    box-sizing:border-box !important;
    padding:8px 10px !important;
    border:1px solid rgba(62,103,124,.13) !important;
    background:rgba(2,12,19,.24) !important;
    color:#7895a5 !important;
    font-size:8px !important;
    font-weight:700 !important;
    letter-spacing:1.45px !important;
    line-height:1.15 !important;
}
.portal-menu-group-title:hover{
    color:#d9e8ee !important;
    border-color:rgba(81,151,180,.22) !important;
    background:rgba(7,25,36,.38) !important;
}
.portal-menu-group[open]>.portal-menu-group-title{
    color:#a8dff1 !important;
    border-color:rgba(75,157,190,.22) !important;
    border-bottom-color:rgba(75,157,190,.15) !important;
    background:linear-gradient(90deg,rgba(0,174,239,.055),rgba(0,174,239,.008)) !important;
}
.portal-menu-group-chevron{
    font-size:10px !important;
    opacity:.8 !important;
}
.portal-menu-group-links{
    gap:3px !important;
    padding:4px 0 5px 8px !important;
}
.portal-menu-group-links a{
    min-height:29px !important;
    padding:0 9px !important;
    font-size:8.5px !important;
    border-color:rgba(72,132,161,.09) !important;
    background:rgba(3,15,24,.27) !important;
}
.portal-menu-group-links a:hover,
.portal-menu-group-links a[aria-current]{
    padding-left:10px !important;
}

/* =========================================================
   PAAL PORTAL SIDEBAR ACCORDION — COMPACT EMPHASIS PASS
========================================================= */
.portal-menu nav{
    gap:2px !important;
    row-gap:2px !important;
}
.portal-menu-group{
    margin:0 !important;
}
.portal-menu-group + .portal-menu-group{
    margin-top:2px !important;
}
.portal-menu-group-title{
    min-height:32px !important;
    padding:7px 10px !important;
    border-color:rgba(72,132,161,.22) !important;
    background:linear-gradient(180deg,rgba(8,25,36,.50),rgba(3,14,22,.58)) !important;
    color:#90aab8 !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.018),
        inset 0 -1px 0 rgba(0,0,0,.22) !important;
}
.portal-menu-group-title:hover{
    color:#e3f1f6 !important;
    border-color:rgba(76,178,216,.34) !important;
    background:linear-gradient(90deg,rgba(7,36,51,.62),rgba(3,17,26,.56)) !important;
}
.portal-menu-group[open]>.portal-menu-group-title{
    color:#c9eef9 !important;
    border-color:rgba(64,190,232,.40) !important;
    background:linear-gradient(90deg,rgba(0,174,239,.11),rgba(4,22,32,.48)) !important;
    box-shadow:
        inset 2px 0 0 rgba(53,205,255,.72),
        inset 0 1px 0 rgba(255,255,255,.018) !important;
}
.portal-menu-group-chevron{
    color:#5d9ab5 !important;
    opacity:.95 !important;
}
.portal-menu-group[open] .portal-menu-group-chevron{
    color:#83e3ff !important;
}
.portal-menu-group-links{
    gap:2px !important;
    padding:3px 0 4px 7px !important;
}

/* =========================================================
   PAAL PORTAL SIDEBAR ACCORDION — TIGHTER VERTICAL RHYTHM
========================================================= */
.portal-menu nav{
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    align-content:flex-start !important;
    gap:6px !important;
    row-gap:6px !important;
}
.portal-menu-group{
    flex:0 0 auto !important;
    margin:0 !important;
}
.portal-menu-group + .portal-menu-group{
    margin-top:0 !important;
}

/* =========================================================
   PAAL PORTAL SIDEBAR ACCORDION — EXTRA TIGHT STACK
========================================================= */
.portal-menu nav{
    display:block !important;
    margin-top:14px !important;
}
.portal-menu-group{
    display:block !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 0 4px 0 !important;
    padding:0 !important;
}
.portal-menu-group:last-child{
    margin-bottom:0 !important;
}
.portal-menu-group + .portal-menu-group{
    margin-top:0 !important;
}
.portal-menu-group-title{
    min-height:32px !important;
    margin:0 !important;
    padding:7px 10px !important;
}
.portal-menu-group-links{
    margin:0 !important;
    padding:3px 0 4px 7px !important;
}