@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap');
:root{--bg:#090909;--panel:#111;--panel2:#171717;--line:#2a2a2a;--gold:#C8A96A;--cream:#F3EEE4;--muted:#969696;--white:#f8f7f4;--green:#70b780;--red:#dc6671;--blue:#8aa9d1}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font:14px Montserrat,Arial,sans-serif;line-height:1.55}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a{transition:all .18s ease}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,4vw,64px);border-bottom:1px solid #29251d;background:#050505;position:sticky;top:0;z-index:5}.brand{display:flex;flex-direction:column;gap:0}.brand-name{font-size:25px;letter-spacing:8px;font-weight:400;color:var(--cream)}.brand small{font-size:9px;letter-spacing:2px;color:var(--gold)}.top-right{display:flex;gap:24px;align-items:center;color:#c5c5c5;font-size:12px}.top-right a:hover,.breadcrumbs a:hover{color:var(--gold)}.wrap{max-width:1240px;margin:0 auto;padding:48px 26px 80px}.wrap.narrow{max-width:900px}.page-head,.project-hero,.section-head,.panel-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.page-head{margin-bottom:32px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:var(--gold);text-transform:uppercase}h1{font-size:clamp(30px,4vw,44px);line-height:1.12;letter-spacing:-1.5px;margin:9px 0 12px}h2{font-size:19px;margin:0 0 16px}h3{font-size:15px;margin:0 0 5px}.muted{color:var(--muted)}.btn{display:inline-flex;justify-content:center;align-items:center;gap:12px;border-radius:3px;padding:12px 17px;font-size:10px;letter-spacing:.7px;font-weight:800;cursor:pointer;border:1px solid var(--gold);background:transparent;color:var(--cream)}.btn.primary{background:var(--gold);color:#090909}.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}.btn.secondary{border-color:#655538;color:var(--cream)}.btn.full{width:100%;margin-top:8px}.panel{background:linear-gradient(135deg,#141414,#0f0f0f);border:1px solid var(--line);border-radius:9px;padding:24px;margin:20px 0}.panel-head{margin-bottom:18px}.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-bottom:24px}.tabs a{padding:13px 17px;color:#aaa;font-size:11px}.tabs a.active,.tabs a:hover{color:var(--gold);border-bottom:2px solid var(--gold)}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:690px}th{text-align:left;font-size:10px;color:var(--gold);letter-spacing:.7px;background:#090909}td,th{padding:15px 13px;border-bottom:1px solid var(--line)}td{font-size:12px;color:#ddd}tbody tr:hover{background:#191919}.table-sub{display:block;color:#777;margin-top:4px}.text-btn{background:none;border:0;color:var(--gold);cursor:pointer;font-weight:700;font-size:11px}.text-btn.danger{color:var(--red)}.pill{display:inline-flex;align-items:center;border-radius:30px;padding:5px 9px;background:#303030;color:#ddd;font-size:9px;font-weight:800;letter-spacing:.5px;white-space:nowrap}.pill.gold,.pill.in_review{background:#4a3b20;color:#f2d28d}.pill.green,.pill.approved,.pill.delivered{background:#1d3926;color:#9ce0a8}.pill.red,.pill.revision_requested{background:#482329;color:#ff9ba5}.pill.in_progress{background:#292929;color:#ccc}.empty{text-align:center;color:#777;padding:28px}.alert{padding:12px 15px;background:#1e3324;border:1px solid #2e5538;color:#a6e0b2;border-radius:4px;margin:16px 0;font-size:12px}.alert.error{background:#3b2023;border-color:#6c3038;color:#ffb0b8}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.form-grid label,.login-form label,.comment-form label{display:flex;flex-direction:column;gap:8px;font-size:11px;color:#ccc;font-weight:700}.form-grid input,.form-grid select,.form-grid textarea,.login-form input,.comment-form input,.comment-form textarea{width:100%;border:1px solid #343434;background:#090909;color:#f8f7f4;border-radius:3px;padding:12px;outline:none}.form-grid input:focus,.form-grid textarea:focus,.form-grid select:focus,.login-form input:focus,.comment-form input:focus,.comment-form textarea:focus{border-color:var(--gold)}.form-grid small,.comment-form small{color:#777;font-size:10px;font-weight:400}.span-2{grid-column:span 2}.video-admin-row{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line)}.video-admin-row small{display:block;color:#888;margin-top:4px}.breadcrumbs{display:flex;gap:10px;color:#888;font-size:11px;margin-bottom:28px}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.project-card{border:1px solid var(--line);border-radius:9px;overflow:hidden;background:#101010;display:block}.project-card:hover{border-color:#77623d;transform:translateY(-3px)}.project-image{height:155px;background:radial-gradient(ellipse at 65% 10%,#57462e,#191715 45%,#080808 78%);display:flex;align-items:flex-end;justify-content:space-between;padding:14px}.image-mark{font-size:21px;letter-spacing:7px;color:#e6d6b8}.project-card-body{padding:20px}.project-card-body>small{color:#9a896b;font-size:10px}.project-card h2{margin:8px 0;font-size:18px}.project-card p{font-size:11px;color:#888;min-height:34px}.card-meta{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #282828;border-bottom:1px solid #282828;padding:12px 0;color:#aaa;font-size:10px}.gold-link{display:flex;justify-content:space-between;align-items:center;color:var(--gold);font-size:10px;font-weight:800;letter-spacing:.6px;margin-top:16px}.project-hero{margin-bottom:30px}.project-hero h1{margin-bottom:8px}.resource-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0 42px}.resource-card{display:flex;gap:18px;padding:24px;border:1px solid var(--line);border-radius:8px;background:linear-gradient(135deg,#161616,#0e0e0e)}.resource-icon{font-size:28px;color:var(--gold)}.resource-card h2{margin-bottom:8px}.resource-card p{color:#999;font-size:12px;margin:0 0 16px}.section-head{margin:35px 0 18px}.section-head h2{font-size:25px;margin:5px 0}.video-list{border-top:1px solid var(--line)}.video-row{display:flex;align-items:center;gap:18px;padding:15px 12px;border-bottom:1px solid var(--line)}.video-row:hover{background:#151515}.video-thumb{width:112px;height:66px;flex-shrink:0;background:linear-gradient(135deg,#4b3928,#141414 65%);display:grid;place-items:center;border-radius:4px;color:var(--gold);font-size:22px}.video-info{flex:1}.video-info p{font-size:10px;color:#888;margin:0}.approval-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:32px;padding:20px;border:1px solid #3b3325;background:#12100c;border-radius:7px}.approval-bar strong,.approval-bar small{display:block}.approval-bar small{color:#888;margin-top:4px;font-size:10px}.approval-bar form{display:flex;gap:9px;flex-wrap:wrap}.review-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.8fr);gap:20px;align-items:start}.player-wrap{aspect-ratio:16/9;background:#000;border:1px solid #333;border-radius:7px;overflow:hidden}.player-wrap iframe{width:100%;height:100%;border:0}.source-note{font-size:10px;color:#777;margin:9px 0 20px}.comment-form{display:grid;gap:15px}.comments-panel{margin:0}.comment{padding:16px 0;border-bottom:1px solid var(--line)}.comment-head{display:flex;justify-content:space-between;gap:10px;font-size:11px}.comment-head span{color:var(--gold);font-variant-numeric:tabular-nums}.comment p{font-size:12px;color:#ddd;white-space:normal;overflow-wrap:anywhere}.comment small{font-size:9px;color:#777}.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at 20% 25%,#242019,#090909 50%)}.login-shell{width:min(980px,100%);min-height:570px;display:grid;grid-template-columns:1fr 1fr;border:1px solid #2a2925;border-radius:10px;overflow:hidden;background:#0d0d0d;box-shadow:0 30px 100px #000}.login-visual{padding:60px 42px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;background:linear-gradient(145deg,#111,#080808 65%,#2d2417)}.logo{font-size:clamp(40px,6vw,65px);letter-spacing:12px;font-weight:300;color:var(--cream)}.tagline{color:#bcb3a4;font-size:13px;letter-spacing:3px}.gold-line{width:40px;height:1px;background:var(--gold);margin:38px 0 22px}.login-visual p{font-size:10px;letter-spacing:3px;color:var(--gold);font-weight:800}.login-visual small{color:#888}.login-form{padding:60px 45px;display:flex;flex-direction:column;justify-content:center;gap:17px}.login-form h1{font-size:34px;margin:0}.login-form>p{font-size:12px;margin:0 0 8px}.login-foot{margin-top:18px;color:#666;font-size:9px;letter-spacing:1px}.setup-form{width:min(520px,100%);background:#101010;border:1px solid var(--line);padding:36px;border-radius:8px}.setup-form .brand-name{margin-bottom:30px}.setup-form h1{margin:0}.login-form .error{color:#ff9ba5}.login-form .alert{margin:0}
@media(max-width:850px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.review-layout{grid-template-columns:1fr}.login-shell{grid-template-columns:1fr}.login-visual{padding:38px 24px;min-height:250px}.login-form{padding:35px 25px}.resource-grid{grid-template-columns:1fr}.approval-bar{align-items:flex-start;flex-direction:column}.wrap{padding:32px 18px 60px}}
@media(max-width:560px){.project-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.span-2{grid-column:auto}.topbar{padding:0 15px;height:68px}.top-right{gap:12px;font-size:10px}.brand-name{font-size:21px;letter-spacing:5px}.page-head,.project-hero,.section-head{align-items:flex-start;flex-direction:column}.video-row{gap:10px;flex-wrap:wrap}.video-thumb{width:88px;height:55px}.video-row .pill{margin-left:auto}.video-row .gold-link{width:100%;margin:4px 0 0}.approval-bar form{width:100%}.approval-bar form .btn{flex:1}.resource-card{padding:18px}.login-form{padding:30px 20px}}


/* Client profile photo UI */
.profile-person{display:flex;align-items:center;gap:10px;min-width:0}.profile-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;flex:0 0 42px;background:#211e18;border:1px solid #665334}.profile-avatar.small{width:32px;height:32px;flex-basis:32px}.profile-avatar.comment-avatar{width:36px;height:36px;flex-basis:36px}.comment-user-row{display:flex;align-items:flex-start;gap:10px}.comment-user-content{flex:1;min-width:0}.profile-caption{display:block;color:#929292;font-size:11px;margin-top:3px}.project-client-profile{margin-top:18px}.client-admin-actions{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.avatar-upload-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.avatar-file-label{display:inline-flex;align-items:center;gap:6px;color:#C8A96A;font-size:12px;cursor:pointer}.avatar-file-label input{max-width:185px;color:#aaa;font-size:11px}


/* VYBE unified header — bounded logo, shared navigation, responsive layout */
.topbar .brand { flex: 0 0 auto; min-width: 150px; }
.topbar .site-logo, .topbar .brand-logo {
  display:block; width:auto; height:auto; max-width:168px; max-height:40px;
  object-fit:contain; object-position:left center;
}
.topbar .brand small { display:block; margin-top:4px; font-size:9px; line-height:1.2; letter-spacing:2px; }
.portal-nav { display:flex; align-items:center; justify-content:center; gap:clamp(12px,1.7vw,26px); margin:0 auto; padding:0 18px; }
.portal-nav a { color:#d0ccc4; font-size:10px; letter-spacing:.25px; white-space:nowrap; }
.portal-nav a:hover { color:var(--gold); }
.portal-nav .nav-quote { border:1px solid var(--gold); padding:9px 12px; color:var(--gold); }
.top-right { flex:0 0 auto; }
.login-logo { display:block; width:min(78%,360px); height:auto; max-height:110px; object-fit:contain; margin:0 auto 10px; }
@media (max-width:1050px) {
  .topbar { gap:12px; padding:0 20px; }
  .portal-nav { gap:12px; padding:0 8px; }
  .portal-nav a { font-size:9px; }
  .topbar .brand { min-width:125px; }
  .topbar .site-logo, .topbar .brand-logo { max-width:140px; max-height:34px; }
}
@media (max-width:760px) {
  .topbar { min-height:72px; height:auto; padding:12px 16px; flex-wrap:wrap; }
  .topbar .brand { min-width:0; }
  .portal-nav { order:3; width:100%; overflow-x:auto; justify-content:flex-start; padding:10px 0 2px; gap:18px; }
  .top-right { margin-left:auto; gap:12px; font-size:11px; }
  .portal-nav a { font-size:10px; }
}


/* VYBE footer logo containment fix: prevent source logo dimensions from expanding the page */
.site-footer {
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:22px clamp(18px,4vw,64px); margin-top:48px;
  border-top:1px solid #29251d; color:#bdbdbd; font-size:11px;
  background:#050505; position:relative; overflow:hidden;
}
.site-footer .footer-brand { display:flex; flex-direction:column; align-items:flex-start; gap:4px; min-width:0; }
.site-footer .footer-brand img { display:block; width:auto !important; height:auto !important; max-width:150px !important; max-height:38px !important; object-fit:contain; object-position:left center; }
.site-footer .footer-brand span { color:#c8a96a; font-size:9px; letter-spacing:1.5px; }
.vybe-footer { display:flex; align-items:center; justify-content:center; flex-direction:column; gap:4px; padding:22px 18px; margin-top:48px; border-top:1px solid #29251d; background:#050505; color:#bdbdbd; font-size:11px; overflow:hidden; }
.vybe-footer img { display:block; width:auto !important; height:auto !important; max-width:150px !important; max-height:38px !important; object-fit:contain; }
.vybe-footer span { color:#c8a96a; font-size:9px; letter-spacing:1.5px; }
@media (max-width:560px) { .site-footer { align-items:flex-start; flex-direction:column; gap:10px; padding:18px 16px; } .site-footer .footer-brand img, .vybe-footer img { max-width:125px !important; max-height:32px !important; } }