/* Dev UI v1: content only. Shared chrome belongs to site-shell.css. */
.dev-portal { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 24px; border:1px solid var(--line); border-radius:10px; background:var(--side); }
.dev-portal > div { display:grid; gap:4px; }
.dev-portal .muted { font-size:13px; }
.dev-portal > span { color:var(--accent); }
.dev-public { display:flex; flex-direction:column; gap:32px; width:min(900px, calc(100% - 64px)); margin:56px auto 48px; min-width:0; }
.dev-login { max-width:900px; }
.dev-ui { --button:#e5eaf0; --button-ink:#191d21; }
[data-theme="light"] .dev-ui { --button:#293744; --button-ink:#fafbfc; }
.dev-panel { width:100%; display:grid; grid-template-columns:232px minmax(0,1fr); min-width:0; }
.dev-sidebar { display:flex; flex-direction:column; align-items:stretch; gap:12px; padding:24px; background:var(--side); min-width:0; }
.dev-menu-link { display:flex; gap:12px; align-items:center; min-height:44px; padding:10px 12px; border-radius:6px; }
.dev-menu-link[aria-current="page"] { background:var(--selected); }
.dev-menu-link:hover { background:var(--raised); }
.dev-sidebar .eyebrow { margin-bottom:4px; }
.dev-workspace { display:flex; flex-direction:column; align-items:stretch; gap:32px; padding:40px; min-width:0; }
.dev-document { display:flex; flex-direction:column; gap:24px; min-width:0; }
.dev-ui .page-heading { display:flex; flex-direction:column; gap:12px; }
.dev-ui h1 { font-size:40px; line-height:48px; letter-spacing:-.8px; font-weight:500; overflow-wrap:anywhere; }
.dev-ui h2 { font-size:24px; line-height:32px; font-weight:500; overflow-wrap:anywhere; }
.dev-ui p { line-height:1.5; }
.dev-ui .page-heading > .muted { font-size:15px; line-height:22px; }
.dev-ui .eyebrow, .dev-sidebar .eyebrow { font-size:11px; line-height:18px; font-weight:500; color:var(--muted); }
.dev-ui .help, .dev-sidebar .help { font-size:13px; line-height:20px; color:var(--muted); overflow-wrap:anywhere; }
.dev-ui .card, .dev-ui .project-card, .dev-ui .project-row, .dev-ui .empty { display:flex; flex-direction:column; align-items:stretch; gap:20px; min-width:0; padding:24px; border:1px solid var(--line); background:var(--panel); border-radius:10px; }
.dev-ui .card form { display:flex; flex-direction:column; gap:20px; min-width:0; }
.dev-ui .project-grid, .dev-ui .project-list { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; }
.dev-ui .project-row h2 { font-size:15px; line-height:22px; }
.dev-ui .project-row-meta, .dev-ui .project-card-actions, .dev-ui .user-row, .dev-ui .dev-gallery-meta { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.dev-ui .project-card-actions { justify-content:flex-start; }
.dev-ui .project-card h2, .dev-ui .project-row h2 { display:flex; align-items:center; gap:12px; }
.dev-ui .project-card h2::before, .dev-ui .project-row h2::before { content:""; display:block; width:18px; height:18px; flex:0 0 18px; background:var(--accent); mask:url("design/dark/dev.svg") center/contain no-repeat; }
.dev-ui .user-row h2 { font-size:15px; line-height:22px; }
.dev-ui .project-row > div:first-child { display:grid; gap:12px; }
.dev-ui .project-row .row-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.dev-ui .project-row-meta .badge { margin-left:auto; }
.dev-ui .project-card { align-items:flex-start; }
.dev-ui .project-card h2 { font-size:22px; line-height:28px; }
.dev-ui .project-link { display:inline-flex; min-height:44px; align-items:center; padding:10px 16px; border:1px solid var(--line); border-radius:6px; font-weight:500; }
.dev-ui .field { display:flex; flex-direction:column; gap:8px; min-width:0; }
.dev-ui label { font-weight:500; }
.dev-ui select, .dev-ui textarea, .dev-ui input:not([type="hidden"]):not([type="checkbox"]) { width:100%; min-width:0; height:44px; padding:10px 14px; border:1px solid var(--line); border-radius:6px; font:inherit; background:var(--panel); color:var(--text); }
.dev-ui textarea { min-height:112px; resize:vertical; }
.dev-ui .project-description { white-space:pre-wrap; overflow-wrap:anywhere; }
.dev-ui select:focus-visible, .dev-ui input:focus-visible, .dev-ui textarea:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.dev-ui input[aria-invalid="true"] { border-color:var(--accent); }
.dev-ui button, .dev-ui .button, .dev-sidebar button { display:inline-flex; align-items:center; justify-content:center; align-self:flex-start; min-height:44px; padding:10px 16px; border:1px solid transparent; border-radius:6px; font:500 15px/22px "IBM Plex Sans",sans-serif; cursor:pointer; color:var(--button-ink,#191d21); background:var(--button,#e5eaf0); text-decoration:none; }
[data-theme="light"] .dev-sidebar button { --button:#293744; --button-ink:#fafbfc; }
.dev-ui button:hover, .dev-ui .button:hover, .dev-ui .project-link:hover { filter:brightness(.94); }
.dev-ui .secondary, .dev-sidebar button.secondary { color:var(--text); background:var(--panel); border-color:var(--line); }
.dev-ui .badge { display:inline-flex; align-items:center; align-self:flex-start; width:max-content; max-width:100%; min-height:28px; padding:4px 10px; border-radius:6px; font-size:12px; line-height:20px; color:var(--muted); background:var(--raised); }
.dev-ui .badge.pending { background:var(--selected); color:var(--accent); }
.dev-ui .badge.rejected { border:1px dashed var(--line); }
.dev-ui .filters, .dev-ui .pagination { display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.dev-ui .filters a, .dev-ui .pagination a { display:inline-flex; min-height:44px; align-items:center; color:var(--muted); }
.dev-ui .filters a[aria-current="page"] { color:var(--text); box-shadow:inset 0 -2px var(--accent); }
.dev-ui .pagination { justify-content:space-between; }
.dev-ui .notice { display:flex; flex-direction:column; gap:12px; padding:20px; border-radius:8px; background:var(--selected); }
.dev-ui .notice h2 { font-size:15px; line-height:22px; }
.dev-ui .notice a { text-decoration:underline; text-underline-offset:3px; }
.dev-ui .notice p { color:var(--muted); font-size:13px; line-height:20px; }
.dev-ui .details p, .dev-ui pre, .dev-ui code { overflow-wrap:anywhere; word-break:break-word; }
.dev-ui .details a { color:var(--accent); }
.dev-ui pre { margin:0; white-space:pre-wrap; padding:16px; background:var(--side); border-radius:6px; }
.dev-ui code { font:400 12px/20px "IBM Plex Mono",monospace; }
.dev-ui .owner-option { display:flex; align-items:center; gap:12px; min-height:44px; }
.dev-ui .owner-option input { width:18px; height:18px; accent-color:var(--accent); }
.dev-ui .login-card { max-width:900px; width:100%; }
.dev-controls { display:none; }
@media (max-width:999px) and (min-width:720px) {
    .dev-panel { grid-template-columns:200px minmax(0,1fr); }
    .dev-sidebar { padding:20px 16px; }
    .dev-workspace { padding:32px 24px; }
}
@media (max-width:719px) {
    .dev-public { width:calc(100% - 48px); margin:24px auto 48px; }
    .dev-panel { display:flex; flex-direction:column; padding:24px; gap:24px; }
    .dev-sidebar { flex-direction:row; flex-wrap:wrap; padding:0 0 16px; gap:8px; }
    .dev-sidebar .eyebrow, .dev-role { display:none; }
    .dev-menu-link { font-size:13px; padding:10px; gap:8px; }
    .dev-workspace { padding:0; }
    .dev-workspace > .eyebrow { display:none; }
    .dev-ui h1 { font-size:32px; line-height:40px; letter-spacing:0; }
    .dev-ui .card, .dev-ui .project-card, .dev-ui .project-row, .dev-ui .empty { padding:24px; }
    .dev-ui .row-actions { align-items:flex-start; }
    .dev-ui .project-row .badge { margin-left:0; }
    .dev-controls { display:flex; justify-content:space-between; align-items:center; min-height:44px; }
    .dev-portal { flex-direction:column; align-items:flex-start; }
    .dev-ui .filters { gap:12px; font-size:13px; }
}