/* SiteForge V8.11 unified professional experience; isolated sf-* selectors */ :root{--sf-blue:#245fc7;--sf-ink:#203451;--sf-line:#dce5f1;--sf-soft:#f5f8fd;--sf-muted:#60748e} .sf-globalbar,.sf-globalbar *,.sf-onboarding,.sf-onboarding *{box-sizing:border-box} .sf-globalbar{position:relative;z-index:100;background:#fff;color:var(--sf-ink);border-bottom:1px solid var(--sf-line);font:13px/1.45 Inter,'Microsoft YaHei',system-ui,sans-serif;box-shadow:0 2px 12px #20345109} .sf-bar-main{min-height:61px;display:flex;align-items:center;gap:19px;padding:10px clamp(15px,2.3vw,32px);flex-wrap:wrap} .sf-bar-brand{display:flex;align-items:center;gap:10px;white-space:nowrap;color:#213b66!important;text-decoration:none!important;font-weight:800;font-size:17px} .sf-bar-logo{display:grid;place-items:center;width:33px;height:33px;background:#265fbd;color:white;border-radius:9px;letter-spacing:-1px} .sf-bar-loc{font-size:12px;color:#6d7d94;border-left:1px solid #dae3ef;padding-left:16px;min-width:0} .sf-bar-loc strong{color:#253d63;font-size:13px} .sf-bar-nav{display:flex;align-items:center;gap:4px;margin-left:auto;min-width:0} .sf-bar-nav a,.sf-bar-help{font:600 12px/1.5 system-ui,'Microsoft YaHei',sans-serif;text-decoration:none!important;color:#61758f!important;padding:8px 11px;border:1px solid transparent;border-radius:8px;white-space:nowrap;background:transparent;cursor:pointer} .sf-bar-nav a:hover,.sf-bar-nav a[aria-current='page'],.sf-bar-help:hover{background:#eaf2fe;color:var(--sf-blue)!important} .sf-bar-site{display:flex;align-items:center;gap:7px;min-width:0;color:#60748e;font-size:12px} .sf-bar-site select{min-width:120px;max-width:184px;height:36px;padding:7px 28px 7px 10px;border:1px solid #cdd9e9;border-radius:8px;background:#fff;color:#253d63;font-size:12px} .sf-onboarding{background:#f4f8ff;border-bottom:1px solid #dfe9f7;color:#4b6180;font:12px/1.6 system-ui,'Microsoft YaHei',sans-serif;padding:10px clamp(15px,2.3vw,32px);display:flex;align-items:center;gap:11px;flex-wrap:wrap} .sf-onboarding strong{color:#1f4d95;white-space:nowrap}.sf-onboarding .sf-onboarding-more{display:none;flex-basis:100%;padding:10px 12px;border:1px solid #d8e5f9;background:white;border-radius:9px} .sf-onboarding[data-open='true'] .sf-onboarding-more{display:block}.sf-onboarding [data-sf-help]{margin-left:auto;font-size:12px;border:1px solid #bdcfee;background:#fff;color:#2757aa;border-radius:7px;padding:5px 10px;cursor:pointer} .sf-professional button:not(:disabled),.sf-professional a{touch-action:manipulation} .sf-professional :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus-visible,.sf-professional button:focus-visible,.sf-professional a:focus-visible{outline:2px solid #4485eb!important;outline-offset:2px} .sf-professional :is(input:not([type=checkbox]):not([type=radio]),select,textarea){accent-color:var(--sf-blue)} .sf-professional button:disabled{opacity:.5;cursor:not-allowed} .sf-professional .sf-hint{font-size:12px;color:var(--sf-muted);line-height:1.6} .sf-professional .sf-step{font-size:11px;color:#2859ad;background:#eaf2fe;border-radius:6px;padding:4px 8px;font-weight:700} /* Avoid duplicate menus: one universal navigation, page-local tabs remain for tasks. */ .sf-professional.sf-page-theme>header{display:none} .sf-professional.sf-page-production>header{display:none} .sf-professional.sf-page-operations .layout{display:block;min-height:auto} .sf-professional.sf-page-operations .layout>aside{display:none} .sf-professional.sf-page-operations .layout>main{max-width:1460px;padding:27px clamp(15px,3vw,35px)} .sf-professional.sf-page-factory .shell{display:block} .sf-professional.sf-page-factory .sidebar{height:auto;position:static;background:#fff;color:#263e5d;padding:10px 25px;border-bottom:1px solid var(--sf-line);display:block} .sf-professional.sf-page-factory .sidebar .identity,.sf-professional.sf-page-factory .sidebar .side-title,.sf-professional.sf-page-factory .sidebar .side-bottom{display:none} .sf-professional.sf-page-factory #navtabs{display:flex;gap:5px;flex-wrap:wrap} .sf-professional.sf-page-factory #navtabs button{color:#5b708a;padding:10px 14px;border-radius:8px} .sf-professional.sf-page-factory #navtabs button.active,.sf-professional.sf-page-factory #navtabs button:hover{background:#e9f1ff;color:#245dc4} .sf-professional.sf-page-factory .top{min-height:59px} .sf-professional.sf-page-factory .top-crumb{display:none} .sf-professional.sf-page-factory .top-controls>label{display:none} .sf-professional.sf-page-operations header .right>label{display:none} .sf-professional.sf-page-production #site{display:none} .sf-professional.sf-page-production .panel:has(> .row > div > h2:first-child){scroll-margin-top:24px} .sf-professional.sf-page-editor .studio{height:calc(100vh - var(--sf-extras-height,116px));min-height:560px} .sf-professional.sf-page-editor .studio-top{height:auto;min-height:70px;padding:10px 18px;gap:8px;flex-wrap:wrap} .sf-professional.sf-page-editor .studio-top .brand,.sf-professional.sf-page-editor .studio-top .divide{display:none} .sf-professional.sf-page-editor .studio-top .top-center{margin-left:auto;margin-right:8px} .sf-professional.sf-page-editor .studio-top .file-name{max-width:320px} .sf-professional.sf-page-editor .sf-editor-actiongroup{display:flex;align-items:center;gap:6px;flex-wrap:wrap} .sf-professional.sf-page-editor .sf-editor-actiongroup[data-group='publish']{padding-left:9px;border-left:1px solid #dae3ef} .sf-professional.sf-page-editor .sf-editor-actiongroup .ui-btn{padding:9px 11px;font-size:11px} .sf-professional.sf-page-editor .preview-workspace .stage{padding:13px} .sf-editor-mobile-tabs{display:none} .sf-professional.sf-page-editor .sf-editor-help{color:#6b7d95;font-size:11px;margin:0;padding:0 6px} @media(max-width:1280px){.sf-bar-main{gap:8px}.sf-bar-nav a{padding:7px}.sf-professional.sf-page-editor .studio-top .file-name{display:none}} @media(max-width:920px){.sf-bar-nav{order:5;width:100%;overflow:auto;margin-left:0;border-top:1px solid #edf1f8;padding-top:6px}.sf-bar-nav a{flex-shrink:0}.sf-bar-site{margin-left:auto}.sf-professional.sf-page-editor .studio{height:calc(100vh - var(--sf-extras-height,156px))}.sf-professional.sf-page-editor .studio-top{position:relative}.sf-professional.sf-page-editor .right-pane{top:0;position:relative;width:auto;box-shadow:none}} @media(max-width:650px){.sf-bar-main{padding:10px 12px}.sf-bar-loc{display:none}.sf-bar-site{max-width:180px}.sf-bar-site select{max-width:125px}.sf-onboarding{padding:8px 12px;align-items:flex-start}.sf-onboarding>span{flex:1 1 75%;min-width:0}.sf-onboarding [data-sf-help]{margin-left:0}.sf-professional.sf-page-editor .studio{height:auto;min-height:calc(100vh - 160px)}.sf-professional.sf-page-editor .studio-top{padding:9px;gap:5px}.sf-professional.sf-page-editor .studio-top .ui-btn.ghost{display:inline-flex}.sf-professional.sf-page-editor .studio-top .sf-editor-actiongroup{display:flex}.sf-professional.sf-page-editor .studio-top .top-center{margin:0 auto}.sf-professional.sf-page-editor .studio-body{display:block;min-height:610px}.sf-professional.sf-page-editor .studio-body>aside,.sf-professional.sf-page-editor .studio-body>.preview-workspace{display:none}.sf-professional.sf-page-editor[data-mobile-pane='structure'] .studio-body>.left-pane{display:flex;min-height:600px}.sf-professional.sf-page-editor[data-mobile-pane='preview'] .studio-body>.preview-workspace{display:flex;min-height:600px}.sf-professional.sf-page-editor[data-mobile-pane='properties'] .studio-body>.right-pane{display:flex;min-height:600px}.sf-professional.sf-page-editor .left-pane,.sf-professional.sf-page-editor .right-pane{overflow:visible;border:0}.sf-editor-mobile-tabs{display:flex;gap:5px;padding:8px;background:#fff;border-bottom:1px solid var(--sf-line)}.sf-editor-mobile-tabs button{flex:1;border:1px solid #dce5f1;border-radius:7px;background:#f7f9fc;padding:9px 6px;color:#4c617d}.sf-editor-mobile-tabs button[aria-selected='true']{background:#e8f0ff;border-color:#94b8f3;color:#1c56ba;font-weight:750}.sf-professional.sf-page-editor .device-frame{min-height:570px}.sf-professional.sf-page-editor iframe{min-height:600px}.sf-professional.sf-page-factory .sidebar{padding:8px}.sf-professional.sf-page-factory #navtabs{flex-wrap:nowrap;overflow-x:auto}.sf-professional.sf-page-factory #navtabs button{white-space:nowrap}.sf-professional.sf-page-operations .layout>main{padding:14px}.sf-professional.sf-page-production main{padding:0 13px}} @media(prefers-reduced-motion:reduce){.sf-globalbar *, .sf-onboarding *{transition:none!important}} /* Shared actions and form language */ .sf-professional :is(.primary,.btn-primary,.ui-btn.primary,button.primary){background:#245fc7!important;border-color:#245fc7!important;color:#fff!important} .sf-professional :is(.primary,.btn-primary,.ui-btn.primary,button.primary):hover:not(:disabled){background:#1c4fa6!important;border-color:#1c4fa6!important} .sf-professional :is(.outline,.btn-muted,.secondary,.ui-btn.ghost){border-color:#cedceb;color:#3f5674} .sf-professional .danger,.sf-professional button.danger{color:#ba4249!important} .sf-professional :is(input,textarea,select):disabled{background:#f2f5fa;color:#8895a7} .sf-professional :is(input,textarea,select)[aria-invalid='true']{border-color:#c8464e!important;background:#fff8f8!important} .sf-professional :is(.panel,.section) h2{letter-spacing:-.25px} .sf-professional .sf-visually-hidden{position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);overflow:hidden;white-space:nowrap} /* Keep editing controls accessible on tablets, not only desktop. */ @media(max-width:950px){ .sf-professional.sf-page-editor .studio-body{display:block;min-height:600px} .sf-professional.sf-page-editor .studio-body>aside,.sf-professional.sf-page-editor .studio-body>.preview-workspace{display:none} .sf-professional.sf-page-editor[data-mobile-pane='structure'] .studio-body>.left-pane{display:flex;min-height:600px} .sf-professional.sf-page-editor[data-mobile-pane='preview'] .studio-body>.preview-workspace{display:flex;min-height:600px} .sf-professional.sf-page-editor[data-mobile-pane='properties'] .studio-body>.right-pane{display:flex;min-height:600px;position:static;width:100%;box-shadow:none} .sf-professional.sf-page-editor .sf-editor-mobile-tabs{display:flex;gap:5px;padding:8px;background:white} .sf-professional.sf-page-editor .sf-editor-mobile-tabs button{flex:1;padding:9px 5px;border:1px solid #d5e0f0;border-radius:7px} .sf-professional.sf-page-editor .sf-editor-mobile-tabs button[aria-selected='true']{background:#e8f0ff;color:#245fc7;border-color:#99b7e9} } .sf-ops-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0 20px} .sf-ops-tabs button{display:grid;gap:4px;text-align:left;border:1px solid #d9e3f1;border-radius:10px;padding:13px 17px;background:#fff;color:#586e8a;cursor:pointer;font:inherit} .sf-ops-tabs button strong{font-size:13px;color:#334c6d} .sf-ops-tabs button small{font-size:11px;color:#8a98aa} .sf-ops-tabs button[aria-selected='true']{border-color:#91b4ec;background:#eaf2ff;box-shadow:inset 3px 0 #326bd6} .sf-professional.sf-page-operations .layout>main>.two[hidden]{display:none!important} .sf-professional.sf-page-production .tool-switch{position:sticky;top:0;z-index:6;box-shadow:0 4px 16px #1b355509} .sf-professional.sf-page-theme .frame{height:calc(100vh - 285px)} @media(max-width:650px){.sf-ops-tabs{grid-template-columns:1fr;gap:7px}.sf-ops-tabs button{padding:9px 12px}.sf-professional.sf-page-production .tool-switch{position:static}}