#cloudSharePanel{display:grid;gap:8px;padding-top:10px;border-top:1px solid color-mix(in srgb,currentColor 22%,transparent);font-size:12px;color:inherit}
#cloudSharePanel .cloud-head{display:flex;justify-content:space-between;gap:8px}
#cloudSharePanel .cloud-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
#cloudSharePanel .cloud-btn,#cloudSharePanel select{min-height:36px;padding:6px 10px;border:1px solid color-mix(in srgb,currentColor 30%,transparent);border-radius:10px;background:transparent;color:inherit;font:inherit}
#cloudSharePanel .cloud-btn:disabled{opacity:.45}
#cloudSharePanel .cloud-btn:focus-visible{outline:2px solid var(--focus-ring,#5eead4);outline-offset:2px}
#cloudSharePanel[data-signed-in="false"] .cloud-row,#cloudSharePanel[data-signed-in="false"] fieldset,#cloudSharePanel[data-signed-in="false"] details{display:none}
#cloudSharePanel fieldset{border:1px solid color-mix(in srgb,currentColor 22%,transparent);border-radius:10px;padding:6px 10px;display:grid;gap:4px}
#cloudSharePanel ol,#cloudSharePanel ul{max-height:140px;overflow:auto;padding-left:18px;display:grid;gap:4px}
#cloudSharePanel a{color:#0369a1;text-decoration:underline}
#cloudSharePanel legend,#cloudSharePanel .cloud-list li{color:inherit;opacity:1}
#shareModal>div{max-height:92dvh;overflow:auto}
@media(pointer:coarse){#cloudSharePanel .cloud-btn,#cloudSharePanel select{min-height:44px}}
#cloudSharePanel .cloud-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
#cloudSharePanel .cloud-grid label{display:grid;gap:3px;color:inherit}
#cloudSharePanel .cloud-grid input{min-height:36px;padding:6px 10px;border:1px solid color-mix(in srgb,currentColor 30%,transparent);border-radius:10px;background:transparent;color:inherit;font:inherit;width:100%;box-sizing:border-box}
#cloudSharePanel .cloud-check input{width:18px;height:18px}
#cloudSharePanel .cloud-primary{background:#18181b;color:#fff;border-color:#18181b;font-weight:700}
#cloudSharePanel .cloud-login{display:none;color:#7dd3fc}
#cloudSharePanel[data-signed-in="false"] .cloud-login{display:block}
#cloudSharePanel[data-signed-in="false"] .cloud-grid,#cloudSharePanel[data-signed-in="false"] .cloud-check{display:none}
#cloudViewerBar{position:fixed;left:50%;top:calc(12px + env(safe-area-inset-top));transform:translateX(-50%);z-index:100150;display:flex;flex-wrap:wrap;align-items:center;gap:8px;max-width:calc(100vw - 32px);box-sizing:border-box;padding:8px 12px;border:1px solid #334155;border-radius:16px;background:rgba(15,23,42,.92);color:#e2e8f0;font-size:13px}
#cloudViewerBar .cloud-badge{padding:2px 8px;border-radius:999px;background:#334155}
#cloudViewerBar input{min-height:40px;flex:1 1 160px;min-width:0;padding:6px 10px;border:1px solid #475569;border-radius:10px;background:#1e293b;color:inherit;font:inherit}
#cloudViewerBar .cloud-btn{min-height:40px;padding:6px 12px;border:1px solid #475569;border-radius:10px;background:#1e293b;color:inherit;font:inherit}
#cloudViewerBar .cloud-primary{background:#f8fafc;color:#0f172a;font-weight:700}
#cloudViewerBar .cloud-btn:focus-visible,#cloudViewerBar input:focus-visible{outline:2px solid var(--focus-ring,#5eead4);outline-offset:2px}
#cloudViewerError{position:fixed;inset:auto 16px 16px;z-index:70;padding:12px 16px;border-radius:14px;background:#7f1d1d;color:#fff;font-size:14px}
html[data-cloud-viewer="full"] #cloudViewerBar{top:calc(64px + env(safe-area-inset-top))}
/* Student / viewer link (?ui=min): hide the editor chrome, keep the board, page navigation and zoom. */
html[data-cloud-viewer="min"] body #topNavbar,html[data-cloud-viewer="min"] body #appShell,html[data-cloud-viewer="min"] body .app-shell-toggle,html[data-cloud-viewer="min"] body .app-shell-backdrop,html[data-cloud-viewer="min"] body #leftSidebar,html[data-cloud-viewer="min"] body #t1021ToolOpts,html[data-cloud-viewer="min"] body #ai-assistant-bar,html[data-cloud-viewer="min"] body #redesignContext,html[data-cloud-viewer="min"] body #redesignPresent{display:none!important}
html[data-cloud-viewer="min"] body{padding-left:0!important}
/* The phone tool rail carries inline display:flex!important from the layout code; visibility still applies. */
html[data-cloud-viewer="min"] body #leftSidebar{visibility:hidden!important;pointer-events:none!important}
html[data-cloud-viewer="min"] body #btnAddPage{visibility:hidden!important;pointer-events:none!important}
@media(max-width:640px){
/* Keep an invalid-link explanation above the measured pages/tools/command stack. */
#cloudViewerError{bottom:calc(var(--mobile-stack-bottom,var(--command-bottom,108px)) + 64px)}
#cloudViewerBar{left:16px;right:16px;transform:none;max-width:none;top:auto;bottom:calc(96px + env(safe-area-inset-bottom))}
html[data-cloud-viewer="full"] #cloudViewerBar{top:auto;bottom:calc(168px + env(safe-area-inset-bottom))}
#cloudViewerBar input{flex-basis:100%}
}

#cloudSaveAlert{position:fixed;bottom:calc(110px + env(safe-area-inset-bottom));left:16px;right:16px;z-index:100160;padding:12px 16px;border-radius:12px;background:#7f1d1d;color:#fff;font-size:14px}
#cloudLoginNotice{flex-basis:100%;display:grid;gap:8px;max-width:500px}
#cloudSharePanel .cloud-check{min-height:44px;cursor:pointer}
#cloudViewerBar .cloud-btn{min-height:44px}
#shareModal{z-index:100170}

/* The cookie choice must remain reachable before showing the share toolbar. */
body:has(#cookieBanner) #cloudViewerBar{visibility:hidden}