/* Layout and chat-specific structure. The active theme owns type, controls and colors. */ #s4d-app{--s4d-accent:var(--wd-primary-color,var(--wp--preset--color--accent-3,#294735));--s4d-text:var(--wd-text-color,#29312c);--s4d-surface:var(--wd-main-bgcolor,#fff);--s4d-line:var(--wd-form-brd-color,#e3e6e3);--s4d-soft:color-mix(in srgb,var(--s4d-accent) 6%,var(--s4d-surface));--s4d-radius:var(--wd-brd-radius,12px);color:var(--s4d-text);font:inherit;isolation:isolate;min-width:0;max-width:100%} #s4d-app *{box-sizing:border-box}#s4d-app [hidden]{display:none!important}#s4d-app :is(button,a,input,textarea,select):focus-visible{outline:2px solid var(--s4d-accent);outline-offset:3px}#s4d-app button{cursor:pointer}#s4d-app button:disabled{opacity:.5;cursor:not-allowed}#s4d-app .s4d-icon{flex:0 0 auto;vertical-align:middle}#s4d-app form{margin:0}#s4d-app .s4d-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;white-space:normal;flex-shrink:0}#s4d-app .s4d-shell{display:grid;grid-template-columns:220px minmax(0,1fr);border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);overflow:hidden;background:var(--s4d-surface)} #s4d-app .s4d-sidebar{background:var(--s4d-soft);padding:24px 14px;border-inline-end:1px solid var(--s4d-line);min-width:0;overflow:auto}#s4d-app .s4d-side-brand{display:flex;align-items:center;justify-content:space-between;margin:0 10px 24px}#s4d-app .s4d-kicker{font-size:10px;letter-spacing:1.4px;font-weight:600;opacity:.72}#s4d-app .s4d-side-nav,#s4d-app .s4d-project-nav{display:grid;gap:5px}#s4d-app .s4d-project-nav{margin-top:24px;padding-top:18px;border-top:1px solid var(--s4d-line)}#s4d-app .s4d-project-nav>.s4d-kicker{padding:4px 10px 12px;overflow-wrap:anywhere}#s4d-app .s4d-nav-item{display:flex;align-items:center;gap:10px;text-align:start;padding:11px 10px;border:0;border-radius:var(--s4d-radius);background:transparent;color:inherit;box-shadow:none;line-height:1.4;font-size:13px;font-family:inherit;text-transform:none;font-weight:500;min-width:0}#s4d-app .s4d-nav-item:hover,#s4d-app .s4d-nav-item.is-active{background:var(--s4d-surface);color:var(--s4d-accent)}#s4d-app .s4d-nav-item.is-active{box-shadow:0 0 0 1px var(--s4d-line);font-weight:650}#s4d-app .s4d-side-bottom{display:grid;gap:6px;margin:30px 10px 0;font-size:12px;overflow-wrap:anywhere}#s4d-app .s4d-nav-toggle{display:none}#s4d-app .s4d-main{padding:clamp(16px,3vw,32px);min-width:0}#s4d-app .s4d-main h1{font-size:clamp(23px,2.5vw,32px);line-height:1.25;margin:10px 0 18px}#s4d-app .s4d-main h2{font-size:22px;line-height:1.4}#s4d-app .s4d-main h3{font-size:17px;line-height:1.4} #s4d-app .s4d-top{display:flex;justify-content:space-between;align-items:center;gap:18px;min-width:0}#s4d-app .s4d-project-header{flex-shrink:0}#s4d-app .s4d-project-header h1{margin:6px 0 0;font-size:clamp(20px,2vw,27px)}#s4d-app .s4d-project-header>div{min-width:0;overflow-wrap:anywhere}#s4d-app .s4d-badge{display:inline-flex;align-items:center;gap:5px;background:var(--s4d-soft);border:1px solid var(--s4d-line);border-radius:100px;padding:5px 10px;font-size:11px;line-height:1.5}#s4d-app .s4d-human-badge{font-weight:600;border-color:var(--s4d-accent);margin-top:10px}#s4d-app .s4d-muted,#s4d-app .s4d-small{opacity:.78}#s4d-app .s4d-small{font-size:12px}#s4d-app .s4d-pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.85}#s4d-app .s4d-card{border:1px solid var(--s4d-line);padding:24px;border-radius:var(--s4d-radius);margin-bottom:22px;min-width:0}#s4d-app .s4d-card h2:first-child{margin-top:0}#s4d-app .s4d-card p{font-size:14px}#s4d-app .s4d-card details{margin:18px 0}#s4d-app summary{cursor:pointer}#s4d-app .s4d-field{display:grid;gap:8px;margin:16px 0;font-size:13px;font-weight:500}#s4d-app .s4d-field :is(input,textarea,select){width:100%;min-width:0;max-width:100%}#s4d-app .s4d-field textarea{resize:vertical}#s4d-app .s4d-check{display:flex;align-items:flex-start;gap:9px;font-size:13px;margin:16px 0;line-height:1.6}#s4d-app .s4d-check input{flex:0 0 auto;margin-top:4px}#s4d-app .s4d-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}#s4d-app .s4d-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:20px 0}#s4d-app .s4d-auth{max-width:520px;margin:20px auto}#s4d-app .s4d-filters{display:flex;gap:15px;align-items:end;flex-wrap:wrap;margin:20px 0}#s4d-app .s4d-filters .s4d-field{flex:1;min-width:160px;margin:0}#s4d-app .s4d-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:20px 0}#s4d-app .s4d-stats>div{display:grid;gap:6px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);padding:18px}#s4d-app .s4d-stats strong{font-size:28px}#s4d-app .s4d-stats span{font-size:12px}#s4d-app .s4d-project-choice-grid{margin-top:22px}#s4d-app .s4d-choice{padding:28px;text-align:start;min-height:220px;border-radius:var(--s4d-radius)}#s4d-app .s4d-choice-card{position:relative;display:grid;grid-template-columns:minmax(95px,.55fr) minmax(0,1.8fr) auto;align-items:center;gap:22px;width:100%;border:0;background:var(--s4d-soft);color:inherit;box-shadow:none;text-transform:none;font:inherit;overflow:hidden;cursor:pointer}#s4d-app .s4d-choice-card.has-image{background-image:linear-gradient(rgba(255,255,255,var(--s4d-choice-overlay,0)),rgba(255,255,255,var(--s4d-choice-overlay,0))),var(--s4d-choice-image);background-size:cover;background-position:center}#s4d-app .s4d-choice-card:hover{transform:translateY(-1px)}#s4d-app .s4d-choice-label{font-size:12px;font-weight:700;line-height:1.2;white-space:pre-line}#s4d-app .s4d-choice-copy{display:grid;grid-template-columns:minmax(120px,.8fr) minmax(160px,1.2fr);align-items:center;gap:24px}#s4d-app .s4d-choice-copy strong{font-family:inherit;font-size:clamp(23px,2vw,31px);line-height:1.15;font-weight:500}#s4d-app .s4d-choice-copy small{font-size:13px;line-height:1.35;font-weight:600}#s4d-app .s4d-choice-arrow{font-size:24px;font-weight:600}#s4d-app .s4d-settings-image-preview{min-height:110px;border:1px dashed var(--s4d-line);border-radius:var(--s4d-radius);overflow:hidden;background:var(--s4d-soft)}#s4d-app .s4d-settings-image-preview:empty{display:none}#s4d-app .s4d-settings-image-preview img{display:block;width:100%;height:150px;object-fit:cover}#s4d-app .s4d-project{display:flex;gap:16px;align-items:center;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);margin:12px 0;overflow:hidden;padding-inline-end:16px}#s4d-app .s4d-project-open{display:block;flex:1;min-width:0;background:transparent;color:inherit;text-align:start;padding:20px;border:0;box-shadow:none;text-transform:none;font:inherit}#s4d-app .s4d-project-open:hover{background:var(--s4d-soft)}#s4d-app .s4d-project h3{margin:8px 0;overflow-wrap:anywhere}#s4d-app .s4d-empty{padding:48px 20px;text-align:center;border:1px dashed var(--s4d-line);border-radius:var(--s4d-radius)}#s4d-app .s4d-empty p{max-width:480px;margin:16px auto} /* The conversation fills the available viewport; only its log scrolls. */ #s4d-app .s4d-conversation-shell{height:var(--s4d-workspace-height,calc(100dvh - 150px));min-height:300px;position:sticky;top:12px}#s4d-app .s4d-conversation-shell>.s4d-main{display:flex;flex-direction:column;gap:18px;padding:22px;overflow:hidden;min-height:0}#s4d-app .s4d-content.is-conversation{flex:1;min-height:0;display:flex}#s4d-app .s4d-chat{display:flex;flex-direction:column;min-height:0;width:100%;position:relative;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);overflow:hidden;background:var(--s4d-surface)}#s4d-app .s4d-chat-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid var(--s4d-line);font-size:12px;flex-shrink:0}#s4d-app .s4d-chat-head>span:first-child{display:flex;align-items:center;gap:8px}#s4d-app #s4d-mode-description{font-size:11px;opacity:.7;text-align:end}#s4d-app .s4d-log{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;overflow-anchor:none;padding:24px 22px;display:flex;flex-direction:column;gap:24px}#s4d-app .s4d-chat-welcome{max-width:450px;text-align:center;margin:auto;padding:20px}#s4d-app .s4d-chat-welcome>.s4d-avatar{margin:0 auto 20px;width:48px;height:48px}#s4d-app .s4d-chat-welcome p{font-size:14px;line-height:1.7}#s4d-app .s4d-avatar{position:relative;display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--s4d-soft);border:1px solid var(--s4d-line);font-size:10px;font-weight:650;flex:0 0 auto;overflow:hidden;color:var(--s4d-accent)}#s4d-app .s4d-avatar img{position:absolute;width:100%;height:100%;object-fit:contain;background:var(--s4d-surface)}#s4d-app .s4d-avatar.is-client img{object-fit:cover}#s4d-app .s4d-message{display:flex;align-items:flex-start;gap:10px;max-width:92%;width:fit-content;align-self:flex-start;animation:s4d-appear .18s ease-out;min-width:0}#s4d-app .s4d-message.client{align-self:flex-end;flex-direction:row-reverse;max-width:85%}#s4d-app .s4d-message-content{padding:4px 0;min-width:0}#s4d-app .s4d-message.client .s4d-message-content{padding:14px 17px;background:var(--s4d-soft);border-radius:var(--s4d-radius)}#s4d-app .s4d-message-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 7px;font-size:11px;line-height:1.4}#s4d-app .s4d-message-meta time{font-size:10px;opacity:.58}#s4d-app .s4d-message details{font-size:12px;margin-top:10px}#s4d-app .s4d-message details p{white-space:pre-wrap}#s4d-app .s4d-message .s4d-btn{font-size:11px;margin-top:8px}#s4d-app .s4d-delivery-preview{border-inline-start:2px solid var(--s4d-accent);padding-inline-start:12px}#s4d-app .s4d-delivery-preview p{font-size:13px}#s4d-app .s4d-attachment{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);text-decoration:none;overflow-wrap:anywhere}#s4d-app .s4d-attachment small{display:block;margin-top:5px;font-size:10px;opacity:.7}#s4d-app .s4d-image-note{display:block;font-size:11px;margin-top:7px;opacity:.7}#s4d-app .s4d-compose-dock{flex-shrink:0;position:sticky;bottom:0;background:var(--s4d-surface);padding:0 18px max(10px,env(safe-area-inset-bottom));z-index:2}#s4d-app .s4d-chat-status{min-height:26px;max-height:42px;overflow:auto;display:flex;align-items:center;gap:7px;font-size:12px;padding:2px 8px}#s4d-app .s4d-composer{border:var(--wd-form-brd-width,1px) solid var(--wd-form-brd-color,var(--s4d-line));border-radius:var(--wd-form-brd-radius,var(--s4d-radius));background:var(--wd-form-bg,var(--s4d-surface));padding:10px 12px;box-shadow:0 4px 20px color-mix(in srgb,var(--s4d-text) 4%,transparent)}#s4d-app .s4d-composer:focus-within{border-color:var(--wd-form-brd-color-focus,var(--s4d-accent))}#s4d-app .s4d-composer textarea{display:block;width:100%;min-height:48px;max-height:160px;padding:6px 2px;resize:none;border:0;border-radius:0;box-shadow:none;background:transparent;margin:0;font:inherit;font-size:14px;color:inherit;outline-offset:-2px}#s4d-app .s4d-composer-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px}#s4d-app .s4d-tool-group{display:flex;align-items:center;gap:8px;min-width:0}#s4d-app .s4d-tool-group>.s4d-btn{padding:9px;min-width:38px;min-height:38px}#s4d-app .s4d-attach-button{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;min-width:36px;min-height:38px;border-radius:var(--s4d-radius);margin:0}#s4d-app .s4d-attach-button input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}#s4d-app .s4d-attach-button:focus-within{outline:2px solid var(--s4d-accent);outline-offset:2px}#s4d-app .s4d-reply-toggle{display:flex;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);padding:3px;gap:3px;min-width:0}#s4d-app .s4d-reply-toggle button{display:flex;align-items:center;gap:5px;background:transparent;color:inherit;border:0;box-shadow:none;border-radius:var(--s4d-radius);padding:6px 8px;font:inherit;font-size:11px;line-height:1.3;text-transform:none;white-space:nowrap}#s4d-app .s4d-reply-toggle .s4d-icon{width:15px;height:15px}#s4d-app .s4d-reply-toggle [aria-pressed=true]{background:var(--s4d-soft);color:var(--s4d-accent);font-weight:650}#s4d-app .s4d-chat-footer{font-size:10px;line-height:1.5;text-align:center;opacity:.7;margin-top:7px}#s4d-app .s4d-attachment-chip{display:flex;align-items:center;gap:7px;padding:6px 9px;border-radius:var(--s4d-radius);border:1px solid var(--s4d-line);font-size:12px;margin-bottom:8px}#s4d-app .s4d-attachment-chip>span{flex:1;overflow-wrap:anywhere}#s4d-app .s4d-attachment-chip .s4d-btn{padding:4px;min-width:30px;min-height:30px}#s4d-app .s4d-latest{position:absolute;bottom:190px;inset-inline-start:50%;transform:translateX(-50%);z-index:3;font-size:12px;padding:6px 12px}#s4d-app #s4d-job-errors>div{font-size:12px;padding:8px;display:flex;align-items:center;gap:10px;justify-content:space-between}#s4d-app .s4d-brief-card{margin:0;border-bottom:1px solid var(--s4d-line);font-size:12px}#s4d-app .s4d-brief-card>summary{display:flex;align-items:center;gap:8px;padding:10px 20px}#s4d-app .s4d-brief-card summary small{margin-inline-start:auto;opacity:.7;font-size:10px}#s4d-app .s4d-brief-body{padding:4px 20px 16px;max-height:200px;overflow:auto}#s4d-app .s4d-brief-body .s4d-btn{margin-top:10px}#s4d-app .s4d-thinking{display:inline-flex;gap:4px;margin-inline-end:5px}#s4d-app .s4d-thinking i{width:5px;height:5px;border-radius:50%;background:currentColor;animation:s4d-pulse 1.2s infinite}#s4d-app .s4d-thinking i:nth-child(2){animation-delay:.2s}#s4d-app .s4d-thinking i:nth-child(3){animation-delay:.4s} #s4d-app .s4d-file{display:flex;gap:14px;align-items:center;border-bottom:1px solid var(--s4d-line);padding:18px 0}#s4d-app .s4d-file>div{flex:1;min-width:0}#s4d-app .s4d-file strong{overflow-wrap:anywhere;font-size:14px}#s4d-app .s4d-file small{display:block;font-size:11px;opacity:.7}#s4d-app .s4d-file-icon{font-size:24px}#s4d-app .s4d-upload{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:20px;border:1px dashed var(--s4d-line);border-radius:var(--s4d-radius);margin:20px 0}#s4d-app .s4d-upload input,#s4d-app .s4d-upload select{min-width:0;max-width:100%}#s4d-app .s4d-save{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px;background:var(--s4d-soft);border-radius:var(--s4d-radius);margin:20px 0}#s4d-app .s4d-quote-dates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0;padding:20px 0;border-block:1px solid var(--s4d-line);font-size:12px}#s4d-app .s4d-quote-dates strong{display:block;font-size:15px;margin-top:7px}#s4d-app .s4d-payment-options{display:grid;gap:12px}#s4d-app .s4d-payment-option{display:flex;align-items:center;gap:15px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);padding:18px}#s4d-app .s4d-payment-option span{flex:1}#s4d-app .s4d-payment-option small{display:block;font-size:11px}#s4d-app .s4d-payment-option b{font-size:19px}#s4d-app .s4d-quote-option{border:1px solid var(--s4d-line);padding:15px;border-radius:var(--s4d-radius);margin:16px 0}#s4d-app .s4d-credential{padding:18px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);min-width:0}#s4d-app .s4d-credential input[type=password]{direction:ltr;text-align:left}#s4d-app .s4d-setting-status{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--s4d-line);font-size:13px}#s4d-app .s4d-record{padding:16px 0;border-bottom:1px solid var(--s4d-line)}#s4d-app .s4d-notice{position:sticky;top:8px;z-index:6;background:var(--s4d-surface);border:1px solid var(--s4d-accent);border-radius:var(--s4d-radius);padding:14px 20px;margin-bottom:15px;font-size:13px}#s4d-app .s4d-notice.error{border-width:2px}#s4d-app .s4d-loading{text-align:center;padding:70px 20px} @keyframes s4d-appear{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}@keyframes s4d-pulse{50%{opacity:.25;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){#s4d-app .s4d-message,#s4d-app .s4d-thinking i{animation:none}} @media(max-width:1100px){#s4d-app .s4d-shell{grid-template-columns:180px minmax(0,1fr)}#s4d-app .s4d-sidebar{padding:20px 8px}#s4d-app .s4d-conversation-shell>.s4d-main{padding:16px;gap:12px}#s4d-app .s4d-chat-head{padding:12px 14px}#s4d-app .s4d-log{padding:18px 14px}#s4d-app .s4d-compose-dock{padding-inline:12px}} @media(max-width:760px){#s4d-app .s4d-shell{display:flex;flex-direction:column}#s4d-app .s4d-sidebar{overflow:visible;flex-shrink:0;padding:9px 12px;border-inline-end:0;border-bottom:1px solid var(--s4d-line);position:relative;z-index:4}#s4d-app .s4d-side-brand{margin:0;min-height:28px}#s4d-app .s4d-nav-toggle{display:grid;place-items:center;min-height:32px;min-width:32px;background:transparent;color:inherit;border:0;padding:4px;box-shadow:none}#s4d-app #s4d-navigation{display:none;position:absolute;top:100%;inset-inline:0;padding:12px;background:var(--s4d-surface);border:1px solid var(--s4d-line);box-shadow:0 12px 18px #0001;max-height:65dvh;overflow:auto}#s4d-app #s4d-navigation.is-open{display:block}#s4d-app .s4d-project-nav{margin-top:14px;padding-top:12px}#s4d-app .s4d-side-bottom{margin-top:18px}#s4d-app .s4d-main{padding:16px}#s4d-app .s4d-conversation-shell>.s4d-main{padding:12px 8px 8px;gap:10px;flex:1}#s4d-app .s4d-project-header{padding:0 4px}#s4d-app .s4d-project-header h1{font-size:18px;margin:3px 0 0}#s4d-app .s4d-project-header .s4d-kicker{font-size:8px}#s4d-app .s4d-project-header .s4d-badge{font-size:9px;max-width:35%;text-align:center}#s4d-app .s4d-chat-head{padding:9px 10px;font-size:11px}#s4d-app #s4d-mode-description{font-size:9px;max-width:46%}#s4d-app .s4d-log{padding:16px 10px;gap:20px}#s4d-app .s4d-message,#s4d-app .s4d-message.client{max-width:98%;gap:7px}#s4d-app .s4d-avatar{width:26px;height:26px;font-size:8px}#s4d-app .s4d-message-meta time{font-size:8px}#s4d-app .s4d-message-meta{font-size:10px;gap:8px}#s4d-app .s4d-message.client .s4d-message-content{padding:10px 12px}#s4d-app .s4d-pre{font-size:13px}#s4d-app .s4d-compose-dock{padding-inline:8px}#s4d-app .s4d-composer{padding:8px}#s4d-app .s4d-composer-tools{gap:5px;flex-wrap:wrap}#s4d-app .s4d-tool-group{gap:4px}#s4d-app .s4d-reply-toggle button{padding:6px;font-size:10px}#s4d-app .s4d-reply-toggle .s4d-icon{display:none}#s4d-app .s4d-attach-button{min-width:28px}#s4d-app .s4d-tool-group>.s4d-btn{padding:7px;min-width:32px;min-height:34px}#s4d-app .s4d-chat-footer{font-size:9px}#s4d-app .s4d-brief-card>summary{padding:8px 12px}#s4d-app .s4d-brief-card summary small{font-size:8px}#s4d-app .s4d-two{grid-template-columns:1fr}#s4d-app .s4d-card{padding:16px}#s4d-app .s4d-file,#s4d-app .s4d-save,#s4d-app .s4d-payment-option{flex-wrap:wrap}#s4d-app .s4d-stats{gap:8px}#s4d-app .s4d-stats>div{padding:12px}#s4d-app .s4d-stats span{font-size:10px}#s4d-app .s4d-project{gap:6px;padding-inline-end:8px}#s4d-app .s4d-project-open{padding:14px}#s4d-app .s4d-project>.s4d-btn{font-size:11px;padding:8px}#s4d-app .s4d-chat-welcome{padding:12px}#s4d-app .s4d-chat-welcome h2{font-size:20px}} /* Map Woodmart native control tokens to its configured default/accented buttons. */ #s4d-app .s4d-btn{--btn-brd-radius:var(--btn-default-brd-radius);--btn-bgcolor:var(--btn-default-bgcolor);--btn-color:var(--btn-default-color);--btn-bgcolor-hover:var(--btn-default-bgcolor-hover);--btn-color-hover:var(--btn-default-color-hover);--btn-box-shadow:var(--btn-default-box-shadow);--btn-box-shadow-hover:var(--btn-default-box-shadow-hover)} #s4d-app .s4d-btn.btn-color-primary{--btn-brd-radius:var(--btn-accented-brd-radius);--btn-bgcolor:var(--btn-accented-bgcolor);--btn-color:var(--btn-accented-color);--btn-bgcolor-hover:var(--btn-accented-bgcolor-hover);--btn-color-hover:var(--btn-accented-color-hover);--btn-box-shadow:var(--btn-accented-box-shadow);--btn-box-shadow-hover:var(--btn-accented-box-shadow-hover)} #s4d-app{scroll-margin-top:calc(100px + var(--wp-admin--admin-bar--height,0px))}#s4d-app .s4d-conversation-shell{min-height:240px}#s4d-app .s4d-compose-dock{position:relative;bottom:auto}#s4d-app .s4d-chat-head,#s4d-app #s4d-brief{flex-shrink:0}.s4d-compact-height .s4d-project-header,.s4d-compact-height #s4d-brief{display:none!important}#s4d-app .s4d-compact-height .s4d-chat-footer{display:none}#s4d-app .s4d-compact-height .s4d-composer textarea{min-height:36px;max-height:70px} /* Direction-aware navigation; existing primary/secondary button styles are unchanged. */ #s4d-app .s4d-nav-item{justify-content:flex-start;text-align:start}#s4d-app .s4d-nav-item>span{text-align:start} #s4d-app .s4d-image-choice{padding:8px 0;font-size:12px}#s4d-app .s4d-image-choice p{margin:0 0 8px}#s4d-app .s4d-image-choice>div{display:flex;gap:8px;flex-wrap:wrap}#s4d-app .s4d-image-choice .s4d-btn{font-size:11px;padding:8px 12px}#s4d-app .s4d-image-choice [aria-pressed=true]{outline:2px solid var(--s4d-accent);outline-offset:1px}#s4d-app .s4d-image-choice small{display:block;margin-top:9px;line-height:1.5} #s4d-app .s4d-upload-progress{display:grid;gap:7px;width:100%;padding:8px 0;font-size:12px}#s4d-app .s4d-upload-progress progress{width:100%;height:8px;accent-color:var(--s4d-accent)}#s4d-app [data-upload-image-choice],#s4d-app [data-upload-status]{flex-basis:100%} #s4d-app .s4d-voice-tools>.s4d-voice-button{gap:7px;min-width:0;font-size:11px;padding:8px 12px;text-transform:none;white-space:nowrap}#s4d-app .s4d-voice-stop{display:inline-flex;align-items:center;opacity:.65}#s4d-app .s4d-voice-stop .s4d-icon{width:12px;height:12px}#s4d-app .s4d-voice-button [data-voice-start]{display:inline-flex}#s4d-app .s4d-voice-wave{display:flex;align-items:center;justify-content:center;gap:2px;height:28px;min-width:38px}#s4d-app .s4d-voice-wave i{display:block;width:2px;height:calc(4px + 25px * var(--s4d-voice-level,.08));background:currentColor;border-radius:8px;transition:height 80ms linear}#s4d-app .s4d-voice-wave i:nth-child(2n){height:calc(4px + 15px * var(--s4d-voice-level,.08))}#s4d-app .s4d-voice-wave i:nth-child(3n){height:calc(4px + 21px * var(--s4d-voice-level,.08))}#s4d-app .s4d-voice-button[data-state=connecting] .s4d-voice-wave{animation:s4d-pulse 1.4s infinite}@media(prefers-reduced-motion:reduce){#s4d-app .s4d-voice-wave{animation:none!important}#s4d-app .s4d-voice-wave i{transition:none}} #s4d-app .s4d-voice-tools{margin-inline-start:auto}#s4d-app [data-voice-label]{max-width:110px;line-height:1.25}#s4d-app .s4d-project{flex-wrap:wrap}@media(max-width:760px){#s4d-app [data-voice-label]{max-width:72px}} @media(max-width:760px){#s4d-app .s4d-voice-tools>.s4d-voice-button{gap:5px;padding:7px;font-size:10px}#s4d-app .s4d-voice-wave{min-width:18px;height:24px}#s4d-app .s4d-voice-wave i:nth-child(even){display:none}} #s4d-app #s4d-project-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}#s4d-app #s4d-project-title h1{margin:0;overflow-wrap:anywhere}#s4d-app #s4d-project-title>[data-action=rename-project]{flex-shrink:0}#s4d-app [data-form=project-title]{width:min(100%,560px);min-width:220px}#s4d-app [data-title-error]{display:block;margin-top:8px}#s4d-app .s4d-auth .s4d-field small{font-size:12px;line-height:1.5} #s4d-app .s4d-chat-image{margin:0;max-width:360px;width:100%}#s4d-app .s4d-chat-image>a{display:block}#s4d-app .s4d-chat-image img{display:block;max-width:100%;width:360px;height:240px;object-fit:contain;border-radius:8px}#s4d-app .s4d-chat-image img[hidden]{display:none}#s4d-app .s4d-chat-image figcaption{margin-top:8px}#s4d-app .s4d-chat-image [data-preview-error]{font-size:12px} /* Project Agreement v0.6.9 — current agreement UI; legacy quotation styles remain for compatibility only. */ #s4d-app .s4d-agreement-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin:24px 0} #s4d-app .s4d-agreement-grid>section{padding:18px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);background:var(--s4d-soft);min-width:0} #s4d-app .s4d-agreement-grid h3{margin:0 0 10px} #s4d-app .s4d-agreement-cost{display:grid;gap:5px;padding:18px 0;margin-top:18px;border-top:1px solid var(--s4d-line);border-bottom:1px solid var(--s4d-line)} #s4d-app .s4d-agreement-cost>span,#s4d-app .s4d-agreement-cost>small{font-size:12px;opacity:.75} #s4d-app .s4d-agreement-cost>strong{font-size:22px} #s4d-app .s4d-agreement-warning{padding:15px 18px;margin:18px 0;border:1px solid var(--s4d-line);border-inline-start:3px solid var(--s4d-accent);border-radius:var(--s4d-radius);background:var(--s4d-soft)} #s4d-app .s4d-agreement-warning ul{margin:8px 0 0;padding-inline-start:22px} #s4d-app .s4d-agreement-editor .s4d-field{text-align:start} #s4d-app .s4d-agreement-editor .s4d-actions{justify-content:flex-start} @media(max-width:760px){#s4d-app .s4d-agreement-grid{grid-template-columns:1fr}} /* Project Agreement v0.6.9 — simplify customer decision and keep legacy commerce out of new-project UI. */ #s4d-app .s4d-agreement-client-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:22px;padding-top:20px;border-top:1px solid var(--s4d-line)} #s4d-app .s4d-agreement-client-actions>.s4d-small{flex-basis:100%;margin:0} #s4d-app .s4d-agreement-client-actions .s4d-save{flex-basis:100%;margin:0 0 4px} @media(max-width:760px){#s4d-app .s4d-agreement-client-actions>.s4d-btn{width:100%}} /* Project agreement conversation milestones v0.6.10. */ #s4d-app .s4d-timeline-card{align-self:stretch;display:flex;gap:12px;max-width:760px;width:min(100%,760px);margin:2px auto;padding:16px 18px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);background:var(--s4d-soft);animation:s4d-appear .18s ease-out} #s4d-app .s4d-timeline-card.is-accepted{border-inline-start:3px solid var(--s4d-accent)} #s4d-app .s4d-timeline-icon{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border:1px solid var(--s4d-line);border-radius:50%;background:var(--s4d-surface);color:var(--s4d-accent)} #s4d-app .s4d-timeline-icon .s4d-icon{width:17px;height:17px} #s4d-app .s4d-timeline-body{min-width:0;flex:1} #s4d-app .s4d-timeline-body p{margin:4px 0 0;font-size:13px;line-height:1.7} #s4d-app .s4d-timeline-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px} #s4d-app .s4d-timeline-actions .s4d-btn{font-size:11px} @media(max-width:760px){#s4d-app .s4d-timeline-card{padding:13px 12px}#s4d-app .s4d-timeline-actions>.s4d-btn{width:100%}} #s4d-app .s4d-currency-locked{border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);padding:14px 16px;background:var(--s4d-soft)}#s4d-app .s4d-currency-locked strong{font-size:15px;font-weight:600}#s4d-app .s4d-currency-locked input[type=hidden]{display:none} #s4d-app .s4d-payment-terms-editor{margin:26px 0;padding:22px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);background:var(--s4d-soft)} #s4d-app .s4d-payment-terms-editor>.s4d-top{align-items:flex-start;margin-bottom:16px} #s4d-app .s4d-payment-terms-editor h3{margin:3px 0 6px} #s4d-app .s4d-payment-term{padding:18px;margin:14px 0;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);background:var(--s4d-surface)} #s4d-app .s4d-payment-term-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px} #s4d-app .s4d-payment-term-total{display:flex;justify-content:space-between;gap:16px;padding-top:12px;margin-top:12px;border-top:1px dashed var(--s4d-line);font-size:12px} #s4d-app .s4d-payment-term-total strong{font-size:14px} #s4d-app .s4d-payment-summary{padding:12px 14px;margin-top:14px;border-radius:var(--s4d-radius);background:var(--s4d-surface);font-size:12px} #s4d-app .s4d-agreement-payments{margin:24px 0;padding:20px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);background:var(--s4d-soft)} #s4d-app .s4d-agreement-payments h3{margin:3px 0 0} #s4d-app .s4d-agreement-payment-list{display:grid;gap:10px;margin-top:14px} #s4d-app .s4d-agreement-payment{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 0;border-top:1px solid var(--s4d-line)} #s4d-app .s4d-agreement-payment:first-child{border-top:0} #s4d-app .s4d-agreement-payment>div{display:grid;gap:3px;min-width:0} #s4d-app .s4d-agreement-payment span,#s4d-app .s4d-agreement-payment small{font-size:11px;opacity:.75} #s4d-app .s4d-agreement-payment b{white-space:nowrap;font-size:15px} #s4d-app .s4d-agreement-payment b small{font-weight:400} @media(max-width:760px){#s4d-app .s4d-payment-terms-editor{padding:15px}#s4d-app .s4d-payment-terms-editor>.s4d-top,#s4d-app .s4d-agreement-payment{align-items:stretch;flex-direction:column}#s4d-app .s4d-agreement-payment b{white-space:normal}} #s4d-app .s4d-agreement-payment-side{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap} #s4d-app .s4d-timeline-card.is-due{border-inline-start:3px solid var(--s4d-accent)} @media(max-width:760px){#s4d-app .s4d-agreement-payment-side{justify-content:flex-start}} /* v0.7.0 · Account billing and statement. Financial tracking stays informational; it never locks project workflow, previews or delivery. */ #s4d-app .s4d-billing-page{display:grid;gap:20px} #s4d-app .s4d-billing-stats>div.is-due{border-color:var(--s4d-accent)} #s4d-app .s4d-billing-admin{align-items:start} #s4d-app .s4d-billing-admin>.s4d-card{margin:0;height:100%} #s4d-app .s4d-statement{overflow:hidden} #s4d-app .s4d-ledger-row{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 0;border-top:1px solid var(--s4d-line)} #s4d-app .s4d-ledger-row:first-of-type{border-top:0} #s4d-app .s4d-ledger-row>div:first-child{display:grid;gap:4px;min-width:0} #s4d-app .s4d-ledger-row strong{overflow-wrap:anywhere} #s4d-app .s4d-ledger-row small,#s4d-app .s4d-ledger-row time{font-size:11px;opacity:.7} #s4d-app .s4d-ledger-amount{display:grid;gap:4px;text-align:end;white-space:nowrap} #s4d-app .s4d-ledger-amount b{font-size:16px} #s4d-app .s4d-ledger-row.is-credit .s4d-ledger-amount b:before{content:'✓ ';font-size:11px} @media(max-width:760px){#s4d-app .s4d-ledger-row{align-items:flex-start;flex-direction:column;gap:10px}#s4d-app .s4d-ledger-amount{text-align:start;white-space:normal}#s4d-app .s4d-billing-page>.s4d-top{align-items:flex-start;flex-direction:column}} @media print{body *{visibility:hidden!important}#s4d-app,#s4d-app *{visibility:visible!important}#s4d-app{position:absolute;inset:0;background:#fff!important}.s4d-sidebar,.s4d-project-header,.s4d-billing-admin,[data-action="print-billing"],#wpadminbar{display:none!important}.s4d-main{padding:0!important}.s4d-billing-page{display:block!important}.s4d-billing-page>.s4d-top,.s4d-billing-stats,.s4d-statement{margin-bottom:18px}.s4d-card,.s4d-stats>div{box-shadow:none!important;break-inside:avoid}} /* v0.7.1 · Billing is an account-level page, with clear debit/payment colors. */ #s4d-app .s4d-ledger-row.is-debit>div:first-child>strong{color:#b96f52} #s4d-app .s4d-ledger-row.is-credit>div:first-child>strong{color:#6f8168} #s4d-app .s4d-ledger-project-link{justify-self:start;padding:0;border:0;background:transparent;box-shadow:none;color:var(--s4d-accent);font:inherit;font-size:11px;font-weight:600;text-transform:none;text-decoration:underline;text-underline-offset:3px} #s4d-app .s4d-ledger-project-link:hover{opacity:.78} @media print{#s4d-app .s4d-ledger-project-link{display:none!important}} /* v0.7.3 · Studio overview cleanup and payment-method preference. */ #s4d-app .s4d-client-account .s4d-stats{grid-template-columns:repeat(4,minmax(0,1fr))} #s4d-app .s4d-client-account .s4d-top>.s4d-actions{margin-block:0} @media(max-width:980px){#s4d-app .s4d-client-account .s4d-stats{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:560px){#s4d-app .s4d-client-account .s4d-stats{grid-template-columns:1fr}} #s4d-app .s4d-dashboard-finance{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:18px 0 24px} #s4d-app .s4d-dashboard-finance .s4d-card{margin-bottom:0} #s4d-app .s4d-finance-summary .s4d-stats{margin-bottom:0} #s4d-app .s4d-record{display:flex;justify-content:space-between;align-items:center;gap:18px} #s4d-app .s4d-record>div:first-child{min-width:0} #s4d-app .s4d-record-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end} #s4d-app .s4d-payment-method form{max-width:520px} @media(max-width:900px){#s4d-app .s4d-dashboard-finance{grid-template-columns:1fr}} @media(max-width:560px){#s4d-app .s4d-record{align-items:flex-start;flex-direction:column}#s4d-app .s4d-record-actions{justify-content:flex-start}#s4d-app .s4d-finance-summary .s4d-stats{grid-template-columns:1fr}} /* v0.7.4 payment method settings and manual payment instructions */ .s4d-payment-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start} .s4d-payment-settings-card{margin:0} .s4d-payment-instructions{margin-top:18px;padding:18px;border:1px solid color-mix(in srgb,currentColor 14%,transparent);border-radius:16px;background:color-mix(in srgb,#8f9b72 7%,transparent)} .s4d-payment-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin:14px 0} .s4d-payment-detail{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border:1px solid color-mix(in srgb,currentColor 10%,transparent);border-radius:12px;background:rgba(255,255,255,.35)} .s4d-payment-detail span{font-size:.78rem;opacity:.68} .s4d-payment-detail strong{font-size:.95rem;overflow-wrap:anywhere} @media(max-width:820px){.s4d-payment-settings-grid,.s4d-payment-details{grid-template-columns:1fr}} #s4d-app .s4d-ledger-actions{display:flex;gap:12px;align-items:center;margin-top:5px} #s4d-app .s4d-ledger-actions button{appearance:none;border:0;background:transparent;padding:0;color:var(--s4d-accent);font:inherit;font-size:11px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px} #s4d-app .s4d-ledger-actions button.is-danger{color:#9a4b45} #s4d-app .s4d-ledger-actions button:hover{opacity:.72} #s4d-app .s4d-ledger-edit{display:grid;gap:14px;margin:0 0 14px;padding:18px;border:1px solid var(--s4d-line);background:rgba(248,247,243,.58)} #s4d-app .s4d-ledger-edit h3{margin:0} @media print{#s4d-app .s4d-ledger-actions,#s4d-app .s4d-ledger-edit{display:none!important}} /* v0.7.6 · Customer payment reports and studio verification. */ #s4d-app .s4d-payment-report{display:grid;gap:14px;margin-top:20px;padding-top:20px;border-top:1px solid var(--s4d-line);max-width:620px} #s4d-app .s4d-payment-requests{display:grid;gap:0} #s4d-app .s4d-payment-request{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:16px 0;border-top:1px solid var(--s4d-line)} #s4d-app .s4d-payment-request:first-of-type{border-top:0} #s4d-app .s4d-payment-request>div:first-child{display:grid;gap:4px;min-width:0} #s4d-app .s4d-payment-request>div:last-child{display:grid;gap:8px;justify-items:end} #s4d-app .s4d-payment-request small,#s4d-app .s4d-payment-request time,#s4d-app .s4d-payment-request span{font-size:11px;opacity:.78} #s4d-app .s4d-payment-request.is-verified strong{color:#6f8168} #s4d-app .s4d-payment-request.is-rejected{opacity:.7} @media(max-width:700px){#s4d-app .s4d-payment-request{flex-direction:column}#s4d-app .s4d-payment-request>div:last-child{justify-items:start}} @media print{#s4d-app .s4d-payment-report,#s4d-app .s4d-payment-requests{display:none!important}} /* v0.7.7 · Simpler customer payment flow and verification attention. */ #s4d-app .s4d-payment-method-picker{max-width:520px} #s4d-app details.s4d-payment-report{display:block;margin-top:18px;padding-top:18px;border-top:1px solid var(--s4d-line);max-width:620px} #s4d-app details.s4d-payment-report>summary{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 16px;border:1px solid var(--s4d-line);border-radius:10px;background:#fff;color:var(--s4d-text);font-weight:700;cursor:pointer;list-style:none} #s4d-app details.s4d-payment-report>summary::-webkit-details-marker{display:none} #s4d-app details.s4d-payment-report[open]>summary{margin-bottom:16px;background:var(--s4d-soft)} #s4d-app details.s4d-payment-report form{display:grid;gap:14px;padding:18px;border:1px solid var(--s4d-line);border-radius:14px;background:rgba(248,247,243,.55)} #s4d-app .s4d-card.is-attention{border-inline-start:3px solid var(--s4d-accent)} #s4d-app .s4d-pending-payment-record+ .s4d-pending-payment-record{border-top:1px solid var(--s4d-line);padding-top:14px;margin-top:14px} /* v0.8.3 notifications and post-agreement financial adjustments */ .s4d-nav-count{display:inline-flex;align-items:center;justify-content:center;min-width:1.55em;height:1.55em;padding:0 .38em;margin-inline-start:.45em;border-radius:999px;background:#c97959;color:#fff;font-style:normal;font-size:.72em;line-height:1} .s4d-notifications-list{display:grid;gap:12px} .s4d-notification{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;padding:18px 0;border-bottom:1px solid rgba(90,88,80,.12)} .s4d-notification:last-child{border-bottom:0} .s4d-notification.is-unread{padding-inline:14px;border-radius:12px;background:rgba(201,121,89,.07)} .s4d-notification h3{margin:.2em 0 .35em} .s4d-notification p{margin:.15em 0 .55em} .s4d-notification time{font-size:.82em;opacity:.62} .s4d-project-adjustments .s4d-adjustment-history{display:grid;gap:8px;margin:18px 0} .s4d-project-adjustments .s4d-record{margin:0} .s4d-timeline-card.is-credit{border-inline-start:3px solid #7e9474} @media (max-width:700px){.s4d-notification{flex-direction:column}.s4d-notification .s4d-record-actions{width:100%}} /* v0.8.4 · Dynamic manual payment-method builder. */ #s4d-app .s4d-manual-builder{display:grid;gap:18px} #s4d-app [data-manual-method-list]{display:grid;gap:18px} #s4d-app .s4d-manual-method{margin:0;border-inline-start:3px solid color-mix(in srgb,var(--s4d-accent) 55%,transparent)} #s4d-app .s4d-manual-fields{display:grid;gap:12px;margin:16px 0} #s4d-app .s4d-manual-field{display:grid;grid-template-columns:minmax(150px,.75fr) minmax(180px,1fr) minmax(240px,1.5fr);gap:12px;align-items:end;padding:14px;border:1px solid var(--s4d-line);border-radius:12px;background:rgba(248,247,243,.5)} #s4d-app .s4d-manual-field .s4d-actions{grid-column:1/-1;margin:0} #s4d-app .s4d-dynamic-payment-details{grid-template-columns:1fr} #s4d-app .s4d-payment-note{padding:14px;border:1px solid var(--s4d-line);border-radius:12px;background:rgba(255,255,255,.45)} #s4d-app .s4d-payment-note strong{display:block;margin-bottom:7px} #s4d-app .s4d-payment-media{display:grid;gap:8px;padding:14px;border:1px solid var(--s4d-line);border-radius:12px;background:rgba(255,255,255,.45)} #s4d-app .s4d-payment-media img{display:block;max-width:min(320px,100%);max-height:320px;object-fit:contain;border-radius:10px;background:#fff} #s4d-app .s4d-payment-code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.04em} #s4d-app .s4d-copy-payment{justify-self:start;appearance:none;border:0;background:transparent;padding:0;color:var(--s4d-accent);font:inherit;font-size:11px;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer} @media(max-width:820px){#s4d-app .s4d-manual-field{grid-template-columns:1fr}} /* v0.8.5 · Accounting statement table, print-ready client statement. */ #s4d-app .s4d-print-header,#s4d-app .s4d-print-footer{display:none} #s4d-app .s4d-statement-table-wrap{width:100%;overflow-x:auto;margin-top:12px} #s4d-app .s4d-statement-table{width:100%;min-width:860px;border-collapse:collapse;font-size:13px} #s4d-app .s4d-statement-table th{padding:11px 12px;border-bottom:2px solid var(--s4d-line);background:var(--s4d-soft);text-align:start;font-size:11px;letter-spacing:.035em;white-space:nowrap} #s4d-app .s4d-statement-table td{padding:13px 12px;border-bottom:1px solid var(--s4d-line);vertical-align:top} #s4d-app .s4d-statement-table tbody tr:last-child td{border-bottom:0} #s4d-app .s4d-statement-description{min-width:220px} #s4d-app .s4d-statement-description strong{display:block;margin-bottom:3px;overflow-wrap:anywhere} #s4d-app .s4d-statement-description small{display:block;font-size:11px;opacity:.72;margin:2px 0} #s4d-app .s4d-statement-note{min-width:180px;max-width:320px;white-space:normal;overflow-wrap:anywhere} #s4d-app .s4d-statement-date{white-space:nowrap;font-variant-numeric:tabular-nums} #s4d-app .s4d-statement-money{text-align:end;white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:650} #s4d-app .s4d-statement-table tr.is-debit .s4d-statement-money.is-debit{color:#b96f52} #s4d-app .s4d-statement-table tr.is-credit .s4d-statement-money.is-credit{color:#6f8168} #s4d-app .s4d-statement-money.is-balance{font-weight:750} #s4d-app .s4d-ledger-edit-row td{padding:0 0 14px!important;background:transparent} #s4d-app .s4d-ledger-edit-row .s4d-ledger-edit{margin:0;border-radius:12px} @media print{ @page{size:A4;margin:14mm 12mm 16mm} html,body{background:#fff!important} #s4d-app{font-family:Arial,"Noto Sans",sans-serif!important;color:#252723!important} #s4d-app .s4d-screen-billing-head,#s4d-app .s4d-payment-method,#s4d-app .s4d-payment-requests,#s4d-app .s4d-billing-admin,#s4d-app .s4d-ledger-actions,#s4d-app .s4d-ledger-edit-row,#s4d-app .s4d-ledger-project-link{display:none!important} #s4d-app .s4d-print-header{display:flex!important;justify-content:space-between;align-items:flex-start;gap:24px;padding:0 0 16px;border-bottom:2px solid #3e4b45;margin-bottom:16px} #s4d-app .s4d-print-brand{display:flex;align-items:center;gap:12px;min-width:220px} #s4d-app .s4d-print-brand img{display:block;max-width:64px;max-height:48px;object-fit:contain} #s4d-app .s4d-print-brand>div{display:grid;gap:2px} #s4d-app .s4d-print-brand>div>strong{font-size:18px;letter-spacing:.02em} #s4d-app .s4d-print-brand>div>span{font-size:8px;letter-spacing:.16em;color:#72766f} #s4d-app .s4d-print-title{text-align:end} #s4d-app .s4d-print-title h1{font-size:20px!important;margin:0 0 5px!important} #s4d-app .s4d-print-title p{margin:2px 0!important;font-size:10px!important;color:#62665f!important} #s4d-app .s4d-billing-stats{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:8px!important;margin:0 0 14px!important} #s4d-app .s4d-billing-stats>div{border:1px solid #d9d6ce!important;padding:10px!important;background:#fff!important} #s4d-app .s4d-billing-stats strong{font-size:14px!important} #s4d-app .s4d-billing-stats span{font-size:9px!important} #s4d-app .s4d-statement{padding:0!important;border:0!important;margin:0!important} #s4d-app .s4d-statement>.s4d-top{margin:0 0 8px!important} #s4d-app .s4d-statement>.s4d-top .s4d-kicker{display:none!important} #s4d-app .s4d-statement>.s4d-top h2{font-size:14px!important;margin:0!important} #s4d-app .s4d-statement-table-wrap{overflow:visible!important;margin:0!important} #s4d-app .s4d-statement-table{min-width:0!important;width:100%!important;font-size:9px!important;table-layout:fixed} #s4d-app .s4d-statement-table thead{display:table-header-group} #s4d-app .s4d-statement-table tr{break-inside:avoid} #s4d-app .s4d-statement-table th{background:#3e4b45!important;color:#fff!important;padding:7px 6px!important;border-color:#3e4b45!important;-webkit-print-color-adjust:exact;print-color-adjust:exact} #s4d-app .s4d-statement-table td{padding:7px 6px!important;border-color:#dedbd3!important} #s4d-app .s4d-statement-table th:nth-child(1),#s4d-app .s4d-statement-table td:nth-child(1){width:10%} #s4d-app .s4d-statement-table th:nth-child(2),#s4d-app .s4d-statement-table td:nth-child(2){width:24%} #s4d-app .s4d-statement-table th:nth-child(3),#s4d-app .s4d-statement-table td:nth-child(3){width:24%} #s4d-app .s4d-statement-table th:nth-child(4),#s4d-app .s4d-statement-table td:nth-child(4),#s4d-app .s4d-statement-table th:nth-child(5),#s4d-app .s4d-statement-table td:nth-child(5),#s4d-app .s4d-statement-table th:nth-child(6),#s4d-app .s4d-statement-table td:nth-child(6){width:14%} #s4d-app .s4d-print-footer{display:block!important;margin-top:14px;padding-top:8px;border-top:1px solid #dedbd3;text-align:center;font-size:8px;color:#777} } /* v0.9.0 · Client account and WhatsApp sign-in. */ #s4d-app .s4d-inline-contact{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-height:42px;padding:10px 12px;border:1px solid var(--s4d-line);border-radius:10px;background:rgba(255,255,255,.5)} #s4d-app .s4d-inline-contact strong{font-variant-numeric:tabular-nums;overflow-wrap:anywhere} #s4d-app .s4d-auth small{display:block;margin:-4px 0 12px;opacity:.7} #s4d-app .s4d-auth-help{display:inline-block;margin-top:4px;font-size:10px;line-height:1.4;opacity:.62;text-decoration:none} #s4d-app .s4d-auth-help:hover{opacity:1;text-decoration:underline} /* v0.9.3 — simplified WhatsApp entry and account controls */ #s4d-app .s4d-phone-input{display:grid;grid-template-columns:minmax(105px,135px) minmax(0,1fr);gap:12px;align-items:end} #s4d-app .s4d-phone-input .s4d-field{margin-bottom:8px} #s4d-app .s4d-dial-field input{direction:ltr;text-align:left} #s4d-app .s4d-signout{appearance:none;border:0;background:transparent;color:inherit;padding:0;text-align:start;font:inherit;font-size:12px;text-decoration:underline;cursor:pointer;opacity:.78;box-shadow:none;text-transform:none} #s4d-app .s4d-signout:hover{opacity:1;color:var(--s4d-accent)} #s4d-app .s4d-badge.is-danger{border-color:#a23a35;color:#8b2e2a;background:#a23a3510} #s4d-app .s4d-client-project-create>summary{cursor:pointer;padding-block:4px} #s4d-app .s4d-client-project-create[open]>summary{margin-bottom:16px} @media(max-width:560px){#s4d-app .s4d-phone-input{grid-template-columns:110px minmax(0,1fr);gap:8px}} /* v0.9.4 · live counters, logical sidebar alignment and desktop statement fit. */ #s4d-app .s4d-signout{justify-self:start;align-self:start;width:max-content;max-width:100%;margin-inline:0 auto;text-align:start!important} #s4d-app .s4d-project-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap} @media(min-width:821px){ #s4d-app .s4d-statement-table-wrap{overflow-x:visible} #s4d-app .s4d-statement-table{min-width:0;table-layout:fixed} #s4d-app .s4d-statement-table th{white-space:normal;overflow-wrap:anywhere} #s4d-app .s4d-statement-table td{min-width:0;overflow-wrap:anywhere} #s4d-app .s4d-statement-description,#s4d-app .s4d-statement-note{min-width:0;max-width:none} #s4d-app .s4d-statement-table th:nth-child(1),#s4d-app .s4d-statement-table td:nth-child(1){width:12%} #s4d-app .s4d-statement-table th:nth-child(2),#s4d-app .s4d-statement-table td:nth-child(2){width:23%} #s4d-app .s4d-statement-table th:nth-child(3),#s4d-app .s4d-statement-table td:nth-child(3){width:23%} #s4d-app .s4d-statement-table th:nth-child(4),#s4d-app .s4d-statement-table td:nth-child(4),#s4d-app .s4d-statement-table th:nth-child(5),#s4d-app .s4d-statement-table td:nth-child(5),#s4d-app .s4d-statement-table th:nth-child(6),#s4d-app .s4d-statement-table td:nth-child(6){width:14%} } @media print{ #s4d-app .s4d-print-brand{min-width:190px!important} #s4d-app .s4d-print-brand img{width:auto!important;max-width:185px!important;max-height:62px!important;object-fit:contain!important} } /* v0.9.5 · per-project unread message badges. */ #s4d-app .s4d-project-card-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap} #s4d-app .s4d-project-unread{margin-inline-start:0;flex:0 0 auto} /* v0.9.6 · split admin message counters and clearer chat mode selection. */ #s4d-app .s4d-reply-toggle [aria-pressed=true]{background:color-mix(in srgb,var(--s4d-accent) 15%,var(--s4d-surface));color:var(--s4d-text);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--s4d-accent) 22%,var(--s4d-line));font-weight:700} #s4d-app .s4d-reply-toggle [aria-pressed=false]{opacity:.78} #s4d-app .s4d-start-block{min-width:0;cursor:pointer}#s4d-app .s4d-start-block:focus-visible{outline:2px solid var(--s4d-accent);outline-offset:4px} @media(max-width:780px){#s4d-app .s4d-project-choice-grid{grid-template-columns:1fr}#s4d-app .s4d-choice-card{grid-template-columns:78px minmax(0,1fr) auto;gap:14px;min-height:180px;padding:22px}#s4d-app .s4d-choice-copy{grid-template-columns:1fr;gap:8px}#s4d-app .s4d-choice-copy strong{font-size:24px}} /* v0.9.14 · final polish before WhatsApp notifications. */ #s4d-app .s4d-session-user{display:flex;align-items:center;gap:8px;min-width:0}#s4d-app .s4d-session-user .s4d-icon{width:16px;height:16px;opacity:.75}#s4d-app .s4d-session-user [data-session-name]{min-width:0;overflow-wrap:anywhere}#s4d-app .s4d-live-voice{animation:none!important} /* v0.10.0 · WhatsApp notification engine foundation. */ #s4d-app .s4d-whatsapp-custom{scroll-margin-top:20px} #s4d-app .s4d-record details{margin:8px 0} #s4d-app .s4d-record details .s4d-pre{margin:8px 0 0;font-size:12px} #s4d-app .s4d-error-text{display:block;margin-top:6px;color:#b42318} /* v0.10.1 · one-click manual WhatsApp notices with a 15-minute undo window. */ #s4d-app .s4d-wa-control{display:grid;gap:7px;min-width:0} #s4d-app .s4d-wa-control>.s4d-actions{margin:7px 0 0;gap:7px} #s4d-app .s4d-wa-control .s4d-btn{min-height:34px;padding:7px 10px;font-size:11px} #s4d-app .s4d-wa-history{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:11px;color:var(--s4d-muted)} #s4d-app .s4d-wa-history>[data-wa-cancel-wrap]{display:flex;align-items:center;gap:7px;flex-wrap:wrap} #s4d-app .s4d-wa-history small{display:inline-flex;align-items:center;gap:4px;margin:0;font-size:10px} #s4d-app .s4d-wa-history b,#s4d-app [data-wa-countdown]{font-variant-numeric:tabular-nums} #s4d-app .s4d-wa-missing{display:block;margin-top:3px;color:var(--s4d-muted);font-size:10px} #s4d-app .s4d-wa-undo-panel{display:grid;gap:9px;margin:0 7px 13px;padding:10px;border:1px solid color-mix(in srgb,var(--s4d-accent) 40%,var(--s4d-line));border-radius:12px;background:color-mix(in srgb,var(--s4d-accent) 8%,var(--s4d-surface));min-width:0} #s4d-app .s4d-wa-undo-panel[hidden]{display:none!important} #s4d-app .s4d-wa-undo-head{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px} #s4d-app .s4d-wa-undo-head strong{min-width:0} #s4d-app .s4d-wa-undo-head em{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--s4d-accent);color:#fff;font-style:normal;font-size:10px;font-weight:800} #s4d-app .s4d-wa-undo-list{display:grid;gap:7px} #s4d-app .s4d-wa-undo-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 9px;padding-top:7px;border-top:1px solid color-mix(in srgb,var(--s4d-line) 80%,transparent);min-width:0} #s4d-app .s4d-wa-undo-row:first-child{padding-top:0;border-top:0} #s4d-app .s4d-wa-undo-row>div{min-width:0} #s4d-app .s4d-wa-undo-row strong{display:block;overflow-wrap:anywhere;font-size:10px;line-height:1.35} #s4d-app .s4d-wa-undo-row small{display:block;margin-top:2px;font-size:9px;line-height:1.35;color:var(--s4d-muted);overflow-wrap:anywhere} #s4d-app .s4d-wa-undo-row>b{align-self:start;white-space:nowrap;font-size:11px} #s4d-app .s4d-wa-undo-row>a{grid-column:1/-1;width:max-content;max-width:100%;font-size:9px;color:var(--s4d-accent);text-decoration:underline;text-underline-offset:2px} #s4d-app .s4d-message-content>.s4d-wa-control,#s4d-app .s4d-agreement-payment .s4d-wa-control,#s4d-app .s4d-statement-description .s4d-wa-control{margin-top:8px} #s4d-app .s4d-statement-description .s4d-wa-control .s4d-actions{justify-content:flex-start} @media(max-width:820px){#s4d-app .s4d-wa-undo-panel{margin:8px 0 12px}#s4d-app .s4d-wa-history{align-items:flex-start}} @media print{#s4d-app .s4d-wa-control,#s4d-app .s4d-wa-undo-panel{display:none!important}} /* v0.10.2 — centralized manual WhatsApp notifications */ #s4d-app .s4d-client-notification{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,340px);gap:22px;align-items:start;padding:18px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);background:var(--s4d-surface)} #s4d-app .s4d-client-notification-main{min-width:0} #s4d-app .s4d-notification-client{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;margin-bottom:10px} #s4d-app .s4d-notification-client>strong{font-size:14px} #s4d-app .s4d-notification-client>span,#s4d-app .s4d-notification-client>small{font-size:11px;opacity:.72} #s4d-app .s4d-notification-wa{display:grid;gap:9px;padding:13px;border:1px solid var(--s4d-line);border-radius:12px;background:var(--s4d-soft);min-width:0} #s4d-app .s4d-notification-wa.is-disabled{opacity:.82} #s4d-app .s4d-notification-wa .s4d-actions{margin:0;gap:8px} #s4d-app .s4d-notification-wa .s4d-btn{min-height:36px;padding:8px 11px;font-size:11px} #s4d-app .s4d-wa-language{display:grid;grid-template-columns:auto minmax(110px,1fr);gap:10px;align-items:center;font-size:11px;font-weight:600} #s4d-app .s4d-wa-language select{width:100%;min-width:0} #s4d-app .s4d-notification-whatsapp-mark{display:inline-flex;align-items:center;gap:5px;margin-top:9px;padding:5px 9px;border:1px solid var(--s4d-line);border-radius:999px;background:var(--s4d-soft);font-size:11px;font-weight:600} #s4d-app .s4d-statement-logo-setting{display:flex;align-items:center;gap:18px;flex-wrap:wrap} #s4d-app .s4d-statement-logo-preview{display:grid;place-items:center;width:min(280px,100%);min-height:110px;padding:14px;border:1px dashed var(--s4d-line);border-radius:var(--s4d-radius);background:var(--s4d-soft)} #s4d-app .s4d-statement-logo-preview img{display:block;max-width:240px;max-height:90px;object-fit:contain} #s4d-app .s4d-statement-logo-preview .s4d-empty{width:100%;padding:20px 10px;border:0} #s4d-app .s4d-switch{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;white-space:nowrap} #s4d-app .s4d-project-card-actions{display:flex;align-items:center;gap:9px;flex:0 0 auto;padding:10px 0} #s4d-app .s4d-project-card-actions>.s4d-btn{min-width:138px;margin:0} #s4d-app .s4d-project-delete-mini{appearance:none;border:0;background:transparent;color:inherit;opacity:.58;font:inherit;font-size:10px;line-height:1;padding:5px 3px;cursor:pointer;text-decoration:underline;text-underline-offset:2px} #s4d-app .s4d-project-delete-mini:hover{opacity:1} @media(max-width:760px){#s4d-app .s4d-client-notification{grid-template-columns:1fr;padding:14px}#s4d-app .s4d-project{align-items:stretch;flex-wrap:wrap;padding-inline-end:8px}#s4d-app .s4d-project-card-actions{width:100%;padding:0 8px 8px}#s4d-app .s4d-project-card-actions>.s4d-btn{flex:1;min-width:0}#s4d-app .s4d-statement-logo-setting{align-items:stretch}} @media print{#s4d-app .s4d-notification-wa,#s4d-app .s4d-notification-whatsapp-mark,#s4d-app .s4d-project-card-actions{display:none!important}} /* v0.10.3 — flexible customer WhatsApp notice composer. */ #s4d-app .s4d-wa-undo-actions{grid-column:1/-1;display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:2px} #s4d-app .s4d-wa-undo-actions>a{width:max-content;max-width:100%;font-size:9px;color:var(--s4d-accent);text-decoration:underline;text-underline-offset:2px;margin-inline-end:auto} #s4d-app .s4d-wa-undo-actions .s4d-btn{min-height:28px;padding:4px 7px;font-size:9px;margin:0} #s4d-app .s4d-project-card-actions{display:grid;grid-template-columns:minmax(138px,1fr);justify-items:stretch;gap:3px;align-content:center} #s4d-app .s4d-project-card-actions>.s4d-btn{width:100%;min-width:138px} #s4d-app .s4d-project-delete-mini{display:inline-flex;align-items:center;justify-content:center;gap:4px;width:max-content;justify-self:center;text-decoration:none;padding:3px 5px;font-size:9px} #s4d-app .s4d-project-delete-mini .s4d-icon{width:12px;height:12px} @media(max-width:760px){#s4d-app .s4d-project-card-actions{grid-template-columns:1fr}#s4d-app .s4d-project-delete-mini{justify-self:center}} /* v0.10.4 — keep the main project action geometrically centered; deletion stays below it. */ #s4d-app .s4d-project-card-actions{position:relative;display:block;align-self:stretch;min-width:138px;min-height:78px;padding:0;margin:0} #s4d-app .s4d-project-card-actions>.s4d-project-open-cta{position:absolute;inset-inline:0;top:50%;transform:translateY(-50%);width:100%;min-width:138px;margin:0;background:var(--btn-accented-bgcolor,var(--wd-primary-color,var(--s4d-accent)))!important;color:var(--btn-accented-color,#fff)!important;border-color:var(--btn-accented-bgcolor,var(--wd-primary-color,var(--s4d-accent)))!important} #s4d-app .s4d-project-card-actions>.s4d-project-open-cta:hover{background:var(--btn-accented-bgcolor-hover,var(--wd-primary-color,var(--s4d-accent)))!important;color:var(--btn-accented-color-hover,var(--btn-accented-color,#fff))!important} #s4d-app .s4d-project-card-actions>.s4d-project-delete-mini{position:absolute;inset-inline-start:50%;top:calc(50% + 27px);transform:translateX(-50%);margin:0;white-space:nowrap} @media(max-width:760px){#s4d-app .s4d-project-card-actions{width:100%;min-height:78px;padding:0 8px}#s4d-app .s4d-project-card-actions>.s4d-project-open-cta{inset-inline:8px;width:auto;min-width:0}#s4d-app .s4d-project-card-actions>.s4d-project-delete-mini{top:calc(50% + 26px)}} /* v0.11.0 — interactive preview rounds and image-anchored review notes. */ #s4d-app .s4d-preview-last-action{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px 14px;margin:0 0 18px;padding:12px 15px;border:1px solid var(--s4d-line);border-inline-start:3px solid var(--s4d-accent);border-radius:var(--s4d-radius);background:var(--s4d-soft);font-size:12px} #s4d-app .s4d-preview-last-action>span,#s4d-app .s4d-preview-last-action>time{opacity:.72;font-size:11px} #s4d-app .s4d-preview-card.is-draft{border-style:dashed} #s4d-app .s4d-preview-card.is-current{border-inline-start:3px solid var(--s4d-accent)} #s4d-app .s4d-preview-meta-form,#s4d-app .s4d-preview-upload,#s4d-app .s4d-preview-publish,#s4d-app .s4d-preview-client-actions,#s4d-app .s4d-preview-notes-summary{margin-top:20px;padding-top:18px;border-top:1px solid var(--s4d-line)} #s4d-app .s4d-preview-meta-form>.s4d-btn,#s4d-app .s4d-preview-upload>.s4d-btn{margin-top:4px} #s4d-app .s4d-preview-studio-note{margin:18px 0;padding:14px 16px;border-inline-start:3px solid var(--s4d-accent);background:var(--s4d-soft);border-radius:0 var(--s4d-radius) var(--s4d-radius) 0} #s4d-app .s4d-preview-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px;margin:20px 0} #s4d-app .s4d-preview-asset{display:flex;flex-direction:column;min-width:0;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);overflow:hidden;background:var(--s4d-surface)} #s4d-app .s4d-preview-thumb{position:relative;display:block;width:100%;aspect-ratio:4/3;padding:0;border:0;background:var(--s4d-soft);box-shadow:none;overflow:hidden} #s4d-app .s4d-preview-thumb img{display:block;width:100%;height:100%;object-fit:contain;background:color-mix(in srgb,var(--s4d-text) 4%,var(--s4d-surface))} #s4d-app .s4d-preview-thumb:hover img{transform:scale(1.01)} #s4d-app .s4d-preview-note-count{position:absolute;inset-block-start:9px;inset-inline-end:9px;display:grid;place-items:center;min-width:30px;height:30px;padding:0 8px;border-radius:999px;background:var(--s4d-accent);color:#fff;font-size:10px;font-weight:800;box-shadow:0 1px 8px rgba(0,0,0,.12)} #s4d-app .s4d-preview-file-visual{display:grid;place-items:center;aspect-ratio:4/3;background:var(--s4d-soft);color:var(--s4d-accent)} #s4d-app .s4d-preview-file-visual .s4d-icon{width:38px;height:38px} #s4d-app .s4d-preview-asset-meta{display:grid;gap:7px;padding:13px;min-width:0} #s4d-app .s4d-preview-asset-meta>strong{overflow-wrap:anywhere} #s4d-app .s4d-preview-asset-meta>small{font-size:10px;opacity:.68} #s4d-app .s4d-preview-asset-meta .s4d-actions{margin:4px 0 0;gap:7px} #s4d-app .s4d-preview-asset-meta .s4d-btn{font-size:10px;min-height:32px;padding:6px 9px} #s4d-app .s4d-preview-order{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding-top:8px;border-top:1px dashed var(--s4d-line)} #s4d-app .s4d-preview-order>button:not(.s4d-btn){display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--s4d-line);border-radius:8px;background:var(--s4d-surface);color:inherit;font:inherit} #s4d-app .s4d-preview-order .s4d-btn{margin-inline-start:auto} #s4d-app .s4d-preview-client-actions>div:first-child{display:flex;gap:10px;flex-wrap:wrap} #s4d-app .s4d-preview-client-actions form{margin-top:14px} #s4d-app .s4d-preview-history{margin-top:28px} #s4d-app .s4d-preview-history>h2{margin:0 0 14px} #s4d-app .s4d-preview-history-item>summary{display:flex;align-items:center;justify-content:space-between;gap:12px} #s4d-app .s4d-preview-history-item>.s4d-preview-card{border:0;padding:18px 0 0;margin:0} #s4d-app .s4d-preview-notes-summary{display:grid;gap:10px} #s4d-app .s4d-preview-summary-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:10px} #s4d-app .s4d-preview-note{display:grid;gap:8px;padding:13px;border:1px solid var(--s4d-line);border-radius:12px;background:var(--s4d-surface);min-width:0} #s4d-app .s4d-preview-note.is-draft{border-style:dashed;background:var(--s4d-soft)} #s4d-app .s4d-preview-note.is-resolved{opacity:.64} #s4d-app .s4d-preview-note p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.6} #s4d-app .s4d-preview-note>small{font-size:10px;opacity:.65} #s4d-app .s4d-preview-note-head{display:flex;align-items:center;justify-content:space-between;gap:10px} #s4d-app .s4d-preview-note-head>strong{font-size:12px} #s4d-app .s4d-preview-note-head>span{font-size:9px;text-transform:uppercase;letter-spacing:.5px;opacity:.68} #s4d-app .s4d-preview-reference-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:7px} #s4d-app .s4d-preview-ref{display:block;aspect-ratio:1;border:1px solid var(--s4d-line);border-radius:9px;overflow:hidden;background:var(--s4d-soft)} #s4d-app .s4d-preview-ref img{display:block;width:100%;height:100%;object-fit:cover} #s4d-app .s4d-preview-note-actions{display:flex;gap:7px;flex-wrap:wrap} #s4d-app .s4d-preview-note-actions .s4d-btn,#s4d-app .s4d-preview-note>.s4d-btn{font-size:10px;min-height:31px;padding:6px 9px;justify-self:start} #s4d-app .s4d-preview-viewer{position:fixed;inset:0;z-index:999999;display:flex;flex-direction:column;background:color-mix(in srgb,var(--s4d-text) 92%,transparent);color:#fff;overscroll-behavior:contain} #s4d-app .s4d-preview-viewer-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 60px 10px 14px;background:color-mix(in srgb,var(--s4d-text) 96%,transparent);border-bottom:1px solid rgba(255,255,255,.16);min-width:0} #s4d-app .s4d-preview-viewer-head>div:first-child{display:grid;gap:2px;min-width:0} #s4d-app .s4d-preview-viewer-head strong{font-size:12px} #s4d-app .s4d-preview-viewer-head span{font-size:10px;opacity:.7;overflow-wrap:anywhere} #s4d-app .s4d-preview-viewer-tools{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap} #s4d-app .s4d-preview-viewer-tools>button:not(.s4d-btn),#s4d-app .s4d-preview-viewer-close{display:grid;place-items:center;min-width:36px;height:36px;padding:0 9px;border:1px solid rgba(255,255,255,.25);border-radius:9px;background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:12px;box-shadow:none} #s4d-app .s4d-preview-viewer-tools .s4d-btn,#s4d-app .s4d-preview-viewer-tools>a.s4d-btn{min-height:36px;padding:7px 10px;font-size:10px;background:#fff!important;color:#222!important;border-color:#fff!important} #s4d-app .s4d-preview-viewer-close{position:absolute!important;top:10px;right:12px;z-index:20;display:grid!important;place-items:center!important;width:40px!important;min-width:40px!important;height:40px!important;padding:0!important;border:1px solid rgba(255,255,255,.35)!important;border-radius:10px!important;background:rgba(0,0,0,.35)!important;color:#fff!important;font:400 25px/1 sans-serif!important;box-shadow:0 2px 12px rgba(0,0,0,.22)!important} #s4d-app .s4d-preview-image-error{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);max-width:min(420px,80%);padding:12px 16px;border-radius:10px;background:rgba(0,0,0,.72);color:#fff;text-align:center;font-size:12px;line-height:1.5;z-index:8} #s4d-app .s4d-preview-viewer-tools [data-action="preview-note-mode"]{order:-1;font-weight:800} #s4d-app .s4d-preview-viewer-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);flex:1;min-height:0} #s4d-app .s4d-preview-canvas{position:relative;display:grid;place-items:center;min-width:0;min-height:0;overflow:hidden;padding:20px;touch-action:none;user-select:none} #s4d-app .s4d-preview-canvas.is-note-mode{cursor:crosshair} #s4d-app .s4d-preview-stage{position:relative;display:inline-block;max-width:100%;max-height:100%;transform-origin:center center;will-change:transform;cursor:grab} #s4d-app .s4d-preview-canvas.is-note-mode .s4d-preview-stage{cursor:crosshair} #s4d-app .s4d-preview-stage img{display:block;max-width:100%;max-height:calc(100vh - 112px);width:auto;height:auto;object-fit:contain;pointer-events:none;user-select:none} #s4d-app .s4d-preview-pin{position:absolute;z-index:4;display:grid;place-items:center;width:28px;height:28px;padding:0;border:2px solid #fff;border-radius:50%;background:var(--s4d-accent);color:#fff;font:700 11px/1 inherit;box-shadow:0 2px 10px rgba(0,0,0,.35);transform:translate(-50%,-50%) scale(var(--preview-inv-scale,1));transform-origin:center;transition:filter .12s ease,opacity .12s ease} #s4d-app .s4d-preview-pin.is-resolved{opacity:.48} #s4d-app .s4d-preview-pin.is-active{filter:brightness(1.35);outline:3px solid rgba(255,255,255,.65);outline-offset:2px} #s4d-app .s4d-preview-note-hint{position:absolute;inset-block-end:14px;inset-inline-start:50%;transform:translateX(-50%);padding:8px 11px;border-radius:999px;background:rgba(0,0,0,.66);color:#fff;font-size:10px;pointer-events:none;white-space:nowrap} #s4d-app .s4d-preview-note-panel{min-width:0;overflow-y:auto;padding:15px;background:var(--s4d-surface);color:var(--s4d-text);border-inline-start:1px solid var(--s4d-line);overscroll-behavior:contain} #s4d-app .s4d-preview-note-panel>.s4d-top{position:sticky;top:-15px;z-index:2;padding:12px 0;background:var(--s4d-surface)} #s4d-app .s4d-preview-note-panel h2{margin:0;font-size:17px} #s4d-app .s4d-preview-note-list{display:grid;gap:9px} #s4d-app .s4d-preview-new-note{margin:0 0 12px;padding:12px;border:1px solid var(--s4d-accent);border-radius:12px;background:var(--s4d-soft)} #s4d-app .s4d-preview-new-note h3{margin:0 0 8px;font-size:14px} #s4d-app .s4d-preview-new-note .s4d-field{margin:10px 0} #s4d-app .s4d-preview-new-note .s4d-actions{margin:10px 0 0} @media(max-width:900px){ #s4d-app .s4d-preview-viewer-body{grid-template-columns:1fr;grid-template-rows:minmax(300px,62vh) auto;overflow-y:auto} #s4d-app .s4d-preview-note-panel{overflow:visible;border-inline-start:0;border-top:1px solid var(--s4d-line)} #s4d-app .s4d-preview-note-panel>.s4d-top{position:static;padding-top:0} #s4d-app .s4d-preview-stage img{max-height:58vh} } @media(max-width:620px){ #s4d-app .s4d-preview-last-action{grid-template-columns:1fr auto}#s4d-app .s4d-preview-last-action>span{grid-column:1/-1} #s4d-app .s4d-preview-gallery{grid-template-columns:1fr 1fr;gap:10px} #s4d-app .s4d-preview-asset-meta{padding:10px}#s4d-app .s4d-preview-asset-meta .s4d-actions{align-items:stretch;flex-direction:column}#s4d-app .s4d-preview-asset-meta .s4d-btn{width:100%} #s4d-app .s4d-preview-summary-row{grid-template-columns:1fr} #s4d-app .s4d-preview-viewer-head{align-items:flex-start;flex-direction:column;padding:8px 58px 8px 10px} #s4d-app .s4d-preview-viewer-tools{width:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px} #s4d-app .s4d-preview-viewer-tools>*{flex:0 0 auto} #s4d-app .s4d-preview-viewer-body{grid-template-rows:minmax(260px,55vh) auto} #s4d-app .s4d-preview-canvas{padding:8px} #s4d-app .s4d-preview-stage img{max-height:52vh} #s4d-app .s4d-preview-note-panel{padding:12px} #s4d-app .s4d-preview-client-actions>div:first-child{align-items:stretch;flex-direction:column}#s4d-app .s4d-preview-client-actions>div:first-child>.s4d-btn{width:100%} } @media(max-width:400px){#s4d-app .s4d-preview-gallery{grid-template-columns:1fr}} #s4d-app .s4d-preview-note-filter{margin:0;gap:6px;justify-content:flex-end} #s4d-app .s4d-preview-note-filter .s4d-btn{min-height:29px;padding:5px 8px;font-size:9px} /* v0.11.3 — focused preview annotations: point + selectable area; note replies removed. */ #s4d-app .s4d-preview-decision-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px} #s4d-app .s4d-preview-admin-actions{margin-top:18px;padding-top:16px;border-top:1px dashed var(--s4d-line)} #s4d-app .s4d-preview-card.is-withdrawn{opacity:.78;border-style:dashed} #s4d-app .s4d-preview-customer-view-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;padding:12px 14px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);background:var(--s4d-soft)} @media(max-width:620px){#s4d-app .s4d-preview-decision-actions{align-items:stretch;flex-direction:column}#s4d-app .s4d-preview-decision-actions>.s4d-btn{width:100%}#s4d-app .s4d-preview-customer-view-head{align-items:stretch;flex-direction:column}} body>.s4d-preview-viewer{position:fixed!important;inset:0!important;z-index:2147483000!important;display:flex!important;flex-direction:column!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important;background:color-mix(in srgb,var(--s4d-text,#29312c) 94%,transparent)!important;color:#fff!important;font:inherit!important;overscroll-behavior:contain!important;isolation:isolate!important} body>.s4d-preview-viewer *{box-sizing:border-box} body>.s4d-preview-viewer [hidden]{display:none!important} body>.s4d-preview-viewer button{cursor:pointer;font:inherit;text-transform:none} body>.s4d-preview-viewer button:disabled{opacity:.42;cursor:not-allowed} body>.s4d-preview-viewer :is(button,a,input,textarea):focus-visible{outline:2px solid var(--s4d-accent,#8f9b72);outline-offset:2px} body>.s4d-preview-viewer .s4d-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:8px 11px;border:1px solid var(--s4d-accent,#8f9b72);border-radius:9px;background:var(--s4d-accent,#8f9b72);color:#fff;text-decoration:none;box-shadow:none;font-size:11px;font-weight:600;line-height:1.2} body>.s4d-preview-viewer .s4d-btn.secondary{background:var(--s4d-surface,#fff);color:var(--s4d-text,#29312c);border-color:var(--s4d-line,#ddd)} body>.s4d-preview-viewer .s4d-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:10px 0} body>.s4d-preview-viewer .s4d-small{font-size:11px;line-height:1.5;opacity:.76} body>.s4d-preview-viewer .s4d-badge{display:inline-flex;align-items:center;border:1px solid var(--s4d-line,#ddd);border-radius:999px;padding:5px 9px;background:var(--s4d-soft,#f3f5f2);color:var(--s4d-text,#29312c);font-size:10px} body>.s4d-preview-viewer .s4d-field{display:grid;gap:7px;margin:10px 0;color:var(--s4d-text,#29312c);font-size:12px;font-weight:600} body>.s4d-preview-viewer .s4d-field :is(input,textarea){width:100%;min-width:0;max-width:100%;padding:10px 11px;border:1px solid var(--s4d-line,#ddd);border-radius:9px;background:var(--s4d-surface,#fff);color:var(--s4d-text,#29312c);font:inherit;font-size:13px} body>.s4d-preview-viewer .s4d-field textarea{min-height:100px;resize:vertical} body>.s4d-preview-viewer .s4d-preview-viewer-close{position:fixed!important;top:12px!important;right:14px!important;z-index:2147483640!important;display:grid!important;place-items:center!important;width:44px!important;min-width:44px!important;height:44px!important;padding:0!important;margin:0!important;border:2px solid rgba(255,255,255,.72)!important;border-radius:12px!important;background:#1d211f!important;color:#fff!important;font:400 29px/1 sans-serif!important;box-shadow:0 5px 24px rgba(0,0,0,.38)!important;opacity:1!important;visibility:visible!important} body>.s4d-preview-viewer .s4d-preview-viewer-head{display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0;min-height:64px;padding:10px 72px 10px 14px;background:rgba(22,27,24,.97);border-bottom:1px solid rgba(255,255,255,.18);flex:0 0 auto} body>.s4d-preview-viewer .s4d-preview-viewer-head>div:first-child{display:grid;gap:2px;min-width:0} body>.s4d-preview-viewer .s4d-preview-viewer-head strong{font-size:13px;color:#fff} body>.s4d-preview-viewer .s4d-preview-viewer-head span{font-size:10px;opacity:.72;overflow-wrap:anywhere;color:#fff} body>.s4d-preview-viewer .s4d-preview-viewer-tools{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;min-width:0} body>.s4d-preview-viewer .s4d-preview-viewer-tools>button:not(.s4d-btn){display:grid;place-items:center;min-width:38px;height:38px;padding:0 10px;border:1px solid rgba(255,255,255,.3);border-radius:9px;background:rgba(255,255,255,.1);color:#fff;box-shadow:none;font-size:12px} body>.s4d-preview-viewer .s4d-preview-viewer-tools .s4d-btn,body>.s4d-preview-viewer .s4d-preview-viewer-tools>a.s4d-btn{min-height:38px;padding:8px 11px;background:#fff!important;color:#222!important;border-color:#fff!important} body>.s4d-preview-viewer .s4d-preview-viewer-tools [data-action="preview-note-mode"]{order:-1;background:var(--s4d-accent,#8f9b72)!important;color:#fff!important;border-color:var(--s4d-accent,#8f9b72)!important;font-weight:800} body>.s4d-preview-viewer .s4d-preview-viewer-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,380px);flex:1;min-height:0;overflow:hidden} body>.s4d-preview-viewer .s4d-preview-canvas{position:relative;display:grid;place-items:center;min-width:0;min-height:0;overflow:hidden;padding:22px;touch-action:none;user-select:none;background:rgba(13,16,14,.62)} body>.s4d-preview-viewer .s4d-preview-canvas.is-note-mode{cursor:crosshair} body>.s4d-preview-viewer .s4d-preview-stage{position:relative;display:inline-block;max-width:100%;max-height:100%;transform-origin:center center;will-change:transform;cursor:grab} body>.s4d-preview-viewer .s4d-preview-canvas.is-note-mode .s4d-preview-stage{cursor:crosshair} body>.s4d-preview-viewer .s4d-preview-stage img{display:block;max-width:100%;max-height:calc(100vh - 94px);width:auto;height:auto;object-fit:contain;pointer-events:none;user-select:none} body>.s4d-preview-viewer .s4d-preview-pin{position:absolute;z-index:4;display:grid;place-items:center;width:30px;height:30px;padding:0;border:2px solid #fff;border-radius:50%;background:var(--s4d-accent,#8f9b72);color:#fff;font:700 11px/1 inherit;box-shadow:0 2px 12px rgba(0,0,0,.42);transform:translate(-50%,-50%) scale(var(--preview-inv-scale,1));transform-origin:center;transition:filter .12s ease,opacity .12s ease} body>.s4d-preview-viewer .s4d-preview-pin.is-resolved{opacity:.45} body>.s4d-preview-viewer .s4d-preview-pin.is-draft{border-style:dashed} body>.s4d-preview-viewer .s4d-preview-pin.is-active{filter:brightness(1.3);outline:3px solid rgba(255,255,255,.7);outline-offset:2px} body>.s4d-preview-viewer .s4d-preview-pin.is-pending{z-index:7;width:34px;height:34px;background:#fff;color:var(--s4d-accent,#8f9b72);border:3px solid var(--s4d-accent,#8f9b72);box-shadow:0 0 0 5px rgba(255,255,255,.35),0 3px 16px rgba(0,0,0,.45);cursor:move;pointer-events:auto;animation:s4d-preview-pulse 1.2s ease-in-out infinite alternate} body>.s4d-preview-viewer .s4d-preview-area{position:absolute;z-index:3;display:block;padding:0;border:2px solid var(--s4d-accent,#8f9b72);border-radius:5px;background:color-mix(in srgb,var(--s4d-accent,#8f9b72) 18%,transparent);box-shadow:0 0 0 1px rgba(255,255,255,.72) inset,0 2px 10px rgba(0,0,0,.24);cursor:pointer;pointer-events:auto;transition:filter .12s ease,opacity .12s ease} body>.s4d-preview-viewer .s4d-preview-area>span{position:absolute;top:-13px;left:-13px;display:grid;place-items:center;width:27px;height:27px;border:2px solid #fff;border-radius:50%;background:var(--s4d-accent,#8f9b72);color:#fff;font:700 10px/1 sans-serif;box-shadow:0 2px 10px rgba(0,0,0,.35);transform:scale(var(--preview-inv-scale,1));transform-origin:center} body>.s4d-preview-viewer .s4d-preview-area.is-resolved{opacity:.42} body>.s4d-preview-viewer .s4d-preview-area.is-draft{border-style:dashed} body>.s4d-preview-viewer .s4d-preview-area.is-active{filter:brightness(1.3);outline:3px solid rgba(255,255,255,.72);outline-offset:2px} body>.s4d-preview-viewer .s4d-preview-area.is-pending{z-index:7;border-width:3px;border-style:solid;background:color-mix(in srgb,var(--s4d-accent,#8f9b72) 24%,transparent);box-shadow:0 0 0 3px rgba(255,255,255,.28),0 4px 18px rgba(0,0,0,.38);cursor:move;animation:s4d-preview-pulse 1.2s ease-in-out infinite alternate} body>.s4d-preview-viewer .s4d-preview-area.is-drawing{pointer-events:none;animation:none} body>.s4d-preview-viewer .s4d-preview-area [data-area-handle]{position:absolute;z-index:2;width:14px;height:14px;border:2px solid #fff;border-radius:50%;background:var(--s4d-accent,#8f9b72);box-shadow:0 1px 5px rgba(0,0,0,.35);transform:scale(var(--preview-inv-scale,1));transform-origin:center;pointer-events:auto} body>.s4d-preview-viewer .s4d-preview-area [data-area-handle="nw"]{left:-7px;top:-7px;cursor:nwse-resize} body>.s4d-preview-viewer .s4d-preview-area [data-area-handle="ne"]{right:-7px;top:-7px;cursor:nesw-resize} body>.s4d-preview-viewer .s4d-preview-area [data-area-handle="sw"]{left:-7px;bottom:-7px;cursor:nesw-resize} body>.s4d-preview-viewer .s4d-preview-area [data-area-handle="se"]{right:-7px;bottom:-7px;cursor:nwse-resize} @keyframes s4d-preview-pulse{from{filter:brightness(1)}to{filter:brightness(1.15)}} body>.s4d-preview-viewer .s4d-preview-note-hint{position:absolute;inset-block-end:16px;inset-inline-start:50%;z-index:10;transform:translateX(-50%);padding:9px 13px;border-radius:999px;background:rgba(0,0,0,.76);color:#fff;font-size:11px;pointer-events:none;white-space:nowrap} body>.s4d-preview-viewer .s4d-preview-note-panel{min-width:0;overflow-y:auto;padding:16px;background:var(--s4d-surface,#fff);color:var(--s4d-text,#29312c);border-inline-start:1px solid var(--s4d-line,#ddd);overscroll-behavior:contain} body>.s4d-preview-viewer .s4d-preview-note-panel>.s4d-top{position:sticky;top:-16px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0;background:var(--s4d-surface,#fff)} body>.s4d-preview-viewer .s4d-preview-note-panel h2{margin:0;font-size:18px;color:var(--s4d-text,#29312c)} body>.s4d-preview-viewer .s4d-preview-note-filter{margin:0;gap:5px;justify-content:flex-end} body>.s4d-preview-viewer .s4d-preview-note-filter .s4d-btn{min-height:30px;padding:5px 8px;font-size:9px} body>.s4d-preview-viewer .s4d-preview-note-list{display:grid;gap:9px} body>.s4d-preview-viewer .s4d-preview-new-note{margin:0 0 12px;padding:13px;border:2px solid var(--s4d-accent,#8f9b72);border-radius:12px;background:var(--s4d-soft,#f3f5f2);color:var(--s4d-text,#29312c)} body>.s4d-preview-viewer .s4d-preview-new-note h3{margin:0 0 6px;font-size:15px;color:var(--s4d-text,#29312c)} body>.s4d-preview-viewer .s4d-preview-note{display:grid;gap:8px;padding:13px;border:1px solid var(--s4d-line,#ddd);border-radius:12px;background:var(--s4d-surface,#fff);min-width:0;color:var(--s4d-text,#29312c)} body>.s4d-preview-viewer .s4d-preview-note.is-draft{border-style:dashed;background:var(--s4d-soft,#f3f5f2)} body>.s4d-preview-viewer .s4d-preview-note.is-resolved{opacity:.62} body>.s4d-preview-viewer .s4d-preview-note p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.6} body>.s4d-preview-viewer .s4d-preview-note>small{font-size:10px;opacity:.65} body>.s4d-preview-viewer .s4d-preview-note-head{display:flex;align-items:center;justify-content:space-between;gap:10px} body>.s4d-preview-viewer .s4d-preview-note-head>strong{font-size:12px} body>.s4d-preview-viewer .s4d-preview-note-head>span{font-size:9px;text-transform:uppercase;letter-spacing:.4px;opacity:.68} body>.s4d-preview-viewer .s4d-preview-note-actions{display:flex;gap:7px;flex-wrap:wrap} body>.s4d-preview-viewer .s4d-preview-note-actions .s4d-btn{min-height:31px;padding:6px 9px;font-size:10px} body>.s4d-preview-viewer .s4d-preview-reference-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:7px} body>.s4d-preview-viewer .s4d-preview-ref{display:block;aspect-ratio:1;border:1px solid var(--s4d-line,#ddd);border-radius:9px;overflow:hidden;background:var(--s4d-soft,#f3f5f2)} body>.s4d-preview-viewer .s4d-preview-ref img{display:block;width:100%;height:100%;object-fit:cover} body>.s4d-preview-viewer .s4d-preview-ref-edit{position:relative;min-width:0} body>.s4d-preview-viewer .s4d-preview-ref-edit>.s4d-btn{position:absolute;top:4px;right:4px;z-index:2;width:25px;min-width:25px;min-height:25px;height:25px;padding:0;border-radius:50%;background:#1d211f;color:#fff;border-color:#fff} body>.s4d-preview-viewer .s4d-preview-edit-attachments>span{display:block;margin:8px 0 6px;font-size:11px;font-weight:600} body>.s4d-preview-viewer .s4d-empty{padding:36px 14px;text-align:center;border:1px dashed var(--s4d-line,#ddd);border-radius:12px;color:var(--s4d-text,#29312c)} body>.s4d-preview-viewer .s4d-preview-image-error{position:absolute;inset:50% auto auto 50%;z-index:8;transform:translate(-50%,-50%);max-width:min(420px,80%);padding:12px 16px;border-radius:10px;background:rgba(0,0,0,.78);color:#fff;text-align:center;font-size:12px;line-height:1.5} @media(max-width:900px){body>.s4d-preview-viewer .s4d-preview-viewer-body{grid-template-columns:1fr;grid-template-rows:minmax(300px,58vh) auto;overflow-y:auto}body>.s4d-preview-viewer .s4d-preview-note-panel{overflow:visible;border-inline-start:0;border-top:1px solid var(--s4d-line,#ddd)}body>.s4d-preview-viewer .s4d-preview-note-panel>.s4d-top{position:static;padding-top:0}body>.s4d-preview-viewer .s4d-preview-stage img{max-height:54vh}} @media(max-width:620px){body>.s4d-preview-viewer .s4d-preview-viewer-head{align-items:flex-start;flex-direction:column;padding:8px 62px 8px 9px}body>.s4d-preview-viewer .s4d-preview-viewer-tools{width:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px;scrollbar-width:thin}body>.s4d-preview-viewer .s4d-preview-viewer-tools>*{flex:0 0 auto}body>.s4d-preview-viewer .s4d-preview-viewer-body{grid-template-rows:minmax(255px,52vh) auto}body>.s4d-preview-viewer .s4d-preview-canvas{padding:7px}body>.s4d-preview-viewer .s4d-preview-stage img{max-height:49vh}body>.s4d-preview-viewer .s4d-preview-note-panel{padding:12px}body>.s4d-preview-viewer .s4d-preview-viewer-close{top:8px!important;right:8px!important;width:42px!important;min-width:42px!important;height:42px!important}} /* Mobile viewer controls: keep the review tools reachable even on short/narrow screens. */ @media(max-width:620px){ body>.s4d-preview-viewer .s4d-preview-viewer-head{padding-bottom:8px} body>.s4d-preview-viewer .s4d-preview-viewer-tools{position:fixed;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));z-index:2147483635;width:auto;min-height:48px;padding:5px 6px;background:rgba(22,27,24,.97);border:1px solid rgba(255,255,255,.24);border-radius:12px;box-shadow:0 5px 24px rgba(0,0,0,.38);overflow-x:auto;overflow-y:hidden;justify-content:flex-start;flex-wrap:nowrap} body>.s4d-preview-viewer .s4d-preview-viewer-body{padding-bottom:66px} body>.s4d-preview-viewer .s4d-preview-viewer-tools>button:not(.s4d-btn),body>.s4d-preview-viewer .s4d-preview-viewer-tools .s4d-btn,body>.s4d-preview-viewer .s4d-preview-viewer-tools>a.s4d-btn{min-height:40px;height:40px;white-space:nowrap} } /* v0.11.4 — simplified preview decisions and clearer studio preview management. */ #s4d-app .s4d-preview-admin-head{align-items:flex-start} #s4d-app .s4d-preview-head-status{display:grid;justify-items:end;gap:8px;min-width:max-content} #s4d-app .s4d-preview-head-actions{margin:0;justify-content:flex-end} #s4d-app .s4d-preview-admin-stack{display:grid;gap:14px;margin-top:18px} #s4d-app .s4d-preview-admin-section{padding:16px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);background:color-mix(in srgb,var(--s4d-soft) 55%,var(--s4d-surface))} #s4d-app .s4d-preview-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px} #s4d-app .s4d-preview-section-head h3{margin:2px 0 0;font-size:16px} #s4d-app .s4d-preview-admin-section>.s4d-preview-meta-form,#s4d-app .s4d-preview-admin-section>.s4d-preview-upload,#s4d-app .s4d-preview-admin-section>.s4d-preview-publish,#s4d-app .s4d-preview-admin-section>.s4d-preview-notes-summary{margin-top:0;padding-top:0;border-top:0} #s4d-app .s4d-preview-admin-section .s4d-preview-gallery{margin:12px 0 14px} #s4d-app .s4d-preview-admin-review>.s4d-preview-notes-summary{margin:0;padding:0;border:0} #s4d-app .s4d-preview-admin-primary-actions{border-inline-start:3px solid var(--s4d-accent)} #s4d-app .s4d-preview-danger-zone{background:var(--s4d-surface);border-style:dashed} #s4d-app .s4d-preview-danger-zone .s4d-small{margin:0 0 10px} @media(max-width:620px){#s4d-app .s4d-preview-admin-head{gap:10px}#s4d-app .s4d-preview-head-status{justify-items:start;min-width:0}#s4d-app .s4d-preview-head-actions{justify-content:flex-start}#s4d-app .s4d-preview-admin-section{padding:13px}} /* Final delivery workspace */ #s4d-app .s4d-delivery-admin{display:grid;gap:18px} #s4d-app .s4d-delivery-activity{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0} #s4d-app .s4d-delivery-activity>div{display:flex;flex-direction:column;gap:6px;padding:13px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);background:var(--s4d-soft)} #s4d-app .s4d-delivery-activity span{font-size:11px;opacity:.7} #s4d-app .s4d-delivery-activity strong{font-size:13px;overflow-wrap:anywhere} #s4d-app .s4d-delivery-group{margin-top:22px} #s4d-app .s4d-delivery-group:first-child{margin-top:8px} #s4d-app .s4d-delivery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:14px;margin-top:12px} #s4d-app .s4d-delivery-item{min-width:0;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);overflow:hidden;background:var(--s4d-surface)} #s4d-app .s4d-delivery-image{display:block;aspect-ratio:16/10;background:var(--s4d-soft);overflow:hidden} #s4d-app .s4d-delivery-image img{display:block;width:100%;height:100%;object-fit:cover} #s4d-app .s4d-delivery-file-visual{aspect-ratio:16/10;display:grid;place-items:center;align-content:center;gap:10px;background:var(--s4d-soft)} #s4d-app .s4d-delivery-file-visual .s4d-icon{width:34px;height:34px} #s4d-app .s4d-delivery-file-visual b{font-size:12px;letter-spacing:.08em} #s4d-app .s4d-delivery-item-meta{display:grid;gap:8px;padding:14px;min-width:0} #s4d-app .s4d-delivery-item-meta>strong{overflow-wrap:anywhere} #s4d-app .s4d-delivery-item-meta>small{font-size:10px;opacity:.7} #s4d-app .s4d-delivery-item-tools{display:grid;gap:8px;padding-top:8px;border-top:1px solid var(--s4d-line)} #s4d-app .s4d-delivery-item-tools .s4d-field{margin:0} #s4d-app .s4d-delivery-upload{margin-top:20px;padding-top:18px;border-top:1px solid var(--s4d-line)} #s4d-app .s4d-delivery-note{white-space:pre-wrap;padding:16px;margin:16px 0;border-inline-start:3px solid var(--s4d-accent);background:var(--s4d-soft);border-radius:var(--s4d-radius)} #s4d-app .s4d-delivery-publish{border-style:dashed} @media (max-width:760px){#s4d-app .s4d-delivery-activity{grid-template-columns:1fr}#s4d-app .s4d-delivery-grid{grid-template-columns:1fr}} /* Assistant navigation actions: trusted route buttons replace raw URLs. */ #s4d-app .s4d-assistant-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px} #s4d-app .s4d-assistant-actions .s4d-btn{margin:0;font-size:11px;min-height:36px;padding:8px 12px} @media(max-width:760px){#s4d-app .s4d-assistant-actions{align-items:stretch;flex-direction:column}#s4d-app .s4d-assistant-actions .s4d-btn{width:100%}} #s4d-app .s4d-composer-voice-slot{display:inline-flex;align-items:center} /* Live Studio Team dictation: make the active writing field unmistakable without changing the theme palette. */ #s4d-app .s4d-composer.is-dictating{border-color:var(--s4d-accent);background:color-mix(in srgb,var(--s4d-accent) 7%,var(--s4d-surface));box-shadow:0 0 0 2px color-mix(in srgb,var(--s4d-accent) 16%,transparent),0 4px 20px color-mix(in srgb,var(--s4d-text) 4%,transparent)} #s4d-app .s4d-composer textarea.is-dictating{background:color-mix(in srgb,var(--s4d-accent) 5%,transparent);caret-color:var(--s4d-accent)} /* New project admission form: theme-owned inputs/buttons, content in two editable halves. */ #s4d-app .s4d-new-project{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;min-height:620px;border:1px solid var(--s4d-line);border-radius:var(--s4d-radius);overflow:hidden} #s4d-app .s4d-intake-form{padding:clamp(24px,3vw,48px);display:flex;flex-direction:column;justify-content:center} #s4d-app .s4d-intake-form h1{font-size:clamp(28px,3vw,40px);margin:12px 0 16px} #s4d-app .s4d-intake-form form{display:flex;flex-direction:column;gap:14px;margin-top:16px} #s4d-app .s4d-intake-form .s4d-field{margin:0} #s4d-app .s4d-intake-form .s4d-small{margin:0} #s4d-app .s4d-intake-image{position:relative;margin:0;min-width:0;background:var(--s4d-soft);min-height:480px} #s4d-app .s4d-intake-image>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} #s4d-app .s4d-intake-image figcaption{position:absolute;inset:auto 0 0;padding:44px 30px 30px;color:white;background:linear-gradient(transparent,rgba(25,34,28,.8));display:flex;flex-direction:column;gap:12px} #s4d-app .s4d-intake-image figcaption .s4d-kicker{color:inherit} #s4d-app .s4d-intake-image figcaption strong{font-size:24px;line-height:1.35} #s4d-app .s4d-intake-image-placeholder{display:grid;place-items:center;height:100%;min-height:480px;color:var(--s4d-ink)} #s4d-app .s4d-intake-image-placeholder svg{width:100px;height:100px;opacity:.2} #s4d-app [data-intake-other-currency][hidden]{display:none} @media(max-width:1000px){#s4d-app .s4d-new-project{grid-template-columns:minmax(0,1fr)}#s4d-app .s4d-intake-image{min-height:280px}#s4d-app .s4d-intake-image-placeholder{min-height:280px}}