/* Reina House Studio: client project space. Brand: white / black / red, Bodoni Moda + Jost, sharp 2px corners. */
.studio main{background:#fff}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border:1px solid #000;border-radius:999px;font-size:.66rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.pill.is-setup{background:#000;color:#fff}
.pill.is-done{border-color:#000;opacity:.6}
.pill.is-waiting{background:var(--accent);border-color:var(--accent);color:#fff}
.avatar{display:inline-grid;place-items:center;flex:0 0 auto;width:36px;height:36px;border-radius:50%;background:#000;color:#fff;font-size:.72rem;font-weight:600;letter-spacing:.06em}
.avatar.is-team{background:var(--accent)}
.dot{width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.studio-flash{margin:0 0 20px;padding:12px 16px;border:1px solid #000;border-left:4px solid #000;border-radius:2px;font-size:.92rem}
.studio-flash.is-ok{border-left-color:#1f7a4d}
.studio-flash.is-error{border-color:var(--accent);border-left-color:var(--accent)}
.studio .eyebrow{padding:0;background:none;margin-bottom:8px;letter-spacing:.22em}
.studio .eyebrow a{color:inherit}
time[data-local]{white-space:nowrap}

/* ---------- forms ---------- */
.studio-form{display:flex;flex-direction:column;gap:14px}
.studio-form label{display:flex;flex-direction:column;gap:6px;font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.studio-form input,.studio-form select,.studio-form textarea{font:inherit;font-size:1rem;letter-spacing:0;text-transform:none;font-weight:400;padding:12px 14px;border:1px solid #000;border-radius:2px;background:#fff;color:#000;width:100%}
.studio-form input[readonly]{background:#f6f6f6}
.studio-form input:focus,.studio-form select:focus,.studio-form textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.studio-form small{font-size:.8rem;font-weight:400;letter-spacing:0;text-transform:none}
.studio-form h3{margin:0;font-size:1.35rem}

/* ---------- sign-in ---------- */
.auth{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - 78px)}
.auth-pitch{display:flex;flex-direction:column;justify-content:center;gap:18px;padding:64px clamp(28px,6vw,90px);background:#000;color:#fff}
.auth-pitch img{width:170px;height:auto}
.auth-pitch h2{margin:10px 0 0;color:#fff;font-size:clamp(2rem,3.4vw,3rem)}
.auth-pitch p{margin:0;color:#fff;line-height:1.6;max-width:44ch}
.auth-pitch ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:14px}
.auth-pitch li{display:flex;gap:12px;align-items:center;font-size:.95rem}
.auth-pitch li svg{flex:0 0 auto;width:38px;height:38px;padding:9px;border-radius:50%;background:var(--accent);color:#fff}
.auth-panel{display:flex;flex-direction:column;justify-content:center;width:100%;max-width:520px;margin:0 auto;padding:56px clamp(24px,5vw,56px)}
.auth-panel h1{margin:0 0 6px}
.auth-sub{margin:0 0 24px;line-height:1.55}
.auth-links{margin:16px 0 0;font-size:.92rem}
.auth-links a,.auth-alt a{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}
.auth-alt{margin-top:28px;padding-top:20px;border-top:1px solid #000;font-size:.92rem}
.auth-alt p{margin:0}
@media (max-width:860px){.auth{grid-template-columns:1fr}.auth-pitch{order:2;padding:40px 24px}.auth-panel{padding:40px 20px}}

/* ---------- studio bar ---------- */
.studio-bar{border-bottom:1px solid #000;background:#fff}
.studio-bar-row{display:flex;align-items:center;gap:24px;min-height:58px}
.studio-brand{display:flex;align-items:center;gap:8px;margin:0;font-family:var(--serif);font-size:1.3rem;font-weight:600}
.studio-brand svg{color:var(--accent)}
.studio-brand em{font-style:normal;font-family:var(--font);font-size:.62rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;padding:2px 8px;background:var(--accent);color:#fff;border-radius:999px}
.studio-bar nav{display:flex;gap:4px;flex:1}
.studio-bar nav a{padding:18px 12px;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;border-bottom:2px solid transparent;margin-bottom:-1px}
.studio-bar nav a[aria-current]{border-color:var(--accent);color:var(--accent)}
.studio-logout{display:flex;align-items:center;gap:6px;margin:0}
.studio-logout .avatar{width:32px;height:32px}
@media (max-width:640px){.studio-bar-row{gap:8px;flex-wrap:wrap}.studio-brand{font-size:1.1rem}.studio-bar nav{order:3;flex-basis:100%;overflow-x:auto}.studio-bar nav a{padding:10px 10px 12px}.studio-logout{margin-left:auto}}

/* ---------- pages ---------- */
.studio-page{padding:36px 0 72px}
.studio-page.narrow{max-width:860px}
.studio-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:28px;flex-wrap:wrap}
.studio-head h1{margin:0}
.studio-head .lead{margin:8px 0 0;font-size:1rem}
.studio-head .lead a{text-decoration:underline;text-decoration-color:var(--accent)}
.studio-h2{margin:0 0 16px;font-size:1.5rem}
.studio-h2:not(:first-child){margin-top:36px}
.studio-dash{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start}
.studio-side{display:flex;flex-direction:column;gap:18px}
.side-card{padding:22px;border:1px solid #000;border-radius:2px;background:#fff}
.side-card h3{margin:0 0 12px;font-size:1.3rem}
.side-card p{margin:0 0 14px;line-height:1.55;font-size:.92rem}
.side-card.is-dark{background:#000;color:#fff}.side-card.is-dark h3,.side-card.is-dark p{color:#fff}
.side-card.is-dark .setup-offer-kicker{color:#ff8fa3;margin-bottom:6px}
@media (max-width:980px){.studio-dash{grid-template-columns:1fr}}

.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.project-card{display:flex;flex-direction:column;border:1px solid #000;border-radius:2px;background:#fff;overflow:hidden;transition:transform .2s var(--ease),box-shadow .2s}
.project-card:hover{transform:translateY(-2px);box-shadow:6px 6px 0 #000;color:inherit}
.project-card.is-unread{border-color:var(--accent);box-shadow:inset 0 3px 0 var(--accent)}
.project-card-media{height:120px;background:#f4f4f4;border-bottom:1px solid #000;display:grid;place-items:center;overflow:hidden}
.project-card-media img{width:100%;height:100%;object-fit:cover;object-position:top}
.project-card-media span{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#000;color:#fff}
.project-card-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px}
.project-card h3{margin:6px 0 0;font-size:1.25rem;line-height:1.2}
.project-client{margin:0;font-size:.82rem;font-weight:600}
.project-last{margin:0;font-size:.9rem;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.project-meta{margin:4px 0 0;font-size:.76rem;letter-spacing:.04em}
.purchase-list{list-style:none;margin:0;padding:0}
.purchase-list li{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #e5e5e5;font-size:.92rem}
.purchase-list li a{font-weight:600;text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}
.purchase-list li span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.purchase-list.wide{max-width:760px}
.tip-list{list-style:none;margin:0;padding:0;display:grid;gap:12px;font-size:.88rem;line-height:1.5}
.tip-list li{display:flex;gap:10px}.tip-list svg{flex:0 0 auto;color:var(--accent);width:18px}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media (max-width:700px){.settings-grid{grid-template-columns:1fr}}

.studio-dialog{max-width:520px;width:calc(100% - 32px);padding:30px;border:1px solid #000;border-radius:2px}
.studio-dialog::backdrop{background:rgba(0,0,0,.5)}
.studio-dialog h2{margin:0 0 6px}
.dialog-actions{display:flex;justify-content:flex-end;gap:10px}

/* ---------- thread ---------- */
.studio-thread .site-footer{display:none}
.thread-shell{display:flex;flex-direction:column;height:calc(100dvh - 78px - 59px);min-height:520px}
.thread-head{display:flex;align-items:center;gap:16px;padding:14px clamp(16px,3vw,32px);border-bottom:1px solid #000}
.thread-back{display:grid;place-items:center;width:40px;height:40px;border:1px solid #000;border-radius:2px;font-size:1.2rem}
.thread-back:hover{background:#000;color:#fff}
.thread-title{flex:1;min-width:0}
.thread-title h1{margin:0;font-size:clamp(1.3rem,2.4vw,1.9rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thread-title p{margin:4px 0 0;font-size:.86rem;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.thread-title p a{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}
.thread-tools{display:flex;gap:8px;align-items:center}
.thread-tools form{margin:0}
.files-toggle span{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;background:#000;color:#fff;border-radius:999px;font-size:.7rem;letter-spacing:0}
.thread-body{flex:1;display:grid;grid-template-columns:minmax(0,1fr) 330px;min-height:0}
.thread-main{position:relative;display:flex;flex-direction:column;min-height:0}
.thread-messages{flex:1;overflow-y:auto;padding:24px clamp(16px,3vw,40px);scroll-behavior:smooth}
.thread-messages>.empty{margin-top:12vh}
.day-sep{display:flex;align-items:center;gap:14px;margin:18px 0;font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.day-sep::before,.day-sep::after{content:"";flex:1;height:1px;background:#e5e5e5}
.msg{display:flex;gap:12px;margin:0 0 16px;max-width:760px}
.msg.is-mine{flex-direction:row-reverse;margin-left:auto}
.msg-main{display:flex;flex-direction:column;gap:6px;min-width:0;max-width:min(560px,100%)}
.msg.is-mine .msg-main{align-items:flex-end}
.msg-meta{margin:0;display:flex;gap:10px;align-items:baseline;font-size:.76rem}
.msg-meta strong{font-size:.8rem}
.msg.is-team .msg-meta strong{color:var(--accent)}
.msg-bubble{padding:12px 16px;border:1px solid #000;border-radius:2px;background:#fff;line-height:1.55;font-size:.97rem;overflow-wrap:anywhere}
.msg.is-mine .msg-bubble{background:#000;color:#fff}
.msg-bubble a{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}
.msg.is-mine .msg-bubble a{color:#fff}
.msg-images{display:grid;gap:6px;width:min(420px,100%)}
.msg-images.n2,.msg-images.n4{grid-template-columns:1fr 1fr}.msg-images.n3{grid-template-columns:1fr 1fr 1fr}
.msg-images a{display:block;border:1px solid #000;border-radius:2px;overflow:hidden;background:#f4f4f4}
.msg-images img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .3s}
.msg-images.n1 img{aspect-ratio:auto;max-height:340px;object-fit:contain}
.msg-images a:hover img{transform:scale(1.04)}
.msg-files{display:flex;flex-direction:column;gap:6px;width:min(420px,100%)}
.msg.is-system{justify-content:center;max-width:none}
.msg-system{display:flex;gap:12px;max-width:640px;padding:16px 18px;border:1px dashed #000;border-radius:2px;background:#fafafa;font-size:.92rem;line-height:1.6}
.msg-system svg{flex:0 0 auto;color:var(--accent);margin-top:2px}
.msg.is-new{animation:msgIn .35s var(--ease)}
@keyframes msgIn{from{opacity:0;transform:translateY(8px)}}

.file-chip{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid #000;border-radius:2px;background:#fff;font-size:.86rem}
.file-chip:hover{background:#000;color:#fff}
.file-ext{display:grid;place-items:center;min-width:44px;height:30px;padding:0 6px;background:#000;color:#fff;font-size:.62rem;font-weight:700;letter-spacing:.08em;border-radius:2px}
.file-chip.kind-doc .file-ext{background:var(--accent)}
.file-chip:hover .file-ext{background:#fff;color:#000}
.file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.file-size{font-size:.74rem;white-space:nowrap}

.composer{border-top:1px solid #000;padding:12px clamp(12px,3vw,32px) 10px;background:#fff}
.composer-row{display:flex;gap:10px;align-items:flex-end}
.composer textarea{flex:1;min-height:48px;max-height:220px;resize:none;padding:12px 14px;border:1px solid #000;border-radius:2px;font:inherit;font-size:1rem;line-height:1.45}
.composer textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.composer-attach{display:grid;place-items:center;width:48px;height:48px;border:1px solid #000;border-radius:2px;cursor:pointer;flex:0 0 auto}
.composer-attach:hover{background:#000;color:#fff}
.composer-attach input{position:absolute;opacity:0;width:1px;height:1px}
.composer-send{height:48px;padding:0 20px}
.composer-hint{margin:6px 0 0;font-size:.74rem}
.composer-hint kbd{font-size:.68rem}
.composer-files{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.pending{position:relative;display:flex;align-items:center;gap:8px;max-width:240px;padding:6px 30px 6px 6px;border:1px solid #000;border-radius:2px;font-size:.8rem;background:#fff}
.pending img,.pending .file-ext{width:40px;height:40px;object-fit:cover;border-radius:2px;flex:0 0 auto}
.pending span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pending button{position:absolute;top:50%;right:4px;transform:translateY(-50%);width:22px;height:22px;border:0;background:none;cursor:pointer;font-size:1rem;line-height:1}
.pending.is-bad{border-color:var(--accent);color:var(--accent)}
.composer-progress{height:3px;background:#eee;margin-top:8px}.composer-progress span{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.composer.is-sending{opacity:.7;pointer-events:none}
.drop-overlay{position:absolute;inset:8px;display:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;border:2px dashed var(--accent);background:rgba(255,255,255,.94);color:var(--accent);z-index:5;font-size:1.1rem}
.drop-overlay svg{width:40px;height:40px}
.thread-main.is-dragging .drop-overlay{display:flex}

.thread-files{border-left:1px solid #000;overflow-y:auto;padding:20px;background:#fff}
.files-head{display:flex;justify-content:space-between;align-items:center}
.files-head h2{margin:0;font-size:1.4rem}
.files-head .icon-btn{display:none}
.thread-files h3{display:flex;justify-content:space-between;margin:22px 0 10px;font-family:var(--font);font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.files-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.files-grid a{display:block;border:1px solid #000;border-radius:2px;overflow:hidden}
.files-grid img{width:100%;aspect-ratio:1;object-fit:cover}
.files-list{display:flex;flex-direction:column;gap:6px}
@media (max-width:980px){
  .thread-body{grid-template-columns:1fr}
  .thread-files{position:fixed;top:0;right:0;bottom:0;width:min(380px,100%);z-index:120;transform:translateX(100%);transition:transform .35s var(--ease);box-shadow:-20px 0 60px rgba(0,0,0,.2)}
  .thread-files.is-open{transform:none}
  .files-head .icon-btn{display:grid}
}
@media (max-width:640px){
  .thread-shell{height:calc(100dvh - 78px - 92px)}
  .thread-head{padding:10px 12px;gap:10px}
  .thread-tools .btn{padding:8px 10px}
  .composer-send span,.composer-hint{display:none}
  .composer-send{padding:0 14px}
  .msg-main{max-width:calc(100% - 48px)}
}
@media (min-width:981px){.files-toggle{display:none}}

.lightbox{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;background:rgba(0,0,0,.92)}
.lightbox[hidden]{display:none}
.lightbox img{max-width:100%;max-height:82vh;object-fit:contain}
.lightbox p{display:flex;gap:16px;align-items:center;margin:0;color:#fff;font-size:.9rem}
.lightbox a{display:inline-flex;gap:6px;align-items:center;color:#fff;text-decoration:underline;text-decoration-color:var(--accent)}
.lightbox-close{position:absolute;top:16px;right:16px;color:#fff;width:44px;height:44px}

/* ---------- owner ---------- */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid #000;margin-bottom:24px}
.stat-row div{padding:18px 20px;border-right:1px solid #000}
.stat-row div:last-child{border-right:0}
.stat-row strong{display:block;font-family:var(--serif);font-size:2.2rem;line-height:1}
.stat-row div:first-child strong{color:var(--accent)}
.stat-row span{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
@media (max-width:700px){.stat-row{grid-template-columns:1fr 1fr}.stat-row div:nth-child(2){border-right:0}.stat-row div:nth-child(-n+2){border-bottom:1px solid #000}}
.inbox-tools{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.seg{display:flex;border:1px solid #000;border-radius:2px;overflow:hidden}
.seg a{padding:9px 14px;font-size:.74rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;border-right:1px solid #000}
.seg a:last-child{border-right:0}
.seg a[aria-current]{background:#000;color:#fff}
.seg b{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:4px;padding:0 5px;border-radius:999px;background:var(--accent);color:#fff;font-size:.66rem}
.inbox-search{display:flex;align-items:center;gap:8px;padding:0 12px;border:1px solid #000;border-radius:2px;min-width:min(320px,100%)}
.inbox-search input{flex:1;border:0;outline:0;padding:10px 0;font:inherit;background:none}
.inbox-list{border-top:1px solid #000}
.inbox-row{display:grid;grid-template-columns:auto minmax(150px,240px) minmax(0,1fr) auto;gap:16px;align-items:center;padding:14px 10px;border-bottom:1px solid #e5e5e5;transition:background .15s}
.inbox-row:hover{background:#fafafa;color:inherit}
.inbox-row.is-unread{box-shadow:inset 4px 0 0 var(--accent)}
.inbox-row.is-unread strong{font-weight:700}
.inbox-who,.inbox-what{display:flex;flex-direction:column;min-width:0}
.inbox-who small,.inbox-what small{font-size:.82rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inbox-what strong{font-family:var(--serif);font-size:1.1rem}
.inbox-meta{display:flex;flex-direction:column;align-items:flex-end;gap:6px;font-size:.76rem}
@media (max-width:760px){.inbox-row{grid-template-columns:auto minmax(0,1fr) auto}.inbox-who{display:none}}
.client-table{border-top:1px solid #000}
.client-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:16px;align-items:center;padding:14px 10px;border-bottom:1px solid #e5e5e5}
.client-row:hover{background:#fafafa;color:inherit}
.client-row span:nth-child(2){display:flex;flex-direction:column}
.client-row small{font-size:.82rem}
.invite-box{margin:0 0 24px;padding:18px 20px;border:1px solid #000;border-left:4px solid var(--accent);border-radius:2px}
.invite-box p{margin:0 0 10px;line-height:1.5}
.copy-row{display:flex;gap:8px}
.copy-row input{flex:1;min-width:0;padding:10px 12px;border:1px solid #000;border-radius:2px;font:inherit;font-size:.85rem}