/* Local appearance drawer. Chat markup and behaviour stay owned by the homepage. */
/* Lock native background scrolling; the live canvas retains deliberate programmatic preview scrolling. */
html:has(> body[data-palette-open=true]),body[data-palette-open=true]{overflow:hidden;}
.ps-studio{--ps-drawer:380px;position:fixed;inset:0;margin:0;width:100%;height:100dvh;max-width:none;max-height:none;padding:16px;border:0;background:transparent;color:var(--yf-text);overflow:hidden;font:14px/1.65 -apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;}
.ps-studio[open]{display:grid;grid-template-columns:minmax(0,1fr) var(--ps-drawer);gap:16px;}
.ps-studio::backdrop{background:transparent;}
.ps-studio *{box-sizing:border-box;}
.ps-studio [hidden]{display:none!important;}
.ps-studio button,.ps-studio input{font:inherit;}
.ps-studio button{cursor:pointer;color:inherit;transition:background-color .16s,border-color .16s,transform .16s;}
.ps-studio button:disabled{cursor:default;opacity:.45;}
.ps-studio button:not(:disabled):active{transform:translateY(1px);}
.ps-studio :is(button,input,summary,.ps-plane):focus-visible{outline:2px solid var(--ps-action-text,var(--yf-text));outline-offset:3px;}
.ps-panel{grid-column:2;grid-row:1;display:flex;flex-direction:column;min-height:0;overflow:hidden;background:var(--yf-surface);border:1px solid var(--yf-border);border-radius:18px;box-shadow:0 14px 45px color-mix(in srgb,var(--yf-text) 9%,transparent);animation:ps-drawer-in .22s cubic-bezier(.2,.8,.2,1);}
.ps-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:22px 22px 12px;flex:0 0 auto;}
.ps-eyebrow{margin:0;color:var(--yf-muted);font-size:11px;letter-spacing:.08em;}
.ps-header h2{margin:3px 0 0;font-size:21px;line-height:1.4;font-weight:550;letter-spacing:-.02em;}
.ps-header-actions{display:flex;align-items:center;gap:8px;}
.ps-close{width:36px;height:36px;order:2;border:0;border-radius:9px;background:transparent;font-size:24px!important;color:var(--yf-muted)!important;}
.ps-close:hover{background:var(--yf-primary-soft);}
.ps-mobile-preview{display:none;}
.ps-quick-tools{flex:0 0 auto;padding:0 22px 13px;}
.ps-preview-tools{display:flex;gap:8px;}
.ps-preview-tools button{min-height:32px;padding:3px 10px;background:transparent;border:0;border-radius:7px;color:var(--yf-muted);font-size:12px;touch-action:none;user-select:none;}
.ps-preview-tools button:hover,.ps-preview-tools button[aria-pressed=true]{background:var(--yf-primary-soft);color:var(--ps-on-soft,var(--yf-text));}
.ps-preview-selection{margin:7px 0 0;color:var(--ps-action-text,var(--yf-text));font-size:12px;}
.ps-layout{display:flex;flex:1 1 auto;min-height:0;}
.ps-editor{flex:1;min-width:0;min-height:0;padding:0 22px 22px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scroll-padding-block:66px 18px;}
.ps-editor :is(button,input,.ps-plane,details){scroll-margin-block:66px 18px;}
.ps-tabs{position:sticky;top:0;z-index:4;display:flex;gap:18px;margin:0 0 20px;padding:0 0 9px;background:var(--yf-surface);border-bottom:1px solid var(--yf-border);box-shadow:0 -10px 0 var(--yf-surface),0 7px 0 var(--yf-surface);}
.ps-tab{min-height:36px;padding:4px 0;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:var(--yf-muted)!important;font-size:13px!important;white-space:nowrap;}
.ps-tab[aria-selected=true]{border-bottom-color:var(--ps-action-text,var(--yf-text));color:var(--yf-text)!important;font-weight:550;}
.ps-section-note{margin:0 0 16px;color:var(--yf-muted);font-size:12px;line-height:1.8;}
.ps-preset-grid{display:grid;gap:9px;}
.ps-preset{display:grid;grid-template-columns:78px minmax(0,1fr);grid-template-rows:auto auto;column-gap:15px;align-items:center;min-width:0;padding:9px;border:1px solid transparent;border-radius:11px;text-align:left;background:transparent;}
.ps-preset:hover{background:var(--yf-page-bg);}
.ps-preset[aria-pressed=true]{border-color:var(--yf-border-strong);background:var(--yf-page-bg);}
.ps-preset-sample{grid-column:1;grid-row:1/3;height:65px;padding:12px 9px;border:1px solid color-mix(in srgb,var(--yf-border) 65%,transparent);border-radius:7px;display:grid;align-items:center;}
.ps-sample-sheet{padding:6px 0;text-align:center;border-radius:4px;font:italic 13px/1.6 Georgia,serif;}
.ps-preset strong{grid-column:2;align-self:end;font-size:14px;font-weight:550;}
.ps-preset small{grid-column:2;align-self:start;color:var(--yf-muted);font-size:11px;line-height:1.6;margin-top:4px;}
.ps-more{margin-top:15px;color:var(--yf-muted);font-size:12px;}
.ps-more summary,.ps-exact-details summary,.ps-readability summary,.ps-save-details summary{cursor:pointer;min-height:36px;padding-block:6px;}
.ps-legacy-grid{display:grid;gap:7px;margin-top:8px;}
.ps-region-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-bottom:18px;}
.ps-region-row{display:flex;min-width:0;border:1px solid var(--yf-border);border-radius:8px;overflow:hidden;}
.ps-region-select{display:flex;gap:7px;align-items:center;flex:1 1 auto;min-width:0;min-height:39px;padding:6px 8px;border:0;background:transparent;font-size:12px!important;}
.ps-region-select[aria-pressed=true]{background:var(--yf-primary-soft);color:var(--ps-on-soft,var(--yf-text));}
.ps-region-chip{display:block;flex:0 0 13px;height:13px;border:1px solid rgba(125,130,125,.25);border-radius:4px;}
.ps-region-lock{flex:0 0 34px;padding:3px;border:0;border-left:1px solid var(--yf-border);background:transparent;color:var(--yf-muted)!important;font-size:10px!important;}
.ps-region-lock[aria-pressed=true]{background:var(--yf-primary-soft);color:var(--ps-on-soft,var(--yf-text))!important;}
.ps-color-head{display:flex;justify-content:space-between;align-items:center;gap:9px;margin-bottom:10px;}
.ps-region-title{font-size:13px;font-weight:550;}
.ps-link-label{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--yf-muted);}
.ps-link{accent-color:var(--ps-action-text,var(--yf-text));}
.ps-plane{position:relative;height:164px;border:1px solid var(--yf-border);border-radius:9px;background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent),var(--picker-hue);overflow:hidden;cursor:crosshair;touch-action:none;}
.ps-plane[aria-disabled=true]{opacity:.5;cursor:default;}
.ps-marker{position:absolute;width:14px;height:14px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.7),0 1px 3px rgba(0,0,0,.3);transform:translate(-50%,-50%);pointer-events:none;}
.ps-sliders{display:grid;gap:8px;margin:15px 0;}
.ps-slider-row{display:grid;grid-template-columns:42px minmax(0,1fr) 34px;align-items:center;gap:8px;font-size:11px;color:var(--yf-muted);}
.ps-slider-row input{width:100%;min-width:0;height:28px;accent-color:var(--ps-action-text,var(--yf-text));}
.ps-slider-row output{text-align:right;font-variant-numeric:tabular-nums;}
.ps-exact-details{font-size:12px;color:var(--yf-muted);margin-bottom:14px;}
.ps-exact{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;padding:7px 0 10px;}
.ps-exact label{display:flex;flex-direction:column;gap:4px;font-size:11px;}
.ps-hex{width:112px;height:36px;padding:6px 9px;border:1px solid var(--yf-border);border-radius:7px;background:var(--yf-surface);color:var(--yf-text);font-family:ui-monospace,monospace!important;}
.ps-hex[aria-invalid=true]{border-color:var(--yf-danger);}
.ps-reset-region,.ps-reset-all,.ps-custom-toggle,.ps-library-refresh,.ps-library-retry{border:0;padding:6px 0;background:transparent;color:var(--yf-muted)!important;font-size:12px!important;}
.ps-reset-region:hover,.ps-reset-all:hover,.ps-custom-toggle:hover{color:var(--ps-action-text,var(--yf-text))!important;}
.ps-swatches{font-size:11px;color:var(--yf-muted);}
.ps-suggestions,.ps-recents{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 14px;}
.ps-color-swatch{width:32px;height:30px;border:1px solid rgba(120,125,120,.2);border-radius:7px;padding:0;}
.ps-editor-extra{margin-top:18px;}
.ps-custom-toggle{min-height:38px;color:var(--ps-action-text,var(--yf-text))!important;}
.ps-readability{margin-top:9px;color:var(--yf-muted);font-size:11px;}
.ps-readability summary{min-height:30px;}.ps-readability.is-warn summary{color:var(--yf-danger);}
.ps-contrast{margin:5px 0;font-size:11px;line-height:1.8;}.ps-contrast.is-warn{color:var(--yf-danger);}
.ps-library-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;}
.ps-library-head .ps-section-note{margin-bottom:5px;}
.ps-library-status{font-size:11px;color:var(--yf-muted);margin:0 0 18px;line-height:1.8;overflow-wrap:anywhere;}
.ps-library-list{display:grid;gap:16px;}
.ps-saved-card{display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;padding-bottom:16px;border-bottom:1px solid color-mix(in srgb,var(--yf-border) 65%,transparent);}
.ps-saved-preview{position:relative;height:86px;padding:15px 10px;border:1px solid var(--yf-border);border-radius:9px;}
.ps-saved-preview[aria-pressed=true]{outline:1px solid var(--yf-primary);outline-offset:2px;}
.ps-saved-sheet{display:block;padding:9px 6px;border:1px solid;border-radius:5px;font:italic 14px/1.5 Georgia,serif;}
.ps-saved-dot{display:block;position:absolute;bottom:7px;right:7px;width:17px;height:8px;border-radius:3px;}
.ps-saved-content{min-width:0;}.ps-saved-name{display:block;font-size:13px;font-weight:550;overflow-wrap:anywhere;}
.ps-saved-badge{display:block;font-size:10px;color:var(--yf-muted);min-height:17px;margin-top:3px;}
.ps-saved-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px;}
.ps-saved-actions button,.ps-rename-form button{min-height:32px;padding:4px 8px;border:0;border-radius:6px;background:transparent;font-size:11px!important;}
.ps-saved-actions .ps-saved-use{color:var(--ps-on-soft,var(--yf-text));background:var(--yf-primary-soft);}
.ps-rename-form{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px;}
.ps-rename-input{flex:1 0 100%;width:100%;min-width:0;height:36px;padding:5px 8px;border:1px solid var(--yf-border);border-radius:6px;background:var(--yf-surface);color:var(--yf-text);font-size:13px!important;}
.ps-footer{flex:0 0 auto;padding:16px 22px 18px;border-top:1px solid var(--yf-border);background:var(--yf-surface);}
.ps-state{display:block;font-size:12px;font-weight:550;}
.ps-feedback{margin:4px 0 0;color:var(--yf-muted);font-size:11px;line-height:1.8;}.ps-feedback:empty{display:none;}
.ps-footer-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:12px;}
.ps-apply{order:2;margin-left:auto;min-height:40px;min-width:118px;padding:7px 17px;border:1px solid var(--yf-primary);border-radius:9px;background:var(--yf-primary);color:var(--ps-on-primary,var(--yf-on-primary))!important;font-size:13px!important;}
.ps-save-details{order:1;font-size:12px;color:var(--yf-muted);}
.ps-save-details[open]{order:3;flex-basis:100%;}
.ps-save-details summary{list-style:none;}.ps-save-details summary::-webkit-details-marker{display:none;}
.ps-save-row{display:flex;align-items:flex-end;gap:8px;padding-top:6px;}
.ps-save-row label{display:flex;flex:1 1 auto;min-width:0;flex-direction:column;gap:5px;font-size:11px;}
.ps-name{width:100%;min-width:0;height:38px;padding:6px 9px;border:1px solid var(--yf-border);border-radius:8px;background:var(--yf-surface);color:var(--yf-text);font-size:13px!important;}
.ps-save{min-height:38px;padding:6px 11px;border:1px solid var(--yf-border);border-radius:8px;background:var(--yf-primary-soft);color:var(--ps-on-soft,var(--yf-text))!important;font-size:12px!important;white-space:nowrap;}
.ps-footer>small{display:block;margin-top:9px;color:var(--yf-muted);font-size:10px;}
.ps-live-canvas{position:relative;grid-column:1;grid-row:1;min-width:0;overflow:hidden;}
.ps-live-hint{position:absolute;z-index:5;top:7px;left:calc(var(--sidebar-width,232px) + 8px);max-width:calc(100% - var(--sidebar-width,232px) - 16px);margin:0;padding:6px 10px;background:var(--yf-surface);border:1px solid var(--yf-border);border-radius:8px;color:var(--yf-muted);font-size:11px;pointer-events:none;}
.ps-live-target{position:absolute;z-index:1;margin:0;padding:0;border:0;border-radius:12px;background:transparent!important;opacity:1!important;transform:none!important;cursor:crosshair!important;}
.ps-live-target[data-role=surfaceSoft]{z-index:2;border-radius:0;}.ps-live-target[data-role=surface]{z-index:3;}.ps-live-target[data-role=primary],.ps-live-target[data-role=accent]{z-index:4;}
.ps-live-target span{display:none;position:absolute;top:5px;right:7px;padding:2px 7px;background:var(--yf-surface);border:1px solid var(--yf-border);border-radius:5px;font-size:11px;color:var(--ps-action-text,var(--yf-text));pointer-events:none;}
.ps-live-target:hover,.ps-live-target.is-selected{outline:2px solid color-mix(in srgb,var(--yf-primary) 60%,transparent);outline-offset:-2px;}
.ps-live-target:hover>span,.ps-live-target.is-selected>span{display:block;}
body[data-palette-open=true] .page-shell{padding-right:412px;}
body[data-palette-adjusting=true] :is(#home,.topbar,.composer,.chat-message-assistant,#chatActionBtn,.ps-panel){transition:none!important;}
body.ps-applied .companion-line-face .line-face-eye{transform-box:fill-box;transform-origin:center;animation:ps-ack .34s ease!important;}
.ps-preset-pane:not([hidden]),.ps-custom-pane:not([hidden]),.ps-saved-pane:not([hidden]){animation:ps-pane-in .16s ease-out;}
@keyframes ps-pane-in{from{opacity:.6;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@keyframes ps-drawer-in{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}
@keyframes ps-ack{0%,100%{transform:scaleY(1)}45%{transform:scaleY(.18)}}
@media(max-width:1100px) and (min-width:961px){.ps-studio{--ps-drawer:356px;}body[data-palette-open=true] .page-shell{padding-right:388px;}.ps-header,.ps-footer{padding-inline:18px;}.ps-editor{padding-inline:18px;}.ps-quick-tools{padding-inline:18px;}.ps-live-hint{font-size:10px;}}
@media(max-width:960px){
 .ps-studio{padding:8px;}.ps-studio[open]{display:block;}.ps-panel{height:100%;width:100%;border-radius:17px;}
 body[data-palette-open=true] .page-shell{padding-right:0;}
 .ps-header{padding:17px 18px 10px;}.ps-header h2{font-size:20px;}.ps-mobile-preview{display:block;min-height:36px;padding:4px 9px;border:0;border-radius:7px;background:var(--yf-primary-soft);color:var(--ps-on-soft,var(--yf-text))!important;font-size:12px!important;}
 .ps-quick-tools{padding:0 18px 12px;}.ps-editor{padding:0 18px 20px;}.ps-tabs{gap:22px;}
 .ps-tab{min-height:40px;}.ps-preset-sample{height:69px;}.ps-preset{grid-template-columns:84px minmax(0,1fr);padding:10px;}
 .ps-plane{height:175px;}.ps-region-select{min-height:40px;}.ps-region-lock{flex-basis:40px;}.ps-slider-row input{height:34px;}.ps-color-swatch{width:36px;height:34px;}
 .ps-name,.ps-hex,.ps-rename-input{font-size:16px!important;}.ps-saved-actions button,.ps-rename-form button{min-height:38px;}
 .ps-footer{padding:13px 18px 16px;}.ps-apply{min-height:43px;}.ps-live-canvas{display:none;}
 .ps-studio[data-preview-only=true] .ps-panel{position:absolute;z-index:10;left:10px;right:10px;bottom:10px;width:auto;height:auto;}
 .ps-studio[data-preview-only=true] .ps-header{padding:12px 14px;}.ps-studio[data-preview-only=true] .ps-eyebrow{display:none;}.ps-studio[data-preview-only=true] h2{font-size:16px;}
 .ps-studio[data-preview-only=true] .ps-live-canvas{display:block;position:absolute;inset:0;}
 .ps-live-hint{left:12px;top:72px;max-width:calc(100% - 24px);font-size:10px;}
}
@media(max-width:960px) and (max-height:720px){.ps-header{padding-block:12px 8px;}.ps-quick-tools{padding-bottom:8px;}.ps-plane{height:145px;}.ps-footer>small{display:none;}.ps-footer{padding-block:11px;}}
@media(prefers-reduced-motion:reduce){.ps-studio *{animation:none!important;transition:none!important;}body.ps-applied .companion-line-face .line-face-eye{animation:none!important;}}
.ps-quick-tools{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;}
.ps-quick-tools .ps-custom-toggle{margin-left:auto;font-size:11px!important;}
.ps-quick-tools .ps-preview-selection{flex-basis:100%;}
.ps-live-target:is([data-role=pageBg],[data-role=surfaceSoft]):hover:not(.is-selected){outline:none;}
.ps-live-target:is([data-role=pageBg],[data-role=surfaceSoft]):hover:not(.is-selected)>span{display:none;}

.ps-live-canvas{touch-action:pinch-zoom;}
