/* One shared control surface: an admin page, or the app's two-finger dialog. */
html:not([data-control-center="admin"]) .scenario-control:not(.mobile-visible),
body #demo-control-launcher { display: none !important; }
html:not([data-control-center="admin"]) .prototype-stage { padding-inline: 0 !important; }
.scenario-control.mobile-visible { display:block !important; position:fixed !important; inset:0 !important; width:100% !important; height:100dvh !important; max-width:none !important; padding:20px !important; overflow:auto !important; z-index:1000 !important; border-radius:0 !important; }
.scenario-control.mobile-visible .scenario-desktop-header { display:none !important; }
.scenario-control.mobile-visible .scenario-mobile-header { display:flex !important; justify-content:space-between; align-items:center; gap:16px; }
.scenario-control.mobile-visible .scenario-panel { width:100% !important; min-width:0 !important; max-width:520px; height:auto !important; margin:auto; visibility:visible !important; opacity:1 !important; }

html[data-control-center="admin"] body { padding:20px; overflow:auto !important; background:var(--surface,#fff); }
html[data-control-center="admin"] .scenario-control { display:block !important; position:static !important; width:100% !important; height:auto !important; max-height:none !important; padding:0 !important; overflow:visible !important; border:0; }
html[data-control-center="admin"] .scenario-panel { width:100% !important; min-width:0 !important; height:auto !important; padding:0 !important; overflow:visible !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; }
html[data-control-center="admin"] :is(.scenario-desktop-header,.scenario-mobile-header) { display:none !important; }
#remote-status { margin:0; font:14px/24px Vazirmatn,sans-serif; }
#remote-connection { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; padding:20px; margin-bottom:24px; border-radius:16px; background:var(--soft,#f3f0fc); color:var(--ink,#282237); }
#remote-connection-title { margin:0 0 8px; font:600 18px/28px Vazirmatn,sans-serif; }
.remote-connection-help { margin:8px 0 0; font:14px/24px Vazirmatn,sans-serif; }
#remote-connection[data-state="connected"] :is(#remote-connection-title,.remote-connection-help) { display:none; }
.remote-open-app { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; min-height:48px; padding:10px 20px; border-radius:999px; background:var(--admin-primary,var(--brand,#6550cc)); color:#fff; text-decoration:none; font:500 14px/24px Vazirmatn,sans-serif; }
.remote-open-app:focus-visible { outline:2px solid currentColor; outline-offset:4px; }
#remote-controls[inert] { opacity:.45; }
body.remote-mock-controls #mock-data-modal { display:none !important; }
body.remote-mock-controls { overflow:auto !important; }

.nova-palette-control { display:grid; gap:16px; margin-block:20px; padding:20px; border-radius:24px; background:#f7f5fc; color:#282237; }
.nova-palette-control header { display:grid; gap:4px; }
.nova-palette-control header strong { font:600 16px/26px "Vazirmatn SemiBold",sans-serif; }
.nova-palette-control :is(small,p) { font:400 12px/20px "Vazirmatn Regular",sans-serif; color:#625a74; }
.nova-palette-control p { margin:0; }
.nova-palette-mode { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; font-size:14px; }
.nova-palette-mode select { min-height:48px; padding:8px 16px; border:1px solid #a09da7; border-radius:16px; color:inherit; background:#fff; font:inherit; }
.nova-palette-control fieldset { display:grid; gap:16px; margin:0; padding:0; min-width:0; border:0; }
.nova-colour-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; cursor:pointer; }
.nova-colour-row > span:first-child { display:grid; gap:4px; }
.nova-colour-row strong { font:600 14px/24px "Vazirmatn SemiBold",sans-serif; }
.nova-colour-input { display:grid; justify-items:center; gap:4px; }
.nova-colour-input input[type="color"] { box-sizing:border-box; width:56px; height:48px; padding:4px; border:1px solid #a09da7; border-radius:12px; background:#fff; cursor:pointer; }
.nova-colour-input input::-webkit-color-swatch-wrapper { padding:0; }
.nova-colour-input input::-webkit-color-swatch { border:0; border-radius:8px; }
.nova-colour-input input::-moz-color-swatch { border:0; border-radius:8px; }
.nova-colour-input code { font:12px/20px monospace; }
.nova-palette-control button { min-height:48px; padding:12px 16px; border:0; border-radius:16px; background:#eee9fb; color:#4a3d84; font:600 14px/24px "Vazirmatn SemiBold",sans-serif; cursor:pointer; }
.nova-palette-control :is(input,select,button):focus-visible { outline:2px solid #6550cc; outline-offset:3px; }
.nova-palette-control :disabled { opacity:.5; cursor:default; }
html[data-color-scheme="dark"] .nova-palette-control { background:#282c32; color:#f2f3f5; }
html[data-color-scheme="dark"] .nova-palette-control :is(small,p) { color:#bbc1ca; }
html[data-color-scheme="dark"] .nova-palette-control :is(select,input[type="color"]) { background:#1d2025; border-color:#7e8793; }
html[data-color-scheme="dark"] .nova-palette-control button { background:#302c40; color:#c1afff; }
html[data-color-scheme="dark"] .nova-palette-control :is(input,select,button):focus-visible { outline-color:#c1afff; }