/* VAULT */
.vpage{background:#07101a;padding-top:72px;min-height:100dvh}

/* Authenticated vault - one-page editorial workspace */
[hidden]{display:none!important}.vtabs-container{position:relative;z-index:2;width:100%;max-width:430px}.vform-msg{display:none;margin-top:.85rem;padding:.8rem 1rem;border-left:2px solid #ef7d7d;background:rgba(239,125,125,.08);color:#ffb9b9;font-size:.76rem;line-height:1.5}.vform-msg.show{display:block}.vform-msg.success{border-color:#63d6aa;background:rgba(99,214,170,.08);color:#a7efd3}.vsub2:disabled,.vm-submit:disabled{opacity:.65;cursor:wait}.vspinner{display:inline-block;width:13px;height:13px;margin-right:8px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:vspin .7s linear infinite}@keyframes vspin{to{transform:rotate(360deg)}}
.vault-shell{position:relative;min-height:calc(100dvh - 72px);padding:5rem clamp(1.5rem,6vw,6rem) 7rem;background:linear-gradient(150deg,#081421 0%,#07101a 48%,#0b1d27 100%);overflow:hidden;color:#fff}.vault-ambient{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 5%,rgba(116,199,240,.1),transparent 28%),radial-gradient(circle at 90% 20%,rgba(26,92,97,.22),transparent 35%);opacity:.9}.vault-welcome{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:3rem;padding-bottom:2.5rem;border-bottom:1px solid rgba(255,255,255,.09)}.vault-welcome h1{font:300 clamp(2.5rem,5vw,4.8rem)/1 var(--fd);letter-spacing:-.02em}.vault-welcome h1 em{color:var(--sky);font-weight:300}.vault-welcome p{margin-top:1rem;color:rgba(255,255,255,.48);font-size:.9rem}.vault-identity{display:flex;align-items:center;gap:.85rem;min-width:max-content}.vault-avatar,.vm-profile>span{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--teal),var(--sky));color:#fff;font:500 .7rem var(--fm);box-shadow:0 0 0 4px rgba(116,199,240,.08)}.vault-identity div{display:flex;flex-direction:column;gap:.25rem}.vault-identity strong{font-size:.82rem}.vault-identity small{font:400 .6rem var(--fm);color:var(--sky);text-transform:uppercase;letter-spacing:.12em}.vtext-btn{border:0;background:transparent;color:rgba(255,255,255,.55);font:500 .65rem var(--fm);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;padding:.6rem}.vtext-btn:hover{color:var(--sky)}
.vault-actions{position:relative;display:grid;grid-template-columns:repeat(4,1fr);margin:2.5rem 0 4rem;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.025);backdrop-filter:blur(20px)}.vault-actions.user-actions{grid-template-columns:1fr;max-width:260px}.vault-actions button{position:relative;display:flex;align-items:center;justify-content:center;gap:.8rem;padding:1.25rem;border:0;border-right:1px solid rgba(255,255,255,.09);background:transparent;color:#fff;font:500 .7rem var(--fm);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:.25s}.vault-actions button:last-child{border-right:0}.vault-actions button:hover{background:rgba(116,199,240,.08);color:var(--sky);transform:translateY(-2px)}.vault-actions button:first-letter{font-size:1.35rem}.vault-actions b{position:absolute;top:.55rem;right:.7rem;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#d65e67;color:#fff;font-size:.6rem}
.vault-toolbar{position:relative;display:flex;align-items:center;gap:1rem;margin-bottom:1.7rem}.vault-toolbar>div:first-child{margin-right:auto}.vault-toolbar h2{font:300 2rem var(--fd)}.vault-toolbar p{margin-top:.25rem;color:rgba(255,255,255,.38);font-size:.75rem}.vault-search{display:flex;align-items:center;gap:.5rem;width:min(280px,30vw);padding:0 .85rem;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035);color:var(--sky)}.vault-search input,.vault-toolbar select,.vm-list-tools input,.vm-list-tools select{width:100%;padding:.75rem 0;border:0;outline:0;background:transparent;color:#fff;font:400 .75rem var(--fb)}.vault-toolbar select{width:auto;padding:.75rem 2.2rem .75rem .9rem;border:1px solid rgba(255,255,255,.12);background:#0b1824}.vault-toolbar option,.vm-field option,.vm-list-tools option{background:#0b1824}.vault-grid{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}.vault-card{overflow:hidden;border:1px solid rgba(255,255,255,.08);background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.025));box-shadow:0 20px 45px rgba(0,0,0,.15);transition:transform .3s,border-color .3s,box-shadow .3s}.vault-card:hover{transform:translateY(-6px);border-color:rgba(116,199,240,.28);box-shadow:0 28px 55px rgba(0,0,0,.3)}.vault-preview{position:relative;display:grid;place-items:center;width:100%;height:220px;overflow:hidden;border:0;background:#0d1a27;color:#fff;cursor:pointer}.vault-preview img,.vault-preview video{width:100%;height:100%;object-fit:cover;transition:transform .5s}.vault-preview:hover img,.vault-preview:hover video{transform:scale(1.04)}.vault-preview>span{position:absolute;left:50%;bottom:1rem;transform:translate(-50%,8px);opacity:0;padding:.6rem 1rem;background:rgba(7,16,26,.82);backdrop-filter:blur(10px);font:500 .6rem var(--fm);letter-spacing:.1em;text-transform:uppercase;transition:.25s}.vault-preview:hover>span{opacity:1;transform:translate(-50%,0)}.vault-file-icon{display:flex;flex-direction:column-reverse;align-items:center;gap:1rem;color:rgba(116,199,240,.3);font:300 4rem var(--fd)}.vault-file-icon span{color:var(--sky);font:500 .68rem var(--fm);letter-spacing:.12em}.vault-card-body{padding:1.35rem}.vault-file-head{display:flex;gap:1rem}.vault-file-head>div{min-width:0;flex:1}.vault-file-head h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 1.15rem var(--fd)}.vault-file-head p{overflow:hidden;text-overflow:ellipsis;margin-top:.25rem;color:rgba(255,255,255,.35);font-size:.65rem}.vault-more{border:0;background:transparent;color:rgba(255,255,255,.55);cursor:pointer}.vault-file-meta,.vault-card-actions{display:flex;gap:1rem;margin-top:1.1rem;font:400 .6rem var(--fm);letter-spacing:.06em;text-transform:uppercase}.vault-file-meta{color:rgba(255,255,255,.36)}.vault-access{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.06)}.vault-access b{color:var(--sky);font:400 .62rem var(--fm)}.vault-card-actions a,.vault-card-actions button{border:0;background:transparent;color:rgba(255,255,255,.55);font:inherit;cursor:pointer}.vault-card-actions a:hover,.vault-card-actions button:hover{color:var(--sky)}.vault-card-actions .danger,.vm-list-row .danger{color:#f29292}.vault-empty{grid-column:1/-1;display:grid;place-items:center;min-height:320px;padding:3rem;border:1px dashed rgba(255,255,255,.13);text-align:center}.vault-empty i{font:300 3rem var(--fd);color:var(--sky)}.vault-empty h3{margin:.5rem 0;font:300 1.8rem var(--fd)}.vault-empty p{color:rgba(255,255,255,.38);font-size:.82rem}
.vault-modal-layer{position:fixed;inset:0;z-index:5000;display:none;align-items:center;justify-content:center;padding:1.25rem}.vault-modal-layer.open{display:flex}.vault-modal-backdrop{position:absolute;inset:0;background:rgba(3,8,14,.84);backdrop-filter:blur(14px);animation:vmfade .25s}.vault-modal{position:relative;width:min(540px,100%);max-height:calc(100dvh - 2.5rem);overflow:auto;border:1px solid rgba(116,199,240,.2);background:linear-gradient(150deg,#101f2c,#08131e);box-shadow:0 35px 100px rgba(0,0,0,.55);color:#fff;animation:vmpop .32s cubic-bezier(.2,.8,.2,1)}.vault-modal.wide{width:min(860px,100%)}@keyframes vmfade{from{opacity:0}}@keyframes vmpop{from{opacity:0;transform:translateY(20px) scale(.98)}}.vault-modal>header{display:flex;align-items:flex-start;justify-content:space-between;padding:1.8rem 2rem;border-bottom:1px solid rgba(255,255,255,.08)}.vault-modal>header h2{font:300 2rem var(--fd)}.vault-modal>header .ey{margin-bottom:.45rem}.vault-modal>header>button{border:0;background:transparent;color:#fff;font:300 2rem var(--fd);cursor:pointer}.vault-modal-content{padding:2rem}.vm-field{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}.vm-field>span{color:rgba(255,255,255,.52);font:500 .59rem var(--fm);letter-spacing:.13em;text-transform:uppercase}.vm-field input,.vm-field select,.vm-field textarea{width:100%;padding:.85rem 1rem;border:1px solid rgba(255,255,255,.13);outline:0;background:rgba(255,255,255,.045);color:#fff;font:400 .82rem var(--fb);transition:.2s}.vm-field textarea{min-height:90px;resize:vertical}.vm-field input:focus,.vm-field select:focus,.vm-field textarea:focus{border-color:var(--sky);box-shadow:0 0 0 3px rgba(116,199,240,.08)}.vm-submit{width:100%;margin-top:.8rem;padding:1rem;border:0;background:linear-gradient(120deg,var(--teal),#277f87);color:#fff;font:500 .66rem var(--fm);letter-spacing:.13em;text-transform:uppercase;cursor:pointer;transition:.2s}.vm-submit:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(26,92,97,.35)}.vault-drop{display:grid;place-items:center;margin-bottom:1.3rem;padding:2rem;border:1px dashed rgba(116,199,240,.35);background:rgba(116,199,240,.035);cursor:pointer}.vault-drop input{position:absolute;opacity:0;pointer-events:none}.vault-drop i{font-size:2rem;color:var(--sky)}.vault-drop strong{font:400 1.2rem var(--fd)}.vault-drop span,.vault-drop em{margin-top:.35rem;color:rgba(255,255,255,.36);font-size:.68rem}.vault-drop em{color:var(--sky)}.vm-segment{display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(255,255,255,.12)}.vm-segment label{padding:.8rem;cursor:pointer;font-size:.75rem}.vm-segment input{width:auto;margin-right:.4rem}.vm-users{max-height:230px;overflow:auto;margin-bottom:1rem;border:1px solid rgba(255,255,255,.09)}.vm-user-check{display:flex;align-items:center;gap:.7rem;padding:.7rem;border-bottom:1px solid rgba(255,255,255,.06);cursor:pointer}.vm-user-check>i,.vm-list-row>i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(116,199,240,.1);color:var(--sky);font:500 .55rem var(--fm)}.vm-user-check span,.vm-list-row>div{display:flex;flex:1;flex-direction:column;gap:.2rem}.vm-user-check b,.vm-list-row b{font-size:.75rem}.vm-user-check small,.vm-list-row small{color:rgba(255,255,255,.38);font-size:.63rem}.upload-progress{margin:.8rem 0;color:var(--sky);font-size:.7rem}.upload-progress i{display:inline-block;width:60%;height:2px;margin-right:1rem;background:linear-gradient(90deg,var(--sky),transparent);animation:vpulse 1.2s infinite}@keyframes vpulse{50%{opacity:.3}}.vm-profile{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.vm-profile label{color:var(--sky);font-size:.72rem;cursor:pointer}.vm-profile input{display:block;margin-top:.4rem;font-size:.62rem;color:rgba(255,255,255,.4)}.vm-list-tools{display:flex;gap:1rem;margin-bottom:1rem}.vm-list-tools input,.vm-list-tools select{padding:.8rem 1rem;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035)}.vm-list-row{display:flex;align-items:center;gap:.8rem;padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.07)}.vm-list-row button{padding:.5rem .7rem;border:1px solid rgba(255,255,255,.12);background:transparent;color:#fff;font:500 .58rem var(--fm);text-transform:uppercase;cursor:pointer}.status{padding:.35rem .6rem;border-radius:20px;background:rgba(255,255,255,.08);font:500 .55rem var(--fm);text-transform:uppercase}.status.active,.status.approved{color:#78ddb7}.status.pending{color:#f2c778}.status.disabled,.status.rejected{color:#f29292}.vault-toast-stack{position:fixed;right:1.5rem;bottom:1.5rem;z-index:6000;display:flex;flex-direction:column;gap:.6rem}.vault-toast{max-width:360px;padding:1rem 1.2rem;border-left:3px solid #65d2aa;background:#10251f;color:#d9fff1;box-shadow:0 15px 40px rgba(0,0,0,.35);font-size:.76rem;animation:vmpop .25s}.vault-toast.error{border-color:#ef7d7d;background:#2a161b;color:#ffdadd}
@media(max-width:1000px){.vault-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vault-welcome{align-items:flex-start;flex-direction:column}.vault-actions{grid-template-columns:repeat(2,1fr)}.vault-actions button:nth-child(2){border-right:0}.vault-actions button:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.09)}}
@media(max-width:700px){.vault-shell{padding:3rem 1.25rem 5rem}.vault-identity{flex-wrap:wrap}.vault-actions{grid-template-columns:1fr}.vault-actions button{border-right:0;border-bottom:1px solid rgba(255,255,255,.09)}.vault-toolbar{align-items:stretch;flex-direction:column}.vault-search{width:100%}.vault-toolbar select{width:100%}.vault-grid{grid-template-columns:1fr}.vault-modal-content{padding:1.3rem}.vm-list-row{align-items:flex-start;flex-wrap:wrap}.vm-list-row>div{min-width:55%}.vm-list-tools{flex-direction:column}}

/* Elevated action tiles */
.vault-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;border:0;background:transparent;backdrop-filter:none}
.vault-actions button{justify-content:flex-start;min-height:100px;padding:1.25rem 1.3rem;border:1px solid rgba(116,199,240,.2)!important;border-radius:14px;background:linear-gradient(145deg,rgba(32,115,171,.9),rgba(17,73,125,.94));box-shadow:0 14px 34px rgba(0,74,140,.2);overflow:hidden;text-align:left}
.vault-actions button::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.16) 48%,transparent 75%);transform:translateX(-130%);transition:transform .65s ease}
.vault-actions button:hover{background:linear-gradient(145deg,#2d91d1,#175b99);color:#fff;transform:translateY(-5px);box-shadow:0 20px 44px rgba(0,104,190,.32);border-color:rgba(116,199,240,.5)!important}
.vault-actions button:hover::after{transform:translateX(130%)}.vault-actions button>i{position:relative;z-index:1;display:grid;place-items:center;flex:0 0 44px;height:44px;border-radius:12px;background:rgba(255,255,255,.13);color:#d8f3ff;font-size:1.05rem}.vault-actions button>span{position:relative;z-index:1;display:flex;min-width:0;flex-direction:column;gap:.35rem}.vault-actions button strong{font:500 .68rem var(--fm);letter-spacing:.09em;text-transform:uppercase}.vault-actions button small{color:rgba(255,255,255,.6);font:400 .65rem var(--fb);letter-spacing:0;text-transform:none}.vault-actions b{z-index:2;background:#fff;color:#12558d;box-shadow:0 4px 12px rgba(0,0,0,.2)}

/* Reusable animated select */
.vselect{position:relative;min-width:170px}.vselect-trigger{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;min-height:43px;padding:.75rem .9rem;border:1px solid rgba(116,199,240,.18);border-radius:8px;background:rgba(8,26,42,.92);color:#fff;font:400 .75rem var(--fb);cursor:pointer;transition:border-color .22s,box-shadow .22s,background .22s}.vselect-trigger:hover,.vselect.open .vselect-trigger{border-color:rgba(116,199,240,.55);background:#0c263b;box-shadow:0 0 0 3px rgba(116,199,240,.07)}.vselect-trigger i{color:var(--sky);font-size:.68rem;transition:transform .28s}.vselect.open .vselect-trigger i{transform:rotate(180deg)}.vselect-menu{position:absolute;z-index:80;top:calc(100% + 7px);left:0;right:0;visibility:hidden;opacity:0;transform:translateY(-7px) scale(.98);padding:.4rem;border:1px solid rgba(116,199,240,.2);border-radius:10px;background:#0b1c2b;box-shadow:0 18px 45px rgba(0,0,0,.42);transition:opacity .2s,transform .2s,visibility .2s}.vselect.open .vselect-menu{visibility:visible;opacity:1;transform:none}.vselect-menu button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.72rem .75rem;border:0;border-radius:7px;background:transparent;color:rgba(255,255,255,.68);font:400 .74rem var(--fb);cursor:pointer;transition:background .18s,color .18s,transform .18s}.vselect-menu button:hover{background:rgba(116,199,240,.09);color:#fff;transform:translateX(2px)}.vselect-menu button i{opacity:0;color:var(--sky);font-size:.62rem}.vselect-menu button.selected{color:var(--sky);background:rgba(116,199,240,.06)}.vselect-menu button.selected i{opacity:1}.vm-field>.vselect{width:100%}.vm-list-tools .vselect{min-width:180px}.vm-list-tools{overflow:visible}.vault-modal{overflow:visible}.vault-modal-content{max-height:calc(100dvh - 150px);overflow:visible auto}

/* User avatar drag and drop */
.avatar-drop{position:relative;display:flex;align-items:center;gap:1rem;margin-bottom:1.4rem;padding:1rem;border:1px dashed rgba(116,199,240,.35);border-radius:14px;background:linear-gradient(135deg,rgba(116,199,240,.06),rgba(26,92,97,.07));cursor:pointer;transition:border-color .25s,background .25s,transform .25s}.avatar-drop:hover,.avatar-drop.dragging{border-color:var(--sky);background:rgba(116,199,240,.11);transform:translateY(-2px)}.avatar-drop>input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.avatar-preview{display:grid;place-items:center;flex:0 0 68px;height:68px;overflow:hidden;border:2px solid rgba(116,199,240,.45);border-radius:50%;background:#102739;color:var(--sky);font-size:1.25rem;box-shadow:0 8px 24px rgba(0,0,0,.25)}.avatar-preview img,.vault-avatar img,.vm-list-row>i img{width:100%;height:100%;object-fit:cover}.avatar-drop>div{display:flex;min-width:0;flex:1;flex-direction:column;gap:.35rem}.avatar-drop strong{font:400 1rem var(--fd)}.avatar-drop small{color:rgba(255,255,255,.4);font-size:.64rem;line-height:1.5}.avatar-drop>i{color:var(--sky);font-size:1rem}.vault-avatar{overflow:hidden}.vm-list-row>i{overflow:hidden}
@media(max-width:1000px){.vault-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.vault-actions{grid-template-columns:1fr}.vault-toolbar .vselect{width:100%}.vm-list-tools .vselect{width:100%}.avatar-drop{align-items:flex-start}.avatar-drop>i{display:none}}

/* Pending request alert state */
.vault-actions button.has-pending{border-color:rgba(111,211,255,.85)!important;background:linear-gradient(145deg,#278ed0,#124f91);box-shadow:0 0 0 1px rgba(116,199,240,.22),0 18px 48px rgba(0,119,210,.38);animation:pendingGlow 2.8s ease-in-out infinite}.vault-actions button.has-pending>i{background:#fff;color:#17689f}.vault-actions button.has-pending b{top:.65rem;right:.75rem;min-width:30px;height:30px;padding:0 8px;border-radius:15px;font-size:.72rem;box-shadow:0 6px 18px rgba(0,0,0,.28)}@keyframes pendingGlow{50%{box-shadow:0 0 0 4px rgba(116,199,240,.08),0 22px 55px rgba(0,119,210,.46)}}

/* Multi-file upload flow */
.upload-steps{display:flex;align-items:center;justify-content:center;margin-bottom:1.7rem}.upload-steps>b{display:grid;place-items:center;width:30px;height:30px;border:1px solid rgba(116,199,240,.25);border-radius:50%;color:rgba(255,255,255,.4);font:500 .62rem var(--fm);transition:.25s}.upload-steps>b.active,.upload-steps>b.done{border-color:var(--sky);background:linear-gradient(135deg,#2e95d1,#155f99);color:#fff;box-shadow:0 0 0 4px rgba(116,199,240,.08)}.upload-steps>i{width:64px;height:1px;background:rgba(116,199,240,.22)}.multi-drop{min-height:300px;border-radius:18px}.multi-drop.dragging{border-color:var(--sky);background:rgba(116,199,240,.12);transform:scale(1.01)}.multi-drop>i{font-size:2.8rem}.multi-drop em{margin-top:1rem;padding:.65rem 1rem;border-radius:8px;background:rgba(116,199,240,.1)}.upload-preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;max-height:430px;overflow:auto;padding:.2rem}.upload-preview-card{overflow:hidden;border:1px solid rgba(116,199,240,.13);border-radius:14px;background:rgba(255,255,255,.035);transition:border-color .25s,transform .25s}.upload-preview-card:hover{border-color:rgba(116,199,240,.4);transform:translateY(-2px)}.upload-preview-card>div{position:relative;display:grid;place-items:center;height:130px;overflow:hidden;background:#0b1a28;color:var(--sky);font-size:2.1rem}.upload-preview-card>div>img{width:100%;height:100%;object-fit:cover}.upload-preview-card>div>button{position:absolute;top:.6rem;right:.6rem;display:grid;place-items:center;width:30px;height:30px;border:0;border-radius:50%;background:rgba(5,13,23,.78);color:#fff;cursor:pointer;transition:.2s}.upload-preview-card>div>button:hover{background:#b44855;transform:scale(1.08)}.upload-preview-card>label{display:flex;flex-direction:column;gap:.35rem;padding:.8rem .8rem .3rem}.upload-preview-card label span{color:rgba(255,255,255,.4);font:500 .55rem var(--fm);letter-spacing:.1em;text-transform:uppercase}.upload-preview-card input{width:100%;padding:.65rem .7rem;border:1px solid rgba(255,255,255,.1);border-radius:7px;outline:0;background:rgba(255,255,255,.04);color:#fff;font-size:.75rem}.upload-preview-card input:focus{border-color:var(--sky)}.upload-preview-card>small{display:block;padding:.4rem .8rem .9rem;color:rgba(255,255,255,.35);font-size:.6rem}.upload-preview-actions{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.3rem}.vm-secondary{position:relative;padding:.85rem 1rem;border:1px solid rgba(116,199,240,.25);border-radius:8px;color:var(--sky);font:500 .65rem var(--fm);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}.vm-secondary input{position:absolute;inset:0;opacity:0;cursor:pointer}.vm-submit.inline{width:auto;margin:0;padding:.9rem 1.4rem}.upload-summary{display:flex;align-items:center;gap:1rem;margin-bottom:1.4rem;padding:1rem;border:1px solid rgba(116,199,240,.14);border-radius:12px;background:rgba(116,199,240,.05)}.upload-summary>i{color:var(--sky);font-size:1.2rem}.upload-summary>span{display:flex;flex:1;flex-direction:column;gap:.25rem}.upload-summary strong{font-size:.78rem}.upload-summary small{color:rgba(255,255,255,.38);font-size:.62rem}.upload-summary button{border:0;background:transparent;color:var(--sky);font:500 .6rem var(--fm);text-transform:uppercase;cursor:pointer}.visibility-segment{gap:.7rem;border:0}.visibility-segment label,.private-mode label{display:flex;align-items:center;gap:.75rem;border:1px solid rgba(255,255,255,.11);border-radius:11px;background:rgba(255,255,255,.025);transition:.25s}.visibility-segment label:has(input:checked),.private-mode label:has(input:checked){border-color:rgba(116,199,240,.65);background:rgba(31,126,188,.16);box-shadow:0 0 0 3px rgba(116,199,240,.05)}.visibility-segment label>i,.private-mode label>i{color:var(--sky)}.visibility-segment label span,.private-mode label span{display:flex;flex-direction:column;gap:.2rem}.visibility-segment b,.private-mode b{font-size:.72rem}.visibility-segment small,.private-mode small{color:rgba(255,255,255,.38);font-size:.6rem}.private-access{margin:1rem 0}.private-mode{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin-bottom:1rem}.private-mode label{padding:1rem;cursor:pointer}.private-mode input,.visibility-segment input{position:absolute;opacity:0}.user-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;max-height:280px;padding:.7rem;border:0}.vm-user-check{position:relative;border:1px solid rgba(255,255,255,.09)!important;border-radius:11px;background:rgba(255,255,255,.025);transition:background .25s,border-color .25s,transform .25s,box-shadow .25s}.vm-user-check:hover{border-color:rgba(116,199,240,.35)!important;transform:translateY(-2px)}.vm-user-check:has(input:checked){border-color:rgba(116,199,240,.7)!important;background:linear-gradient(135deg,rgba(34,130,194,.28),rgba(20,79,130,.22));box-shadow:0 8px 24px rgba(0,104,180,.16)}.vm-user-check>input{position:absolute;opacity:0}.vm-user-check>em{padding:.25rem .45rem;border-radius:12px;background:rgba(116,199,240,.08);color:var(--sky);font:500 .5rem var(--fm);text-transform:uppercase}.vm-user-check .checkmark{display:grid;place-items:center;width:20px;height:20px;opacity:0;border-radius:50%;background:var(--sky);color:#082037;font-size:.55rem;transform:scale(.7);transition:.25s}.vm-user-check:has(input:checked) .checkmark{opacity:1;transform:scale(1)}
@media(max-width:700px){.upload-preview-grid,.user-card-grid,.private-mode{grid-template-columns:1fr}.upload-preview-actions{align-items:stretch;flex-direction:column}.vm-secondary,.vm-submit.inline{width:100%;text-align:center}.upload-steps>i{width:34px}}

/* Permissions polish */
.visibility-segment label,.private-mode label{position:relative;padding-right:2.5rem}.visibility-segment .option-icon,.private-mode .option-icon{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:9px;background:rgba(116,199,240,.09);font-size:.9rem}.choice-check{position:absolute;top:50%;right:.9rem;opacity:0;color:var(--sky);font-size:.95rem;transform:translateY(-50%) scale(.65);transition:opacity .22s,transform .22s}.visibility-segment label:has(input:checked) .choice-check,.private-mode label:has(input:checked) .choice-check{opacity:1;transform:translateY(-50%) scale(1)}.private-mode #selectedPeopleCount{display:inline-grid;place-items:center;min-width:21px;height:21px;margin-right:.2rem;padding:0 6px;border-radius:11px;background:rgba(116,199,240,.16);color:var(--sky);font:600 .58rem var(--fm)}.people-search{display:flex;align-items:center;gap:.65rem;margin-bottom:.75rem;padding:0 .8rem;border:1px solid rgba(116,199,240,.18);border-radius:10px;background:rgba(7,22,35,.75);color:var(--sky);transition:border-color .2s,box-shadow .2s}.people-search:focus-within{border-color:rgba(116,199,240,.6);box-shadow:0 0 0 3px rgba(116,199,240,.07)}.people-search input{min-width:0;flex:1;padding:.78rem 0;border:0;outline:0;background:transparent;color:#fff;font:.76rem var(--fb)}.people-search button{display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:50%;background:transparent;color:rgba(255,255,255,.4);cursor:pointer;transition:.2s}.people-search button:hover{background:rgba(116,199,240,.1);color:var(--sky)}.people-no-results{padding:1rem;text-align:center;color:rgba(255,255,255,.4);font-size:.72rem}.vm-user-check[hidden]{display:none!important}.vm-user-check .checkmark{display:grid;place-items:center;flex:0 0 20px;width:20px;height:20px;opacity:0;border-radius:50%;background:var(--sky);color:#082037;font-size:.55rem;transform:scale(.7);transition:.25s}.vm-user-check .checkmark i{font-size:.55rem}.vm-user-check:has(input:checked) .checkmark{opacity:1;transform:scale(1)}

/* Compact media cards and larger actions */
.vault-grid{gap:1.15rem}.vault-preview{height:178px}.vault-card-body{padding:1rem}.vault-file-head h3{font-size:1.08rem}.vault-file-head p{margin-top:.15rem;font-size:.59rem}.vault-compact-meta{display:flex;align-items:center;gap:.65rem;margin-top:.7rem;color:rgba(255,255,255,.42);font:400 .55rem var(--fm);text-transform:uppercase}.vault-compact-meta>span{display:flex;align-items:center;gap:.35rem;white-space:nowrap}.vault-compact-meta i{color:rgba(116,199,240,.65)}.vault-compact-meta .access-pill{margin-left:auto;padding:.3rem .5rem;border-radius:20px;background:rgba(116,199,240,.07);color:var(--sky)}.vault-card-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-top:.9rem;padding-top:.85rem;border-top:1px solid rgba(255,255,255,.07)}.vault-card-actions a,.vault-card-actions button{display:flex;align-items:center;justify-content:center;gap:.4rem;min-height:40px;padding:.55rem .45rem;border:1px solid rgba(116,199,240,.13);border-radius:8px;background:rgba(116,199,240,.04);color:rgba(255,255,255,.72);font:500 .56rem var(--fm);letter-spacing:.04em;text-transform:uppercase;transition:.2s}.vault-card-actions a:hover,.vault-card-actions button:hover{border-color:rgba(116,199,240,.5);background:rgba(38,137,201,.14);color:#fff;transform:translateY(-2px)}.vault-card-actions i{color:var(--sky);font-size:.72rem}.vault-card-actions .danger{border-color:rgba(242,146,146,.12);color:#f2a1a1}.vault-card-actions .danger i{color:#ef8d97}.vault-card-actions .danger:hover{border-color:rgba(239,125,125,.42);background:rgba(180,56,72,.12)}

/* Prominent user management action */
.manage-users-btn{display:flex;align-items:center;gap:.7rem;min-height:48px;padding:.55rem .8rem;border:1px solid rgba(116,199,240,.38);border-radius:10px;background:linear-gradient(135deg,rgba(34,130,194,.3),rgba(16,75,124,.3));color:#fff;cursor:pointer;box-shadow:0 8px 24px rgba(0,91,160,.14);transition:.25s}.manage-users-btn:hover{border-color:var(--sky);background:linear-gradient(135deg,rgba(42,150,220,.45),rgba(20,92,151,.42));transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,104,180,.22)}.manage-users-btn>i:first-child{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;background:rgba(116,199,240,.13);color:var(--sky)}.manage-users-btn>span{display:flex;flex-direction:column;gap:.15rem;text-align:left}.manage-users-btn strong{font:500 .62rem var(--fm);letter-spacing:.08em;text-transform:uppercase}.manage-users-btn small{color:rgba(255,255,255,.46);font-size:.58rem}.manage-users-btn>i:last-child{margin-left:.2rem;color:var(--sky);font-size:.65rem;transition:transform .2s}.manage-users-btn:hover>i:last-child{transform:translateX(3px)}

/* Admin panel responsive refinements */
@media(max-width:1180px){.vault-shell{padding-inline:3rem}.vault-toolbar{display:grid;grid-template-columns:1fr minmax(220px,1fr) 170px}.vault-toolbar>div:first-child{grid-column:1/-1}.manage-users-btn{grid-column:auto}.vault-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){.vault-shell{padding:2.5rem 1.5rem 4rem}.vault-welcome{gap:1.5rem}.vault-welcome h1{font-size:clamp(2.4rem,10vw,3.5rem)}.vault-identity{width:100%;min-width:0}.vault-identity .vtext-btn{margin-left:auto}.vault-toolbar{display:flex;align-items:stretch;flex-direction:column}.vault-toolbar>div:first-child{margin-right:0}.vault-search,.vault-toolbar #fileTypeSlot,.vault-toolbar .vselect,.manage-users-btn{width:100%}.manage-users-btn>i:last-child{margin-left:auto}.vault-grid{grid-template-columns:1fr}.vault-preview{height:220px}.vault-modal-layer{padding:.65rem}.vault-modal{max-height:calc(100dvh - 1.3rem);border-radius:14px}.vault-modal>header{padding:1.25rem}.vault-modal-content{max-height:calc(100dvh - 115px);padding:1.15rem}.visibility-segment,.private-mode{grid-template-columns:1fr}.user-card-grid{grid-template-columns:1fr}.vault-card-actions{grid-template-columns:repeat(3,1fr)}}
@media(max-width:480px){.vault-shell{padding-inline:1rem}.vault-actions button{min-height:88px}.vault-avatar{flex:0 0 42px}.vault-identity>div{min-width:0}.vault-identity strong{display:block;max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vault-preview{height:180px}.vault-compact-meta{align-items:flex-start;flex-wrap:wrap}.vault-compact-meta .access-pill{margin-left:0}.vault-card-actions{gap:.35rem}.vault-card-actions a,.vault-card-actions button{min-height:42px;padding:.45rem .25rem}.vault-card-actions span{font-size:.5rem}.upload-summary{align-items:flex-start;flex-wrap:wrap}.upload-summary button{margin-left:2rem}.vm-user-check{padding:.65rem}.vm-user-check>em{display:none}}

/* Authenticated profile control */
.vault-identity{display:flex;align-items:stretch;gap:.7rem;min-width:0}.vault-profile-trigger{display:flex;align-items:center;gap:.9rem;min-width:280px;padding:.72rem .8rem;border:1px solid rgba(116,199,240,.16);border-radius:16px;background:linear-gradient(135deg,rgba(116,199,240,.08),rgba(255,255,255,.025));color:#fff;cursor:pointer;text-align:left;box-shadow:0 12px 32px rgba(0,0,0,.16);transition:transform .25s,border-color .25s,background .25s,box-shadow .25s}.vault-profile-trigger:hover{transform:translateY(-3px);border-color:rgba(116,199,240,.5);background:linear-gradient(135deg,rgba(38,139,204,.18),rgba(26,92,97,.12));box-shadow:0 18px 38px rgba(0,0,0,.24)}.vault-profile-trigger .vault-avatar{position:relative;flex:0 0 54px;width:54px;height:54px;box-shadow:0 0 0 4px rgba(116,199,240,.1),0 8px 24px rgba(0,0,0,.26)}.vault-profile-trigger .vault-avatar::after{content:'';position:absolute;right:1px;bottom:1px;width:10px;height:10px;border:2px solid #0c1b28;border-radius:50%;background:#5bd7a1;box-shadow:0 0 8px rgba(91,215,161,.65)}.vault-profile-copy{display:flex;min-width:0;flex:1;flex-direction:column;gap:.18rem}.vault-profile-copy strong{max-width:155px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 .84rem var(--fb)}.vault-profile-copy small{font:500 .55rem var(--fm);letter-spacing:.16em;text-transform:uppercase;color:var(--sky)}.vault-profile-copy em{margin-top:.15rem;color:rgba(255,255,255,.32);font:400 .57rem var(--fb);font-style:normal;transition:color .2s}.vault-profile-trigger:hover .vault-profile-copy em{color:rgba(255,255,255,.65)}.vault-profile-trigger>i{color:rgba(116,199,240,.55);font-size:.65rem;transition:transform .2s,color .2s}.vault-profile-trigger:hover>i{color:var(--sky);transform:translateX(3px)}.vault-signout{display:flex;align-items:center;justify-content:center;gap:.45rem;padding:0 .9rem;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:rgba(255,255,255,.025);color:rgba(255,255,255,.52);font:500 .58rem var(--fm);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:.22s}.vault-signout:hover{border-color:rgba(242,146,146,.35);background:rgba(180,56,72,.1);color:#f3a8af;transform:translateY(-2px)}

/* Dark site navigation only inside the authenticated vault */
body.vault-authenticated .nav{background:rgba(6,16,27,.94);border-bottom-color:rgba(116,199,240,.14);box-shadow:0 12px 34px rgba(0,0,0,.22);backdrop-filter:blur(18px);transition:background .35s,border-color .35s,box-shadow .35s}body.vault-authenticated .nav::after{content:'';position:absolute;right:3.5rem;bottom:-1px;left:3.5rem;height:1px;background:linear-gradient(90deg,transparent,rgba(116,199,240,.3),transparent)}body.vault-authenticated .nav-logo{color:#fff}body.vault-authenticated .nav-logo span{color:var(--sky)}body.vault-authenticated .nl li button{color:rgba(255,255,255,.58)}body.vault-authenticated .nl li button:hover,body.vault-authenticated .nl li button.act{color:var(--sky)}body.vault-authenticated .nl li button::after{background:var(--sky)}body.vault-authenticated .n-cta{border-color:rgba(116,199,240,.6)!important;color:var(--sky)!important}body.vault-authenticated .n-cta::before{background:var(--sky)!important}body.vault-authenticated .n-cta:hover{color:#07101a!important;border-color:var(--sky)!important}body.vault-authenticated .hbg span{background:#fff}body.vault-authenticated .mm{background:#081522;border-bottom-color:rgba(116,199,240,.15)}body.vault-authenticated .mm button{border-bottom-color:rgba(255,255,255,.07);color:rgba(255,255,255,.68)}body.vault-authenticated .mm button:hover{color:var(--sky)}
@media(max-width:820px){.vault-identity{width:100%}.vault-profile-trigger{min-width:0;flex:1}.vault-signout{flex:0 0 auto}.vault-signout span{display:none}.vault-signout i{font-size:.85rem}body.vault-authenticated .nav::after{right:1.5rem;left:1.5rem}}
@media(max-width:480px){.vault-profile-trigger{padding:.65rem}.vault-profile-trigger .vault-avatar{flex-basis:46px;width:46px;height:46px}.vault-profile-copy strong{max-width:125px}.vault-profile-copy em{display:none}.vault-signout{padding:0 .75rem}}

/* Profile status and refined sign-out */
.vault-profile-trigger .vault-avatar{overflow:visible}.vault-profile-trigger .vault-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.vault-profile-trigger .vault-avatar::after{right:-2px;bottom:2px;z-index:3;width:11px;height:11px;border:3px solid #0b1b29;box-shadow:0 0 0 2px rgba(91,215,161,.14),0 0 10px rgba(91,215,161,.8)}.vault-signout{align-self:center;gap:.65rem;padding:.45rem .55rem;border:0;border-radius:10px;background:transparent;box-shadow:none}.vault-signout .signout-icon{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(255,255,255,.035);color:rgba(255,255,255,.55);transition:.22s}.vault-signout .signout-copy{display:flex;flex-direction:column;gap:.1rem;text-align:left}.vault-signout .signout-copy strong{color:rgba(255,255,255,.66);font:500 .58rem var(--fm);letter-spacing:.08em;text-transform:uppercase}.vault-signout .signout-copy small{color:rgba(255,255,255,.26);font-size:.54rem;white-space:nowrap}.vault-signout:hover{border:0;background:rgba(180,56,72,.06);transform:none}.vault-signout:hover .signout-icon{border-color:rgba(242,146,146,.4);background:rgba(180,56,72,.12);color:#f3a8af;transform:translateX(2px)}.vault-signout:hover .signout-copy strong{color:#f3a8af}

/* Access request inbox */
.request-overview{display:flex;align-items:center;gap:1.4rem;margin-bottom:1.4rem;padding:1.15rem 1.25rem;border:1px solid rgba(116,199,240,.16);border-radius:14px;background:linear-gradient(135deg,rgba(38,137,201,.12),rgba(12,34,52,.35))}.request-overview>div{display:flex;align-items:center;gap:.8rem;min-width:max-content}.request-overview>div>i{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg,#278ece,#15578f);color:#fff;box-shadow:0 10px 26px rgba(0,99,171,.25)}.request-overview span{display:flex;flex-direction:column}.request-overview strong{font:300 1.7rem/1 var(--fd);color:#fff}.request-overview small{margin-top:.2rem;color:var(--sky);font:500 .54rem var(--fm);letter-spacing:.08em;text-transform:uppercase}.request-overview p{margin-left:auto;max-width:390px;color:rgba(255,255,255,.4);font-size:.7rem;line-height:1.6}.request-tabs{display:flex;align-items:center;gap:.5rem;margin-bottom:.65rem;padding:.55rem .2rem;border-bottom:1px solid rgba(255,255,255,.07)}.request-tabs span{display:flex;align-items:center;gap:.5rem;color:#fff;font:500 .62rem var(--fm);letter-spacing:.07em;text-transform:uppercase}.request-tabs span i{color:var(--sky)}.request-tabs b{display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:12px;background:rgba(116,199,240,.1);color:var(--sky);font-size:.56rem}.request-list{display:grid;gap:.7rem;max-height:440px;overflow:auto;padding:.2rem}.request-card{display:grid;grid-template-columns:minmax(200px,1.4fr) 1fr auto;align-items:center;gap:1rem;padding:1rem;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.025);transition:.25s}.request-card:hover{border-color:rgba(116,199,240,.25);background:rgba(116,199,240,.045);transform:translateY(-2px)}.request-card.pending{border-left:3px solid #efc66c}.request-person{display:flex;align-items:center;gap:.75rem;min-width:0}.request-person>i{display:grid;place-items:center;flex:0 0 40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(42,140,202,.38),rgba(21,87,143,.4));color:var(--sky);font:500 .6rem var(--fm);font-style:normal}.request-person>span{display:flex;min-width:0;flex-direction:column;gap:.2rem}.request-person strong,.request-person small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.request-person strong{font-size:.76rem}.request-person small{color:rgba(255,255,255,.38);font-size:.62rem}.request-meta{display:flex;align-items:center;gap:.65rem;color:rgba(255,255,255,.35);font:400 .56rem var(--fm);text-transform:uppercase}.request-meta>span,.request-meta em{display:flex;align-items:center;gap:.35rem}.request-meta>span i{color:rgba(116,199,240,.55)}.request-meta .status{font-style:normal}.request-actions{display:flex;gap:.45rem}.request-actions button{display:flex;align-items:center;gap:.38rem;min-height:36px;padding:.55rem .7rem;border-radius:8px;font:500 .53rem var(--fm);letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:.2s}.request-actions .approve{border:1px solid rgba(91,215,161,.28);background:rgba(91,215,161,.08);color:#8ee7bf}.request-actions .approve:hover{background:rgba(91,215,161,.16);transform:translateY(-2px)}.request-actions .reject{border:1px solid rgba(239,125,125,.22);background:rgba(180,56,72,.06);color:#f2a1a1}.request-actions .reject:hover{background:rgba(180,56,72,.14);transform:translateY(-2px)}.request-reviewed{color:rgba(255,255,255,.3);font:500 .53rem var(--fm);text-transform:uppercase}.request-empty{display:grid;place-items:center;min-height:240px;text-align:center}.request-empty>i{display:grid;place-items:center;width:62px;height:62px;margin-bottom:.7rem;border-radius:18px;background:rgba(91,215,161,.08);color:#78ddb7;font-size:1.25rem}.request-empty h3{font:300 1.7rem var(--fd)}.request-empty p{margin-top:.35rem;color:rgba(255,255,255,.36);font-size:.7rem}

/* Secure upload loader */
.upload-progress{display:flex;align-items:center;gap:1rem;margin:1rem 0;padding:1rem;border:1px solid rgba(116,199,240,.2);border-radius:14px;background:linear-gradient(135deg,rgba(38,137,201,.11),rgba(7,23,37,.55));color:#fff}.upload-progress[hidden]{display:none}.upload-loader-ring{position:relative;display:grid;place-items:center;flex:0 0 52px;height:52px;border-radius:50%;background:rgba(116,199,240,.08);color:var(--sky)}.upload-loader-ring::before{content:'';position:absolute;inset:0;border:2px solid rgba(116,199,240,.16);border-top-color:var(--sky);border-radius:50%;animation:vspin .9s linear infinite}.upload-loader-ring i{font-size:.9rem;animation:uploadFloat 1.3s ease-in-out infinite}.upload-loader-copy{position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;flex:1;gap:.25rem .8rem}.upload-loader-copy strong{font-size:.72rem}.upload-loader-copy small{grid-column:1;color:rgba(255,255,255,.36);font-size:.6rem}.upload-loader-copy em{grid-column:2;grid-row:1/3;color:var(--sky);font:500 .56rem var(--fm);font-size:0;font-style:normal;text-transform:uppercase}.upload-loader-copy em::after{content:'Secure';font-size:.56rem}.upload-progress-track{grid-column:1/-1;position:relative;height:5px;margin-top:.35rem;overflow:hidden;border-radius:4px;background:rgba(255,255,255,.07)}.upload-progress-track span{position:absolute;inset:0 auto 0 0;width:38%;border-radius:4px;background:linear-gradient(90deg,#278ed0,var(--sky));box-shadow:0 0 12px rgba(116,199,240,.5);animation:uploadTrack 1.35s ease-in-out infinite}@keyframes uploadTrack{0%{transform:translateX(-110%)}100%{transform:translateX(290%)}}@keyframes uploadFloat{50%{transform:translateY(-3px)}}
@media(max-width:820px){.vault-signout .signout-copy{display:none}.vault-signout .signout-icon{display:grid}.request-overview{align-items:flex-start;flex-direction:column}.request-overview p{margin-left:0}.request-card{grid-template-columns:1fr}.request-actions{width:100%}.request-actions button{flex:1;justify-content:center}.request-reviewed{justify-self:start}}

/* ═══════════════════════════════════════════
   VAULT HERO - SPLIT LAYOUT
   ═══════════════════════════════════════════ */
.vhero{padding:0;border-bottom:1px solid rgba(255,255,255,.05);position:relative;overflow:hidden;min-height:calc(100dvh - 72px)}
.vgrid{position:absolute;inset:0;background-image:linear-gradient(rgba(116,199,240,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(116,199,240,.04) 1px,transparent 1px);background-size:50px 50px}
.vb1{width:600px;height:600px;background:rgba(26,92,97,.25);top:-200px;right:-100px;animation-delay:-3s}
.vb2{width:350px;height:350px;background:rgba(116,199,240,.06);bottom:-100px;left:10%;animation-delay:-11s}

/* Split container */
.vhero-split{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;min-height:calc(100dvh - 72px)}

/* Left - image */
.vhero-left{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:6rem 4rem 4rem 4rem}
.vhero-img{position:absolute;inset:0;z-index:0}
.vhero-img img{width:100%;height:100%;object-fit:cover;object-position:center 25%;filter:saturate(.85) contrast(1.05)}
.vhero-img-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(7,16,26,.95) 0%,rgba(7,16,26,.6) 40%,transparent 100%);pointer-events:none}
.vhero-left-content{position:relative;z-index:1;max-width:560px}

/* Right - form */
.vhero-right{display:flex;align-items:center;justify-content:center;padding:4rem;position:relative;background:rgba(7,16,26,.85)}
.vhero-right-bg{position:absolute;inset:0;background-image:url("../../images/Produktionen.webp");background-size:cover;background-position:center;opacity:0.15;mix-blend-mode:overlay;z-index:0;pointer-events:none}

.vtabs-head{margin-bottom:2rem;text-align:left}
.vtabs-head h2{font-family:var(--fd);font-size:2rem;font-weight:300;color:#fff;margin-bottom:.4rem;line-height:1.1}
.vtabs-head p{font-family:var(--fm);font-size:.75rem;color:rgba(255,255,255,.5);letter-spacing:.05em}

.vh1{font-family:var(--fd);font-size:clamp(2.5rem,5vw,4.5rem);font-weight:300;line-height:1.04;color:#fff;margin-bottom:1.35rem;position:relative;z-index:1}
.vh1 em{font-style:italic;color:var(--sky)}
.vsub{font-size:.9rem;line-height:1.85;color:rgba(255,255,255,.42);max-width:560px;margin-bottom:2.5rem;position:relative;z-index:1}

/* Kittys-Salon casting-upload callout, About/Media Hub login hero */
.vkittys{position:relative;z-index:1;max-width:480px;padding:1.5rem 1.75rem;border:1px solid rgba(194,147,67,.3);border-radius:12px;background:rgba(255,255,255,.03);backdrop-filter:blur(6px)}
.vkittys-label{display:block;font-family:var(--fm);font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:var(--color-frame-gold);margin-bottom:.65rem}
.vkittys-text{font-size:.82rem;line-height:1.7;color:rgba(255,255,255,.55);margin-bottom:1.1rem}
.vkittys-row{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap}
.vkittys-contact{font-family:var(--fm);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.4)}
.vkittys-btn{display:inline-block;font-family:var(--fm);font-size:.72rem;letter-spacing:.06em;font-weight:600;color:#1a1204;background:linear-gradient(135deg,var(--color-frame-gold),#e0b96a);padding:.55rem 1.15rem;border-radius:30px;transition:transform .22s ease,box-shadow .22s ease}
.vkittys-btn:hover,.vkittys-btn:focus-visible{transform:translateY(-2px);box-shadow:0 8px 20px rgba(194,147,67,.4)}
@media(max-width:700px){.vkittys{padding:1.25rem 1.35rem}}

/* ═══════════════════════════════════════════
   TAB SYSTEM
   ═══════════════════════════════════════════ */
.vtabs{position:relative;z-index:1;width:100%}
.vtab-bar{display:flex;position:relative;border:1px solid rgba(116,199,240,.2);border-radius:8px;margin-bottom:2rem;background:rgba(7,16,26,.4);overflow:hidden}
.vtab-btn{flex:1;padding:.75rem 1.5rem;font-family:var(--fm);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.4);background:none;border:none;cursor:pointer;position:relative;z-index:2;transition:color .35s ease}
.vtab-btn.vtab-active{color:#fff}
/* Animated slider */
.vtab-slider{position:absolute;top:0;left:0;width:50%;height:100%;background:var(--teal);transition:transform .4s cubic-bezier(.4,0,.2,1);z-index:1}
.vtab-bar[data-active="1"] .vtab-slider{transform:translateX(100%)}

/* Panels */
.vtab-panels{position:relative;overflow:hidden}
.vtab-panel{display:none;flex-direction:column;gap:1.25rem;animation:vtabFadeIn .4s ease}
.vtab-panel.vtab-panel-active{display:flex}
@keyframes vtabFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* Fields */
.vfield{display:flex;flex-direction:column;gap:.4rem}
.vflbl{font-family:var(--fm);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.vin{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:6px;padding:.85rem 2.5rem .85rem 1.2rem;font-family:var(--fm);font-size:.85rem;color:#fff;outline:none;transition:border-color .25s ease,background .25s ease,box-shadow .25s}
.vin:focus{border-color:var(--sky);background:rgba(255,255,255,.08);box-shadow:0 0 0 2px rgba(116,199,240,.15)}
.vpw-eye{position:absolute;right:0.6rem;bottom:0.75rem;background:none;border:none;color:var(--sky);opacity:0.6;cursor:pointer;transition:opacity .25s, transform .25s;display:flex;align-items:center;justify-content:center;padding:0.2rem}
.vpw-eye:hover{opacity:1;transform:scale(1.1)}
.vin::placeholder{color:rgba(255,255,255,.22);letter-spacing:.07em}
.vsub2{width:100%;background:linear-gradient(135deg,var(--teal),var(--tl));border:none;border-radius:6px;padding:1rem 1.4rem;font-family:var(--fm);font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#fff;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,filter .25s;margin-top:1rem;box-shadow:0 8px 24px rgba(26,92,97,.2)}
.vsub2:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(26,92,97,.4);filter:brightness(1.1)}
.vmsg{display:none;margin-top:1rem;font-family:var(--fm);font-size:.7rem;letter-spacing:.1em;color:var(--sky)}

/* ═══════════════════════════════════════════
   VAULT CARDS (preserved & enhanced)
   ═══════════════════════════════════════════ */
.vprojs{padding:5rem 6rem 2rem 6rem;display:grid;grid-template-columns:1fr 1fr;gap:2rem;background:transparent;position:relative;z-index:1}
.vp{background:rgba(20,30,45,.4);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:3rem 2.5rem;position:relative;overflow:hidden;cursor:pointer;transition:transform .4s cubic-bezier(.4,0,.2,1), box-shadow .4s, border-color .4s, background .4s;backdrop-filter:blur(16px)}
.vp:hover{background:rgba(30,42,60,.5);transform:translateY(-6px);box-shadow:0 24px 48px rgba(0,0,0,.5);border-color:rgba(116,199,240,.25)}
.vp::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--teal),var(--sky));transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.4,0,.2,1)}
.vp:hover::before{transform:scaleX(1)}
.vp::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 100% 100%,rgba(116,199,240,.08) 0%,transparent 60%);opacity:0;transition:opacity .4s}
.vp:hover::after{opacity:1}
.vst{display:flex;align-items:center;gap:.6rem;font-family:var(--fm);font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:1.5rem;position:relative;z-index:1}
.vd{width:6px;height:6px;border-radius:50%}
.vd.lv{background:#22d072;animation:bk 2s ease-in-out infinite;box-shadow:0 0 8px #22d072}
.vd.av{background:var(--sky);box-shadow:0 0 8px var(--sky)}.vd.ar{background:var(--gm)}
.vst.lv{color:#22d072}.vst.av{color:var(--sky)}.vst.ar{color:var(--gm)}
.vtit{font-family:var(--fd);font-size:1.6rem;font-weight:300;color:#fff;line-height:1.25;margin-bottom:1rem;position:relative;z-index:1}
.vmeta2{font-size:.82rem;color:rgba(255,255,255,.45);line-height:1.75;margin-bottom:2rem;position:relative;z-index:1}
.vtags{display:flex;gap:.5rem;flex-wrap:wrap;position:relative;z-index:1}
.vtag{font-family:var(--fm);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;padding:.3rem .75rem;border:1px solid rgba(116,199,240,.2);color:var(--sky);border-radius:30px;background:rgba(116,199,240,.04)}

/* Security Badges */
.vsec{padding:4rem 6rem 6rem 6rem;background:transparent;display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;position:relative;z-index:1}
.sei{display:flex;flex-direction:column;align-items:flex-start;gap:.85rem;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);border-radius:12px;padding:2rem 1.5rem;transition:background .35s, transform .35s, border-color .35s}
.sei:hover{background:rgba(255,255,255,.04);transform:translateY(-3px);border-color:rgba(255,255,255,.1)}
.seic{font-size:1.6rem;color:var(--sky)}
.set strong{display:block;font-family:var(--fm);font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.75);margin-bottom:.4rem}
.set span{font-size:.75rem;color:rgba(255,255,255,.35)}

/* Responsive */
@media(max-width:1100px){
  .vhero-split{display:flex;flex-direction:column-reverse}
  .vhero-left{padding:6rem 3rem 4rem;background-image:linear-gradient(to top,rgba(7,16,26,.98) 0%,rgba(7,16,26,.7) 40%,rgba(7,16,26,.4) 100%),url("../../images/gallery/tv-film/Produktionen-10.webp");background-size:cover;background-position:center 25%;justify-content:flex-end}
  .vhero-img{display:none}
  .vhero-right{padding:4rem 3rem}
}
@media(max-width:768px){
  .vhero-left{padding:4rem 2rem 1rem}
  .vhero-right{padding:3rem 2rem}
  .vtabs{max-width:100%}
  .vprojs{grid-template-columns:1fr;padding:3rem 2rem 1rem 2rem}
  .vsec{grid-template-columns:1fr;padding:1rem 2rem 4rem 2rem}
}

/* ═══════════════════════════════════════════
   BRAND REFRESH - Deep Sea / Luxury Gold / Pearl Foam
   Brightens the Vault's base surfaces and gives the primary sign-in action
   and a few premium accents a warmer, gold-forward treatment, without
   touching layout, forms, uploads, auth, or any JS-driven behavior.
   ═══════════════════════════════════════════ */
.vpage{background:linear-gradient(165deg,var(--color-deep-sea) 0%,#0f3f54 55%,#155069 100%)}
.vault-shell{background:linear-gradient(160deg,#0b3247 0%,var(--color-deep-sea) 52%,#124258 100%)}
.vault-ambient{background:radial-gradient(circle at 10% 5%,rgba(212,175,55,.08),transparent 30%),radial-gradient(circle at 90% 20%,rgba(116,199,240,.14),transparent 38%)}
/* Primary CTA - sign in / send request, gold-forward for a premium feel */
.vsub2{background:linear-gradient(135deg,var(--color-frame-gold),#a97d33);color:#fff;box-shadow:0 8px 24px rgba(194,147,67,.3)}
.vsub2:hover{box-shadow:0 12px 28px rgba(194,147,67,.42);filter:brightness(1.05)}
.vtab-slider{background:var(--color-frame-gold)}
.vtab-btn.vtab-active{color:var(--color-deep-sea)}

/* ═══════════════════════════════════════════
   LOGIN PANEL - CINEMATIC DARK & GOLD
   Replaces an earlier near-flat pale-yellow treatment (two almost-identical
   pastel stops - #FDF7D9 into #fbf3d8 - reading as a static yellow field,
   with gold-on-pale-gold decoration too low-contrast to register). This
   panel now carries real dark-to-gold depth, and the star/particle/orbit
   layer is duplicated into BOTH .vhero-left and .vhero-right (see
   .vhero-atmos below) so the atmosphere covers the whole hero, not just
   the form side. It has to live *inside* each panel, painted above that
   panel's own opaque background/photo and below that panel's text/form -
   a layer placed outside both panels would just render behind their
   opaque backgrounds and never be seen.
   ═══════════════════════════════════════════ */
.vhero-right{background:linear-gradient(155deg,#050b13 0%,var(--color-deep-sea) 46%,#1c3d4e 76%,#2c2115 100%)}
.vhero-right-bg{opacity:.06}

/* Shared wrapper (used once inside .vhero-left, once inside .vhero-right) -
   carries the mouse/scroll parallax translate (--mx/--my, set by
   initHeroMotion() in media-vault.js) on its own `transform`, so it never
   collides with each child's own rotate/twinkle keyframe - two animations
   fighting over one element's `transform` would just have the last one
   win every frame. Both instances inherit the same --mx/--my from the
   shared #vaultAuth ancestor. */
.vhero-atmos{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:visible;
  transform:translate3d(calc(var(--mx,0)*10px),calc(var(--my,0)*10px),0);
  transition:transform .5s cubic-bezier(.2,.8,.2,1);will-change:transform}
.vstars{position:absolute;inset:0;opacity:.75;
  background-image:
    radial-gradient(1.6px 1.6px at 6% 15%, rgba(255,247,222,.95), transparent 60%),
    radial-gradient(1.2px 1.2px at 14% 42%, rgba(230,195,120,.75), transparent 60%),
    radial-gradient(1.4px 1.4px at 22% 8%, rgba(255,247,222,.85), transparent 60%),
    radial-gradient(1.1px 1.1px at 31% 60%, rgba(230,195,120,.6), transparent 60%),
    radial-gradient(1.8px 1.8px at 40% 24%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(1.2px 1.2px at 48% 72%, rgba(230,195,120,.65), transparent 60%),
    radial-gradient(1.5px 1.5px at 57% 12%, rgba(255,247,222,.85), transparent 60%),
    radial-gradient(1.1px 1.1px at 63% 48%, rgba(230,195,120,.55), transparent 60%),
    radial-gradient(1.7px 1.7px at 70% 30%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(1.2px 1.2px at 77% 66%, rgba(230,195,120,.6), transparent 60%),
    radial-gradient(1.4px 1.4px at 84% 18%, rgba(255,247,222,.85), transparent 60%),
    radial-gradient(1.1px 1.1px at 90% 52%, rgba(230,195,120,.6), transparent 60%),
    radial-gradient(1.3px 1.3px at 10% 80%, rgba(230,195,120,.55), transparent 60%),
    radial-gradient(1.5px 1.5px at 95% 78%, rgba(255,230,160,.8), transparent 60%);
  animation:vStarTwinkle 9s ease-in-out infinite;
}
/* Faint constellation lines, drifting very slowly for depth. */
.vstars::after{content:'';position:absolute;inset:0;opacity:.4;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 500'%3E%3Cg fill='none' stroke='%23e6c378' stroke-width='.7'%3E%3Cpath d='M60 90 L120 140 L200 100 M200 100 L270 150'/%3E%3Cpath d='M420 260 L480 220 L540 280 L600 240'/%3E%3Cpath d='M640 90 L690 130 L660 190'/%3E%3C/g%3E%3C/svg%3E");
  background-size:100% 100%;background-repeat:no-repeat;animation:vConstellationDrift 55s ease-in-out infinite}
/* Left-side (over the portrait) - screen blend so only the light gold
   specks contribute; the photo shows through untouched everywhere else. */
.vstars-left{opacity:.5;mix-blend-mode:screen}
.vstars-left::after{opacity:.28}
@keyframes vStarTwinkle{0%,100%{opacity:.5}50%{opacity:.85}}
@keyframes vConstellationDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(-10px,7px)}}
/* Soft drifting particles - distinct from the twinkling stars: these move
   position slowly rather than just fading in place. Form side only. */
.vparticles{position:absolute;inset:0;opacity:.6}
.vparticles::before,.vparticles::after{content:'';position:absolute;inset:-10%;
  background-image:
    radial-gradient(2px 2px at 20% 30%, rgba(255,230,170,.85), transparent 70%),
    radial-gradient(1.6px 1.6px at 60% 65%, rgba(255,230,170,.6), transparent 70%),
    radial-gradient(2px 2px at 80% 20%, rgba(255,230,170,.75), transparent 70%),
    radial-gradient(1.4px 1.4px at 35% 80%, rgba(255,230,170,.55), transparent 70%),
    radial-gradient(1.8px 1.8px at 90% 55%, rgba(255,230,170,.65), transparent 70%),
    radial-gradient(1.5px 1.5px at 50% 45%, rgba(255,230,170,.5), transparent 70%);
  animation:vParticleDrift 28s ease-in-out infinite}
.vparticles::after{animation-duration:38s;animation-direction:reverse;opacity:.55;transform:scale(1.12) translate(4%,-3%)}
@keyframes vParticleDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(-3.5%,-4.5%)}}
/* Two orbital rings - a larger dashed ring over the portrait side, a
   smaller "globe" of rings over the form side - so the composition reads
   across the whole hero rather than as one corner decoration. Both bleed
   past their own panel edge and get clipped there (same technique as the
   About page's .aleft::after/.aorbit-gold). */
.vorbit{position:absolute;width:640px;height:640px;left:-220px;top:-190px;opacity:.22;mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cg fill='none' stroke='%23e6c378' stroke-width='1'%3E%3Ccircle cx='300' cy='300' r='260' stroke-dasharray='3 15'/%3E%3Ccircle cx='300' cy='300' r='195'/%3E%3Cellipse cx='300' cy='300' rx='285' ry='110' transform='rotate(28 300 300)'/%3E%3Cellipse cx='300' cy='300' rx='285' ry='110' transform='rotate(-28 300 300)'/%3E%3C/g%3E%3C/svg%3E");
  background-size:contain;animation:vOrbitSpin 70s linear infinite}
@keyframes vOrbitSpin{to{transform:rotate(360deg)}}
.vglobe{position:absolute;width:460px;height:460px;right:-130px;bottom:-140px;opacity:.26;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3E%3Cg fill='none' stroke='%23e6c378' stroke-width='1'%3E%3Ccircle cx='200' cy='200' r='160' stroke-dasharray='2 10'/%3E%3Ccircle cx='200' cy='200' r='120'/%3E%3Cellipse cx='200' cy='200' rx='170' ry='65' transform='rotate(30 200 200)'/%3E%3Cellipse cx='200' cy='200' rx='170' ry='65' transform='rotate(-30 200 200)'/%3E%3C/g%3E%3C/svg%3E");
  background-size:contain;animation:vGlobeSpin 55s linear infinite reverse}
@keyframes vGlobeSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){
  .vhero-atmos{transform:none!important;transition:none}
  .vstars,.vstars::after,.vparticles::before,.vparticles::after,.vorbit,.vglobe{animation:none}
  .vstars{opacity:.55}.vparticles{opacity:.45}
}
/* Frosted glass backing behind the form so it stays perfectly readable
   regardless of what the star/particle/orbit layer is doing behind it -
   the requirement is a lively background AND a legible form, not a choice
   between them. */
.vtabs-container{background:rgba(4,10,18,.42);border:1px solid rgba(194,147,67,.18);border-radius:20px;padding:2.5rem;box-shadow:0 30px 70px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.04);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.vtabs-head h2{color:#fff}
.vtabs-head p{color:rgba(253,247,217,.6)}
.vh1{color:#fff}
.vh1 em{color:var(--color-frame-gold)}
.vsub{color:rgba(253,247,217,.55)}
.vtab-bar{background:rgba(5,11,19,.55);border-color:rgba(194,147,67,.32)}
.vtab-btn{color:rgba(253,247,217,.55)}
.vtab-btn.vtab-active{color:#fff}
.vflbl{color:rgba(253,247,217,.6)}
.vin{background:rgba(255,255,255,.06);border-color:rgba(194,147,67,.32);color:#fff}
.vin:focus{border-color:var(--color-frame-gold);background:rgba(255,255,255,.1);box-shadow:0 0 0 2px rgba(194,147,67,.22)}
.vin::placeholder{color:rgba(253,247,217,.3)}
.vpw-eye{color:var(--color-frame-gold)}
.vmsg{color:var(--color-frame-gold)}

/* Avatar ring + online indicator pick up the gold accent */
.vault-avatar,.vm-profile>span{background:linear-gradient(135deg,var(--color-deep-sea),var(--color-luxury-gold))}
.vault-profile-trigger .vault-avatar{box-shadow:0 0 0 4px rgba(212,175,55,.14),0 8px 24px rgba(0,0,0,.26)}

/* Modal frame - refined gold hairline instead of blue */
.vault-modal{border-color:rgba(194,147,67,.3)}
.vm-field input:focus,.vm-field select:focus,.vm-field textarea:focus{border-color:var(--color-frame-gold);box-shadow:0 0 0 3px rgba(194,147,67,.14)}

/* Empty / loading states stay legible on the brighter background */
.vault-empty{border-color:rgba(253,247,217,.18)}
.vault-empty i,.vault-empty h3{color:var(--color-pearl-foam)}
.request-empty>i{background:rgba(212,175,55,.12);color:var(--color-luxury-gold)}