:root{
  --bg:#131218;--panel:#1c1b22;--panel-2:#24222c;--line:#34313f;
  --ink:#ece9f7;--muted:#9692a7;--violet:#8c2ae8;--violet-2:#b478ff;
  --teal:#2ee0c6;--danger:#ff6a76;--warning:#f2bd62;--success:#52d7a0;
  --display:'Anton',Impact,sans-serif;--body:'Inter',sans-serif;
}
*{box-sizing:border-box}
html{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:inherit}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.portal-header{height:72px;padding:0 clamp(1.1rem,3vw,2.4rem);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;background:rgba(19,18,24,.92);backdrop-filter:blur(18px)}
.portal-brand{font-family:var(--display);text-transform:uppercase;letter-spacing:.16em;font-size:1.5rem;text-decoration:none}
.portal-account{display:flex;align-items:center;gap:1.2rem;text-align:right}
.portal-account span{display:flex;flex-direction:column;font-size:.875rem}
.portal-account small{font-size:.75rem;color:var(--muted);margin-top:.1rem}
.text-button{border:0;background:transparent;color:var(--violet-2);padding:.4rem 0}
.portal-main{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:calc(100vh - 72px)}
.portal-nav{border-right:1px solid var(--line);padding:1.5rem 1rem;display:flex;flex-direction:column;gap:.35rem}
.portal-nav a{display:block;text-decoration:none;color:var(--muted);padding:.75rem .85rem;border-radius:.5rem;font-size:.9rem}
.portal-nav a:hover,.portal-nav a:focus-visible{color:var(--ink);background:var(--panel)}
.portal-content{width:100%;max-width:1440px;padding:clamp(1.25rem,3vw,3rem);margin:0 auto}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;margin-bottom:2rem}
.page-head h1,.state-card h1{font-family:var(--display);font-size:clamp(2.5rem,6vw,5rem);text-transform:uppercase;line-height:.9;font-weight:400;margin:.45rem 0 0}
.page-head p{color:var(--muted);max-width:620px;margin:.7rem 0 0}
.eyebrow{font:500 .75rem/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--teal);letter-spacing:.16em;text-transform:uppercase}
.muted{color:var(--muted)}
.button{border:0;border-radius:999px;min-height:44px;padding:.72rem 1.2rem;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:700;white-space:nowrap}
.button-primary{color:#fff;background:var(--violet)}
.button-primary:hover{filter:brightness(1.12)}
.button-secondary{border:1px solid var(--line);background:var(--panel);color:var(--ink)}
.button-danger{background:var(--danger);color:#17121a}
.button-wide{width:100%}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;margin-bottom:2rem}
.stat{background:var(--panel);border:1px solid var(--line);padding:1.1rem 1.2rem;border-radius:.75rem}
.stat strong{display:block;font-family:var(--display);font-size:2.2rem;font-weight:400;line-height:1;color:var(--ink)}
.stat span{display:block;color:var(--muted);font-size:.8rem;margin-top:.45rem}
.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.project-card{display:flex;min-height:220px;flex-direction:column;justify-content:space-between;text-decoration:none;background:linear-gradient(135deg,var(--panel),#18171d);border:1px solid var(--line);border-radius:.8rem;padding:1.35rem;transition:.2s}
.project-card:hover{transform:translateY(-2px);border-color:var(--violet-2)}
.project-card h2{font-size:1.45rem;margin:.55rem 0 .5rem}
.project-card p{color:var(--muted);font-size:.9rem;line-height:1.6;margin:0;max-width:48ch}
.card-meta{display:flex;justify-content:space-between;gap:1rem;align-items:end;margin-top:1.5rem;color:var(--muted);font-size:.8rem}
.status{display:inline-flex;align-items:center;gap:.45rem;font-size:.75rem;font-weight:600;color:var(--ink);text-transform:uppercase;letter-spacing:.08em}
.status::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--muted)}
.status-ready_for_review::before{background:var(--teal)}
.status-approved::before,.status-delivered::before{background:var(--success)}
.status-changes_requested::before{background:var(--warning)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:.8rem;padding:1.25rem}
.panel+.panel{margin-top:1rem}
.panel-head{display:flex;justify-content:space-between;gap:1rem;align-items:center;margin-bottom:1.1rem}
.panel-head h2{font-size:1.1rem;margin:0}
.split{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.7fr);gap:1rem;align-items:start}
.asset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.asset-card{background:#0b0a0e;border:1px solid var(--line);border-radius:.7rem;overflow:hidden;text-decoration:none;display:block}
.asset-thumb{aspect-ratio:16/9;background:#09090b;position:relative;overflow:hidden}
.asset-thumb img,.asset-thumb video{width:100%;height:100%;object-fit:cover;display:block}
.asset-thumb .play-chip{position:absolute;left:.7rem;top:.7rem;background:var(--violet);padding:.28rem .55rem;font:500 .7rem ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.12em}
.asset-copy{padding:.9rem 1rem 1rem}
.asset-copy h3{font-size:1rem;margin:0 0 .3rem}
.asset-copy p{font-size:.78rem;color:var(--muted);margin:0}
.review-viewer{background:#08080a;border:1px solid var(--line);border-radius:.8rem;overflow:hidden}
.review-media{position:relative;overflow:hidden;background:#000;isolation:isolate}
.review-controls{position:absolute;z-index:4;left:.7rem;right:.7rem;bottom:.7rem;display:grid;grid-template-columns:auto auto minmax(100px,1fr) auto auto;align-items:center;gap:.65rem;padding:.55rem .65rem;border:1px solid rgba(255,255,255,.2);border-radius:.65rem;background:rgba(10,9,14,.82);backdrop-filter:blur(10px);opacity:1;transform:translateY(0);transition:opacity .2s ease,transform .2s ease}
.review-media.controls-hidden .review-controls{opacity:0;transform:translateY(.35rem);pointer-events:none}
.review-controls button{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:34px;border:0;border-radius:.4rem;background:transparent;color:#fff;padding:.35rem .45rem;font:600 .68rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase}
.review-controls button:hover,.review-controls button:focus-visible{color:var(--violet-2);background:rgba(180,120,255,.1)}
.review-controls input[type="range"]{height:4px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.25);box-shadow:none;accent-color:var(--violet-2)}
.review-time{color:#fff;font:500 .66rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}
.review-media:fullscreen,.review-media:-webkit-full-screen{width:100vw;height:100vh;display:grid;place-items:center;background:#000}
.review-media:fullscreen video,.review-media:-webkit-full-screen video{width:100%;height:100%;max-height:none;object-fit:contain}
.review-media.is-viewport-fullscreen{position:fixed;z-index:1000;inset:0;width:100vw;height:100vh;height:100dvh;display:grid;place-items:center;background:#000}
.review-media.is-viewport-fullscreen video{width:100%;height:100%;max-height:none;object-fit:contain}
.review-media.is-viewport-fullscreen .review-controls{left:max(.7rem,env(safe-area-inset-left));right:max(.7rem,env(safe-area-inset-right));bottom:max(.7rem,env(safe-area-inset-bottom))}
body.review-fullscreen-open{overflow:hidden;overscroll-behavior:none}
.review-viewer video,.review-viewer img{width:100%;max-height:68vh;display:block;object-fit:contain;background:#000}
.review-watermarks{position:absolute;inset:-8%;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,1fr);align-items:center;justify-items:center;gap:4%;pointer-events:none;overflow:hidden}
.review-watermarks span{max-width:90%;color:rgba(255,255,255,.34);font:600 clamp(.62rem,1.15vw,.9rem)/1.25 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;text-align:center;text-transform:uppercase;text-shadow:0 1px 4px rgba(0,0,0,.9);transform:rotate(-17deg);white-space:nowrap}
.access-mode{display:flex;flex-direction:column;align-items:flex-end;padding:.55rem .8rem;border:1px solid var(--line);border-radius:.6rem;background:var(--panel)}
.access-mode strong{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--teal)}
.access-mode span{margin-top:.15rem;color:var(--muted);font-size:.75rem}
.viewer-meta{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.85rem 1rem;background:var(--panel)}
.versions{display:flex;flex-wrap:wrap;gap:.45rem}
.version-link{padding:.4rem .65rem;border:1px solid var(--line);border-radius:999px;text-decoration:none;font-size:.78rem;color:var(--muted)}
.version-link.active{background:var(--violet);color:#fff;border-color:var(--violet)}
.comment-list{display:flex;flex-direction:column;gap:.65rem}
.comment{border:1px solid var(--line);border-radius:.65rem;padding:.85rem;background:#18171e}
.comment.resolved{opacity:.6}
.comment-head{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.45rem;font-size:.78rem;color:var(--muted)}
.timecode{color:var(--teal);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;border:0;background:none;padding:0}
.comment p{margin:0;line-height:1.55;font-size:.9rem;white-space:pre-wrap}
.comment-form{display:grid;gap:.7rem;margin-top:1rem}
.comment-form textarea{min-height:96px}
.comment-actions{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:.8rem}
.empty{border:1px dashed var(--line);border-radius:.8rem;padding:2rem;text-align:center;color:var(--muted)}
.data-list{display:grid;gap:.55rem}
.data-row{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.8rem 0;border-bottom:1px solid var(--line)}
.data-row:last-child{border-bottom:0}
.data-row strong{display:block;font-size:.9rem}
.data-row small{display:block;color:var(--muted);margin-top:.2rem}
.row-actions{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
.account-stack{display:grid;gap:1rem}
.account-stack .panel+.panel{margin-top:0}
.account-controls>p{font-size:.86rem;line-height:1.55;margin:-.2rem 0 1rem}
.danger-zone{border-top:1px solid var(--line);margin-top:1.25rem;padding-top:1.1rem}
.danger-zone>strong{display:block;font-size:.9rem}
.danger-zone>p{font-size:.82rem;line-height:1.5;margin:.45rem 0 .8rem}
.button:disabled{cursor:not-allowed;opacity:.45}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
label{display:grid;gap:.42rem;color:#d7d3df;font-size:.82rem;font-weight:600}
input,textarea,select{width:100%;border:1px solid var(--line);border-radius:.55rem;background:#121117;color:var(--ink);padding:.78rem .85rem;outline:none}
input:focus,textarea:focus,select:focus{border-color:var(--violet-2);box-shadow:0 0 0 3px rgba(180,120,255,.14)}
textarea{resize:vertical;min-height:120px}
.form-actions{display:flex;justify-content:flex-end;gap:.7rem;margin-top:1rem}
.form-error,.flash{border-radius:.55rem;padding:.8rem .9rem;margin-bottom:1rem;font-size:.88rem}
.form-error,.flash-error{background:rgba(255,106,118,.12);border:1px solid rgba(255,106,118,.5);color:#ffc2c8}
.flash-success{background:rgba(82,215,160,.1);border:1px solid rgba(82,215,160,.4);color:#a7f2d1}
.login-shell{min-height:100vh;display:grid;grid-template-columns:1.15fr .85fr}
.login-visual{position:relative;min-height:100vh;overflow:hidden;background:#09080c}
.login-visual video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.72}
.login-visual::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(19,18,24,.96),rgba(19,18,24,.05) 60%)}
.login-visual-copy{position:absolute;z-index:2;left:clamp(1.5rem,5vw,4rem);right:2rem;bottom:clamp(2rem,7vh,5rem)}
.login-visual-copy p{font-family:var(--display);text-transform:uppercase;font-size:clamp(2.3rem,5vw,5.2rem);line-height:.9;max-width:780px;margin:1rem 0 0}
.login-panel{position:relative;display:flex;align-items:center;justify-content:center;padding:5rem 2rem 2rem;background:var(--bg)}
.login-home{position:absolute;top:1.5rem;left:1.5rem;color:var(--muted);font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}.login-home:hover{color:var(--ink)}
.login-card{width:min(420px,100%)}
.login-card h1{font-family:var(--display);font-size:clamp(3rem,7vw,5.4rem);font-weight:400;text-transform:uppercase;line-height:.9;margin:.7rem 0 1rem}
.login-card label{margin-top:1rem}
.login-card .button{margin-top:1.2rem}
.login-legal{color:var(--muted);font-size:.75rem;line-height:1.55;text-align:center;margin:1rem 0 0}.login-legal a{color:var(--violet-2)}
.back-link{display:block;text-align:center;color:var(--muted);text-decoration:none;margin-top:1.1rem;font-size:.82rem}
.portal-legal{border-top:1px solid var(--line);padding:1rem clamp(1.1rem,3vw,2.4rem);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:var(--muted);font:500 .68rem/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.07em;text-transform:uppercase}.portal-legal span:last-child{display:flex;gap:1rem;flex-wrap:wrap}.portal-legal a{color:inherit;text-decoration:none}.portal-legal a:hover{color:var(--ink)}
.terms-acceptance{width:min(760px,100%);margin:4vh auto;background:var(--panel);border:1px solid var(--line);border-radius:.9rem;padding:clamp(1.4rem,4vw,2.5rem)}.terms-acceptance h1{font-family:var(--display);font-size:clamp(3rem,7vw,5.6rem);font-weight:400;line-height:.9;text-transform:uppercase;margin:.7rem 0 1rem}.terms-acceptance>p{color:var(--muted);line-height:1.7}.terms-summary{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:1.5rem 0;padding:.7rem 0}.terms-summary p{color:#c9c5d3;line-height:1.6}.accept-check{display:flex;grid-template-columns:auto 1fr;align-items:flex-start;gap:.7rem;font-size:.9rem;line-height:1.55}.accept-check input{width:auto;margin-top:.25rem}.accept-check a{color:var(--violet-2)}.terms-version{font:500 .68rem/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.08em;margin-bottom:0}
.state-card{max-width:700px;margin:10vh auto;padding:2rem;background:var(--panel);border:1px solid var(--line);border-radius:.8rem}
.state-card p{color:var(--muted);font-size:1rem;line-height:1.7;margin-bottom:1.5rem}
.upload-progress{height:5px;background:var(--line);border-radius:999px;overflow:hidden;display:none;margin-top:.7rem}
.upload-progress span{display:block;width:35%;height:100%;background:var(--teal);animation:uploading 1.2s ease-in-out infinite alternate}
@keyframes uploading{from{transform:translateX(-100%)}to{transform:translateX(285%)}}
@media(max-width:900px){
  .portal-main{grid-template-columns:1fr;align-content:start}.portal-nav{border-right:0;border-bottom:1px solid var(--line);flex-direction:row;overflow:auto;padding:.65rem 1rem;position:sticky;top:72px;background:var(--bg);z-index:20}
  .split,.login-shell{grid-template-columns:1fr}.login-visual{display:none}.login-panel{min-height:100vh}
  .project-grid,.asset-grid{grid-template-columns:1fr}.stats{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:620px){
  .portal-header{height:64px}.portal-account span{display:none}.portal-main{min-height:calc(100vh - 64px)}.portal-nav{top:64px}
  .portal-content{padding:1.1rem}.page-head{align-items:flex-start;flex-direction:column}.stats{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}
  .viewer-meta{align-items:flex-start;flex-direction:column}.card-meta{align-items:flex-start;flex-direction:column}.access-mode{align-items:flex-start}.review-watermarks{grid-template-columns:1fr;grid-template-rows:repeat(3,1fr)}.review-watermarks span:nth-child(even){display:none}.review-controls{grid-template-columns:auto minmax(70px,1fr) auto auto;gap:.35rem;left:.4rem;right:.4rem;bottom:.4rem}.review-time{display:none}.review-controls button span{display:none}.portal-legal{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.login-visual video{display:none}}
