/* Owner panel (G1–G12) layer on top of ui/components.css + groups/g1.css / g2.css. Owned by web-owner-a.
   Only what real pages need beyond the artboards: sticky bars, form controls, links, chat polish. Tokens only. */

/* sticky bottom bars (artboard bars are flex:none at the bottom of a fixed-height phone) */
body.owner-panel .screen.page > .tab-bar.owner,
body.owner-panel .screen.page > .sticky-actions,
body.owner-panel .screen.page > .composer { position: sticky; bottom: 0; z-index: 20; }
body.owner-panel .screen.page > .tab-bar.owner { padding-bottom: calc(8px + env(safe-area-inset-bottom)); }
body.owner-panel .screen.page > .sticky-actions { padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
body.owner-panel .screen.page > .owner-dock { position: sticky; bottom: 0; z-index: 20; }
body.owner-panel .owner-dock > .tab-bar.owner { padding-bottom: calc(8px + env(safe-area-inset-bottom)); }
body.owner-panel .screen.page > .top-bar { position: sticky; top: 0; z-index: 20; background: var(--paper); padding-top: 12px; }
body.owner-panel .screen.page > .content { padding-bottom: 24px; }
.owner-chat-page + .composer { margin-top: auto; }

/* links that look like their artboard element */
body.owner-panel a { text-decoration: none; }
a.list-row, a.owner-link, a.owner-plain { color: inherit; }
a.site-preview { color: var(--on-ink); }
a.owner-link { display: flex; }
a.list-row:hover .chev, a.owner-link:hover .t-caption-strong { opacity: .75; }
.owner-plain:hover { text-decoration: underline; }
a.btn { text-decoration: none; }
a.site-preview { display: flex; }
.site-preview .photo { background-repeat: no-repeat; }
.owner-clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.owner-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.owner-break { overflow-wrap: anywhere; }
.owner-center { text-align: center; }
.owner-pre { white-space: pre-line; overflow-wrap: anywhere; }

/* header avatar menu (Sair) */
.owner-avatar-menu { position: relative; }
.owner-avatar-menu details > summary { list-style: none; cursor: pointer; }
.owner-avatar-menu details > summary::-webkit-details-marker { display: none; }
.owner-avatar-menu .menu { position: absolute; right: 0; top: 52px; z-index: 30; padding: 6px; min-width: 132px;
  box-shadow: var(--shadow-float); }
.owner-avatar-menu .menu .btn { width: 100%; justify-content: flex-start; }

/* site switcher */
.owner-switcher { overflow-x: auto; scrollbar-width: none; }
.owner-switcher .chip { text-decoration: none; }

/* toasts */
.owner-toast { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(96px + env(safe-area-inset-bottom));
  width: calc(100% - 32px); max-width: 448px; z-index: 50; transition: opacity .3s ease; }
.owner-toast.error { background: var(--red); }
.owner-toast.hide { opacity: 0; pointer-events: none; }
.owner-toast form { display: contents; }
.owner-toast-act { background: none; border: 0; color: var(--live); font: 600 15px/21px var(--font-ui); cursor: pointer; padding: 0 0 0 8px; }

/* login (G1/G2) */
.owner-login { min-height: 100dvh; }
.owner-login-foot { align-items: center; text-align: center; margin-top: auto; }
.owner-input { border: 0; outline: 0; background: transparent; font: inherit; color: var(--ink); min-width: 0; padding: 0; }
.owner-input::placeholder { color: var(--ink-subtle); }
.input:focus-within .field { box-shadow: inset 0 0 0 2px var(--ink); }
.input.error:focus-within .field { box-shadow: inset 0 0 0 2px var(--red); }
.owner-resend[disabled] { color: var(--ink-subtle); opacity: 1; }
.owner-resend:not([disabled]) { color: var(--live-strong); }

/* home (G3) */
.owner-stat { min-width: 0; flex-basis: 0; }
.owner-stat .meta { display: inline-flex; align-items: center; gap: 4px; font: 400 13px/18px var(--font-ui); }
.owner-stat .meta .i { --i: 14px; }
.owner-empty { align-items: flex-start; }

/* chat (G4) */
.owner-chat { overflow: visible; justify-content: flex-start; flex: 1 1 auto; }
.owner-turn { display: flex; flex-direction: column; gap: 12px; }
.owner-turn .stamp { align-self: center; }
.attach img.ph { object-fit: cover; display: block; }
.attach .col { min-width: 0; max-width: 180px; }
.owner-examples { align-items: flex-start; }
.owner-examples .chip { white-space: normal; text-align: left; font-weight: 500; }
.owner-outcome { align-items: center; flex-wrap: wrap; }
.owner-outcome .owner-ellipsis { max-width: 220px; }
.owner-composer { flex-direction: column; align-items: stretch; gap: 8px; }
.owner-composer-row { align-items: flex-end; }
.owner-composer-top:has(.owner-composer-error:empty):has(.owner-files[hidden]) { display: none; }
.owner-textarea { resize: none; border: 0; outline: 0; font: 400 15px/21px var(--font-ui); color: var(--ink); min-height: 44px;
  max-height: 140px; padding: 11px 16px; border-radius: 22px; }
.owner-textarea::placeholder { color: var(--ink-subtle); }
.owner-textarea:focus { box-shadow: inset 0 0 0 2px var(--ink); }
.owner-attach { cursor: pointer; }
.owner-attach:focus-within { box-shadow: inset 0 0 0 2px var(--ink); }
.owner-files { display: flex; gap: 8px; overflow-x: auto; }
.owner-files[hidden] { display: none; }
.owner-file { position: relative; flex: none; width: 56px; height: 56px; border-radius: 10px; overflow: hidden; background: var(--paper); }
.owner-file img { width: 100%; height: 100%; object-fit: cover; display: block; }
.owner-file button { position: absolute; top: 2px; right: 2px; width: 20px; height: 20px; border-radius: 50%; border: 0;
  background: var(--ink); color: var(--on-ink); display: grid; place-items: center; cursor: pointer; padding: 0; }
.owner-file button .i { --i: 12px; }
.owner-mini-banner { padding: 8px 12px; }
.circle-btn[disabled], .owner-textarea[disabled] { opacity: .5; cursor: not-allowed; }
.owner-dots { display: inline-flex; gap: 4px; margin-left: 6px; vertical-align: middle; }
.owner-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--ink-subtle); animation: owner-blink 1.2s infinite both; }
.owner-dots i:nth-child(2) { animation-delay: .2s; } .owner-dots i:nth-child(3) { animation-delay: .4s; }
@keyframes owner-blink { 0%, 80%, 100% { opacity: .25; } 40% { opacity: 1; } }
.owner-spin { animation: owner-rot 1s linear infinite; }
@keyframes owner-rot { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .owner-spin, .owner-dots i { animation: none; } }

/* draft preview (G5) */
.owner-seg .item { text-decoration: none; cursor: pointer; }
.owner-frame { display: flex; flex-direction: column; }
.owner-frame iframe { display: block; width: 100%; height: min(52vh, 520px); border: 0; background: var(--surface); }

/* versions (G6) */
.owner-versions .tl-item:last-child .rail .line { display: none; }
.owner-versions form { flex: none; }