:root{--ink:#1d2030;--muted:#81869a;--line:#e8e9f0;--bg:#f7f7fa;--surface:#fff;--purple:#6756d9;--green:#24876b;--orange:#cf8a36;--red:#c95d83}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px "DM Sans",sans-serif}.boot{min-height:100vh;display:grid;place-items:center;color:var(--muted)}button,input,textarea,select{font:inherit}button{cursor:pointer}.layout{display:flex;min-height:100vh}.sidebar{width:244px;flex:0 0 244px;background:#fff;border-right:1px solid var(--line);padding:25px 14px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{font:700 24px "Space Grotesk";letter-spacing:-1px;display:flex;gap:9px;align-items:center;padding:0 11px 32px}.brand-mark{display:grid;place-items:center;width:30px;height:30px;color:#fff;background:var(--purple);border-radius:9px;font-size:15px}.workspace{padding:0 11px 22px}.workspace-label{font-size:10px;letter-spacing:1px;font-weight:700;color:#a4a6b1;margin-bottom:10px}.workspace-card{display:flex;gap:9px;align-items:center;padding:11px 9px;background:#f4f3fc;border-radius:10px}.workspace-logo{width:29px;height:29px;border-radius:8px;overflow:hidden;background:linear-gradient(135deg,#f59b70,#6756d9);display:grid;place-items:center;color:#fff;font-weight:700}.workspace-logo img{width:100%;height:100%;object-fit:cover}.workspace-card strong{display:block;font-size:12px}.workspace-card small{display:block;color:var(--muted);font-size:10px;margin-top:2px}.nav{display:grid;gap:4px}.nav button{border:0;background:none;color:#73778a;text-align:left;border-radius:8px;padding:11px 12px;font-weight:600;display:flex;align-items:center;gap:12px}.nav button.active{background:#efedfc;color:var(--purple)}.nav .count{margin-left:auto;border-radius:10px;background:#f1effc;color:var(--purple);font-size:10px;padding:3px 7px}.nav .review-count{background:#fff0e3;color:#bd7c2d}.sidebar-bottom{margin-top:auto;border-top:1px solid var(--line);padding-top:14px}.side-action{display:block;border:0;background:none;color:#777b8c;padding:9px 12px;width:100%;text-align:left}.profile{display:flex;gap:9px;align-items:center;margin:10px 8px 0;padding-top:12px;border-top:1px solid #f0f0f4}.avatar{width:31px;height:31px;border-radius:50%;background:#ebe8fd;color:var(--purple);display:grid;place-items:center;font-size:10px;font-weight:700}.profile strong,.profile small{display:block}.profile strong{font-size:11px}.profile small{font-size:10px;color:var(--muted);margin-top:2px}.main{width:100%;max-width:1500px;margin:0 auto;padding:0 52px 50px}.topbar{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.crumb{font-size:12px;color:#a0a3b0}.actions{display:flex;gap:9px;align-items:center}.button{border:0;border-radius:8px;padding:10px 15px;font-size:12px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:7px}.primary{background:var(--purple);color:#fff;box-shadow:0 4px 11px #6756d938}.secondary{color:var(--purple);background:#fff;border:1px solid #dfddf2}.icon-button{background:#fff;border:1px solid var(--line);border-radius:8px;width:37px;height:37px;color:#74788a}.heading{padding:34px 0 24px;display:flex;justify-content:space-between;align-items:end}.eyebrow{font-size:11px;color:#979aa8;margin:0 0 8px}.heading h1,.project-title{font:600 30px "Space Grotesk";letter-spacing:-1px;margin:0}.subtle{color:var(--muted);margin:8px 0 0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:22px}.stat,.panel{background:var(--surface);border:1px solid var(--line);border-radius:13px}.stat{padding:19px;display:flex;gap:12px;align-items:center}.stat-icon{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font-size:19px}.stat:nth-child(1) .stat-icon{background:#eceefd;color:#6174ca}.stat:nth-child(2) .stat-icon{background:#fff2e4;color:#c27b2c}.stat:nth-child(3) .stat-icon{background:#e5f4ed;color:#398d72}.stat:nth-child(4) .stat-icon{background:#fbeaf2;color:#be6791}.stat strong{display:block;font:600 25px "Space Grotesk"}.stat span{font-size:11px;color:var(--muted)}.grid{display:grid;grid-template-columns:minmax(480px,1fr) 330px;gap:20px}.panel{padding:22px}.panel-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:18px}.panel h2{font:600 17px "Space Grotesk";margin:0}.panel-head p{font-size:11px;color:var(--muted);margin:5px 0 0}.link-button{border:0;background:none;color:var(--purple);font-size:11px;font-weight:700}.table-labels,.project-row{display:grid;grid-template-columns:minmax(220px,1.8fr) 1fr 1fr 18px;gap:10px;align-items:center}.table-labels{font-size:9px;font-weight:700;letter-spacing:.7px;color:#aaacb9;border-bottom:1px solid var(--line);padding:0 6px 9px}.project-row{padding:13px 6px;border-bottom:1px solid #f0f0f4;cursor:pointer}.project-row:hover{background:#fafaff}.proof-thumb{width:40px;height:40px;border-radius:8px;background:#eceafd;overflow:hidden;display:grid;place-items:center;color:var(--purple);font-weight:700}.proof-thumb img{width:100%;height:100%;object-fit:cover}.project-name{display:flex;gap:11px;align-items:center}.project-name strong{font-size:12px;display:block}.project-name small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.status{font-size:10px;font-weight:700;display:inline-flex;gap:5px;align-items:center}.status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.in-production{color:#6978c7}.awaiting-review{color:#c5812f}.needs-changes{color:#c0648b}.approved,.finalized{color:#388e71}.updated{font-size:10px;color:#9598a6}.attention{padding:0}.attention .panel-head{padding:22px 22px 8px}.attention-row{display:flex;gap:10px;align-items:center;padding:12px 22px;border-bottom:1px solid #f0f0f4}.attention-row strong{font-size:11px;display:block}.attention-row small{font-size:10px;color:var(--muted)}.badge{padding:3px 7px;background:#f1effc;color:var(--purple);border-radius:10px;font-size:10px;font-weight:700}.empty{padding:30px 8px;text-align:center;color:var(--muted);font-size:12px}.workspace-main{max-width:1280px;margin:0 auto;padding:0 32px 50px;width:100%}.workspace-top{height:78px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.back{border:0;background:none;color:#696d7e;font-weight:700}.project-heading{padding:28px 0 18px;display:flex;justify-content:space-between;align-items:end}.project-meta{font-size:12px;color:var(--muted);margin-top:7px}.project-tabs{display:flex;gap:2px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:3px;margin-bottom:16px}.project-tabs button{border:0;background:none;padding:9px 13px;color:#777b8d;border-radius:7px;font-size:12px;font-weight:700}.project-tabs button.active{color:var(--purple);background:#f0effc}.proof-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.proof-toolbar strong{font:600 16px "Space Grotesk"}.proof-container{display:grid;gap:22px}.proof-page{display:grid;grid-template-columns:minmax(0,820px) 320px;justify-content:center;gap:18px;align-items:start}.art{position:relative;line-height:0;background:#fff}.art img,.art .pdf-canvas{display:block;width:100%;height:auto}.annotation-canvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair}.draw-toolbar{position:absolute;left:10px;top:10px;display:flex;align-items:center;gap:7px;z-index:2;background:#fff;padding:8px 10px;border:1px solid #deddf1;border-radius:9px;box-shadow:0 3px 12px #1d203022;line-height:normal}.color-dot,.width-dot{border:0;background:none;padding:0;border-radius:50%;cursor:pointer}.color-dot{width:22px;height:22px;background:var(--c);border:2px solid #fff;box-shadow:0 0 0 1px #bcc0ce}.color-dot.active{box-shadow:0 0 0 2px var(--purple)}.width-dot{width:28px;height:28px;background:#fff;border:1px solid #dfdfeb;display:grid;place-items:center}.width-dot:after{content:"";width:var(--s);height:var(--s);background:#5e6375;border-radius:50%}.width-dot.active{border-color:var(--purple);background:#f0effc}.tool-divider{width:1px;height:20px;background:#e2e2ea}.tool-button{border:1px solid #dddcef;background:#fff;color:var(--purple);border-radius:6px;padding:6px 9px;font-size:11px;font-weight:700}.page-comments{background:#fff;border:1px solid var(--line);border-radius:10px;padding:17px;line-height:normal}.page-comments h3{font:600 14px "Space Grotesk";margin:0 0 11px}.comment{padding:9px 0;border-bottom:1px solid #f1f1f5}.comment:last-child{border-bottom:0}.comment strong{font-size:11px}.comment small{float:right;color:var(--muted);font-size:10px}.comment p{font-size:12px;line-height:1.4;margin:5px 0 0;color:#666a7b}.comment-form{margin-top:12px}.field{display:block;font-size:11px;font-weight:700;color:#606476;margin:0 0 12px}.field input,.field textarea,.field select{display:block;width:100%;margin-top:6px;padding:10px;border:1px solid #dfdfe8;border-radius:8px;background:#fff;color:var(--ink);outline:none}.field textarea{min-height:82px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--purple)}.offer-box{max-width:650px}.offer-box p{line-height:1.6;color:#65697a}.page-tabs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:13px}.page-tabs button{border:1px solid #dfddeb;background:#fff;color:var(--purple);border-radius:7px;padding:8px 11px;font-size:11px;font-weight:700}.page-tabs button.active{background:var(--purple);color:#fff}.modal-backdrop{position:fixed;inset:0;background:#1c1f315c;display:grid;place-items:center;padding:18px;z-index:20}.modal{position:relative;width:min(410px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:15px;padding:28px;box-shadow:0 18px 70px #1d203055}.modal h2{font:600 21px "Space Grotesk";margin:0 0 8px}.modal p{font-size:12px;color:var(--muted);line-height:1.5}.modal-close{position:absolute;right:13px;top:10px;border:0;background:none;font-size:22px;color:#8c90a0}.modal-icon{width:35px;height:35px;background:#efedfc;color:var(--purple);border-radius:9px;display:grid;place-items:center;margin-bottom:14px}.modal-actions{display:flex;gap:8px;margin-top:14px}.modal-actions>*{flex:1}.toast{position:fixed;right:22px;bottom:22px;background:#252838;color:#fff;border-radius:9px;padding:11px 14px;z-index:30;font-size:12px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.logo-preview{height:100px;background:#fff;border:1px dashed #d9d8e7;border-radius:10px;display:grid;place-items:center;color:var(--muted);overflow:hidden}.logo-preview img{max-width:100%;max-height:100%;object-fit:contain}.guest-header{max-width:1180px;margin:0 auto;padding:20px 28px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.guest-brand{font:700 21px "Space Grotesk"}.hidden{display:none!important}@media(max-width:1000px){.sidebar{width:210px;flex-basis:210px}.main{padding:0 24px}.stats{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}.proof-page{grid-template-columns:minmax(0,1fr) 280px}.workspace-main{padding:0 24px}}@media(max-width:720px){.sidebar{display:none}.main,.workspace-main{padding-left:16px;padding-right:16px}.topbar,.workspace-top{height:64px}.heading,.project-heading{align-items:start;gap:12px;flex-direction:column}.stats{grid-template-columns:1fr 1fr}.stat{padding:13px}.grid{display:block}.attention{margin-top:16px}.table-labels{display:none}.project-row{grid-template-columns:1fr 15px}.project-row .status,.project-row .updated{grid-column:1;margin-left:52px}.project-row .updated{display:none}.proof-page{grid-template-columns:1fr}.page-comments{grid-row:2}.draw-toolbar{max-width:calc(100% - 20px);flex-wrap:wrap}.settings-grid{grid-template-columns:1fr}.guest-header{padding:16px}.workspace-top .actions .secondary{display:none}}
.language-switch{width:calc(100% - 16px);margin:6px 8px;border:1px solid #dcd9f2;border-radius:9px;background:linear-gradient(135deg,#fbfaff,#f0edff);color:var(--purple);padding:8px 11px;display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:700;letter-spacing:.2px;box-shadow:0 2px 7px #6756d914;transition:transform .15s ease,box-shadow .15s ease}.language-switch:hover{transform:translateY(-1px);box-shadow:0 5px 12px #6756d924}.language-switch:before{content:'◎';width:21px;height:21px;border-radius:50%;display:grid;place-items:center;background:var(--purple);color:#fff;font-size:14px;line-height:1}.guest-header .language-switch{width:auto;margin:0;gap:7px;padding:8px 11px}
.annotation-canvas.drawing-enabled{touch-action:none;-webkit-user-select:none;user-select:none}.page-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 auto 14px;max-width:820px}.page-nav strong{font-size:12px;color:#5d6175}.page-nav button:disabled{opacity:.42;cursor:not-allowed}@media(max-width:720px){.proof-page{gap:12px}.proof-page .art{max-width:100%;overflow:hidden}.draw-toolbar{position:sticky;left:6px;top:6px}.page-nav{position:sticky;top:0;z-index:4;background:var(--bg);padding:8px 0;margin-bottom:8px}.page-nav .button{padding:9px 10px;font-size:11px}}
.brand,.heading h1,.project-title,.stat strong,.panel h2,.proof-toolbar strong,.page-comments h3,.guest-brand,.modal h2{font-family:"Montserrat",Arial,sans-serif!important}.brand,.heading h1,.project-title{letter-spacing:-.4px}body{font-family:"Montserrat",Arial,sans-serif}
.brand-mark{background:#6756d9!important;font-size:0!important;position:relative;overflow:hidden}.brand-mark:before{content:"";position:absolute;inset:6px 7px 7px 8px;border-radius:3px;background:#fff;clip-path:polygon(0 0,70% 0,100% 30%,100% 100%,0 100%)}.brand-mark:after{content:"";position:absolute;left:11px;top:15px;width:10px;height:5px;border-left:2px solid #6756d9;border-bottom:2px solid #6756d9;transform:rotate(-45deg)}.language-picker{display:grid;grid-template-columns:1fr 1fr;gap:3px;margin:7px 8px;padding:3px;border:1px solid #dedbf2;border-radius:10px;background:#f6f5fc;box-shadow:inset 0 1px 1px #ffffff}.language-picker button{border:0;border-radius:7px;background:transparent;color:#7c8092;padding:7px 5px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:5px;transition:background .15s,color .15s,box-shadow .15s}.language-picker button.active{background:#fff;color:#5542d0;box-shadow:0 2px 6px #352d771c}.language-picker button:not(.active):hover{background:#eeecfb}.flag{display:inline-block;width:17px;height:12px;border-radius:2px;box-shadow:0 0 0 1px #39405a2b;overflow:hidden}.flag-bg{background:linear-gradient(to bottom,#fff 0 33.33%,#169b62 33.33% 66.66%,#d62612 66.66%)}.flag-en{background:linear-gradient(33deg,transparent 42%,#fff 42% 48%,#cf142b 48% 53%,transparent 53%),linear-gradient(-33deg,transparent 42%,#fff 42% 48%,#cf142b 48% 53%,transparent 53%),linear-gradient(to right,transparent 39%,#fff 39% 61%,transparent 61%),linear-gradient(to bottom,transparent 31%,#fff 31% 69%,transparent 69%),linear-gradient(to right,transparent 44%,#cf142b 44% 56%,transparent 56%),linear-gradient(to bottom,transparent 38%,#cf142b 38% 62%,transparent 62%),#1f4d99}.guest-header .language-picker{width:132px;margin:0}.language-picker-compact{flex:0 0 132px}@media(max-width:720px){.guest-header .language-picker{width:116px}.language-picker button span{font-size:10px}}
.brand-mark{background:linear-gradient(135deg,#8b79ff,#5140c5)!important;box-shadow:0 4px 11px #6756d94d}.brand-mark:before{content:"✓"!important;inset:0!important;width:auto!important;height:auto!important;border:0!important;clip-path:none!important;background:transparent!important;color:#fff!important;display:grid!important;place-items:center!important;font:700 20px/1 Arial,sans-serif!important}.brand-mark:after{content:""!important;left:auto!important;top:auto!important;right:3px!important;bottom:3px!important;width:7px!important;height:7px!important;border:2px solid #fff!important;border-radius:50%!important;background:#ff9f5c!important;transform:none!important}.flag{width:18px!important;height:18px!important;border-radius:50%!important;box-shadow:0 0 0 1px #39405a35,0 1px 3px #39405a28!important}.flag-bg{background:linear-gradient(to bottom,#fff 0 33.33%,#199d63 33.33% 66.66%,#d62612 66.66%)!important}.flag-en{background:linear-gradient(33deg,transparent 43%,#fff 43% 48%,#cf142b 48% 52%,transparent 52%),linear-gradient(-33deg,transparent 43%,#fff 43% 48%,#cf142b 48% 52%,transparent 52%),linear-gradient(to right,transparent 37%,#fff 37% 63%,transparent 63%),linear-gradient(to bottom,transparent 31%,#fff 31% 69%,transparent 69%),linear-gradient(to right,transparent 44%,#cf142b 44% 56%,transparent 56%),linear-gradient(to bottom,transparent 39%,#cf142b 39% 61%,transparent 61%),#1f4d99!important}
.flag{width:20px!important;height:14px!important;border-radius:2px!important}.flag-en{background:#012169 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Crect width='60' height='30' fill='%23012169'/%3E%3Cpath d='M0 0 60 30M60 0 0 30' stroke='white' stroke-width='7'/%3E%3Cpath d='M0 0 60 30M60 0 0 30' stroke='%23C8102E' stroke-width='3'/%3E%3Cpath d='M30 0v30M0 15h60' stroke='white' stroke-width='11'/%3E%3Cpath d='M30 0v30M0 15h60' stroke='%23C8102E' stroke-width='6'/%3E%3C/svg%3E") center/cover no-repeat!important}

/* Responsive layout safeguards */
.sidebar{overflow-y:auto;overscroll-behavior:contain}
.mobile-nav-layer,.mobile-nav-toggle{display:none}
@media(max-width:1180px){.grid{grid-template-columns:1fr}}
@media(max-width:1120px){.proof-page{grid-template-columns:minmax(0,820px);justify-content:center}.page-comments{max-width:820px;width:100%;justify-self:center}}
@media(max-width:720px){
  .mobile-nav-toggle{display:grid;place-items:center;flex:0 0 37px}
  .topbar{height:auto;min-height:64px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;padding-block:10px}
  .topbar .crumb{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .topbar .actions{justify-content:flex-end;min-width:0}.topbar .actions .secondary{display:none}.topbar .actions .primary{padding-inline:11px;white-space:nowrap}
  .workspace-top{height:auto;min-height:64px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;padding-block:10px}
  .workspace-top .actions{grid-column:1/-1;justify-content:flex-start;overflow-x:auto;white-space:nowrap;padding-bottom:2px;scrollbar-width:none}.workspace-top .actions::-webkit-scrollbar{display:none}.workspace-top .actions .secondary{display:inline-flex}.workspace-top .actions .button{flex:0 0 auto}
  .project-tabs{overflow-x:auto;white-space:nowrap;padding-inline-end:32px;scroll-padding-inline:12px;scroll-snap-type:x proximity;scrollbar-width:none}.project-tabs::-webkit-scrollbar{display:none}.project-tabs button{flex:0 0 auto;scroll-snap-align:start}
  .modal-actions{flex-direction:column}.modal-actions>*{width:100%}
  .guest-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.guest-header>span:nth-child(2){grid-column:1/-1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;order:3}
  .mobile-nav-layer{display:block;position:fixed;inset:0;z-index:50;pointer-events:none}.mobile-nav-layer.open{pointer-events:auto}.mobile-nav-scrim{position:absolute;inset:0;border:0;background:#1c1f315c;opacity:0;transition:opacity .18s ease}.mobile-nav-layer.open .mobile-nav-scrim{opacity:1}
  .mobile-nav-panel{position:absolute;inset-block:0;inset-inline-start:0;width:min(86vw,330px);background:#fff;padding:20px 14px calc(18px + env(safe-area-inset-bottom));display:flex;flex-direction:column;overflow-y:auto;box-shadow:16px 0 38px #1d203033;transform:translateX(-105%);transition:transform .2s ease}.mobile-nav-layer.open .mobile-nav-panel{transform:translateX(0)}
  .mobile-nav-head{display:flex;align-items:center;justify-content:space-between;padding:0 4px 20px}.mobile-nav-head .brand{padding:0;font-size:22px}.mobile-nav-head .icon-button{border:0;background:#f4f3fc}.mobile-nav-links{margin-top:4px}.mobile-nav-foot{margin-top:auto;padding-top:16px;border-top:1px solid var(--line)}.mobile-nav-foot .language-picker{margin-inline:0}.mobile-profile{width:100%;border:0;background:none;text-align:start;margin:10px 0 0;padding:12px 8px;cursor:pointer}
}

/* Review follow-up: accessible contrast, type and shared interaction states. */
:root{--muted:#596075}
.project-link{color:inherit;text-decoration:none}
.workspace-label,.table-labels,.updated,.crumb{color:#5b6175}
.workspace-card small,.profile small,.project-name small,.attention-row small{color:var(--muted);font-size:12px}
.table-labels{font-size:11px}.updated,.status{font-size:12px}.field{font-size:12px}.panel-head p{font-size:12px}.project-name strong,.attention-row strong{font-size:13px}
.awaiting-review{color:#8a5316}.needs-changes{color:#973d63}.approved,.finalized{color:#176c57}
.field input,.field textarea,.field select{font-size:14px}
:where(button,input,textarea,select,a):focus-visible{outline:2px solid #4f3fc6;outline-offset:2px}
.field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible{border-color:#4f3fc6;box-shadow:0 0 0 3px #6756d926}
.button:active:not(:disabled){transform:scale(.96)}.button.is-pending{opacity:.72;cursor:wait}.button.is-pending::after{content:"";width:12px;height:12px;border:2px solid currentColor;border-inline-end-color:transparent;border-radius:50%;margin-inline-start:3px}
@media(prefers-reduced-motion:no-preference){.button.is-pending::after{animation:proofly-spin .7s linear infinite}}@keyframes proofly-spin{to{transform:rotate(1turn)}}
#toast-region{position:fixed;right:22px;bottom:22px;z-index:60;max-width:min(420px,calc(100vw - 32px));background:#252838;color:#fff;border-radius:9px;padding:11px 14px;font-size:13px;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .16s ease,transform .16s ease}#toast-region.show{opacity:1;transform:translateY(0)}
.proof-skeleton{min-height:260px;width:100%;border-radius:12px;background:linear-gradient(100deg,#f0f0f5 25%,#fafafe 42%,#f0f0f5 58%);background-size:200% 100%;display:grid;place-items:center;color:#696f82}.proof-skeleton:before{content:"Loading preview…";font-size:13px;font-weight:600}@media(prefers-reduced-motion:no-preference){.proof-skeleton{animation:proofly-shimmer 1.2s linear infinite}}@keyframes proofly-shimmer{to{background-position:-200% 0}}
.art img,.art .pdf-canvas,.proof-thumb img{outline:1px solid oklch(0 0 0 / .1);outline-offset:-1px}
.color-dot{width:32px;height:32px}.width-dot{width:34px;height:34px}.tool-button{padding:8px 11px;font-size:12px}
.brand-mark{background:linear-gradient(135deg,#8b79ff,#5140c5)!important}.flag{width:20px!important;height:14px!important;border-radius:2px!important}
@media(max-width:720px){.field input,.field textarea,.field select{font-size:16px}.draw-toolbar{gap:8px;padding:9px}.color-dot{width:34px;height:34px}.width-dot{width:36px;height:36px}.modal-backdrop{overscroll-behavior:contain}#toast-region{right:16px;bottom:calc(16px + env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.mobile-nav-scrim,.mobile-nav-panel,#toast-region{transition:none}.proof-skeleton{animation:none}}
.modal-backdrop{z-index:1000;overscroll-behavior:contain}
.modal{z-index:1001;pointer-events:auto}
.modal .field,.modal .auth-form,.modal .auth-result,.modal .auth-register-choices{position:relative;z-index:2}
.modal input,.modal textarea,.modal select{position:relative;z-index:3;pointer-events:auto;cursor:text;caret-color:#4f3fc6;-webkit-user-select:text;user-select:text}
.modal button{position:relative;z-index:3}
.modal input::selection,.modal textarea::selection{background:#dcd7ff;color:#17182a}

/* Keep the primary project action next to the project list it creates. */
.compact-topbar{justify-content:flex-start}
.panel-head{gap:16px}
.panel-actions{margin-inline-start:auto;display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.panel-actions .link-button{min-height:38px;padding:0 4px;white-space:nowrap}
.panel-new-project{padding:11px 15px;white-space:nowrap;box-shadow:0 8px 20px #6756d92f}
.panel-new-project .mi{font-size:20px;line-height:1}
@media(max-width:720px){
  .panel-head{align-items:stretch;flex-direction:column}
  .panel-actions{margin-inline-start:0;justify-content:flex-start}
  .panel-new-project{width:100%}
}

/* Proof page status layout: keep status controls with the project title, not in the top bar. */
.workspace-top .status-action-wrap,.workspace-top .status-legend{display:none!important}
.workspace-top .actions{flex-wrap:wrap;justify-content:flex-end}
.project-heading{align-items:flex-start;gap:24px}
.project-heading>div{min-width:0}
.project-status-panel{margin-inline-start:auto;min-width:300px;max-width:390px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px 14px;box-shadow:0 10px 28px #1d20300d}
.project-status-current{display:flex;align-items:center;gap:10px;justify-content:space-between}
.project-status-current .status-icon-pill{flex:0 0 auto}
.project-status-current small{font-size:11px;line-height:1.3;color:var(--muted);text-align:end;max-width:185px}
.project-status-panel .status-quick-actions{margin-top:10px;justify-content:flex-end;gap:8px}
.project-status-panel .status-icon-button{width:38px!important;height:38px!important;min-width:38px!important;border-radius:12px!important}
.project-status-panel .status-icon-button .mi{font-size:21px!important}
@media(max-width:960px){
  .project-heading{flex-direction:column;align-items:stretch}
  .project-status-panel{margin-inline-start:0;width:100%;max-width:none;min-width:0}
  .project-status-current,.project-status-panel .status-quick-actions{justify-content:flex-start}
  .project-status-current small{text-align:start;max-width:none}
}
@media(max-width:720px){
  .workspace-top .actions{justify-content:flex-start}
  .project-status-panel .status-icon-button{width:44px!important;height:44px!important;min-width:44px!important}
}

/* Header identity: company + language + active designer. */
.app-topbar{gap:16px;justify-content:space-between}
.topbar-right,.header-utilities{margin-inline-start:auto;display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}
.company-chip,.header-profile-chip{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);background:#fff;border-radius:14px;min-height:42px;padding:6px 10px;color:var(--ink);box-shadow:0 6px 18px #1d20300a}
.company-chip{max-width:270px}
.company-chip-logo{width:30px;height:30px;border-radius:9px;background:#f4f3fc;color:var(--purple);display:grid;place-items:center;overflow:hidden;flex:0 0 30px;font-weight:800;font-size:11px}
.company-chip-logo img{width:100%;height:100%;object-fit:contain;background:#fff}
.company-chip strong,.company-chip small,.header-profile-chip strong,.header-profile-chip small{display:block;line-height:1.15;min-width:0}
.company-chip strong,.header-profile-chip strong{font-size:12px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.company-chip small,.header-profile-chip small{font-size:10px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.header-profile-chip{border:0;cursor:pointer;max-width:230px;text-align:start;padding-inline:8px 11px}
.header-profile-chip:hover{background:#f7f6fd;box-shadow:0 8px 20px #6756d914}
.header-profile-chip .avatar{width:34px;height:34px;border-radius:10px;overflow:hidden;flex:0 0 34px}
.header-profile-chip .avatar img{width:100%;height:100%;object-fit:cover}
.workspace-top{gap:12px}
.workspace-identity-top{margin-inline-end:auto}
.guest-header .guest-company-chip{margin-inline:auto}
.guest-header .company-chip-logo{width:34px;height:34px;flex-basis:34px}
@media(max-width:1180px){
  .topbar-right .topbar-company{display:none}
  .header-profile-chip{max-width:190px}
}
@media(max-width:860px){
  .app-topbar{height:auto;min-height:68px;align-items:center;padding-block:10px}
  .topbar-right,.header-utilities{flex-wrap:wrap}
  .workspace-top{height:auto;min-height:70px;flex-wrap:wrap;padding-block:10px}
  .workspace-identity-top{order:3;flex:1 1 100%;margin-inline-end:0}
  .workspace-top .actions{margin-inline-start:0}
}
@media(max-width:720px){
  .topbar-right .language-picker,.header-utilities .language-picker{width:112px}
  .header-profile-chip span:last-child{display:none}
  .header-profile-chip{padding:5px;min-height:42px}
  .guest-header .guest-company-chip{order:3;grid-column:1/-1;margin:0}
}

/* Sidebar brand: compact wordmark + dashboard shortcut. */
.sidebar .brand,.mobile-nav-head .brand{cursor:pointer;border-radius:14px;min-height:44px;padding:4px 8px;margin:0 2px 28px;gap:10px;transition:background-color .14s ease,box-shadow .14s ease}
.sidebar .brand:hover,.mobile-nav-head .brand:hover{background:#f6f4ff;box-shadow:0 8px 18px #6756d910}
.sidebar .brand:focus-visible,.mobile-nav-head .brand:focus-visible{outline:2px solid #4f3fc6;outline-offset:2px}
.pixelapprove-wordmark{display:inline-flex;align-items:baseline;min-width:0}
.sidebar .pixelapprove-wordmark,.mobile-nav-head .pixelapprove-wordmark{display:flex;flex-direction:column;align-items:flex-start;gap:0;line-height:.92;letter-spacing:-.8px;min-width:0}
.sidebar .word-pixel,.sidebar .word-approve,.mobile-nav-head .word-pixel,.mobile-nav-head .word-approve{display:block;max-width:135px;overflow:visible;text-overflow:clip;white-space:nowrap}
.sidebar .word-pixel,.mobile-nav-head .word-pixel{font-size:21px}
.sidebar .word-approve,.mobile-nav-head .word-approve{font-size:17px;color:#5b6175;letter-spacing:-.45px}
.sidebar .brand .brand-mark,.mobile-nav-head .brand .brand-mark{width:34px;height:34px;flex:0 0 34px;border-radius:11px}
.landing-brand .pixelapprove-wordmark,.guest-brand .pixelapprove-wordmark{gap:0}
@media(max-width:1000px){
  .sidebar .word-pixel,.sidebar .word-approve{max-width:118px}
  .sidebar .word-pixel{font-size:20px}
  .sidebar .word-approve{font-size:16px}
}

/* Proofing identity cleanup: no repeated company chips in the designer/review view. */
.topbar-company,.workspace-identity-top,.guest-company-chip{display:none!important}
.workspace-top .header-utilities{display:none!important}
.company-logo-only{width:42px;height:42px;border-radius:13px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;overflow:hidden;box-shadow:0 7px 18px #1d20300d;color:var(--purple);flex:0 0 42px}
.company-logo-only img{width:100%;height:100%;object-fit:contain;padding:5px;background:#fff}
.company-logo-only svg{width:26px;height:26px;color:var(--purple)}
.project-company-logo{margin-inline-start:4px;margin-inline-end:auto}
.guest-company-logo{margin-inline-start:12px;margin-inline-end:auto}
.project-designer-byline{display:inline-flex;align-items:center;gap:10px;margin-top:12px;color:var(--muted)}
.project-designer-byline .avatar{width:38px;height:38px;border-radius:12px;overflow:hidden;flex:0 0 38px;outline:1px solid oklch(0 0 0 / .1);outline-offset:-1px}
.project-designer-byline .avatar img{width:100%;height:100%;object-fit:cover}
.project-designer-byline small,.project-designer-byline strong{display:block;line-height:1.18}
.project-designer-byline small{font-size:10px;text-transform:uppercase;letter-spacing:.55px;color:#8a8fa1;font-weight:800}
.project-designer-byline strong{font-size:13px;color:var(--ink);font-weight:800}
.workspace-top{grid-template-columns:auto auto minmax(0,1fr) auto}
.workspace-top .actions{margin-inline-start:auto}
@media(max-width:860px){
  .project-company-logo{order:2;margin-inline-end:0}
  .workspace-top .actions{order:3;margin-inline-start:auto}
  .project-designer-byline{margin-top:10px}
}

/* Proofing cleanup v2: one brand, one back action, one compact status control. */
.project-company-logo,.guest-company-logo,.guest-header>.company-chip,.guest-header>.guest-company-chip{display:none!important}
.guest-header{justify-content:space-between}
.guest-header>span:not(.guest-brand){display:none!important}
.workspace-top{display:flex!important;grid-template-columns:none!important;align-items:center;gap:14px}
.workspace-top .back{margin-inline-end:auto}
.workspace-top .actions{margin-inline-start:0}
.compact-status-panel{min-width:0;max-width:340px;padding:12px 14px;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px 14px}
.compact-status-panel .status-quick-actions{margin-top:0!important;justify-content:flex-start!important;gap:8px}
.compact-status-panel .status-icon-button{width:40px!important;height:40px!important;min-width:40px!important;border-radius:14px!important}
.compact-status-panel .status-icon-button.active{box-shadow:0 0 0 3px currentColor inset;background:color-mix(in oklch,currentColor 10%,white)}
.status-selected-copy{min-width:0}
.status-selected-copy strong{display:block;font-size:13px;line-height:1.15;color:var(--ink)}
.status-selected-copy small{display:block;margin-top:3px;font-size:11px;line-height:1.25;color:var(--muted)}
.project-status-current{display:none!important}
@media(max-width:960px){
  .compact-status-panel{width:100%;max-width:none}
}
@media(max-width:720px){
  .workspace-top{flex-wrap:wrap}
  .workspace-top .actions{width:100%;justify-content:flex-start}
  .compact-status-panel{grid-template-columns:1fr}
}

/* Project identity and lighter client approval controls. */
.project-identity-strip{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px}
.project-identity-card{display:inline-flex;align-items:center;gap:10px;min-width:0}
.project-identity-avatar{width:38px;height:38px;border-radius:12px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;overflow:hidden;color:var(--purple);flex:0 0 38px;box-shadow:0 5px 14px #1d20300a}
.project-identity-avatar img{width:100%;height:100%;object-fit:cover}
.project-identity-avatar.company-avatar img{object-fit:contain;padding:5px;background:#fff}
.project-identity-avatar svg{width:24px;height:24px}
.project-identity-card small,.project-identity-card strong{display:block;line-height:1.16}
.project-identity-card small{font-size:10px;text-transform:uppercase;letter-spacing:.55px;color:#8a8fa1;font-weight:800}
.project-identity-card strong{font-size:13px;color:var(--ink);font-weight:800;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.client-status-panel{min-width:0;max-width:430px;padding:0;background:transparent;border:0;box-shadow:none}
.client-status-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.client-status-button{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:14px;padding:10px 13px;display:inline-flex;align-items:center;gap:10px;min-height:48px;box-shadow:0 5px 16px #1d20300a;transition:background-color .15s ease,border-color .15s ease,transform .12s ease}
.client-status-button .mi{font-size:22px}
.client-status-button strong,.client-status-button small{display:block;line-height:1.12;text-align:start}
.client-status-button strong{font-size:12px}
.client-status-button small{font-size:10px;color:var(--muted);margin-top:3px}
.client-status-button.changes{color:#9b4269}
.client-status-button.approve{color:#16715b}
.client-status-button.active{border-color:currentColor;background:color-mix(in oklch,currentColor 8%,white);box-shadow:0 5px 16px #1d20300a}
.client-status-button:active{transform:scale(.96)}
.compact-status-panel .status-icon-button.active{box-shadow:none!important;border-color:currentColor!important;background:color-mix(in oklch,currentColor 10%,white)!important}
@media(max-width:960px){
  .client-status-panel{width:100%;max-width:none}
  .client-status-actions{justify-content:flex-start}
}
@media(max-width:720px){
  .project-identity-strip{gap:10px}
  .project-identity-card{width:100%}
  .client-status-button{flex:1 1 180px}
}

/* Editable company team list. */
.team-editor-list{
  display:grid;
  gap:10px;
}
.team-editor-row{
  display:grid;
  grid-template-columns:42px minmax(150px,1fr) minmax(210px,1.25fr) 160px auto;
  gap:12px;
  align-items:end;
  padding:12px;
  border:1px solid #eeeef5;
  border-radius:14px;
  background:#fff;
}
.team-editor-row .avatar{
  align-self:center;
  width:38px;
  height:38px;
  border-radius:12px;
  overflow:hidden;
}
.team-editor-row .avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.team-editor-row .field{
  margin:0;
}
.team-save-button{
  min-height:40px;
  white-space:nowrap;
}
.team-save-button:disabled{
  opacity:.6;
  cursor:wait;
}
.team-row-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  min-height:40px;
}
.team-icon-button{
  min-width:42px;
  width:42px;
  height:40px;
  padding:0;
  display:inline-grid;
  place-items:center;
}
.danger-soft{
  color:#b42355;
  background:#fff1f5;
  border-color:#ffd3df;
}
.danger-soft:hover{
  background:#ffe5ef;
  border-color:#ffb9cc;
}
.common-project-toggle{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:11px 12px;
  border:1px solid #e3e1f3;
  border-radius:12px;
  background:#fff;
  box-shadow:0 6px 16px rgba(29,32,48,.04);
  cursor:pointer;
  transition-property:border-color,background-color,box-shadow;
  transition-duration:.15s;
  transition-timing-function:ease;
}
.common-project-toggle:hover{
  border-color:#cfc9f4;
  background:#fbfaff;
  box-shadow:0 8px 18px rgba(29,32,48,.06);
}
.common-project-toggle input{
  appearance:none;
  position:relative;
  flex:0 0 auto;
  width:22px;
  height:22px;
  margin:1px 0 0;
  border-radius:7px;
  border:1.5px solid #c9c5e6;
  background:#fff;
  box-shadow:0 1px 3px rgba(29,32,48,.08);
  display:grid;
  place-items:center;
  cursor:pointer;
  transition-property:background-color,border-color,box-shadow;
  transition-duration:.15s;
  transition-timing-function:ease;
}
.common-project-toggle input::before{
  content:"";
  position:static;
  width:10px;
  height:6px;
  border-radius:0;
  border-inline-start:2px solid #fff;
  border-block-end:2px solid #fff;
  background:transparent;
  box-shadow:none;
  opacity:0;
  transform:rotate(-45deg) translateY(-1px);
  transition-property:opacity;
  transition-duration:.12s;
}
.common-project-toggle input:checked{
  background:#6756d9;
  border-color:#6756d9;
}
.common-project-toggle input:checked::before{
  opacity:1;
  transform:rotate(-45deg) translateY(-1px);
}
.common-project-toggle input:focus-visible{
  outline:3px solid rgba(103,86,217,.22);
  outline-offset:2px;
}
.common-project-toggle span{
  display:block;
  min-width:0;
}
.common-project-toggle .mi{
  display:none;
}
.common-project-toggle strong{
  display:block;
  font-size:13px;
  line-height:1.2;
}
.common-project-toggle small{
  display:block;
  margin-top:2px;
  color:#7d8195;
  line-height:1.35;
}
.project-shared-toggle{
  margin-bottom:16px;
}
.settings-toggle{
  margin:4px 0 14px;
}
.notification-toggle{
  box-shadow:0 8px 20px rgba(29,32,48,.05);
}
.project-shared-toggle,
.settings-toggle{
  max-width:520px;
}
.compact-check-row{
  display:flex;
  align-items:flex-start;
  gap:8px;
  width:max-content;
  max-width:100%;
  margin:2px 0 10px;
  padding:2px 0;
  border:0;
  background:transparent;
  box-shadow:none;
  color:var(--ink);
  cursor:pointer;
}
.compact-check-row:hover{
  background:transparent;
  box-shadow:none;
}
.compact-check-row input{
  appearance:none;
  position:relative;
  flex:0 0 17px;
  width:17px;
  height:17px;
  margin:1px 0 0;
  border:1.5px solid #b9b5d8;
  border-radius:4px;
  background:#fff;
  box-shadow:0 1px 2px rgba(29,32,48,.08);
  cursor:pointer;
}
.compact-check-row input::before{
  content:"";
  position:absolute;
  left:3px;
  top:3px;
  width:8px;
  height:5px;
  border-inline-start:2px solid #fff;
  border-block-end:2px solid #fff;
  opacity:0;
  transform:rotate(-45deg);
}
.compact-check-row input:checked{
  background:#6756d9;
  border-color:#6756d9;
}
.compact-check-row input:checked::before{
  opacity:1;
  transform:rotate(-45deg);
}
.compact-check-row input:focus-visible{
  outline:3px solid rgba(103,86,217,.22);
  outline-offset:2px;
}
.compact-check-row span{
  display:block;
  min-width:0;
}
.compact-check-row .mi{
  display:none;
}
.compact-check-row strong{
  display:block;
  font-size:12px;
  line-height:1.18;
}
.compact-check-row small{
  display:block;
  margin-top:1px;
  color:#7d8195;
  font-size:11px;
  line-height:1.25;
}
.project-shared-toggle,
.settings-toggle{
  max-width:440px;
}
.notification-toggle{
  margin-top:6px;
  margin-bottom:12px;
}
@media(max-width:980px){
  .team-editor-row{
    grid-template-columns:42px 1fr 1fr;
  }
  .team-role-field,
  .team-row-actions{
    grid-column:auto;
  }
}
@media(max-width:720px){
  .team-editor-row{
    grid-template-columns:42px 1fr;
    align-items:start;
  }
  .team-editor-row .team-email-field,
  .team-editor-row .team-role-field,
  .team-editor-row .team-row-actions{
    grid-column:1/-1;
  }
  .team-row-actions{
    justify-content:stretch;
  }
  .team-row-actions .team-save-button{
    flex:1;
  }
}

/* Annotation toolbar v20: visible for anonymous review and ~30% lighter. */
.compact-draw-toolbar,
.draw-toolbar{
  gap:5px;
  padding:6px 8px;
  border-radius:8px;
  box-shadow:0 4px 14px #1d20301f;
}
.compact-draw-toolbar strong,
.draw-toolbar strong{
  font-size:11px;
  line-height:1;
}
.compact-draw-toolbar .color-dot,
.draw-toolbar .color-dot{
  width:22px!important;
  height:22px!important;
}
.compact-draw-toolbar .width-dot,
.draw-toolbar .width-dot{
  width:24px!important;
  height:24px!important;
}
.compact-draw-toolbar .tool-button,
.draw-toolbar .tool-button{
  padding:6px 8px!important;
  font-size:11px!important;
}
.compact-draw-toolbar .autosave-status,
.draw-toolbar .autosave-status{
  font-size:11px;
}
.compact-draw-toolbar .tool-divider,
.draw-toolbar .tool-divider{
  height:17px;
}
.guest-proof-page .draw-toolbar{
  display:flex;
}
.readonly-proof-page .draw-toolbar,
.readonly-proof-page .draw-hint{
  display:none!important;
}
.readonly-annotation{
  pointer-events:none;
  cursor:default;
}
.draw-hint{
  max-width:285px;
  padding:12px 13px;
  border-radius:13px;
}
.draw-hint strong{
  font-size:13px;
}
.draw-hint span{
  font-size:12px;
  line-height:1.35;
}
@media(max-width:720px){
  .compact-draw-toolbar,
  .draw-toolbar{
    gap:5px;
    padding:6px;
    max-width:calc(100% - 12px);
  }
  .compact-draw-toolbar .color-dot,
  .draw-toolbar .color-dot{
    width:24px!important;
    height:24px!important;
  }
  .compact-draw-toolbar .width-dot,
  .draw-toolbar .width-dot{
    width:26px!important;
    height:26px!important;
  }
  .compact-draw-toolbar .autosave-status,
  .draw-toolbar .autosave-status{
    display:none;
  }
  .guest-proof-page .art,
  .guest-proof-page .annotation-canvas.drawing-enabled{
    touch-action:none;
  }
  .guest-proof-page .draw-hint{
    left:8px;
    right:8px;
    max-width:none;
  }
}

/* Keep language and account controls in one canonical place: the sidebar.
   The desktop topbar should stay a lightweight breadcrumb/header only. */
.topbar .topbar-right,
.topbar .header-utilities,
.topbar .language-picker,
.topbar .header-profile-chip,
.topbar [data-header-profile],
.topbar [data-header-signin],
.topbar [data-profile],
.topbar [data-signin]{
  display:none!important;
}

.topbar.app-topbar,
.topbar.compact-topbar{
  justify-content:flex-start!important;
}

/* Status icons: keep them compact and self-contained instead of inheriting
   the old text-status dot layout. */
.status-icon-pill{
  width:34px;
  height:30px;
  padding:0;
  border:1px solid currentColor;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  background:color-mix(in oklch,currentColor 9%,white);
  font-size:0;
  line-height:1;
  vertical-align:middle;
  overflow:hidden;
  flex:0 0 auto;
}
.status-icon-pill:before{
  display:none!important;
  content:none!important;
}
.status-icon-pill .mi{
  font-size:18px;
  line-height:1;
}
.status-icon-pill.with-copy{
  width:auto;
  min-height:34px;
  padding:7px 10px;
  gap:7px;
  font-size:12px;
  font-weight:800;
}

.status-legend-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
}
.status-legend-trigger{
  width:36px;
  height:36px;
  border:1px solid #dedcf2;
  border-radius:12px;
  background:#fff;
  color:#69708a;
  display:grid;
  place-items:center;
  box-shadow:0 6px 18px rgba(29,32,48,.05);
  transition:color .14s ease-out, border-color .14s ease-out, background-color .14s ease-out, transform .14s ease-out;
}
.status-legend-trigger:hover,
.status-legend-wrap:focus-within .status-legend-trigger{
  color:var(--purple);
  border-color:#cac5f3;
  background:#f7f5ff;
}
.status-legend-trigger:active{
  transform:scale(.96);
}
.status-legend-trigger .mi{
  font-size:20px;
  line-height:1;
}
.status-legend{
  position:absolute;
  z-index:20;
  inset-block-start:calc(100% + 10px);
  inset-inline-end:0;
  width:min(360px,calc(100vw - 40px));
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  padding:12px;
  border:1px solid #e5e2f5;
  border-radius:16px;
  background:#fff;
  box-shadow:0 18px 44px rgba(29,32,48,.16);
  opacity:0;
  transform:translateY(-4px);
  pointer-events:none;
  transition:opacity .14s ease-out, transform .14s ease-out;
}
.status-legend-wrap:hover .status-legend,
.status-legend-wrap:focus-within .status-legend{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.status-legend-item{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  padding:6px;
  border-radius:12px;
}
.status-legend-item strong,
.status-legend-item small{
  display:block;
  line-height:1.15;
}
.status-legend-item strong{
  font-size:12px;
}
.status-legend-item small{
  margin-top:2px;
  color:var(--muted);
  font-size:11px;
}

@media(max-width:720px){
  .panel{
    overflow:hidden;
  }
  .project-row.project-link{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:6px 12px!important;
    align-items:center!important;
    width:100%;
    min-width:0;
    padding:14px 0!important;
    overflow:hidden;
  }
  .project-row.project-link .project-name{
    grid-column:1;
    grid-row:1;
    min-width:0;
    display:grid;
    grid-template-columns:44px minmax(0,1fr);
    gap:12px;
    align-items:center;
  }
  .project-row.project-link .proof-thumb{
    width:44px;
    height:44px;
  }
  .project-row.project-link .project-name strong,
  .project-row.project-link .project-name small{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .project-row.project-link .status-icon-pill,
  .project-row.project-link .status{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
    margin:0!important;
  }
  .project-row.project-link .updated{
    display:none!important;
    margin:0!important;
  }
  .project-row.project-link>span:last-child{
    display:none!important;
  }
  .status-legend{
    inset-inline-start:0;
    inset-inline-end:auto;
    width:min(320px,calc(100vw - 32px));
  }
  .panel:has(.status-legend-wrap){overflow:visible}
  .comment-inbox-row{
    grid-template-columns:44px minmax(0,1fr);
    padding-inline:0;
  }
  .comment-inbox-row>span:last-child{
    display:none;
  }
  .comment-inbox-top{
    align-items:flex-start;
    flex-direction:column;
    gap:6px;
  }
  .comment-inbox-top strong{
    white-space:normal;
  }
}

/* Proof dimensions: lightweight print-size guides outside the artwork. */
.proof-stack,
.proof-container,
.proof-page,
.proof-page .art.has-dimensions{
  overflow:visible!important;
}
.proof-page .art.has-dimensions{
  margin-block-start:28px;
  margin-inline-start:28px;
}
.proof-page .art.has-dimensions.dimensions-hidden{
  margin-block-start:0;
  margin-inline-start:0;
}
.proof-page-main{
  min-width:0;
  width:100%;
}
.proof-page-tools{
  display:flex;
  align-items:flex-start;
  gap:10px;
  flex-wrap:wrap;
  margin-block-end:10px;
  position:relative;
  z-index:5;
}
.proof-page-tools .draw-toolbar{
  position:static;
  inset:auto;
  max-width:100%;
}
.comment-draw-tools{
  margin-block-start:16px;
  padding-block-start:14px;
  border-top:1px solid #f0eef8;
}
.comment-draw-tools .draw-toolbar{
  position:static;
  inset:auto;
  width:100%;
  max-width:100%;
  box-shadow:none;
}
.proof-size-tools{
  margin-block-end:8px;
}
.proof-size-pill{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 12px;
  border:1px solid #ddd8ff;
  border-radius:999px;
  background:#fff;
  color:#5f55d8;
  font-size:12px;
  font-weight:800;
  box-shadow:0 8px 22px #6756d91a;
  white-space:nowrap;
}
.proof-size-pill.is-estimated{
  border-color:#ffe0aa;
  background:#fff9f0;
  color:#a16305;
}
.proof-size-pill.is-manual{
  border-color:#d8f2e9;
  background:#f2fbf8;
  color:#19735f;
}
.proof-size-missing{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:36px;
  padding:0 12px;
  border:1px dashed #d8dbe8;
  border-radius:999px;
  background:#fff;
  color:#7a8195;
  font:inherit;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}
.proof-size-missing .mi{
  font-size:18px;
}
.proof-size-missing.editable{
  cursor:pointer;
  color:#5f55d8;
  border-color:#cfc8ff;
  box-shadow:0 8px 22px #6756d912;
}
.proof-size-missing.editable:hover{
  background:#f7f5ff;
  border-style:solid;
}
.size-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr .75fr;
  gap:12px;
  margin-block:18px 8px;
}
.proof-dimension{
  position:absolute;
  z-index:1;
  pointer-events:none;
  color:#8a90a3;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  line-height:1;
}
.proof-dimension-label{
  position:absolute;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:18px;
  padding:0 7px;
  border:1px solid #e5e6ef;
  border-radius:999px;
  background:#fff;
  box-shadow:0 3px 10px #1d20300f;
  white-space:nowrap;
}
.proof-dimension-x{
  inset-inline:0;
  top:-17px;
  height:1px;
  border-block-start:1px solid #c7cad8;
}
.proof-dimension-x:before,
.proof-dimension-x:after{
  content:"";
  position:absolute;
  top:-5px;
  width:1px;
  height:10px;
  background:#c7cad8;
}
.proof-dimension-x:before{inset-inline-start:0}
.proof-dimension-x:after{inset-inline-end:0}
.proof-dimension-x .proof-dimension-label{
  inset-inline-start:50%;
  top:-10px;
  transform:translateX(-50%);
}
.proof-dimension-y{
  inset-block:0;
  inset-inline-start:-17px;
  width:1px;
  border-inline-start:1px solid #c7cad8;
}
.proof-dimension-y:before,
.proof-dimension-y:after{
  content:"";
  position:absolute;
  inset-inline-start:-5px;
  width:10px;
  height:1px;
  background:#c7cad8;
}
.proof-dimension-y:before{top:0}
.proof-dimension-y:after{bottom:0}
.proof-dimension-y .proof-dimension-label{
  top:50%;
  inset-inline-start:-10px;
  transform:translate(-50%,-50%) rotate(-90deg);
  transform-origin:center;
}
.locked-status-panel{
  display:flex;
  align-items:center;
  gap:12px;
  max-width:430px;
  padding:12px 14px;
  border-color:#d7dcfb;
  background:linear-gradient(135deg,#fff,#f5f7ff);
}
.locked-status-panel p{
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}
@media(max-width:720px){
  .proof-page .art.has-dimensions{
    margin-block-start:24px;
    margin-inline-start:20px;
  }
  .proof-page .art.has-dimensions.dimensions-hidden{
    margin-block-start:0;
    margin-inline-start:0;
  }
  .proof-dimension{
    font-size:10px;
  }
  .proof-dimension-y{
    inset-inline-start:-13px;
  }
  .proof-dimension-x{
    top:-15px;
  }
  .proof-dimension-y .proof-dimension-label{
    inset-inline-start:-8px;
  }
  .locked-status-panel{
    width:100%;
    max-width:none;
  }
}

/* Reliable modal typing + mobile sign-out hit areas */
.modal-backdrop{
  position:fixed;
  inset:0;
  display:flex!important;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:1000;
  overscroll-behavior:contain;
  touch-action:auto;
}
.modal{
  position:relative;
  isolation:isolate;
  z-index:1001;
  pointer-events:auto;
}
.modal .field,
.modal .auth-form,
.modal .auth-result,
.modal .auth-register-choices{
  position:relative;
  z-index:2;
}
.modal input,
.modal textarea,
.modal select{
  min-height:44px;
  line-height:1.3;
  position:relative;
  z-index:3;
  pointer-events:auto;
  cursor:text;
  caret-color:#4f3fc6;
  -webkit-user-select:text;
  user-select:text;
  -webkit-appearance:none;
  appearance:none;
  touch-action:manipulation;
}
.modal label.field{
  cursor:text;
}
.modal button{
  position:relative;
  z-index:3;
}
.profile-actions{
  display:flex;
  align-items:center;
  gap:8px;
  position:relative;
  z-index:2;
}
.profile-actions .profile{
  flex:1;
  min-width:0;
}
.profile-logout,
#settings-signout,
#client-signout,
#sign-out,
[data-confirm-signout]{
  min-width:44px;
  min-height:44px;
  touch-action:manipulation;
  pointer-events:auto;
}
.profile-logout{
  display:grid;
  place-items:center;
  border:0;
  border-radius:12px;
  background:#fff0f4;
  color:#b6436a;
  cursor:pointer;
}
.profile-logout .mi,
.profile-logout svg{
  width:22px;
  height:22px;
  font-size:22px;
  line-height:1;
}
.comment-count-badge{
  display:inline-flex;
  width:max-content;
  align-items:center;
  gap:4px;
  margin:5px 0 0;
  padding:4px 8px;
  border-radius:999px;
  background:#fff3e6;
  color:#a56217;
  font-size:10px;
  font-weight:800;
  line-height:1;
  letter-spacing:.01em;
  white-space:normal;
  max-width:100%;
}
.comment-count-badge:before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:currentColor;
  opacity:.75;
}
.attention-row .comment-count-badge{
  margin-top:6px;
}
.attention-comment-row{
  align-items:flex-start;
}
.attention-copy{
  min-width:0;
  flex:1;
}
.attention-copy strong,
.attention-copy small{
  display:block;
}
.attention-copy p{
  margin:6px 0 0;
  color:#4f5367;
  font-size:12px;
  line-height:1.45;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.attention-comment-row .proof-thumb{
  margin-top:2px;
}
.attention-comment-row small{
  margin-top:3px;
}
.stats .stat{
  min-width:0;
}
.stats .stat>div{
  min-width:0;
}
.stats .stat span:not(.stat-icon){
  display:block;
  line-height:1.25;
  overflow-wrap:anywhere;
}
.comments-inbox-panel{
  padding-bottom:14px;
}
.comment-inbox-list{
  display:grid;
  gap:8px;
}
.comment-inbox-row{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 22px;
  gap:12px;
  align-items:center;
  padding:13px 10px;
  border-radius:14px;
  color:inherit;
  text-decoration:none;
  transition:background-color .14s ease-out, transform .14s ease-out;
}
.comment-inbox-row:hover,
.comment-inbox-row:focus-visible{
  background:#faf9ff;
}
.comment-inbox-row:active{
  transform:scale(.96);
}
.comment-inbox-main{
  min-width:0;
  display:grid;
  gap:5px;
}
.comment-inbox-top{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.comment-inbox-top strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
}
.comment-inbox-top .status-icon-pill{
  flex:0 0 auto;
}
.comment-inbox-main small{
  color:var(--muted);
  font-size:11px;
}
.comment-inbox-main em{
  color:#4f5367;
  font-size:13px;
  font-style:normal;
  line-height:1.45;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.project-name>span:last-child{
  min-width:0;
}
.project-name .comment-count-badge+small{
  margin-top:4px;
}
.guest-brand[role="link"],
.sidebar .brand[role="button"],
.mobile-nav-head .brand[role="button"]{
  cursor:pointer;
}
.guest-brand[role="link"]:focus-visible,
.sidebar .brand[role="button"]:focus-visible,
.mobile-nav-head .brand[role="button"]:focus-visible{
  outline:2px solid #6756d9;
  outline-offset:4px;
  border-radius:12px;
}
.clickable-stat{
  cursor:pointer;
  position:relative;
  transition:transform .14s ease-out, box-shadow .14s ease-out, border-color .14s ease-out;
}
.clickable-stat:hover{
  transform:translateY(-1px);
  border-color:#d8d4f4;
  box-shadow:0 10px 26px rgba(30,32,48,.07);
}
.clickable-stat:active{
  transform:scale(.96);
}
.clickable-stat:focus-visible{
  outline:2px solid #6756d9;
  outline-offset:3px;
}
.notification-bell{
  position:relative;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border:1px solid #dfddf2;
  border-radius:12px;
  background:#fff;
  color:#6756d9;
  box-shadow:0 8px 18px rgba(103,86,217,.08);
}
.notification-bell .mi{
  font-size:21px;
  line-height:1;
}
.notification-badge{
  position:absolute;
  top:-7px;
  right:-7px;
  min-width:19px;
  height:19px;
  padding:0 5px;
  display:grid;
  place-items:center;
  border:2px solid #fff;
  border-radius:999px;
  background:#e24b55;
  color:#fff;
  font-size:10px;
  font-weight:800;
  line-height:1;
}
.notification-list{
  display:grid;
  gap:8px;
  margin-top:16px;
}
.notification-item{
  display:grid;
  grid-template-columns:12px minmax(0,1fr);
  gap:11px;
  width:100%;
  padding:13px;
  border:1px solid #ececf4;
  border-radius:13px;
  background:#fff;
  color:#1d2030;
  text-align:left;
}
.notification-item:hover{
  background:#faf9ff;
  border-color:#dcd8f4;
}
.notification-item:focus-visible{
  outline:2px solid #6756d9;
  outline-offset:2px;
}
.notification-dot{
  width:10px;
  height:10px;
  margin-top:4px;
  border-radius:50%;
  background:#6756d9;
  box-shadow:0 0 0 4px #efedfc;
}
.notification-dot.comment{
  background:#cf8a36;
  box-shadow:0 0 0 4px #fff0e3;
}
.notification-dot.status{
  background:#24876b;
  box-shadow:0 0 0 4px #e5f4ed;
}
.notification-dot.annotation{
  width:20px;
  height:20px;
  margin-top:0;
  display:grid;
  place-items:center;
  background:#fff0f6;
  color:#b84478;
  box-shadow:0 0 0 1px #f3bdd5,0 0 0 5px #fff7fb;
}
.notification-dot.annotation .mi{
  font-size:14px!important;
  line-height:1!important;
}
.notification-item strong,
.notification-item small,
.notification-item em{
  display:block;
}
.notification-item strong{
  font-size:13px;
}
.notification-item small{
  margin-top:3px;
  color:#81869a;
  font-size:11px;
}
.notification-item em{
  margin-top:7px;
  color:#5f6476;
  font-size:12px;
  font-style:normal;
  line-height:1.45;
}
.notification-item .notification-time{
  grid-column:2;
  margin-top:2px;
  color:#9aa0b4;
  font-size:11px;
  font-weight:700;
  letter-spacing:.01em;
}
.notification-bell.compact{
  width:100%;
  min-height:42px;
  display:flex;
  justify-content:flex-start;
  gap:10px;
  margin:0 0 8px;
  padding:9px 12px;
  border-color:transparent;
  border-radius:12px;
  box-shadow:none;
  background:#fff;
  color:#6f7488;
  font-weight:700;
}
.notification-bell.compact:hover,
.notification-bell.compact.has-notifications{
  background:#f4f1ff;
  color:#6756d9;
}
.notification-bell.compact .notification-badge{
  position:static;
  margin-left:auto;
  min-width:21px;
  height:21px;
  border:0;
  background:#e24b55;
}
.notification-read-all{
  width:100%;
  margin-top:12px;
}
.mobile-topbar-brand{
  display:none;
  align-items:center;
  gap:9px;
  color:var(--ink);
  text-decoration:none;
  font-weight:800;
  letter-spacing:-.03em;
}
.mobile-topbar-brand svg,
.mobile-topbar-brand .brand-mark{
  width:30px;
  height:30px;
  flex:0 0 30px;
  border-radius:9px;
  box-shadow:0 8px 18px rgba(103,86,217,.18);
}
.mobile-topbar-bell{
  display:none;
}
.stats .stat strong{
  white-space:nowrap;
}
.stats .stat span:not(.stat-icon){
  max-width:100%;
}

@media(max-width:720px){
  .app-topbar,
  .topbar.compact-topbar{
    display:flex;
    justify-content:flex-start;
    gap:10px;
  }
  .app-topbar .crumb,
  .topbar.compact-topbar .crumb{
    display:none!important;
  }
  .mobile-topbar-brand{
    display:inline-flex;
    min-width:0;
  }
  .mobile-topbar-brand span:last-child{
    font-size:15px;
    line-height:1;
    white-space:nowrap;
  }
  .mobile-topbar-bell{
    display:grid;
    margin-inline-start:auto;
    width:40px;
    height:40px;
    flex:0 0 40px;
  }
  .app-topbar .topbar-right,
  .topbar.compact-topbar .topbar-right{
    display:none!important;
  }
}
.improved-page-nav{
  display:grid;
  grid-template-columns:auto auto minmax(180px,1fr) auto auto;
  align-items:center;
  gap:8px;
}
.improved-page-nav .button{
  min-height:40px;
  white-space:nowrap;
}
.page-jump{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:0;
  color:#73778a;
  font-size:12px;
  font-weight:700;
}
.page-jump label{
  display:flex;
  align-items:center;
  gap:7px;
}
.page-jump input{
  width:66px;
  min-height:38px;
  border:1px solid #dfddf2;
  border-radius:9px;
  padding:6px 8px;
  text-align:center;
  color:#1d2030;
  background:#fff;
}
.segmented-draw-toolbar{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  align-items:stretch;
  min-width:210px;
}
.segmented-draw-toolbar .draw-row{
  display:flex;
  align-items:center;
  gap:7px;
}
.segmented-draw-toolbar .draw-row-main{
  justify-content:space-between;
}
.segmented-draw-toolbar .draw-options{
  flex-wrap:wrap;
}
.segmented-draw-toolbar .autosave-status{
  margin-inline-start:auto;
}
.proof-dimension-toggle{
  position:static;
  z-index:3;
  width:38px;
  height:38px;
  display:none;
  place-items:center;
  border:1px solid #dfddf2;
  border-radius:12px;
  background:#fff;
  color:#6756d9;
  box-shadow:0 8px 20px rgba(30,32,48,.12);
}
.proof-dimension-toggle .mi{
  font-size:21px;
}
.art.has-dimensions.dimensions-hidden .proof-dimension{
  opacity:0;
  visibility:hidden;
}
.page-correction-card{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:10px;
  margin:14px 0;
  padding:12px;
  border:1px solid #ece9fb;
  border-radius:14px;
  background:#faf9ff;
}
.page-correction-card strong,
.page-correction-card small{
  display:block;
}
.page-correction-card strong{
  font-size:12px;
}
.page-correction-card small{
  margin-top:4px;
  color:var(--muted);
  font-size:11px;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.page-correction-button{
  justify-self:start;
}

/* Mobile proofing: scroll first, draw only after an explicit toggle. */
.mobile-draw-toggle{
  display:none;
}
.proof-page.mobile-draw-locked .annotation-canvas.drawing-enabled{
  pointer-events:none!important;
  touch-action:auto!important;
  cursor:default;
}
.proof-page.mobile-draw-active .annotation-canvas.drawing-enabled{
  pointer-events:auto!important;
  touch-action:none!important;
  cursor:crosshair;
}
@media(max-width:720px), (pointer:coarse){
  .stats{
    gap:10px;
  }
  .stat{
    min-width:0;
    align-items:flex-start;
  }
  .stat span:not(.stat-icon){
    display:block;
    line-height:1.25;
    overflow-wrap:anywhere;
  }
  .stat strong{
    line-height:1;
  }
  .project-row{
    overflow:hidden;
  }
  .project-name{
    min-width:0;
  }
  .project-name>span:last-child{
    display:grid;
    gap:3px;
    min-width:0;
  }
  .comment-count-badge{
    font-size:9px;
    padding:4px 7px;
    line-height:1.15;
  }
  .topbar-right{
    gap:8px;
    min-width:0;
  }
  .notification-bell{
    width:38px;
    height:38px;
    flex:0 0 auto;
  }
  .improved-page-nav{
    grid-template-columns:44px 44px minmax(0,1fr) 44px 44px;
    gap:6px;
  }
  .improved-page-nav .button{
    min-width:44px;
    padding:9px;
  }
  .improved-page-nav .button span:not(.mi),
  .improved-page-nav .page-edge span:not(.mi){
    display:none;
  }
  .page-jump{
    gap:6px;
    font-size:11px;
  }
  .page-jump label>span{
    display:none;
  }
  .page-jump input{
    width:52px;
    min-height:40px;
    font-size:16px;
  }
  .page-jump .button{
    min-width:auto;
    padding-inline:10px;
  }
  .proof-dimension-toggle{
    display:grid;
  }
  .proof-page-tools{
    gap:8px;
    margin-block-end:8px;
  }
  .art.has-dimensions .proof-dimension{
    transition:opacity .2s ease, visibility .2s ease;
  }
  .segmented-draw-toolbar{
    width:min(100%,360px);
    min-width:0;
  }
  .segmented-draw-toolbar .draw-options{
    display:flex;
  }
  .proof-page.mobile-draw-locked .draw-options{
    display:none;
  }
  .proof-page.mobile-draw-locked .segmented-draw-toolbar{
    width:auto;
  }
  .segmented-draw-toolbar .autosave-status{
    display:none;
  }
  .segmented-draw-toolbar .draw-row-main{
    justify-content:flex-start;
  }
  .proof-page.mobile-draw-capable .mobile-draw-toggle{
    display:inline-flex;
  }
  .proof-page.mobile-draw-locked .art,
  .proof-page.mobile-draw-locked .annotation-canvas.drawing-enabled{
    touch-action:pan-y pinch-zoom!important;
  }
  .proof-page.mobile-draw-active .art,
  .proof-page.mobile-draw-active .annotation-canvas.drawing-enabled{
    touch-action:none!important;
  }
  .proof-page.mobile-draw-locked .draw-toolbar{
    box-shadow:0 4px 14px #1d20301f;
  }
  .proof-page.mobile-draw-active .mobile-draw-toggle{
    background:#6756d9;
    color:#fff;
    border-color:#6756d9;
  }
}

/* Public review should not expose internal workspace navigation or designer identity. */
.public-review-top{
  justify-content:flex-end!important;
}
.public-review-top .actions{
  margin-inline-start:auto;
}
@media(max-width:720px){
  .public-review-top{
    min-height:54px;
    padding-block:8px;
  }
  .public-review-top .actions{
    width:100%;
    justify-content:flex-end!important;
  }
}

/* Share dialog cleanup: close button alignment and real checkbox access toggle. */
.modal-close{
  position:absolute!important;
  inset-block-start:14px!important;
  inset-inline-end:14px!important;
  inset-inline-start:auto!important;
  width:34px!important;
  height:34px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  color:#8d93a6!important;
  line-height:1!important;
}
.modal-close:hover{
  background:#f5f4fb!important;
  color:#5e6375!important;
}
.modal-close .mi{
  font-size:20px!important;
  line-height:1!important;
}
.share-modal{
  display:grid;
  gap:12px;
}
.share-modal .modal-icon,
.share-modal h2,
.share-modal p{
  margin-block-end:0;
}
.share-url-input{
  font-weight:700;
  color:#1d2030;
  background:#fbfbff!important;
}
.share-toggle{
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  gap:11px;
  align-items:flex-start;
  margin:2px 0 4px;
  padding:12px;
  border:1px solid #e6e3f7;
  border-radius:14px;
  background:#fbfaff;
  cursor:pointer;
}
.share-toggle input[type="checkbox"]{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.share-toggle-box{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border:1px solid #cbc6f3;
  border-radius:7px;
  background:#fff;
  color:transparent;
  transition:background-color .14s ease-out, border-color .14s ease-out, color .14s ease-out;
}
.share-toggle input[type="checkbox"]:checked+.share-toggle-box{
  background:#6756d9;
  border-color:#6756d9;
  color:#fff;
}
.share-toggle input[type="checkbox"]:focus-visible+.share-toggle-box{
  outline:2px solid #4f3fc6;
  outline-offset:2px;
}
.share-toggle strong,
.share-toggle small{
  display:block;
}
.share-toggle strong{
  font-size:13px;
}
.share-toggle small{
  margin-top:3px;
  color:var(--muted);
  font-size:11px;
  line-height:1.35;
}
@media(max-width:720px){
  .size-form-grid{
    grid-template-columns:1fr;
  }
  .proof-size-missing,
  .proof-size-pill{
    min-height:34px;
    white-space:normal;
    line-height:1.25;
  }
}
/* Final auth verification fallback */
.verify-error-card{max-width:420px;margin:0 auto;text-align:center}
.auth-error-actions{display:flex;gap:12px;justify-content:center;margin:20px 0 12px;flex-wrap:wrap}
.auth-error-actions .button{min-width:138px}

/* Designer sidebar: collapsible, with New project as a primary navigation action. */
.sidebar{
  transition:flex-basis .18s ease,width .18s ease,padding-inline .18s ease;
}
.sidebar-collapse-toggle{
  position:absolute;
  inset-block-start:22px;
  inset-inline-end:10px;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid #e4e1f5;
  border-radius:10px;
  background:#fff;
  color:#767c90;
  box-shadow:0 8px 18px #1d20300d;
}
.sidebar-collapse-toggle:hover{
  color:#6756d9;
  border-color:#cec8f2;
  background:#fbfaff;
}
.sidebar-collapse-toggle .mi{
  font-size:20px;
  transition:transform .18s ease;
}
.nav-new-project{
  margin:0 0 8px;
  background:#6756d9!important;
  color:#fff!important;
  box-shadow:0 8px 18px #6756d930;
}
.nav-new-project:hover{
  background:#5c4bd0!important;
}
.nav-new-project .mi{
  color:inherit;
}
body.sidebar-collapsed .sidebar{
  width:76px;
  flex-basis:76px;
  padding-inline:10px;
}
body.sidebar-collapsed .sidebar-collapse-toggle{
  inset-inline-end:8px;
}
body.sidebar-collapsed .sidebar-collapse-toggle .mi{
  transform:rotate(180deg);
}
body.sidebar-collapsed .sidebar .brand{
  justify-content:center;
  padding-inline:0;
  margin-inline:0;
  margin-block-end:22px;
}
body.sidebar-collapsed .sidebar .brand .pixelapprove-wordmark,
body.sidebar-collapsed .sidebar .workspace-label,
body.sidebar-collapsed .sidebar .workspace-card>span:not(.workspace-logo),
body.sidebar-collapsed .sidebar .workspace-card>.mi,
body.sidebar-collapsed .sidebar .workspace-card>b,
body.sidebar-collapsed .sidebar .nav button>span:not(.mi):not(.count),
body.sidebar-collapsed .sidebar .side-action>span:not(.mi),
body.sidebar-collapsed .sidebar .notification-bell.compact>span,
body.sidebar-collapsed .sidebar .profile>span:not(.avatar),
body.sidebar-collapsed .sidebar .language-toggle,
body.sidebar-collapsed .sidebar .language-picker span{
  display:none!important;
}
body.sidebar-collapsed .workspace{
  padding-inline:0;
}
body.sidebar-collapsed .workspace-card{
  justify-content:center;
  padding:9px;
}
body.sidebar-collapsed .workspace-logo{
  width:34px;
  height:34px;
  flex:0 0 34px;
}
body.sidebar-collapsed .sidebar .nav button,
body.sidebar-collapsed .sidebar .side-action,
body.sidebar-collapsed .sidebar .notification-bell.compact{
  position:relative;
  justify-content:center;
  width:100%;
  min-height:44px;
  padding:10px;
}
body.sidebar-collapsed .sidebar .nav .count,
body.sidebar-collapsed .sidebar .notification-badge{
  position:absolute;
  inset-block-start:4px;
  inset-inline-end:4px;
  margin:0;
  min-width:16px;
  height:16px;
  display:grid;
  place-items:center;
  padding:0 4px;
  font-size:9px;
}
body.sidebar-collapsed .sidebar .sidebar-bottom{
  display:grid;
  gap:4px;
}
body.sidebar-collapsed .sidebar .profile{
  justify-content:center;
  width:100%;
  margin-inline:0;
  padding:10px 0 0;
}
body.sidebar-collapsed .sidebar .profile .avatar{
  width:38px;
  height:38px;
}
@media(max-width:720px){
  .sidebar-collapse-toggle,
  .nav-new-project{
    display:none!important;
  }
  body.sidebar-collapsed .sidebar{
    width:auto;
    flex-basis:auto;
  }
}

.profile-language-setting{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:12px 0;
  padding:12px;
  border:1px solid #e7e4f5;
  border-radius:14px;
  background:#fbfaff;
}
.profile-language-setting strong,
.profile-language-setting small{
  display:block;
}
.profile-language-setting strong{
  font-size:13px;
}
.profile-language-setting small{
  margin-top:3px;
  color:var(--muted);
  font-size:11px;
  line-height:1.35;
}
.profile-language-setting .language-picker{
  flex:0 0 auto;
  margin:0;
}
@media(max-width:520px){
  .profile-language-setting{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* Collapsed sidebar final pass: stable icon rail, clean labels, no overflow. */
.layout{
  overflow-x:clip;
}
.sidebar{
  overflow-x:hidden;
}
.sidebar-collapse-toggle{
  z-index:6;
}
body.sidebar-collapsed .sidebar{
  width:78px;
  flex-basis:78px;
  padding-inline:12px;
  overflow-x:hidden;
}
body.sidebar-collapsed .sidebar-collapse-toggle{
  inset-block-start:68px;
  inset-inline-start:50%;
  inset-inline-end:auto;
  transform:translateX(-50%);
}
body.sidebar-collapsed .sidebar-collapse-toggle .mi{
  transform:rotate(180deg);
}
body.sidebar-collapsed .sidebar .brand{
  min-height:42px;
  padding:0;
  margin:0 0 48px;
  justify-content:center;
}
body.sidebar-collapsed .sidebar .brand .brand-mark{
  width:38px;
  height:38px;
  flex-basis:38px;
}
body.sidebar-collapsed .workspace{
  padding:0 0 22px;
}
body.sidebar-collapsed .workspace-card{
  width:52px;
  min-height:52px;
  margin-inline:auto;
  padding:8px;
  justify-content:center;
}
body.sidebar-collapsed .workspace-logo{
  width:36px;
  height:36px;
  flex:0 0 36px;
}
body.sidebar-collapsed .sidebar .nav{
  gap:8px;
}
body.sidebar-collapsed .sidebar .nav button,
body.sidebar-collapsed .sidebar .side-action,
body.sidebar-collapsed .sidebar .notification-bell.compact,
body.sidebar-collapsed .sidebar .nav-new-project{
  width:52px;
  min-width:52px;
  min-height:52px;
  margin-inline:auto;
  padding:0;
  justify-content:center;
  align-items:center;
  border-radius:13px;
  overflow:visible;
}
body.sidebar-collapsed .sidebar .nav button .mi,
body.sidebar-collapsed .sidebar .side-action .mi,
body.sidebar-collapsed .sidebar .nav-new-project .mi{
  font-size:23px!important;
}
body.sidebar-collapsed .sidebar .nav button>span:not(.mi):not(.count),
body.sidebar-collapsed .sidebar .side-action>span:not(.mi),
body.sidebar-collapsed .sidebar .notification-bell.compact>span:not(.mi){
  display:none!important;
}
body.sidebar-collapsed .sidebar .notification-bell.compact>.mi{
  display:inline-grid!important;
  font-size:23px!important;
}
body.sidebar-collapsed .sidebar .nav .count,
body.sidebar-collapsed .sidebar .notification-badge{
  inset-block-start:-3px;
  inset-inline-end:-3px;
  min-width:18px;
  height:18px;
  border:2px solid #fff;
  font-size:9px;
}
body.sidebar-collapsed .sidebar-bottom{
  gap:8px;
  align-items:center;
}
body.sidebar-collapsed .profile-actions{
  display:grid;
  grid-template-columns:1fr;
  justify-items:center;
  gap:8px;
  width:100%;
}
body.sidebar-collapsed .sidebar .profile{
  width:52px;
  min-width:52px;
  min-height:52px;
  margin:0;
  padding:0;
  justify-content:center;
  border:0;
  border-radius:13px;
  background:#f4f1ff;
}
body.sidebar-collapsed .sidebar .profile .avatar{
  width:38px;
  height:38px;
}
body.sidebar-collapsed .sidebar .profile-logout{
  width:52px;
  min-width:52px;
  height:52px;
  min-height:52px;
  border-radius:13px;
}