.studio-portal { min-height:100dvh; background:#faf8fb; color:#241b29; }
.studio-portal a { color:inherit; text-decoration:none; }
.studio-portal svg { display:block; width:18px; height:18px; flex:none; }
.portal-shell { min-height:100dvh; display:grid; grid-template-columns:220px minmax(0,1fr); }
.portal-sidebar { position:sticky; top:0; height:100dvh; display:flex; flex-direction:column; padding:28px 19px 18px; background:#241b29; color:#241b29; }
.portal-sidebar .studio-wordmark { margin-bottom:40px; }
.portal-nav,.portal-sidebar-clients nav { display:grid; gap:4px; }
.portal-nav a,.portal-sidebar-clients a { display:flex; align-items:center; gap:10px; min-width:0; padding:10px; border-radius:5px; color:#66596c; font-size:13px; font-weight:700; }
.portal-nav a:hover,.portal-sidebar-clients a:hover { background:#fff2f7; color:#a31e65; }
.portal-nav a[aria-current],.portal-sidebar-clients a[aria-current] { background:#fff2f7; color:#a31e65; }
.portal-nav a small { margin-left:auto; font-size:11px; opacity:.8; }
.portal-sidebar-clients { min-height:0; overflow:auto; margin-top:27px; scrollbar-width:thin; }
.portal-sidebar-clients h2 { margin:0 10px 7px; color:#66596c; font-size:10px; text-transform:uppercase; letter-spacing:.16em; }
.portal-sidebar-clients a { padding-block:8px; font-size:12px; }
.portal-sidebar-clients a span:last-child { min-width:0; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.portal-client-dot { width:7px; height:7px; flex:none; border-radius:50%; background:#a31e65; }
.portal-account { margin-top:auto; border-top:1px solid #eee5ed; padding-top:16px; display:grid; grid-template-columns:32px minmax(0,1fr) auto; align-items:center; gap:8px; }
.portal-account strong,.portal-account small { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:12px; }
.portal-account small { color:#66596c; font-size:10px; }
.portal-avatar { width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:#7626a1; color:#fff; font-size:11px; font-weight:800; }
.portal-account button,.portal-dialog-close { display:grid; place-items:center; color:inherit; padding:6px; border-radius:4px; }
.portal-account button:hover { background:#fff2f7; }
.portal-main { min-width:0; }
.portal-bar { min-height:63px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 38px; border-bottom:1px solid #eee5ed; background:#faf8fb; }
.portal-mobile-brand { display:none; }
.portal-breadcrumb,.portal-breadcrumb a { min-width:0; display:flex; align-items:center; gap:8px; }
.portal-breadcrumb { font-size:12px; color:#66596c; }
.portal-breadcrumb a { white-space:nowrap; }
.portal-breadcrumb svg { width:13px;height:13px; }
.portal-breadcrumb span { color:#a31e65; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.portal-search { min-width:0; width:min(260px,42%); display:flex; align-items:center; gap:8px; margin:0; padding:0 10px; border:1px solid #eee5ed; border-radius:4px; background:#fff; color:#66596c; }
.portal-search:focus-within { outline:2px solid #ce77b4; outline-offset:1px; }
.portal-search input { min-width:0; width:100%; padding:8px 0; color:#241b29; background:transparent; border:0; font-size:12px; }
.portal-search input:focus { outline:none; }
.portal-search svg { width:15px; height:15px; }
.portal-dashboard { max-width:1350px; padding:38px 38px 50px; margin-inline:auto; }
.portal-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:26px; }
.portal-heading h1,.portal-login-form h1 { font:400 clamp(30px,4vw,52px)/1.03 Manrope,"Segoe UI",sans-serif; letter-spacing:-.045em; overflow-wrap:anywhere; }
.portal-heading p,.portal-login-form p { margin-top:10px; color:#66596c; font-size:13px; }
.portal-action { display:inline-flex; flex:none; align-items:center; justify-content:center; gap:7px; }
.portal-action svg { width:14px; height:14px; }
.portal-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 0 35px; border-block:1px solid #eee5ed; }
.portal-summary > div { min-height:73px; display:flex; align-items:center; gap:9px; padding:13px 17px; }
.portal-summary > div + div { border-left:1px solid #eee5ed; }
.portal-summary dt { color:#66596c; font-size:12px; }
.portal-summary dd { order:-1; display:flex; align-items:center; gap:8px; margin:0; color:#241b29; }
.portal-summary dd strong { font:400 25px/1 Manrope,"Segoe UI",sans-serif; }
.portal-summary svg { color:#a83b80; }
.portal-section-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; }
.portal-section-heading h2 { font-size:15px; font-weight:800; }
.portal-section-heading span,.portal-empty { color:#66596c; font-size:12px; }
.portal-client-index { border-top:1px solid #eee5ed; }
.portal-card { min-width:0; color:inherit; }
.portal-client-index .portal-card { display:grid; grid-template-columns:44px minmax(0,1fr) 22px; align-items:center; gap:12px; padding:12px 10px; min-height:70px; border-bottom:1px solid #eee5ed; }
.portal-client-index .portal-card:hover { background:#fff2f7; }
.portal-card-body { min-width:0; }
.portal-card-body h3 { font-size:14px; font-weight:800; overflow-wrap:anywhere; }
.portal-card-body p,.portal-card-body small { margin:0; color:#66596c; font-size:12px; overflow-wrap:anywhere; }
.portal-card-body small { display:flex; align-items:center; gap:5px; font-size:11px; }
.portal-card-body small svg { width:13px;height:13px; }
.portal-client-index .portal-card-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(85px,.4fr) minmax(0,.7fr); align-items:center; gap:10px; }
.portal-initials { display:grid; place-items:center; width:38px; height:38px; border-radius:4px; background:var(--tile,#e4d4c4); color:#342824; font:400 17px Manrope,"Segoe UI",sans-serif; }
.portal-color-0 { --tile:#e4d4c4; }.portal-color-1 { --tile:#dbc6bf; }.portal-color-2 { --tile:#d6d9c7; }.portal-color-3 { --tile:#ead6b7; }.portal-color-4 { --tile:#d9d0dc; }
.portal-card-arrow { color:#a31e65; justify-self:end; }
.portal-project-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,245px),1fr)); gap:14px; }
.portal-project-grid .portal-card { display:grid; grid-template-columns:36px minmax(0,1fr) 16px; align-items:start; gap:12px; padding:15px; min-height:112px; background:#fff; border:1px solid #eee5ed; border-radius:5px; }
.portal-project-grid .portal-card:hover { border-color:#e7b8d6; background:#fff2f7; }
.portal-project-symbol { display:grid; place-items:center; width:35px; height:35px; color:#7626a1; border-radius:4px; background:var(--tile,#e4d4c4); }
.portal-project-grid .portal-card-body p { margin:4px 0 9px; }
.portal-empty { display:flex; align-items:center; gap:9px; min-height:78px; margin-top:2px; }
.portal-empty svg { color:#a31e65; }
.portal-create-dialog { max-width:440px; border-radius:6px; }
.portal-create-dialog h2 { margin-right:28px; }
.portal-dialog-close { position:absolute; top:12px; right:12px; }
.portal-dialog-close:hover { background:#fff2f7; }
.portal-create-dialog form:last-child .primary { margin-top:16px; }
.portal-login { min-height:100dvh; display:grid; grid-template-columns:minmax(0,1.08fr) minmax(350px,.92fr); background:#fff; }
.portal-login-art { display:flex; flex-direction:column; padding:38px clamp(30px,6vw,98px) 45px; background:#241b29; color:#241b29; }
.portal-login-intro { margin:auto 0; padding-top:36px; }
.portal-login-intro > p { font:400 clamp(35px,5vw,76px)/1.03 Manrope,"Segoe UI",sans-serif; letter-spacing:-.048em; }
.portal-login-intro em { color:#88baff; font-weight:400; }
.portal-template-samples { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:26px; max-width:510px; }
.portal-template-samples figure { margin:0; min-width:0; }
.portal-template-samples canvas { display:block; width:100%; height:auto; border:1px solid #fff3de35; background:#e9ddcc; }
.portal-template-samples figcaption { margin-top:7px; color:#d7e5ff; font-size:11px; }
.portal-login-content { display:grid; place-items:center; padding:32px; }
.portal-login-form { width:min(100%,350px); }
.portal-login-form h1 { font-size:clamp(32px,3.3vw,47px); }
.portal-login-form form { margin-top:26px; }
.portal-login-form input[type=email],.portal-login-form input[type=password] { width:100%; padding:11px 12px; border:1px solid #eee5ed; border-radius:4px; background:#faf8fb; color:#241b29; }
.portal-login-form .primary { width:100%; margin-top:18px; }
.portal-login-mobile-mark { display:none!important; }
@media (max-width:950px){
  .portal-shell { grid-template-columns:190px minmax(0,1fr); }
  .portal-sidebar { padding-inline:13px; }
  .portal-dashboard,.portal-bar { padding-inline:21px; }
  .portal-login-art { padding-inline:26px; }
}
@media (max-width:740px){
  .portal-shell { display:flex; flex-direction:column; }
  .portal-sidebar { position:static; height:auto; flex-direction:row; align-items:center; justify-content:space-between; padding:7px 11px; }
  .portal-sidebar .studio-wordmark,.portal-sidebar-clients,.portal-account > div,.portal-avatar { display:none; }
  .portal-nav { display:flex; }
  .portal-nav a { padding:7px 9px; font-size:12px; }
  .portal-account { display:block; padding:0; border:0; }
  .portal-mobile-brand { display:block; }
  .portal-mobile-brand .studio-mark { width:29px; height:29px; }
  .portal-bar { min-height:50px; padding-inline:12px; gap:7px; }
  .portal-breadcrumb { margin-right:auto; }
  .portal-breadcrumb > a,.portal-breadcrumb > svg { display:none; }
  .portal-search { width:min(210px,52%); }
  .portal-dashboard { padding:23px 13px 30px; }
  .portal-heading { flex-wrap:wrap; gap:12px; }
  .portal-summary > div { flex-direction:column; align-items:flex-start; justify-content:center; gap:4px; min-height:64px; padding:7px; }
  .portal-summary dd { gap:5px; }.portal-summary dd strong { font-size:20px; }.portal-summary dt { font-size:10px; }
  .portal-summary svg { width:14px;height:14px; }
  .portal-client-index .portal-card-body { display:block; }
  .portal-client-index .portal-card-body small { margin-top:3px; }
  .portal-login { display:flex; flex-direction:column-reverse; }
  .portal-login-content { padding:26px 21px 40px; gap:30px; }
  .portal-login-mobile-mark { display:flex!important; justify-self:start; }
  .portal-login-art { padding:25px 21px; }
  .portal-login-art .studio-wordmark,.portal-login-intro > p { display:none; }
  .portal-login-intro { padding:0; }
  .portal-template-samples { margin-top:0; }
}


/* Kanban dashboard and sign-in treatment */
.portal-shell { grid-template-columns:244px minmax(0,1fr); }
.portal-sidebar { background:#fff; border-right:1px solid #eee5ed; padding:26px 20px 20px; }
.portal-sidebar .studio-wordmark { margin-bottom:0; }
.kanban-workspace { display:flex; align-items:center; gap:10px; margin:24px 0 17px; padding:18px 0; border-block:1px solid #eee5ed; font-size:13px; }
.kanban-workspace > span { display:grid; place-items:center; flex:0 0 35px; height:35px; border-radius:10px; color:#fff; background:linear-gradient(135deg,#d6415b,#8626b3); }
.portal-bar { min-height:70px; background:#fff; }
.portal-dashboard { padding-top:35px; }
.portal-heading { align-items:center; }
.portal-heading h1 { font:800 29px/1.2 Manrope,"Segoe UI",sans-serif; letter-spacing:-1.15px; }
.portal-heading p { font-size:14px; }
.portal-summary { gap:14px; border:0; margin-bottom:31px; }
.portal-summary > div,.portal-summary > div + div { border:1px solid #eee5ed; border-radius:13px; background:#fff; min-height:75px; box-shadow:0 2px 4px #a22c661b; }
.portal-summary dd strong { font:800 20px/1.1 Manrope,"Segoe UI",sans-serif; }
.portal-card-grid.portal-client-index,.portal-project-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,215px),1fr)); gap:18px; border:0; }
.portal-card-grid .portal-card {
  display:grid; grid-template-columns:minmax(0,1fr) 22px; grid-template-rows:112px 1fr; gap:0; align-items:stretch;
  min-height:220px; padding:0; overflow:hidden; background:#fff; border:1px solid #eee5ed; border-radius:15px;
  box-shadow:0 3px 9px #a22c661b; transition:transform .18s,box-shadow .18s;
}
.portal-card-grid .portal-card:hover { transform:translateY(-3px); background:#fff; box-shadow:0 12px 25px #a22c661b; border-color:#e7b8d6; }
.portal-color-0 { --cover:#a83b80; }.portal-color-1 { --cover:#a83b80; }.portal-color-2 { --cover:#8626b3; }.portal-color-3 { --cover:#c76b12; }.portal-color-4 { --cover:#a83b80; }
.portal-client-dot { background:var(--cover,#a31e65); }
.portal-card-cover { position:relative; isolation:isolate; overflow:hidden; grid-column:1/-1; display:flex; align-items:flex-end; padding:14px; background:var(--cover,#a31e65); }
.portal-card-cover::before { content:""; position:absolute; z-index:-1; width:195px; height:195px; border:1px solid #ffffff21; border-radius:50%; top:-121px; right:-18px; box-shadow:0 0 0 24px #ffffff0d,0 0 0 49px #ffffff09; }
.portal-initials,.portal-project-symbol { width:37px; height:35px; display:grid; place-items:center; border-radius:7px; background:#42194259; color:white; font:800 13px Manrope,"Segoe UI",sans-serif; }
.portal-card-grid .portal-card-body { display:block; padding:13px 12px 14px 15px; }
.portal-card-grid .portal-card-body h3 { color:#241b29; font-size:14px; }
.portal-card-grid .portal-card-body p { margin:4px 0 8px; }
.portal-card-arrow { padding-top:15px; padding-right:10px; }
.portal-card-arrow svg { width:13px; }
.kanban-new-tile { display:grid; min-height:220px; place-content:center; justify-items:center; gap:10px; border:1px dashed #e7b8d6; border-radius:15px; background:#faf8fb; color:#7626a1; }
.kanban-new-tile > span { display:grid; place-items:center; width:40px; height:40px; border-radius:10px; background:#f8edf7; color:#a31e65; }
.kanban-new-tile:hover { background:#fff2f7; border-color:#ce77b4; }
.portal-login { display:grid; grid-template-columns:1fr 1fr; background:#fff; }
.portal-login-art { position:relative; overflow:hidden; justify-content:center; padding:clamp(26px,6vw,90px); color:#fff; background:radial-gradient(circle at 90% 0,#3d70d477,transparent 50%),linear-gradient(150deg,#15204c,#20367b); }
.portal-login-art::before { content:""; width:650px; height:650px; border:80px solid #ffffff0a; border-radius:50%; position:absolute; bottom:-370px; left:-150px; pointer-events:none; }
.portal-login-art .studio-wordmark { color:#fff; }
.portal-login-art .studio-wordmark small { color:#c9dcff; }
.portal-login-intro { margin:45px 0 0; padding:0; position:relative; }
.portal-login-intro h2 { font:800 clamp(28px,3.5vw,43px)/1.2 Manrope,"Segoe UI",sans-serif; letter-spacing:-1.6px; margin-bottom:16px; }
.portal-login-intro h2 em { font-style:normal; color:#88baff; }
.portal-login-intro > p { font:500 15px/1.9 Manrope,"Segoe UI",sans-serif; color:#a5badf; letter-spacing:0; max-width:350px; }
.portal-template-samples { gap:13px; margin-top:25px; max-width:400px; }
.portal-template-samples canvas { width:100%; max-height:120px; object-fit:contain; border:1px solid #ffffff30; border-radius:8px; background:#ffffff0d; }
.portal-template-samples figcaption { color:#d7e5ff; }
.portal-login-form h1 { font:800 27px/1.2 Manrope,"Segoe UI",sans-serif; letter-spacing:-1px; }
.portal-login-form p { font-size:14px; }
.portal-login-form input[type=email],.portal-login-form input[type=password] { border-radius:8px; }
@media(max-width:950px){.portal-shell { grid-template-columns:215px minmax(0,1fr); }}
@media(max-width:740px){
  .portal-shell { display:flex; }.kanban-workspace { display:none; }.portal-summary { gap:6px; }
  .portal-heading { align-items:flex-start; }.portal-bar { min-height:53px; }
  .portal-card-grid.portal-client-index,.portal-project-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,155px),1fr)); gap:10px; }
  .portal-card-grid .portal-card { min-height:184px; grid-template-rows:85px 1fr; }
  .kanban-new-tile { min-height:184px; }.portal-login { display:flex; }.portal-login-intro h2 { display:none; }.portal-login-intro { margin:0; }
}
@media(prefers-reduced-motion:reduce){.portal-card-grid .portal-card { transition:none; }}

.portal-login-form .portal-invitation-note { margin-top:22px; font-size:12px; line-height:1.65; }
.team-panel { max-width:820px; padding:20px; margin:0 0 16px; border:1px solid #eee5ed; border-radius:13px; background:white; }
.team-panel input[type=email],.team-panel select { width:100%; max-width:440px; padding:9px; border:1px solid #eee5ed; border-radius:8px; background:#faf8fb; }
.team-panel fieldset { margin:14px 0; border:1px solid #eee5ed; border-radius:8px; }
.team-panel fieldset label { display:flex; align-items:center; gap:7px; margin:7px 0; }
.team-hint { color:#66596c; font-size:12px; margin:12px 0; }
.team-row,.team-link { display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.team-row { padding:12px 0; border-top:1px solid #eee5ed; }
.team-panel h2 + .team-row { margin-top:12px; }
.team-row small { display:block; color:#66596c; }
.team-link input { flex:1; min-width:150px; }
.studio-agency img { display:block; width:min(154px,100%); height:auto; }
.studio-agency-dark { position:relative; margin-top:28px; }
.studio-agency-dark img { filter:brightness(0) invert(1); }
.studio-agency-mobile { display:none; }
.portal-sidebar-footer { margin-top:auto; }
.studio-agency-sidebar { margin-top:15px; padding-top:12px; border-top:1px solid #f8edf7; }
.studio-agency-sidebar span { display:block; margin-bottom:7px; color:#66596c; font-size:10px; }
.studio-agency-sidebar img { width:min(122px,100%); }
@media(max-width:740px){
 .studio-agency-sidebar { display:none; }
 .portal-sidebar-footer { margin-top:0; }
 .studio-agency-mobile { display:block; justify-self:center; }
}

@media(max-width:740px){.studio-agency-dark { display:none; }}

.portal-template-samples{grid-template-columns:repeat(2,minmax(0,145px))}

/* Public home */
.portal-login{--login-gradient:linear-gradient(130deg,#dd4b1d 0%,#c41863 48%,#7626b8 100%);grid-template-columns:minmax(0,1.65fr) minmax(335px,1fr);background:#fff}
.portal-login-art{justify-content:space-between;align-items:flex-start;gap:22px;padding:clamp(25px,4vw,60px);background:radial-gradient(ellipse at 46% 67%,#fff2f6 0%,#fff 66%);color:#211925;border-right:1px solid #ece5eb}
.portal-login-art::before{display:none}
.portal-login-art .studio-wordmark{color:#211925}
.portal-login-art .studio-wordmark small{color:#625366}
.portal-login-intro{margin:0 auto;text-align:center;max-width:100%;width:620px}
.portal-login-intro h2{font-size:clamp(29px,4vw,53px);line-height:1.08;margin:0 0 12px}
.portal-login-intro h2 em{color:#bd2263;background:var(--login-gradient);background-clip:text;-webkit-text-fill-color:transparent}
.portal-login-intro>p{margin:auto;color:#625366;font-size:14px}
.portal-template-samples{position:relative;display:flex;align-items:center;justify-content:center;gap:0;width:min(100%,530px);max-width:none;margin:29px auto 10px;padding:12px 0 21px}
.portal-template-samples figure{flex:0 0 37%;position:relative;min-width:0;transform:rotate(-9deg) translate(14%,5%)}
.portal-template-samples figure:nth-child(2){z-index:1;transform:translateY(-4%)}
.portal-template-samples figure:nth-child(3){transform:rotate(9deg) translate(-14%,5%)}
.portal-template-samples canvas{width:100%;height:auto;aspect-ratio:4/5;max-height:none;object-fit:cover;border:4px solid #fff;border-radius:13px;background:#f7e6ed;box-shadow:0 12px 30px #61224c29}
.portal-template-samples figcaption{color:#554457;font-weight:700;font-size:10px}
.portal-login-content{background:#fff}
.portal-login-form h1{color:#211925}
.portal-login-form p{color:#625366}
.portal-login-form input[type=email],.portal-login-form input[type=password],.portal-login-form input:not([type]){border-color:#e3d8e0;background:#fffcfe}
.portal-login-form :focus-visible{outline-color:#b63b82}
.portal-login-form .primary,.portal-login-form .primary:hover{background:var(--login-gradient);border:0;border-radius:999px;min-height:43px}
.portal-login-form .primary:hover{filter:brightness(.92)}
.portal-login-form .portal-invitation-note{border-top:1px solid #eee5eb;padding-top:16px}
.portal-login .studio-agency-dark{margin:0}
.portal-login .studio-agency img{filter:brightness(0) saturate(100%) invert(16%) sepia(15%) saturate(1756%) hue-rotate(280deg) brightness(95%) contrast(94%)}
@media(max-width:740px){
 .portal-login{display:flex;flex-direction:column-reverse}
 .portal-login-content{padding-bottom:26px}
 .portal-login-art{border-right:0;border-top:1px solid #ece5eb;padding:25px 17px}
 .portal-login-intro h2,.portal-login-intro>p{display:block}
 .portal-template-samples{width:min(100%,395px);margin-top:20px}
}


.portal-color-0{--cover:linear-gradient(140deg,#c33c59,#8d245f)}
.portal-color-1{--cover:linear-gradient(140deg,#d96832,#bd3d66)}
.portal-color-2{--cover:linear-gradient(140deg,#a847ac,#733295)}
.portal-color-3{--cover:linear-gradient(140deg,#b65c2e,#a93555)}
.portal-color-4{--cover:linear-gradient(140deg,#ab4382,#79369f)}
.portal-client-dot{background:#b54a83}

.portal-login-form a{color:#a31e65;text-decoration:underline;text-underline-offset:3px}