/*==============================================================
    PHIORO ADMIN
    Shared admin design system + page layout
==============================================================*/

:root {
    --phi-admin-bg:#000;
    --phi-admin-surface:#000;
    --phi-admin-surface-soft:#111;
    --phi-admin-control:darkslategrey;
    --phi-admin-control-hover:#365f5f;
    --phi-admin-text:#fff;
    --phi-admin-muted:#fff;
    --phi-admin-border:#fff;
    --phi-admin-danger:#ff6b6b;
    --phi-admin-success:#8fd18f;
    --phi-admin-radius:6px;
    --phi-admin-card-radius:8px;
}

*,
*::before,
*::after {
    box-sizing:border-box;
}

html {
    scroll-behavior:smooth;
    background:var(--phi-admin-bg);
}

body.admin-page,
body.admin-login-page,
body.admin-factory-page {
    min-height:100vh;
    margin:0;
    color:var(--phi-admin-text);
    background:var(--phi-admin-bg);
    font-family:var(--font-main, "Amatic SC", "Segoe Print", "Bradley Hand", cursive);
    color-scheme:dark;
}

body.admin-page a,
body.admin-login-page a,
body.admin-factory-page a {
    color:inherit;
    text-decoration:none;
}

body.admin-page small,
body.admin-login-page small,
body.admin-factory-page small,
body.admin-page .muted,
body.admin-login-page .muted,
body.admin-factory-page .muted,
body.admin-page .help,
body.admin-login-page .help,
body.admin-factory-page .help {
    color:var(--phi-admin-muted);
}

/*==============================================================
    GLOBAL FORM CONTROLS
==============================================================*/

body.admin-page button,
body.admin-page input,
body.admin-page select,
body.admin-page textarea,
body.admin-login-page button,
body.admin-login-page input,
body.admin-login-page select,
body.admin-login-page textarea,
body.admin-factory-page button,
body.admin-factory-page input,
body.admin-factory-page select,
body.admin-factory-page textarea {
    font:inherit;
}

body.admin-page input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]),
body.admin-page textarea,
body.admin-page select,
body.admin-login-page input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]),
body.admin-login-page textarea,
body.admin-login-page select,
body.admin-factory-page input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]),
body.admin-factory-page textarea,
body.admin-factory-page select {
    color:var(--phi-admin-text);
    background:var(--phi-admin-control);
    border:1px solid var(--phi-admin-border);
    border-radius:var(--phi-admin-radius);
}

body.admin-page input::placeholder,
body.admin-page textarea::placeholder,
body.admin-login-page input::placeholder,
body.admin-login-page textarea::placeholder,
body.admin-factory-page input::placeholder,
body.admin-factory-page textarea::placeholder {
    color:var(--phi-admin-text);
    opacity:.72;
}

body.admin-page input:focus,
body.admin-page textarea:focus,
body.admin-page select:focus,
body.admin-login-page input:focus,
body.admin-login-page textarea:focus,
body.admin-login-page select:focus,
body.admin-factory-page input:focus,
body.admin-factory-page textarea:focus,
body.admin-factory-page select:focus {
    outline:2px solid var(--phi-admin-border);
    outline-offset:1px;
}

body.admin-page input[type="checkbox"],
body.admin-page input[type="radio"],
body.admin-login-page input[type="checkbox"],
body.admin-login-page input[type="radio"],
body.admin-factory-page input[type="checkbox"],
body.admin-factory-page input[type="radio"] {
    width:auto;
    accent-color:darkslategrey;
}

body.admin-page button,
body.admin-page .button,
body.admin-login-page button,
body.admin-login-page .button,
body.admin-factory-page button,
body.admin-factory-page .button {
    appearance:none;
    color:var(--phi-admin-text);
    background:var(--phi-admin-control);
    border:1px solid var(--phi-admin-border);
    border-radius:var(--phi-admin-radius);
    cursor:pointer;
}

body.admin-page button:hover,
body.admin-page .button:hover,
body.admin-login-page button:hover,
body.admin-login-page .button:hover,
body.admin-factory-page button:hover,
body.admin-factory-page .button:hover {
    background:var(--phi-admin-control-hover);
}

body.admin-page button:disabled,
body.admin-page .button:disabled,
body.admin-login-page button:disabled,
body.admin-login-page .button:disabled,
body.admin-factory-page button:disabled,
body.admin-factory-page .button:disabled {
    opacity:.55;
    cursor:default;
}

/*==============================================================
    GLOBAL SURFACES
==============================================================*/

body.admin-page .container,
body.admin-page .panel,
body.admin-page .card,
body.admin-page .sort-item,
body.admin-login-page .container,
body.admin-login-page .panel,
body.admin-login-page .card,
body.admin-factory-page .container,
body.admin-factory-page .panel,
body.admin-factory-page .card,
body.admin-factory-page .factory-section,
body.admin-factory-page .created {
    color:var(--phi-admin-text);
    background:var(--phi-admin-surface);
    border:1px solid var(--phi-admin-border);
    border-radius:var(--phi-admin-card-radius);
}

body.admin-page .form-section {
    color:var(--phi-admin-text);
    background:var(--phi-admin-surface);
    border:1px solid var(--phi-admin-border);
}

body.admin-page .form-actions {
    color:var(--phi-admin-text);
    background:var(--phi-admin-bg);
    border-top:1px solid var(--phi-admin-border);
}

body.admin-page .checkbox-row {
    color:var(--phi-admin-text);
    background:var(--phi-admin-control);
    border:1px solid var(--phi-admin-border);
    border-radius:var(--phi-admin-radius);
}

body.admin-page .badge {
    color:var(--phi-admin-text);
    background:var(--phi-admin-control);
    border:1px solid var(--phi-admin-border);
}

body.admin-page table {
    color:var(--phi-admin-text);
    background:var(--phi-admin-bg);
}

body.admin-page th,
body.admin-page td {
    border-color:var(--phi-admin-border);
}

body.admin-page th {
    color:var(--phi-admin-text);
    background:var(--phi-admin-bg);
}

body.admin-page .empty,
body.admin-page .empty-message {
    color:var(--phi-admin-text);
    border-color:var(--phi-admin-border);
}

body.admin-page .message,
body.admin-factory-page .message {
    color:var(--phi-admin-success);
    background:var(--phi-admin-bg);
    border:1px solid var(--phi-admin-success);
}

body.admin-page .error,
body.admin-login-page .error,
body.admin-factory-page .error {
    color:var(--phi-admin-danger);
    background:var(--phi-admin-bg);
    border:1px solid var(--phi-admin-danger);
}

/*==============================================================
    DASHBOARD
==============================================================*/

body.admin-dashboard {
    width:100%;
    max-width:1100px;
    margin:0 auto;
    padding:40px 20px 60px;
}

.admin-dashboard .dashboard-header {
    margin-bottom:28px;
    font-size:3em;
}

.admin-dashboard .dashboard-header h1 {
    margin:0;
    padding:1px 10px 10px 0;
    font-size:3rem;
    text-align:right;
}

.admin-dashboard .welcome {
    margin:0;
    padding:10px 10px 10px 0;
    font-size:2.2rem;
    text-align:right;
}

.admin-dashboard .welcome-greeting {
    display:inline-block;
    margin-right:.2em;
}

.admin-dashboard .hero {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:420px;
    margin-bottom:0;
    padding:24px;
    overflow:hidden;
    border-radius:14px;
    background:var(--phi-admin-surface-soft);
    box-shadow:0 10px 30px rgba(0,0,0,.35);
}

.admin-dashboard .hero-image {
    display:block;
    width:auto;
    max-width:100%;
    height:auto;
    max-height:65vh;
    object-fit:contain;
    opacity:0;
    transform:scale(.97);
    animation:reveal-artwork .8s ease forwards;
}

@keyframes reveal-artwork {
    to {
        opacity:1;
        transform:scale(1);
    }
}

.admin-dashboard .hero-caption {
    position:absolute;
    right:18px;
    bottom:16px;
    left:18px;
    margin:0;
    font-size:.9rem;
    text-align:center;
    text-shadow:0 1px 4px rgba(0,0,0,.9);
}

.admin-dashboard .hero-empty {
    margin:0;
    font-size:1rem;
    text-align:center;
}

.admin-dashboard .dashboard-science-fact {
    max-width:680px;
    margin:16px auto 30px;
    padding:0;
    background:transparent;
    color:#fff;
    text-align:center;
    font-size:1.25rem;
    line-height:1.35;
}

@media(max-width:700px) {
    body.admin-dashboard {
        padding:24px 14px 100px !important;
    }

    .admin-dashboard .dashboard-header h1 {
        font-size:1.8rem;
    }

    .admin-dashboard .hero {
        min-height:300px;
        margin-bottom:0;
        padding:14px;
        border-radius:10px;
    }

    .admin-dashboard .hero-image {
        max-height:38vh;
    }

    .admin-dashboard .hero-caption {
        right:12px;
        bottom:10px;
        left:12px;
        font-size:.8rem;
    }

    .admin-dashboard .dashboard-science-fact {
        margin:14px auto 20px;
        padding:0;
        font-size:1.1rem;
    }
}

/*==============================================================
    GALLERY MANAGER
==============================================================*/

body.admin-gallery {
    width:100%;
    max-width:1200px;
    margin:40px auto;
    padding:20px;
}

.admin-gallery .message {
    margin-bottom:25px;
    padding:12px;
}

.admin-gallery .grid {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(250px, 1fr));
    gap:25px;
}

.admin-gallery .card {
    overflow:hidden;
}

.admin-gallery .image-link {
    display:block;
}

.admin-gallery .card img {
    display:block;
    width:100%;
    height:220px;
    object-fit:cover;
    background:var(--phi-admin-control);
}

.admin-gallery .image-placeholder {
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:220px;
    padding:20px;
    background:var(--phi-admin-control);
    text-align:center;
}

.admin-gallery .card-content {
    padding:15px;
}

.admin-gallery .title {
    margin-bottom:6px;
    font-size:18px;
    font-weight:bold;
}

.admin-gallery .category {
    margin-bottom:10px;
}

.admin-gallery .metadata {
    min-height:42px;
    font-size:14px;
    line-height:1.5;
}

.admin-gallery .badges {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:12px;
}

.admin-gallery .badge {
    display:inline-block;
    padding:4px 8px;
    border-radius:999px;
    font-size:12px;
}

.admin-gallery .buttons {
    display:flex;
    gap:8px;
    margin-top:15px;
}

.admin-gallery .button {
    display:inline-block;
    padding:8px 12px;
}

.admin-gallery .delete-button {
    color:var(--phi-admin-danger);
}

.admin-gallery .empty-message {
    padding:30px;
    border-style:dashed;
    text-align:center;
}

@media(max-width:700px) {
    body.admin-gallery {
        padding:20px 14px 100px !important;
    }
}

/*==============================================================
    ARTWORK FORMS — UPLOAD + EDIT
==============================================================*/

body.admin-upload,
body.admin-edit {
    margin:0;
    padding:32px 28px 70px 130px;
    font-size:1.5rem;
}

body.admin-upload {
    padding-top:10px;
    padding-bottom:20px;
}

.admin-upload .container,
.admin-edit .container {
    width:100%;
    max-width:1050px;
    margin:auto;
    padding:28px;
}

.admin-upload .container {
    padding:18px 22px;
}

.admin-upload h1,
.admin-edit h1 {
    margin:0 0 20px;
    font-size:3rem;
}

.admin-upload h1 {
    margin-bottom:8px;
    font-size:2.45rem;
}

.admin-upload .upload-page-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:8px;
}

.admin-upload .upload-page-heading h1 {
    margin:0;
}

.admin-upload label,
.admin-edit label {
    display:block;
    margin-top:14px;
    margin-bottom:5px;
    font-weight:bold;
}

.admin-upload input,
.admin-upload textarea,
.admin-upload select,
.admin-edit input,
.admin-edit textarea,
.admin-edit select {
    width:100%;
    padding:9px 10px;
}

.admin-upload textarea,
.admin-edit textarea {
    min-height:105px;
    resize:vertical;
}

.admin-upload button,
.admin-edit button {
    padding:10px 24px;
}

.admin-upload .category-native-select,
.admin-edit .category-native-select,
.admin-upload .media-file-input {
    position:absolute;
    width:1px;
    height:1px;
    margin:-1px;
    padding:0;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
}

.admin-upload .category-picker,
.admin-edit .category-picker {
    position:relative;
    width:100%;
}

.admin-upload .category-picker-button,
.admin-edit .category-picker-button {
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    margin:0;
    padding:9px 10px;
    text-align:left;
}

.admin-upload .category-picker-button::after,
.admin-edit .category-picker-button::after {
    content:"▾";
    margin-left:12px;
}

.admin-upload .category-picker-menu,
.admin-edit .category-picker-menu {
    position:absolute;
    top:calc(100% + 2px);
    right:0;
    left:0;
    z-index:30;
    display:none;
    max-height:260px;
    overflow-y:auto;
    background:var(--phi-admin-control);
    border:1px solid var(--phi-admin-border);
    box-shadow:0 6px 16px rgba(0,0,0,.35);
}

.admin-upload .category-picker.open .category-picker-menu,
.admin-edit .category-picker.open .category-picker-menu {
    display:block;
}

.admin-upload .category-picker-option,
.admin-edit .category-picker-option {
    display:block;
    width:100%;
    margin:0;
    padding:7px 10px;
    border:0;
    border-radius:0;
    text-align:left;
}

.admin-upload .category-picker-option:hover,
.admin-upload .category-picker-option:focus-visible,
.admin-edit .category-picker-option:hover,
.admin-edit .category-picker-option:focus-visible {
    background:var(--phi-admin-control-hover);
    outline:none;
}

.admin-upload .error,
.admin-edit .error {
    margin:10px 0 18px;
    padding:10px 12px;
}

.admin-upload .upload-primary,
.admin-edit .edit-primary {
    display:grid;
    grid-template-columns:minmax(280px,330px) minmax(0,1fr);
    gap:28px;
    align-items:start;
}

.admin-upload .upload-primary {
    grid-template-columns:minmax(165px,190px) minmax(0,1fr);
    gap:18px;
}

.admin-upload .media-column,
.admin-edit .media-column {
    min-width:0;
}

.admin-upload .media-picker {
    display:block;
    margin:0;
    font-weight:normal;
    cursor:pointer;
}

.admin-upload .selected-media-preview {
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    aspect-ratio:1 / 1;
    overflow:hidden;
    color:var(--phi-admin-text);
    background:var(--phi-admin-control);
    border:2px dashed var(--phi-admin-border);
    border-radius:var(--phi-admin-card-radius);
}

.admin-upload .selected-media-preview.has-media {
    border-style:solid;
}

.admin-upload .selected-media-preview img,
.admin-edit .media-tile img {
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
}

.admin-edit .media-tile {
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    aspect-ratio:1 / 1;
    overflow:hidden;
    background:var(--phi-admin-bg);
    border:1px solid var(--phi-admin-border);
    border-radius:var(--phi-admin-card-radius);
}

.admin-upload .media-placeholder,
.admin-edit .media-placeholder {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    width:100%;
    height:100%;
    padding:18px;
    text-align:center;
}

.admin-upload .media-placeholder {
    padding:10px;
}

.admin-upload .media-placeholder strong {
    font-size:1.35rem;
}

.admin-upload .media-placeholder span {
    font-size:.82rem;
}

.admin-upload .upload-note {
    margin:6px 0 0;
    font-size:1.1rem;
    line-height:1.15;
}

.admin-upload .upload-media-status {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    overflow:hidden;
    clip:rect(0, 0, 0, 0);
    white-space:nowrap;
    border:0;
}

.admin-edit .filename {
    margin:7px 0 0;
    font-size:.9rem;
    line-height:1.25;
    word-break:break-all;
}

.admin-upload .essential-fields > label:first-child,
.admin-edit .essential-fields > label:first-child {
    margin-top:0;
}

.admin-upload .title-control-row,
.admin-edit .title-control-row {
    display:flex;
    align-items:center;
    gap:12px;
}

.admin-edit .gallery-position-help {
    display:block;
    margin-top:5px;
    font-size:.9rem;
    line-height:1.3;
}

.admin-upload .title-control-row > #title,
.admin-edit .title-control-row > #title {
    flex:1 1 auto;
    min-width:0;
}

.admin-upload .title-checkbox,
.admin-edit .title-checkbox {
    display:flex;
    align-items:center;
    flex:0 0 auto;
    gap:6px;
    margin:0;
    white-space:nowrap;
    font-weight:normal;
}

.admin-upload .title-checkbox input,
.admin-edit .title-checkbox input {
    width:auto;
    margin:0;
}

.admin-upload .form-sections,
.admin-edit .form-sections {
    margin-top:20px;
}

.admin-upload .form-sections {
    margin-top:8px;
}

.admin-upload .form-section,
.admin-edit .form-section {
    margin-bottom:10px;
}

.admin-upload .form-section {
    margin-bottom:6px;
}

.admin-upload .form-section summary,
.admin-edit .form-section summary {
    padding:11px 10px;
    font-size:1.25rem;
    font-weight:bold;
    cursor:pointer;
    user-select:none;
}

.admin-upload .form-section summary {
    padding:7px 9px;
    font-size:1.08rem;
}

.admin-upload .section-body,
.admin-edit .section-body {
    padding:0 10px 14px;
}

.admin-upload .section-body > label:first-child,
.admin-edit .section-body > label:first-child {
    margin-top:2px;
}

.admin-upload .artwork-details-grid,
.admin-edit .artwork-details-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 18px;
}

.admin-upload .ai-description-controls,
.admin-edit .description-tools {
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:9px;
}

.admin-upload #generate-description,
.admin-edit .description-tools button {
    margin:0;
}

.admin-upload #ai-status,
.admin-edit .ai-status {
    margin:0;
    font-size:1rem;
}

.admin-upload .form-actions,
.admin-edit .form-actions {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin:18px -10px -10px;
    padding:12px 10px 10px;
}

.admin-edit .form-actions {
    position:sticky;
    bottom:0;
    z-index:5;
}

.admin-upload .distribution-controls {
    margin-top:6px;
}

.admin-upload .distribution-panel {
    margin:0;
    padding:0;
}

.admin-upload .distribution-panel > summary,
.admin-upload .distribution-panel-title {
    margin:0;
    padding:7px 9px;
    font-size:1.08rem;
    font-weight:bold;
}

.admin-upload .distribution-panel > .distribution-card-list {
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:4px;
    margin:0;
    padding:0 10px 14px;
}

.admin-upload .distribution-action-group {
    display:contents;
}

.admin-upload .distribution-card-social,
.admin-upload .distribution-icon-card {
    min-height:44px;
    padding:2px;
}

.admin-upload .distribution-card-social .social-posting-menu > summary,
.admin-upload .distribution-action-icon {
    width:38px;
    height:38px;
}

.admin-upload .distribution-card-social .social-posting-icon,
.admin-upload .distribution-action-icon svg {
    width:20px;
    height:20px;
}

.admin-upload .form-actions {
    margin-top:2px;
    padding-top:6px;
}

.admin-upload .checkbox-row,
.admin-edit .checkbox-row {
    display:flex;
    align-items:center;
    gap:8px;
    margin:0;
    padding:8px 10px;
}

.admin-upload .checkbox-row input,
.admin-edit .checkbox-row input {
    width:auto;
}

.admin-upload .checkbox-row label,
.admin-edit .checkbox-row label {
    margin:0;
}

.admin-upload .form-actions button,
.admin-edit .form-actions button {
    flex:0 0 auto;
    margin:0;
}

.admin-edit .artwork-editor-open {
    width:100%;
    margin-top:10px;
    padding:9px 12px;
}

.admin-edit .artwork-editor-open.is-edited {
    border-color:rgba(255,255,255,.78);
    box-shadow:0 0 0 1px rgba(255,255,255,.18);
}

body.artwork-editor-active {
    overflow:hidden !important;
}

.artwork-editor-modal {
    position:fixed;
    inset:0;
    z-index:2600;
    display:grid;
    place-items:center;
    box-sizing:border-box;
    padding:clamp(10px, 3vw, 28px);
    background:rgba(0,0,0,.72);
    opacity:0;
    transition:opacity .32s ease;
}

.artwork-editor-modal[hidden] {
    display:none;
}

.artwork-editor-modal.is-open {
    opacity:1;
}

.artwork-editor-dialog {
    display:grid;
    grid-template-columns:minmax(0,1.4fr) minmax(260px,.8fr);
    grid-template-areas:
        "header header"
        "stage controls"
        "status controls"
        "actions actions";
    gap:14px 18px;
    width:min(94vw, 980px);
    max-height:calc(100dvh - 24px);
    box-sizing:border-box;
    overflow:auto;
    padding:16px;
    border:1px solid rgba(255,255,255,.72);
    border-radius:16px;
    background:var(--phi-admin-bg);
    box-shadow:0 28px 80px rgba(0,0,0,.75);
    transform:translateY(18px) scale(.96);
    transition:transform .38s cubic-bezier(.22,1,.36,1);
}

.artwork-editor-modal.is-open .artwork-editor-dialog {
    transform:translateY(0) scale(1);
}

.artwork-editor-dialog > header {
    grid-area:header;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    border-bottom:1px solid var(--phi-admin-border);
}

.artwork-editor-dialog > header h2 {
    margin:0;
}

.artwork-editor-dialog > header button {
    min-width:40px;
    padding:6px 10px;
    font-size:1.5rem;
    line-height:1;
}

.artwork-editor-stage {
    grid-area:stage;
    display:grid;
    min-height:280px;
    place-items:center;
    overflow:hidden;
    border:1px solid var(--phi-admin-border);
    border-radius:12px;
    background:#111;
}

.artwork-editor-stage canvas {
    display:block;
    max-width:100%;
    max-height:58dvh;
    object-fit:contain;
}

.artwork-editor-controls {
    grid-area:controls;
    display:grid;
    align-content:start;
    gap:12px;
}

.artwork-editor-controls fieldset {
    min-width:0;
    margin:0;
    padding:10px;
    border:1px solid var(--phi-admin-border);
    border-radius:10px;
}

.artwork-editor-controls legend {
    padding:0 5px;
    font-weight:bold;
}

.artwork-editor-button-row {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}

.artwork-editor-button-row button {
    min-height:38px;
    padding:7px 10px;
}

.artwork-editor-button-row button[aria-pressed="true"] {
    border-color:rgba(255,255,255,.9);
    background:rgba(255,255,255,.16);
}

.artwork-editor-focus {
    display:grid;
    gap:6px;
    margin-top:10px;
}

.artwork-editor-focus[hidden] {
    display:none;
}

.artwork-editor-focus label {
    margin:0;
    font-size:.85rem;
}

.artwork-editor-focus input {
    width:100%;
    padding:0;
}

.artwork-editor-status {
    grid-area:status;
    min-height:1.3em;
    margin:0;
    font-size:.9rem;
}

.artwork-editor-actions {
    grid-area:actions;
    display:flex;
    justify-content:flex-end;
    gap:10px;
    padding-top:4px;
    border-top:1px solid var(--phi-admin-border);
}

.artwork-editor-actions button {
    padding:9px 16px;
}

.artwork-editor-actions .artwork-editor-apply {
    border-color:rgba(255,255,255,.8);
}

@media(max-width:700px) {
    .artwork-editor-dialog {
        grid-template-columns:1fr;
        grid-template-areas:
            "header"
            "stage"
            "controls"
            "status"
            "actions";
        width:calc(100vw - 20px);
        max-height:calc(100dvh - var(--admin-mobile-nav-height, 78px) - 12px);
        padding:12px;
    }

    .artwork-editor-stage {
        min-height:190px;
    }

    .artwork-editor-stage canvas {
        max-height:36dvh;
    }

    .artwork-editor-controls {
        grid-template-columns:1fr;
    }

    .artwork-editor-actions {
        position:sticky;
        bottom:-12px;
        padding:10px 0 0;
        background:var(--phi-admin-bg);
    }
}

@media(prefers-reduced-motion:reduce) {
    .artwork-editor-modal,
    .artwork-editor-dialog {
        transition:none;
    }
}

@media(max-width:800px) {
    body.admin-upload,
    body.admin-edit {
        padding:24px 14px 100px;
    }

    body.admin-upload {
        padding-top:8px;
        padding-right:8px;
        padding-left:8px;
    }

    .admin-upload .container,
    .admin-edit .container {
        padding:22px;
    }

    .admin-upload .container {
        padding:10px 12px;
    }

    .admin-upload h1,
    .admin-edit h1 {
        font-size:2.5rem;
    }

    .admin-upload h1 {
        font-size:2rem;
    }

    .admin-upload .upload-page-heading {
        align-items:center;
        flex-direction:row;
        margin-bottom:7px;
    }

    .admin-upload .upload-primary,
    .admin-edit .edit-primary {
        grid-template-columns:1fr;
        gap:18px;
    }

    .admin-upload .upload-primary {
        grid-template-columns:minmax(105px,34vw) minmax(0,1fr);
        gap:10px;
    }

    .admin-upload .media-column {
        width:100%;
        max-width:132px;
        margin:0;
    }

    .admin-upload .essential-fields > label {
        margin-top:5px;
        margin-bottom:3px;
        font-size:1.08rem;
    }

    .admin-upload .essential-fields > label:first-child {
        margin-top:0;
    }

    .admin-upload .category-picker-button,
    .admin-upload #title {
        min-height:38px;
        padding:7px 8px;
    }

    .admin-upload .title-control-row {
        gap:6px;
    }

    .admin-upload .title-checkbox {
        gap:3px;
        font-size:.82rem;
    }

    .admin-upload .media-placeholder strong {
        font-size:1.05rem;
    }

    .admin-upload .media-placeholder span {
        font-size:.62rem;
        line-height:1.15;
    }

    .admin-upload .form-sections {
        margin-top:7px;
    }

    .admin-edit .media-column {
        width:100%;
        max-width:330px;
        margin:0 auto;
    }

    .admin-upload .artwork-details-grid,
    .admin-edit .artwork-details-grid {
        grid-template-columns:1fr;
    }

    .admin-upload .ai-description-controls,
    .admin-edit .description-tools {
        align-items:flex-start;
        flex-direction:column;
        gap:6px;
    }

    .admin-upload .form-actions,
    .admin-edit .form-actions {
        align-items:stretch;
        flex-direction:column;
    }

    .admin-upload .form-actions {
        gap:6px;
        margin-right:-4px;
        margin-left:-4px;
        padding:6px 4px 4px;
    }

    .admin-upload .form-actions button,
    .admin-edit .form-actions button {
        width:100%;
    }

    .admin-upload .form-actions button {
        min-height:40px;
        padding:7px 12px;
    }
}

@media(max-width:700px) {
    html.admin-upload-document {
        height:100dvh;
        overflow:hidden;
    }

    body.admin-upload {
        height:100dvh;
        min-height:0;
        overflow:hidden;
    }

    .admin-upload .container {
        display:flex;
        flex-direction:column;
        height:calc(100dvh - 124px - var(--admin-mobile-nav-height, 78px));
        min-height:0;
        overflow-x:hidden;
        overflow-y:auto;
        overscroll-behavior:contain;
    }

    .admin-upload .category-picker {
        z-index:2050;
    }

    .admin-upload .category-picker::before {
        content:"";
        position:fixed;
        inset:0;
        z-index:-1;
        background:rgba(0,0,0,.3);
        opacity:0;
        visibility:hidden;
        transition:opacity .6s ease-in-out, visibility 0s linear .6s;
    }

    .admin-upload .category-picker.open::before {
        opacity:1;
        visibility:visible;
        transition-delay:0s;
    }

    .admin-upload .category-picker-menu {
        position:fixed;
        top:calc((100dvh - var(--admin-mobile-nav-height, 78px)) / 2);
        right:auto;
        left:50%;
        z-index:1;
        display:block;
        width:min(86vw, 520px);
        max-height:min(82dvh, 680px);
        border:1px solid rgba(255,255,255,.72);
        border-radius:14px;
        box-shadow:0 0 0 1px rgba(0,0,0,.35), 0 24px 70px rgba(0,0,0,.72);
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transform:translate(-50%, -46%) scale(.9);
        transition:
            opacity .6s ease-in-out,
            transform .6s cubic-bezier(.22, 1, .36, 1),
            visibility 0s linear .6s;
    }

    .admin-upload .category-picker.open .category-picker-menu {
        display:block;
        opacity:1;
        visibility:visible;
        pointer-events:auto;
        transform:translate(-50%, -50%) scale(1);
        transition-delay:0s;
    }

    .admin-upload details.form-section[open] {
        position:fixed;
        top:calc((100dvh - var(--admin-mobile-nav-height, 78px)) / 2);
        right:auto;
        bottom:auto;
        left:50%;
        z-index:2050;
        width:min(86vw, 520px);
        height:min(82dvh, 680px);
        max-height:calc(100dvh - var(--admin-mobile-nav-height, 78px) - 20px);
        margin:0;
        overflow-x:hidden;
        overflow-y:auto;
        overscroll-behavior:contain;
        border:1px solid rgba(255,255,255,.72);
        border-radius:14px;
        background:var(--phi-admin-bg);
        box-shadow:0 0 0 100vmax rgba(0,0,0,.3), 0 0 0 1px rgba(0,0,0,.35), 0 24px 70px rgba(0,0,0,.72);
        transform:translate(-50%, -50%);
        animation:upload-modal-in .6s cubic-bezier(.22, 1, .36, 1) both;
    }

    .admin-upload details.form-section[open].is-closing {
        pointer-events:none;
        animation:upload-modal-out .55s ease-in-out both;
    }

    .admin-upload details.form-section[open] > summary {
        position:sticky;
        top:0;
        z-index:1;
        border-bottom:1px solid var(--phi-admin-border);
        background:var(--phi-admin-bg);
    }

    .admin-upload details.form-section[open] > summary::after {
        content:"Tap to close";
        float:right;
        margin-left:12px;
        font-size:.72em;
        font-weight:normal;
        opacity:.72;
    }

    @keyframes upload-modal-in {
        from {
            opacity:0;
            transform:translate(-50%, -46%) scale(.9);
        }
        to {
            opacity:1;
            transform:translate(-50%, -50%) scale(1);
        }
    }

    @keyframes upload-modal-out {
        from {
            opacity:1;
            transform:translate(-50%, -50%) scale(1);
        }
        to {
            opacity:0;
            transform:translate(-50%, -46%) scale(.9);
        }
    }

    @media(prefers-reduced-motion:reduce) {
        .admin-upload .category-picker::before,
        .admin-upload .category-picker-menu,
        .admin-upload details.form-section[open],
        .admin-upload details.form-section[open].is-closing {
            animation:none;
            transition:none;
        }
    }

    .admin-upload .container > form {
        display:flex;
        flex:1 0 auto;
        flex-direction:column;
        min-height:0;
    }

    .admin-upload .distribution-panel > .distribution-card-list {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .admin-upload .form-actions {
        position:sticky;
        bottom:0;
        z-index:10;
        margin-top:auto;
    }
}

/*==============================================================
    SORT GALLERY
==============================================================*/

body.admin-sort {
    width:100%;
    max-width:1100px;
    margin:0 auto;
    padding:20px;
}

.admin-sort .instructions {
    margin-bottom:25px;
}

.admin-sort .message,
.admin-sort .error {
    margin-bottom:20px;
    padding:12px;
}

.admin-sort .sort-list {
    display:grid;
    gap:12px;
    margin:0;
    padding:0;
    list-style:none;
}

.admin-sort .sort-item {
    display:grid;
    grid-template-columns:42px 90px 1fr auto;
    gap:15px;
    align-items:center;
    padding:12px;
    cursor:grab;
    user-select:none;
}

.admin-sort .sort-item:active {
    cursor:grabbing;
}

.admin-sort .sort-item.dragging {
    opacity:.45;
}

.admin-sort .drag-handle {
    font-size:24px;
    text-align:center;
}

.admin-sort .preview,
.admin-sort .preview-placeholder {
    width:90px;
    height:70px;
    border-radius:4px;
    object-fit:cover;
    background:var(--phi-admin-control);
}

.admin-sort .preview-placeholder {
    display:flex;
    align-items:center;
    justify-content:center;
    padding:5px;
    font-size:12px;
    text-align:center;
}

.admin-sort .artwork-title {
    margin-bottom:4px;
    font-weight:bold;
}

.admin-sort .category-name,
.admin-sort .position {
    font-size:14px;
}

.admin-sort .position {
    min-width:70px;
    text-align:right;
}

.admin-sort .save-button {
    margin-top:25px;
    padding:12px 25px;
}

.admin-sort .empty {
    padding:30px;
    border-style:dashed;
    text-align:center;
}

@media(max-width:650px) {
    .admin-sort .sort-item {
        grid-template-columns:30px 70px 1fr;
    }

    .admin-sort .preview,
    .admin-sort .preview-placeholder {
        width:70px;
        height:60px;
    }

    .admin-sort .position {
        display:none;
    }
}

/*==============================================================
    CATEGORIES
==============================================================*/

/*==============================================================
    GALLERY CARDS
==============================================================*/

.admin-gallery-cards .gallery-card-builder {
    width:min(1180px, calc(100% - 32px));
    margin:0 auto;
    padding:32px 0 60px;
}

.admin-gallery-cards .gallery-card-heading {
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(320px, .8fr);
    gap:32px;
    align-items:start;
}

.admin-gallery-cards .gallery-card-heading { margin-bottom:24px; }
.admin-gallery-cards .gallery-card-heading h1 { margin:.15rem 0 .4rem; }
.admin-gallery-cards .gallery-card-kicker { margin:0; font-size:.76rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.admin-gallery-cards .gallery-card-heading > a { justify-self:end; }
.admin-gallery-cards .gallery-card-heading-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:16px; }
.admin-gallery-cards .gallery-card-heading-actions a { color:inherit; }
.admin-gallery-cards .gallery-card-form { display:grid; gap:22px; }
.admin-gallery-cards .gallery-card-panel { padding:24px; border:1px solid var(--phi-admin-border); border-radius:14px; background:var(--phi-admin-surface-soft); }
.admin-gallery-cards .gallery-card-panel h2 { margin:0 0 18px; font-size:1.1rem; }
.admin-gallery-cards .gallery-card-section-heading { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:18px; }
.admin-gallery-cards .gallery-card-section-heading h2 { margin:0; }
.admin-gallery-cards .gallery-card-section-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:12px; }
.admin-gallery-cards .gallery-card-select-all { min-height:38px; padding:7px 13px; border:1px solid var(--phi-admin-border); border-radius:8px; background:var(--phi-admin-control); color:inherit; font:inherit; font-weight:700; cursor:pointer; }
.admin-gallery-cards .gallery-card-artwork-list { display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:12px; max-height:164px; overflow:hidden; }
.admin-gallery-cards .gallery-card-artwork-list[data-grid-columns] { grid-template-columns:repeat(var(--phioro-grid-columns), minmax(0, 1fr)); }
.admin-gallery-cards .gallery-card-artwork-list.is-expanded { max-height:none; }
.admin-gallery-cards .gallery-card-artwork-expand { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:12px; padding:8px 12px; border:0; background:transparent; color:inherit; cursor:pointer; }
.admin-gallery-cards .gallery-card-artwork-expand[hidden] { display:none; }
.admin-gallery-cards .gallery-card-expand-arrow { font-size:1.25rem; line-height:1; transition:transform .18s ease; }
.admin-gallery-cards .gallery-card-artwork-expand[aria-expanded="true"] .gallery-card-expand-arrow { transform:rotate(180deg); }
.admin-gallery-cards .gallery-card-artwork-option { display:grid; grid-template-columns:22px 54px minmax(0, 1fr); gap:10px; align-items:center; padding:10px; border:1px solid var(--phi-admin-border); border-radius:10px; cursor:pointer; }
.admin-gallery-cards .gallery-card-artwork-option[hidden] { display:none; }
.admin-gallery-cards .gallery-card-artwork-option:has(input:checked) { outline:2px solid currentColor; }
.admin-gallery-cards .gallery-card-artwork-option img,
.admin-gallery-cards .gallery-card-artwork-placeholder { width:54px; height:54px; border-radius:6px; object-fit:cover; background:var(--phi-admin-control); }
.admin-gallery-cards .gallery-card-artwork-placeholder { display:grid; place-items:center; font-size:.65rem; text-align:center; }
.admin-gallery-cards .gallery-card-artwork-option span:last-child { min-width:0; }
.admin-gallery-cards .gallery-card-artwork-option strong,
.admin-gallery-cards .gallery-card-artwork-option small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.admin-gallery-cards .gallery-card-field-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:12px; }
.admin-gallery-cards .gallery-card-field-grid label,
.admin-gallery-cards .gallery-card-layout { display:flex; gap:10px; align-items:flex-start; padding:12px; border:1px solid var(--phi-admin-border); border-radius:9px; }
.admin-gallery-cards .gallery-card-layout-options { display:grid; gap:10px; }
.admin-gallery-cards .gallery-card-layout + .gallery-card-layout { margin-top:10px; }
.admin-gallery-cards .gallery-card-layout span,
.admin-gallery-cards .gallery-card-layout strong,
.admin-gallery-cards .gallery-card-layout small { display:block; }
.admin-gallery-cards .gallery-card-generate { min-height:52px; padding:12px 20px; }
.admin-gallery-cards .gallery-card-action-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(175px, 1fr)); gap:10px; }
.admin-gallery-cards .gallery-card-action-grid label { display:flex; gap:10px; align-items:flex-start; padding:13px; border:1px solid var(--phi-admin-border); border-radius:9px; }
.admin-gallery-cards .gallery-card-action-grid span,
.admin-gallery-cards .gallery-card-action-grid strong,
.admin-gallery-cards .gallery-card-action-grid small { display:block; }
.admin-gallery-cards .gallery-card-delivery-details { display:grid; gap:13px; margin-top:18px; padding-top:18px; border-top:1px solid var(--phi-admin-border); }
.admin-gallery-cards .gallery-card-delivery-details label { display:grid; gap:7px; }
.admin-gallery-cards .gallery-card-delivery-details select,
.admin-gallery-cards .gallery-card-delivery-details input,
.admin-gallery-cards .gallery-card-delivery-details textarea { width:100%; }
.admin-gallery-cards .gallery-card-detail-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.admin-gallery-cards .gallery-card-detail-heading a { color:inherit; }
.admin-gallery-cards .print-spec-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:12px; }
.admin-gallery-cards .print-destination-layout { display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr); gap:22px; align-items:start; }
.admin-gallery-cards .print-destination-form { display:grid; gap:14px; }
.admin-gallery-cards .print-destination-form label { display:grid; gap:7px; }
.admin-gallery-cards .print-destination-form input,
.admin-gallery-cards .print-destination-form textarea { width:100%; }
.admin-gallery-cards .print-destination-list { display:grid; gap:10px; }
.admin-gallery-cards .print-destination-card { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px; border:1px solid var(--phi-admin-border); border-radius:10px; }
.admin-gallery-cards .print-destination-card.is-archived { opacity:.55; }
.admin-gallery-cards .print-destination-card strong,
.admin-gallery-cards .print-destination-card small { display:block; }
.admin-gallery-cards .print-destination-actions { display:flex; align-items:center; gap:10px; }
.admin-gallery-cards .print-destination-actions form { margin:0; }
.admin-gallery-cards .print-job-history { margin-top:22px; }
.admin-gallery-cards .print-job-table-wrap { overflow-x:auto; }
.admin-gallery-cards .print-job-table-wrap table { width:100%; border-collapse:collapse; }
.admin-gallery-cards .print-job-table-wrap th,
.admin-gallery-cards .print-job-table-wrap td { padding:12px 10px; border-bottom:1px solid var(--phi-admin-border); text-align:left; vertical-align:top; }
.admin-gallery-cards .print-job-table-wrap td small { display:block; max-width:260px; }
.admin-gallery-cards .print-assets-alert { margin-bottom:20px; padding:14px 16px; border:1px solid var(--phi-admin-border); border-radius:10px; background:var(--phi-admin-surface-soft); }
.admin-gallery-cards .print-assets-alert.is-success { border-color:#4b8f68; }
.admin-gallery-cards .print-assets-alert.is-error { border-color:#b45b5b; }
.admin-gallery-cards .print-assets-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:20px; }
.admin-gallery-cards .print-assets-grid[data-grid-columns] { grid-template-columns:repeat(var(--phioro-grid-columns), minmax(0, 1fr)); }
.admin-gallery-cards .print-asset-card { overflow:hidden; border:1px solid var(--phi-admin-border); border-radius:14px; background:var(--phi-admin-surface-soft); }
.admin-gallery-cards .print-asset-card > img { display:block; width:100%; aspect-ratio:8.5 / 11; object-fit:cover; background:#fff; }
.admin-gallery-cards .print-asset-card-body { padding:18px; }
.admin-gallery-cards .print-asset-card-body h2 { margin:.2rem 0 .5rem; }
.admin-gallery-cards .print-asset-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:16px; }
.admin-gallery-cards .print-asset-actions a,
.admin-gallery-cards .print-asset-actions button { display:flex; min-height:42px; align-items:center; justify-content:center; padding:9px; border:1px solid var(--phi-admin-border); border-radius:8px; background:var(--phi-admin-control); color:inherit; font:inherit; text-align:center; text-decoration:none; cursor:pointer; }
.admin-gallery-cards .print-asset-social { grid-column:1 / -1; }

@media(max-width:760px) {
    .admin-gallery-cards .gallery-card-heading,
    .admin-gallery-cards .print-destination-layout { grid-template-columns:1fr; }
    .admin-gallery-cards .gallery-card-heading > a { justify-self:start; }
    .admin-gallery-cards .gallery-card-heading-actions { justify-content:flex-start; }
    .admin-gallery-cards .gallery-card-section-heading { align-items:flex-start; flex-direction:column; gap:12px; }
    .admin-gallery-cards .gallery-card-section-actions { width:100%; justify-content:space-between; }
    .admin-gallery-cards .gallery-card-artwork-list,
    .admin-gallery-cards .gallery-card-field-grid,
    .admin-gallery-cards .gallery-card-layout-options { grid-template-columns:repeat(2, minmax(0, 1fr)); }
    .admin-gallery-cards .gallery-card-artwork-list { max-height:136px; }
    .admin-gallery-cards .gallery-card-layout + .gallery-card-layout { margin-top:0; }
    .admin-gallery-cards .gallery-card-artwork-option { grid-template-columns:20px 44px minmax(0, 1fr); gap:7px; padding:8px; }
    .admin-gallery-cards .gallery-card-artwork-option img,
    .admin-gallery-cards .gallery-card-artwork-placeholder { width:44px; height:44px; }
    .admin-gallery-cards .gallery-card-field-grid,
    .admin-gallery-cards .gallery-card-layout-options { gap:8px; }
    .admin-gallery-cards .gallery-card-field-grid label,
    .admin-gallery-cards .gallery-card-layout { gap:7px; padding:9px; font-size:.84rem; }
}

.admin-categories {
    max-width:1000px;
    margin:0 auto;
    padding:20px;
}

.admin-categories .panel {
    margin-bottom:16px;
    padding:16px;
}

.admin-categories input {
    width:100%;
    min-width:0;
    padding:9px 10px;
}

.admin-categories button {
    padding:9px 14px;
}

.admin-categories .message,
.admin-categories .error {
    margin-bottom:20px;
    padding:12px;
}

.admin-categories .add-form {
    display:grid;
    grid-template-columns:42px minmax(0, 1fr);
    gap:8px;
    align-items:center;
}

.admin-categories .add-button {
    width:42px;
    height:42px;
    padding:0;
    font-size:1.5rem;
    line-height:1;
}

.admin-categories .category-grid {
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
}

.admin-categories .category-card {
    display:grid;
    grid-template-columns:28px minmax(0, 1fr) auto;
    gap:10px;
    align-items:center;
    min-width:0;
    padding:10px;
    border:1px solid var(--phi-admin-border);
    border-radius:var(--phi-admin-radius);
    background:var(--phi-admin-control);
}

.admin-categories .category-sort-order {
    display:flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    border-radius:50%;
    color:var(--phi-admin-text);
    background:var(--phi-admin-bg);
    font-size:.78rem;
    font-weight:700;
}

.admin-categories .category-card-name {
    min-width:0;
}

.admin-categories .rename-form {
    margin:0;
}

.admin-categories .category-name-input {
    border-color:transparent;
    background:transparent;
    cursor:text;
}

.admin-categories .category-name-input:focus {
    border-color:var(--phi-admin-border);
    background:var(--phi-admin-bg);
}

.admin-categories .category-artwork-count {
    white-space:nowrap;
    font-size:.78rem;
    opacity:.72;
}

@media(min-width:640px) {
    .admin-categories .category-grid {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media(max-width:420px) {
    .admin-categories .category-card {
        grid-template-columns:28px minmax(0, 1fr);
    }

    .admin-categories .category-artwork-count {
        grid-column:2;
    }
}

/*==============================================================
    LOGIN
==============================================================*/

body.admin-login-page {
    width:100%;
    max-width:none;
    min-height:100vh;
    margin:0;
    padding:72px 20px 32px;
}

.admin-login-page .admin-login-back {
    position:fixed;
    top:18px;
    left:18px;
    z-index:2;
    display:inline-flex;
    align-items:center;
    gap:.45em;
    margin:0;
    padding:8px 13px;
    text-decoration:none;
}

.admin-login-page .admin-login-shell {
    width:min(100%, 430px);
    margin:0 auto;
}

.admin-login-page .admin-login-shell.has-artwork {
    display:grid;
    grid-template-columns:minmax(280px, .8fr) minmax(0, 1.2fr);
    align-items:center;
    gap:clamp(24px, 5vw, 64px);
    width:min(100%, 1060px);
}

.admin-login-page .admin-login-panel {
    min-width:0;
}

.admin-login-page .admin-login-panel h1,
.admin-login-page .admin-login-panel h2 {
    margin-top:0;
}

.admin-login-page .admin-login-artwork {
    display:flex;
    min-width:0;
    margin:0;
    flex-direction:column;
    align-items:center;
    gap:10px;
}

.admin-login-page .admin-login-artwork img {
    display:block;
    width:auto;
    max-width:100%;
    height:auto;
    max-height:72vh;
    object-fit:contain;
    opacity:0;
    transform:scale(.97);
    animation:reveal-artwork .8s ease forwards;
    box-shadow:0 0 12px rgba(255,255,255,.22);
}

.admin-login-page .admin-login-artwork figcaption {
    margin:0;
    text-align:center;
    text-shadow:0 1px 4px rgba(0,0,0,.9);
}

.admin-login-page label {
    display:block;
    margin-top:18px;
    font-weight:bold;
}

.admin-login-page input {
    width:100%;
    margin-top:6px;
    padding:12px;
}

.admin-login-page button {
    margin-top:20px;
    padding:12px 24px;
}

.admin-login-page .error {
    padding:12px;
}

@media(max-width:700px) {
    body.admin-login-page {
        padding:68px 14px 30px;
    }

    .admin-login-page .admin-login-back {
        top:14px;
        left:14px;
    }

    .admin-login-page .admin-login-shell.has-artwork {
        grid-template-columns:1fr;
        gap:30px;
    }

    .admin-login-page .admin-login-artwork img {
        max-height:46vh;
    }
}

/*==============================================================
    PROJECT FACTORY
==============================================================*/

body.admin-factory-page {
    padding:0;
}

.admin-factory-page .factory-page {
    width:min(940px,calc(100% - 40px));
    margin:40px auto 100px;
}

.admin-factory-page .factory-header {
    margin-bottom:30px;
}

.admin-factory-page .factory-header h1 {
    margin:0 0 8px;
    font-size:2.4rem;
}

.admin-factory-page .factory-header p {
    margin:0;
}

.admin-factory-page .message,
.admin-factory-page .error,
.admin-factory-page .created {
    margin-bottom:22px;
    padding:16px;
    border-radius:12px;
}

.admin-factory-page .created h2 {
    margin-top:0;
}

.admin-factory-page .created code {
    display:block;
    margin:7px 0 16px;
    padding:10px;
    overflow-x:auto;
    color:var(--phi-admin-text);
    background:var(--phi-admin-control);
    border:1px solid var(--phi-admin-border);
    border-radius:var(--phi-admin-radius);
}

.admin-factory-page .factory-section {
    margin-bottom:20px;
    padding:24px;
    border-radius:14px;
}

.admin-factory-page .factory-section h2 {
    margin:0 0 20px;
    font-size:1.3rem;
}

.admin-factory-page .field-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}

.admin-factory-page .field {
    display:flex;
    flex-direction:column;
    gap:7px;
}

.admin-factory-page .field.full {
    grid-column:1 / -1;
}

.admin-factory-page label {
    font-weight:600;
}

.admin-factory-page input,
.admin-factory-page select,
.admin-factory-page textarea {
    width:100%;
    padding:11px 12px;
}

.admin-factory-page textarea {
    min-height:100px;
    resize:vertical;
}

.admin-factory-page .checkbox-field {
    display:flex;
    align-items:center;
    gap:10px;
    min-height:44px;
}

.admin-factory-page .checkbox-field input {
    width:auto;
}

.admin-factory-page .help {
    font-size:.9rem;
    line-height:1.4;
}

.admin-factory-page .factory-font-select-field select {
    min-height:44px;
    overflow:hidden;
    text-overflow:ellipsis;
}

.admin-factory-page .factory-database-guide {
    display:grid;
    grid-template-columns:minmax(180px,.65fr) minmax(0,1.35fr);
    gap:8px 18px;
    margin:0 0 22px;
    padding:16px;
    border:1px solid var(--phi-admin-border);
    border-radius:var(--phi-admin-radius);
    background:var(--phi-admin-control);
}

.admin-factory-page .factory-database-guide span,
.admin-factory-page .factory-database-guide a {
    line-height:1.4;
}

.admin-factory-page .factory-database-guide a {
    grid-column:2;
    justify-self:start;
}

.admin-factory-page .factory-database-check {
    display:grid;
    grid-template-columns:max-content minmax(0,1fr);
    align-items:center;
    gap:12px;
    padding-top:4px;
}

.admin-factory-page .factory-database-check .button {
    margin:0;
    padding:10px 18px;
}

.admin-factory-page #database-check-status {
    margin:0;
}

.admin-factory-page #database-check-status[data-state="success"] { color:#baf7d1; }
.admin-factory-page #database-check-status[data-state="error"] { color:#ffd0d0; }

.admin-factory-page .color-row {
    display:flex;
    align-items:center;
    gap:10px;
}

.admin-factory-page .factory-color-fields {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    align-items:end;
    gap:18px;
}

.admin-factory-page .factory-color-field select {
    min-height:44px;
    overflow:hidden;
    text-overflow:ellipsis;
    border:1px solid var(--phi-admin-border);
    font-weight:700;
}

.admin-factory-page .factory-live-preview {
    --factory-preview-background:#000;
    --factory-preview-text:#fff;
    --factory-preview-border:#fff;
    --factory-preview-font:"Amatic SC", "Segoe Print", "Bradley Hand", cursive;
    margin-top:22px;
    overflow:hidden;
    border:1px solid var(--factory-preview-border);
    border-radius:12px;
    background:var(--factory-preview-background);
    color:var(--factory-preview-text);
    font-family:var(--factory-preview-font);
    box-shadow:0 14px 34px rgba(0,0,0,.28);
    transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}

.admin-factory-page .factory-preview-toolbar {
    display:grid;
    grid-template-columns:8px 8px 8px minmax(0,1fr);
    align-items:center;
    gap:6px;
    min-height:34px;
    padding:8px 12px;
    border-bottom:1px solid var(--factory-preview-border);
}

.admin-factory-page .factory-preview-toolbar > span {
    width:8px;
    height:8px;
    border:1px solid var(--factory-preview-border);
    border-radius:50%;
}

.admin-factory-page .factory-preview-toolbar strong {
    overflow:hidden;
    font-size:.82rem;
    text-align:right;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.admin-factory-page .factory-preview-gallery {
    min-height:230px;
    padding:24px;
    text-align:center;
}

.admin-factory-page .factory-preview-gallery h3 {
    margin:0;
    color:var(--factory-preview-border);
    font-size:clamp(2rem,7vw,4rem);
    line-height:1;
    text-shadow:0 1px 3px var(--factory-preview-background);
}

.admin-factory-page .factory-preview-gallery p {
    display:inline-block;
    margin:20px 0 14px;
    padding:3px 16px;
    border:1px solid var(--factory-preview-border);
    color:var(--factory-preview-text);
    font-size:1rem;
}

.admin-factory-page .factory-preview-artwork {
    display:grid;
    grid-template-columns:1fr .7fr 1.2fr;
    align-items:end;
    gap:14px;
    max-width:560px;
    margin:0 auto;
}

.admin-factory-page .factory-preview-artwork span {
    display:block;
    height:82px;
    border:1px solid var(--factory-preview-border);
    background:color-mix(in srgb,var(--factory-preview-text) 15%,var(--factory-preview-background));
}

.admin-factory-page .factory-preview-artwork span:nth-child(2) { height:112px; }
.admin-factory-page .factory-preview-artwork span:nth-child(3) { height:68px; }

.admin-factory-page .factory-actions {
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:12px;
    margin-top:28px;
}

.admin-factory-page .button {
    padding:14px 24px;
    border-radius:999px;
    font-weight:700;
}

@media(max-width:700px) {
    .admin-factory-page .field-grid {
        grid-template-columns:1fr;
    }

    .admin-factory-page .field.full {
        grid-column:auto;
    }

    .admin-factory-page .factory-color-fields {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .admin-factory-page .factory-actions {
        flex-direction:column;
    }

    .admin-factory-page .button {
        width:100%;
    }

    .admin-factory-page .factory-database-guide,
    .admin-factory-page .factory-database-check {
        grid-template-columns:1fr;
    }

    .admin-factory-page .factory-preview-gallery {
        min-height:200px;
        padding:20px 14px;
    }

    .admin-factory-page .factory-database-guide a {
        grid-column:auto;
    }
}

/*==============================================================
    GLOBAL IMAGES
==============================================================*/

body.admin-page img,
body.admin-login-page img,
body.admin-factory-page img {
    border:1px solid var(--phi-admin-border);
}


/* Dashboard artwork title below image */
.admin-dashboard .hero {
    flex-direction:column;
}

.admin-dashboard .hero-caption {
    position:static;
    margin-top:12px;
}

.admin-dashboard .hero-image {
    box-shadow:0 0 12px rgba(255,255,255,.22);
}


/*==============================================================
    GLOBAL TOOLBARS
==============================================================*/

:root {
    --phi-admin-toolbar:#182828;
}

.admin-page .form-actions,
.admin-page .toolbar {
    background:var(--phi-admin-toolbar);
}


/* Shared video previews for uploads, editing and the gallery. */
.admin-upload .selected-media-preview video,
.admin-edit .media-tile video,
.admin-gallery .card video { display: block; width: 100%; max-height: 70vh; object-fit: contain; background: #111; }

/* Shared multi-destination controls used by Upload and Edit. */
.distribution-controls { flex:1 1 100%; width:100%; }
.distribution-panel { flex: 1 1 100%; width: 100%; margin: 1rem 0; padding: 1rem; border: 1px solid var(--phi-admin-border); background: rgba(0, 0, 0, .18); }
.distribution-panel summary { cursor: pointer; font-weight: 800; }
.distribution-panel > p { color: var(--phi-admin-muted, #aaa); }
.distribution-order-help { margin:.65rem 0; color:var(--phi-admin-muted, #aaa); font-size:.78rem; }
.distribution-card-list { display:grid; gap:1.25rem; margin:1.25rem 0; }
.distribution-card { padding:1rem; border:1px solid var(--phi-admin-border); border-radius:8px; background:rgba(255,255,255,.035); }
.distribution-controls .distribution-card-list { grid-template-columns:1fr; gap:.75rem; }
.distribution-action-group { display:grid; gap:.75rem; }
.distribution-action-group-social,
.distribution-action-group-output { grid-template-columns:repeat(3,minmax(0,1fr)); }
.distribution-action-group-communication { grid-template-columns:repeat(2,minmax(0,1fr)); }
.distribution-action-group .distribution-card { min-width:0; }
.distribution-action-group .distribution-card:has(.distribution-card-fields:not([hidden])) { grid-column:1 / -1; }
.distribution-icon-card { display:grid; min-height:72px; place-items:center; padding:.5rem; }
.distribution-icon-action { display:grid !important; margin:0 !important; place-items:center; cursor:pointer; }
.distribution-icon-input { position:absolute; width:1px !important; height:1px; margin:0 !important; opacity:0; pointer-events:none; }
.distribution-action-icon { position:relative; display:grid; width:50px; height:50px; box-sizing:border-box; place-items:center; border:1px solid var(--phi-admin-border); border-radius:50%; background:var(--phi-admin-control, #182828); color:inherit; }
.distribution-action-icon svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.distribution-icon-action:hover .distribution-action-icon,
.distribution-icon-action:focus-within .distribution-action-icon,
.distribution-icon-action:has(input:checked) .distribution-action-icon { border-color:rgba(255,255,255,.75); background:rgba(255,255,255,.13); }
.distribution-icon-action:has(input:disabled) { opacity:.42; cursor:not-allowed; }
.distribution-field-actions { display:flex; align-items:center; gap:.65rem; }
.distribution-save-button,
.distribution-cancel-button { justify-self:start; }
.distribution-cancel-button { background:transparent; }
.distribution-action-saved .distribution-action-icon::after,
.distribution-action-saved .social-posting-menu > summary::after { content:"✓"; position:absolute; top:-7px; right:-6px; color:rgba(255,255,255,.75); font-size:1rem; font-weight:900; line-height:1; }
.admin-gallery-cards .distribution-card-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; margin:.8rem 0; }
.admin-gallery-cards .distribution-card { position:relative; min-width:0; padding:.75rem; cursor:grab; user-select:none; -webkit-user-select:none; }
.admin-gallery-cards .distribution-card.sortable-chosen { cursor:grabbing; }
.admin-gallery-cards .distribution-card.sortable-ghost { opacity:.3; }
.admin-gallery-cards .distribution-card:has(.distribution-card-fields:not([hidden])) { grid-column:1 / -1; }
.distribution-card:has([data-distribution-toggle]:checked) { border-color: rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .07); }
.distribution-card-heading { display:flex; align-items:flex-start; gap:.75rem; margin:0 !important; cursor:pointer; }
.admin-gallery-cards .distribution-card-heading { gap:.55rem; }
.distribution-card-heading input { flex: 0 0 auto; width: auto !important; margin-top: .2rem; }
.distribution-card-heading span { display: grid; gap: .3rem; }
.distribution-card-heading strong { font-size: 1rem; }
.distribution-card-heading small { color:var(--phi-admin-muted, #aaa); }
.admin-gallery-cards .distribution-card-heading small { font-size:.72rem; line-height:1.25; }
.distribution-card-fields { display: grid; gap: .8rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--phi-admin-border); }
.distribution-card-fields[hidden] { display: none; }
.distribution-card-fields textarea { box-sizing: border-box; width: 100%; min-width: 0; }
.distribution-field-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .8rem; }
.distribution-panel label { margin-top: .7rem; }
.distribution-panel select,
.distribution-panel input,
.distribution-panel textarea { width: 100%; }

/* Compact social menus shared by Upload, Edit, Print Studio and Saved Assets. */
.social-posting-row { display:flex; align-items:center; flex-wrap:wrap; gap:.75rem; margin:1rem 0; }
.social-posting-label { color:var(--phi-admin-muted, #aaa); font-size:.78rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.social-posting-toolbar { display:flex; align-items:center; gap:.55rem; }
.social-posting-menu { position:relative; }
.social-posting-menu > summary { display:grid; width:44px; height:44px; box-sizing:border-box; place-items:center; border:1px solid var(--phi-admin-border); border-radius:50%; background:var(--phi-admin-control, #182828); color:inherit; cursor:pointer; font-weight:900; list-style:none; user-select:none; }
.social-posting-menu > summary::-webkit-details-marker { display:none; }
.social-posting-menu > summary:hover,
.social-posting-menu > summary:focus-visible,
.social-posting-menu[open] > summary,
.social-posting-menu:has(input:checked) > summary { border-color:rgba(255,255,255,.75); background:rgba(255,255,255,.13); outline:none; }
.social-posting-icon { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.social-posting-icon-fill { fill:currentColor; stroke:none; }
.social-posting-icon-facebook { width:28px; height:28px; }
.distribution-card-social { position:relative; display:grid; min-height:72px; place-items:center; padding:.5rem; }
.distribution-card-social .social-posting-menu { position:static; }
.distribution-card-social .social-posting-menu > summary { position:relative; width:50px; height:50px; }
.social-posting-popover { position:absolute; z-index:30; bottom:calc(100% + .65rem); left:0; display:grid; width:min(320px, calc(100vw - 2rem)); box-sizing:border-box; gap:.75rem; padding:1rem; border:1px solid var(--phi-admin-border); border-radius:10px; background:var(--phi-admin-toolbar, #182828); box-shadow:0 18px 45px rgba(0,0,0,.45); }
.social-posting-menu:nth-last-child(-n + 2) .social-posting-popover { right:0; left:auto; }
.distribution-card-social .social-posting-popover { right:auto; left:0; transform:none; }
.distribution-card-social:nth-child(3n + 2) .social-posting-popover { left:50%; transform:translateX(-50%); }
.distribution-card-social:nth-child(3n) .social-posting-popover { right:0; left:auto; transform:none; }
.social-posting-popover > strong { font-size:1rem; }
.social-posting-popover p { margin:0; color:var(--phi-admin-muted, #aaa); line-height:1.45; }
.social-posting-popover label { display:grid; gap:.4rem; margin:0 !important; }
.social-posting-popover textarea { box-sizing:border-box; width:100%; min-width:0; resize:vertical; }
.social-posting-popover a,
.social-posting-popover button { justify-self:start; }
.social-posting-choice { grid-template-columns:auto 1fr; align-items:start; }
.social-posting-choice input { width:auto !important; margin:.2rem 0 0 !important; }
.social-posting-choice span { line-height:1.35; }
.social-posting-popover .distribution-card-fields { margin-top:0; padding-top:.75rem; }

@media (max-width: 520px) {
    .distribution-card-social .social-posting-menu .social-posting-popover,
    .social-posting-menu .social-posting-popover { position:fixed; z-index:100; right:1rem; bottom:5.25rem; left:1rem; width:auto; max-height:calc(100vh - 7rem); overflow:auto; transform:none; }
}

@media (min-width: 720px) {
    .distribution-card-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-gallery-cards .distribution-card-list { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (min-width: 1100px) {
    .distribution-card-list { grid-template-columns:repeat(3,minmax(0,1fr)); }
}