/* 5.5.30: responsive interaction and visual hierarchy fixes. */
:root{color-scheme:dark;--ui-border:#343d50;--ui-muted:#a4afc0}
html{scrollbar-gutter:stable}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
button:disabled{cursor:not-allowed;opacity:.5}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #b6a7ff;outline-offset:3px}
.field-note,.muted,.simple-section-head small{color:var(--ui-muted)}
.simple-result-panel,.simple-upload-section,.simple-prompt-panel{border-color:#2a3447;background:linear-gradient(145deg,#171d2a,#11151e);box-shadow:0 5px 20px #0002}
.simple-section-head{flex-wrap:wrap}.simple-ai-tools{flex-wrap:wrap;gap:6px}
.primary{box-shadow:0 3px 12px #6e56cf25}.project-card{transition:border-color .16s ease,box-shadow .16s ease}
@media(hover:hover){.project-card:hover{border-color:#7565ab;box-shadow:0 6px 22px #0003}}
.simple-action-dock{z-index:100}.v48-mobile-nav a[aria-current=page]{background:#7462ca;color:white}
.modal,.site-modal{z-index:10020;max-width:none;max-height:none}
.modal-card,.site-dialog{overscroll-behavior:contain;max-height:calc(100dvh - 32px);overflow:auto}
input[type=checkbox],input[type=radio]{width:18px!important;height:18px;min-width:18px;flex:0 0 auto}
.right-dock .dock-panel,.asset-list,#inspector{touch-action:pan-y}
.simple-page,.canvas-page{padding-bottom:0!important}
body.simple-page{height:100dvh;display:flex;flex-direction:column;overflow:hidden!important}
.simple-page>.app-topbar{flex:0 0 auto}
.simple-page>.simple-main{flex:1 1 auto;min-height:0;height:auto}
.simple-page .simple-main{scroll-padding-bottom:180px}
.simple-image-order{flex-wrap:wrap;max-width:calc(100% - 8px)}
.canvas-page .workspace{width:100%;max-width:none;margin:0}
.save-state{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#b6c6df}
.site-dialog input,.site-dialog textarea{max-width:100%}
@media(max-width:1100px){
 .app-topbar{height:auto;min-height:58px;flex-wrap:wrap;padding-block:8px}
 .app-topbar .header-actions{flex-wrap:wrap;max-width:100%}
 .simple-project-switch{min-width:0;max-width:100%}
 .simple-main{height:calc(100dvh - 80px)}
 .canvas-header .left-tools,.canvas-header .right-tools{min-width:0}
 .canvas-header .storage-text{display:none}
 .canvas-header .center-tools{gap:4px}
 .canvas-header .center-tools button{padding-inline:7px}
 .modal{inset:0;width:100%;height:100%;max-width:none!important;max-height:none!important}
}
@media(pointer:coarse){
 button,.btn,[role=button]{min-height:44px}
 .simple-image-order{opacity:1}
 .simple-image-order button{min-width:32px;min-height:36px;padding:3px}
 .simple-image-card{min-width:144px;min-height:180px}
 .simple-image-grid{grid-template-columns:repeat(9,144px)}
 input,select,textarea{font-size:16px}
 .pet-walker{display:block!important;z-index:10005}
}
@media(max-width:600px){
 .simple-section-head>.simple-ai-tools{display:flex;flex:1 1 100%;flex-direction:row;justify-content:flex-end;gap:6px}
 .home-main,.dashboard-main{padding-bottom:calc(92px + env(safe-area-inset-bottom))!important}
 .simple-section-head>div{min-width:0}
 .simple-section-head b{font-size:14px}
 .simple-section-head small{font-size:11px}
 .simple-action-dock{left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));width:auto;max-width:none;transform:none;border:1px solid #424562;box-shadow:0 8px 32px #0008;border-radius:18px}
 .simple-main{padding-bottom:calc(200px + env(safe-area-inset-bottom))!important}
 .simple-settings{min-width:0}.simple-settings select{width:auto;flex:1;min-width:0}
 .simple-action{min-width:0!important;padding:6px 3px!important}.simple-action small{max-width:70px}
 .simple-generate-btn{min-width:0!important;padding-inline:8px!important}
 .simple-prompt-panel textarea{min-height:156px}
 .simple-page .app-topbar{align-items:center}
 .canvas-header .center-tools,.canvas-header .api-quota-widget,.canvas-header .credit-header{display:none!important}
 .canvas-header{height:56px!important;overflow:visible!important;gap:4px;padding-inline:6px}
 .canvas-header .project-name{width:clamp(72px,26vw,140px);min-width:0!important}
 .canvas-page .workspace{height:calc(var(--app-height,100dvh) - 56px)!important}
 .canvas-page .right-dock{position:absolute!important;inset:auto 0 0 0!important;width:100%!important;max-width:100%!important;height:70%;transform:translateY(0);border-radius:20px 20px 0 0}
 .canvas-page .right-dock.collapsed{transform:translateY(105%)}
 .canvas-header .asset-library-btn{font-size:12px;padding-inline:6px;white-space:nowrap}
 .canvas-header .save-state{font-size:10px;max-width:50px}
 .modal-card,.site-dialog{max-height:calc(100dvh - 32px)!important}
 .simple-library-item{grid-template-columns:40px minmax(0,1fr) auto;gap:7px}
 .simple-library-item button{font-size:12px;padding:6px;min-width:40px}.simple-library-item button:last-child{grid-column:3}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* 5.5.30: keep keyboard, native text selection and canvas gestures independent. */
body.canvas-page{top:var(--visual-top,0px);left:var(--visual-left,0px);right:auto;bottom:auto;width:var(--visual-width,100%);height:var(--app-height,100dvh);padding-bottom:0!important;display:flex;flex-direction:column}
.canvas-page .canvas-header{flex-shrink:0}
.canvas-page .workspace{flex:1 1 auto;height:auto!important;min-height:0;touch-action:auto}
.canvas-page .viewport,.canvas-page .stage{touch-action:auto}
.canvas-page .node{touch-action:none}
.canvas-page .edge-layer,.canvas-page .node-header,.canvas-page .port,.canvas-page #minimap{touch-action:none}
.canvas-page .node textarea,.canvas-page .node input{user-select:text;-webkit-user-select:text;touch-action:pan-y;overscroll-behavior:contain;-webkit-touch-callout:default}
.canvas-page .node textarea{overflow-y:auto!important;max-height:360px}
.canvas-page .right-dock,.canvas-page .right-dock *{touch-action:pan-y}
.canvas-page .modal{top:var(--visual-top,0px)!important;left:var(--visual-left,0px)!important;right:auto!important;bottom:auto!important;width:var(--visual-width,100vw)!important;height:var(--app-height,100dvh)!important;overflow:hidden!important;box-sizing:border-box}
.canvas-page .modal-card{max-height:calc(var(--app-height,100dvh) - 24px)!important;min-height:0}
.canvas-page #canvasTextEditor{z-index:10040;place-items:center!important;padding:12px!important}
.canvas-page #canvasTextEditor .canvas-text-card{display:flex;flex-direction:column;gap:12px;width:min(760px,100%)!important;max-width:760px!important;height:min(680px,100%);max-height:100%!important;padding:16px!important;overflow:hidden;border-radius:16px!important}
.canvas-text-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:0 0 auto}
.canvas-page #canvasTextInput{flex:1 1 auto;min-height:64px!important;max-height:none;width:100%;resize:none;font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;padding:12px;overflow:auto;touch-action:pan-y;overscroll-behavior:contain;user-select:text;-webkit-user-select:text;border:1px solid #424966;border-radius:10px;background:#0d111a;color:#eef1fa}
.canvas-text-foot{flex:none;font-size:12px;color:#a4afc0}.canvas-text-head button{min-height:44px;min-width:64px}
.canvas-page #mentionMenu{position:fixed;z-index:10050;touch-action:pan-y;overscroll-behavior:contain;min-width:0;box-sizing:border-box}
.canvas-page #mentionMenu button{min-height:44px;touch-action:pan-y}.mention-active{background:#353052!important;color:#f6f3ff!important}
#canvasRecovery{position:fixed;z-index:10060;top:calc(var(--visual-top,0px) + 60px);left:12px;right:12px;max-width:760px;margin:auto;padding:10px 12px;border:1px solid #9d773e;border-radius:12px;background:#342a19;color:#ffedce;box-shadow:0 8px 30px #0006;display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:13px}
#canvasRecovery[hidden]{display:none}#canvasRecovery>span{flex:1 1 230px}#canvasRecovery button{min-height:40px;font-size:12px;padding:7px 12px;border-radius:8px;border:1px solid #a68b63;background:#51432d;color:#fff}
.canvas-page .expand-text{display:block;margin:0 0 6px auto;min-height:32px}
.canvas-page.keyboard-open .minimap,.canvas-page.keyboard-open .help-card,.canvas-page.keyboard-open .dock-handles{display:none!important}
.canvas-page.keyboard-open .toast{bottom:auto;top:calc(var(--visual-top,0px) + var(--app-height,100dvh) - 70px);z-index:10070}
@media(pointer:coarse){
 .canvas-page .node textarea,.canvas-page #inspector textarea,.canvas-page #inspector input{font-size:16px!important}
 .canvas-page .port{width:28px!important;height:28px!important}.canvas-page .port:after{content:'';position:absolute;inset:-8px}
 .canvas-page .port.input{left:-14px!important}.canvas-page .port.output{right:-14px!important}
 .canvas-page .node-actions button{min-width:38px;min-height:38px}
 .canvas-page #canvasTextEditor{padding:6px!important}
 .canvas-page #canvasTextEditor .canvas-text-card{height:100%;border-radius:12px!important;padding:12px!important}
}
@media(max-width:600px){body.canvas-page.phone-ui .save-state{display:inline!important;max-width:68px;white-space:normal;font-size:10px} .canvas-page .right-dock{max-height:100%!important}.canvas-page.keyboard-open .right-dock{height:100%!important}}

/* v6.2.1: keep the canvas assistant visible on touch devices without covering navigation. */
@media(pointer:coarse) and (min-width:601px){
  .canvas-page #petWalker{display:block!important;width:118px;left:max(14px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));z-index:10005}
}
@media(pointer:coarse) and (max-width:600px){
  .canvas-page #petWalker{display:block!important;width:86px;left:max(8px,env(safe-area-inset-left));bottom:calc(76px + env(safe-area-inset-bottom));z-index:10005;filter:drop-shadow(0 8px 12px rgba(0,0,0,.28))}
  .canvas-page.keyboard-open #petWalker{display:none!important}
}