:root{--paper:#f2f0e9;--card:#fcfaf5;--ink:#2f352a;--muted:#858c7b;--line:#dadfce;--dark:#151a13;--accent:#52613e;--serif:Georgia,"Songti SC","Noto Serif CJK SC","SimSun",serif;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-gutter:stable}body{margin:0;background:var(--paper);font:13px/1.65 var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #82945f;outline-offset:4px}h1,h2,h3,p{margin:0}img{display:block;width:100%;max-width:100%}[hidden]{display:none!important}.eyebrow{font-size:9px;letter-spacing:.16em;color:#8b947f}.login-screen{background:var(--dark);color:#e5e8dc;min-height:100svh;display:flex;flex-direction:column;padding:38px clamp(25px,5vw,80px);position:relative;overflow:hidden}.login-screen::after{content:"";position:absolute;right:-150px;top:50%;width:650px;height:650px;border:1px solid #6978571b;border-radius:50%;transform:translateY(-50%);pointer-events:none}.login-brand,.admin-brand{font:29px var(--serif);letter-spacing:.1em;display:flex;gap:17px;align-items:center}.login-brand span,.admin-brand span{font:8px var(--sans);letter-spacing:.19em;color:#8b987b;padding-left:17px;border-left:1px solid #4a573b}.login-card{width:min(380px,100%);margin:9vh auto 8vh;z-index:1}.login-card h1{font:400 38px/1.5 var(--serif);margin-top:18px}.login-intro{color:#99a78b;font-size:12px;margin:15px 0 35px}.login-card label{color:#a8b49b}.login-card input{background:#20281b;color:#eef0e7;border-color:#3b482e}.login-card .primary-button{background:#b9c5a6;color:#1d2718;width:100%;margin-top:8px}.login-back{margin-top:auto;color:#95a486;font-size:11px;min-height:44px;display:flex;align-items:center;width:max-content}.admin-shell{min-height:100svh}.sidebar{width:227px;position:fixed;inset:0 auto 0 0;background:var(--dark);color:#d2dcc4;padding:34px 27px;display:flex;flex-direction:column;z-index:5}.admin-brand{font-size:28px;gap:10px}.admin-brand span{font-size:7px;letter-spacing:.09em;padding-left:10px}.sidebar-caption{font-size:10px;color:#80916e;letter-spacing:.1em;margin-top:15px}.sidebar nav{display:flex;flex-direction:column;gap:7px;margin-top:58px;font-size:12px}.sidebar nav a{min-height:48px;display:flex;align-items:center;gap:21px;border-bottom:1px solid #2b3523}.sidebar nav a:hover{color:#f4f5ef}.sidebar nav span{font-size:9px;color:#677a54}.sidebar-bottom{margin-top:auto;display:flex;flex-direction:column;gap:12px;font-size:10px;color:#92a57b}.sidebar-bottom a{min-height:44px;display:flex;align-items:center}.sidebar-bottom button{background:none;border:1px solid #3a4a2b;color:#becdae;padding:0 15px;min-height:40px;text-align:left;max-width:125px}.sidebar-bottom p{font-size:9px}.admin-main{margin-left:227px;padding:48px clamp(28px,4.5vw,72px) 20px;max-width:1720px}.admin-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:37px;border-bottom:1px solid var(--line);margin-bottom:42px}.admin-heading h1{font:400 clamp(27px,3vw,38px)/1.5 var(--serif);margin-top:12px;letter-spacing:.03em}.private-badge{border:1px solid #c6cfb8;color:#6a7958;font-size:10px;padding:7px 12px;border-radius:999px;white-space:nowrap}.workspace-section{padding-bottom:47px;margin-bottom:43px;border-bottom:1px solid var(--line);scroll-margin-top:22px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:28px}.section-heading h2{font:400 27px var(--serif);margin-top:9px}.section-heading h2 span{font:11px var(--sans);color:#8a967e;margin-left:15px}.section-heading>p{color:#849275;font-size:11px}.upload-layout{display:grid;grid-template-columns:minmax(230px,1fr) minmax(250px,1fr);gap:35px}.drop-zone{aspect-ratio:4/3;border:1px dashed #b9c3aa;background:#e7eadf;display:flex;position:relative;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;border-radius:3px;margin-bottom:13px}.drop-zone.dragover{border-color:#586d3f;background:#dce5d0}.drop-zone input{position:absolute;width:1px;height:1px;opacity:0;margin:0;padding:0}.drop-zone:focus-within{outline:2px solid #82945f;outline-offset:4px}.drop-zone>span{text-align:center;padding:25px}.upload-symbol{font-size:34px;display:block;font-weight:300;line-height:1.1;color:#8a9a77;margin-bottom:23px}.drop-zone b{font-size:12px;font-weight:500;display:block}.drop-zone small{font-size:10px;color:#91a17f;display:block;margin-top:9px}.drop-zone img{height:100%;object-fit:contain;background:#e5e6df}.file-summary{font-size:10px;color:#8a937e;overflow-wrap:anywhere}.metadata-panel{background:#e9ecdf;padding:19px 20px;margin-top:24px;border-radius:3px}.metadata-panel h3{font-size:11px;font-weight:500;color:#596b45}.metadata-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.metadata-heading>span{font-size:9px;white-space:nowrap;color:#71865b;border:1px solid #c3cfb1;padding:2px 7px;border-radius:999px}.metadata-panel>p{font-size:10px;line-height:1.9;color:#8a9b78;margin-top:13px}.metadata-list{display:grid;grid-template-columns:65px minmax(0,1fr);gap:8px 12px;margin:16px 0 0;font-size:10px;line-height:1.75}.metadata-list:empty{display:none}.metadata-list dt{color:#8c9c7a}.metadata-list dd{margin:0;color:#5c6e4a;overflow-wrap:anywhere}label:not(.check-label){display:block;font-size:11px;color:#626f53;margin-bottom:17px}input:not([type=checkbox]):not([type=file]),textarea,select{display:block;width:100%;background:var(--card);border:1px solid #d1d8c5;border-radius:3px;padding:11px 13px;margin-top:7px;font-size:12px;line-height:1.6;min-width:0}textarea{resize:vertical;min-height:100px}input::placeholder,textarea::placeholder{color:#adb49f;font-size:11px}label small{display:block;font-size:10px;color:#98a28b;margin-top:7px;line-height:1.85}.required{color:#9c7253;margin-left:3px}.check-label{display:flex;gap:11px;align-items:flex-start;font-size:11px;margin:18px 0;cursor:pointer}.check-label input{margin:3px 0 0;accent-color:#627c43;flex-shrink:0;width:15px;height:15px}.check-label b{font-size:11px;font-weight:500;color:#586b44}.check-label small{font-size:10px;margin-top:3px}.primary-button{background:#536644;color:#f1f3ea;border:0;border-radius:3px;min-height:45px;padding:10px 19px;display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:11px}.primary-button:hover{background:#435835}.upload-fields>.primary-button{width:100%;margin-top:25px}.secondary-button{border:1px solid #c7d2ba;border-radius:3px;background:#f8f9f2;min-height:42px;padding:9px 15px;font-size:10px;white-space:nowrap}.secondary-button:hover{background:#edf1e3}.text-button{border:0;background:none;min-height:44px;padding:0;font-size:10px;color:#72875a}.form-status{font-size:11px;line-height:1.8;color:#647e49;margin-top:13px;overflow-wrap:anywhere;min-height:18px}.form-status.error{color:#a65237}.global-status{padding:14px 18px;border:1px solid #ccd5ba;border-radius:3px;color:#5f7547;background:#e7edda;font-size:11px;margin-bottom:25px}.global-status.error{background:#f0e7db;border-color:#dec9b5;color:#9c6040}.library-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:21px;font-size:11px;color:#869775}.library-toolbar label{display:flex;gap:10px;align-items:center;font-size:10px;margin:0}.library-toolbar select{font-size:10px;padding:7px 12px;width:120px;margin:0}.library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.library-card{background:var(--card);border:1px solid #d7dec9;border-radius:3px;overflow:hidden}.library-photo{aspect-ratio:4/3;position:relative;display:block;width:100%;border:0;padding:0;background:#e1e5d5}.library-photo img{height:100%;object-fit:cover;transition:opacity .25s}.library-photo:hover img{opacity:.85}.card-badges{position:absolute;left:10px;top:10px;display:flex;gap:5px}.card-badge{background:#e9eddfeb;color:#667b4d;border:1px solid #becdaa;padding:3px 7px;border-radius:999px;font-size:8px}.card-badge.archived{background:#e5ddd0ed;border-color:#cfc1ad;color:#8b7557}.card-copy{padding:15px}.card-copy h3{font:400 17px/1.5 var(--serif);overflow-wrap:anywhere}.card-copy p{font-size:10px;color:#96a180;margin-top:5px;min-height:17px}.card-copy small{font-size:9px;color:#a0aa8e;display:block;margin-top:9px}.card-actions{display:flex;justify-content:space-between;gap:10px;margin-top:15px;border-top:1px solid #e2e7d8;padding-top:7px}.card-actions button{border:0;background:none;min-height:32px;font-size:10px;color:#788f58;padding:0}.empty-library{padding:31px 0;color:#8e9e7b;font-size:12px}.pagination{display:flex;gap:15px;align-items:center;justify-content:center;margin-top:28px}.pagination span{font-size:10px;color:#96a387}.storage-card{border:1px solid #d4ddc5;border-radius:3px;padding:24px 27px;background:#fafbf4;display:flex;align-items:flex-start;justify-content:space-between;gap:25px}.storage-card>div{flex:1;min-width:0}.storage-dot{width:7px;height:7px;display:inline-block;background:#b4c49d;border-radius:50%;vertical-align:middle;margin-right:8px}.storage-dot.configured{background:#729951}.storage-card h3{display:inline;font-size:13px;font-weight:500}.storage-card p{font-size:11px;color:#92a17e;margin-top:10px}.storage-card .metadata-list{max-width:500px}.verify-stages{padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;margin:17px 0 0}.verify-stages li{font-size:10px;padding:10px 13px;background:#e9efdf;border:1px solid #d7e1c7;display:flex;gap:8px;align-items:center}.verify-stages li.failed{background:#f0e8de;border-color:#dacabb;color:#996c4d}.admin-footer{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.12em;color:#9ca88d;padding:3px 0 20px;gap:15px}.edit-dialog{width:min(920px,calc(100% - 44px));max-height:calc(100dvh - 70px);border:1px solid #c6d0b6;border-radius:5px;background:var(--paper);padding:29px 32px;color:var(--ink);overflow:auto}.edit-dialog::backdrop{background:#0a100bd4;backdrop-filter:blur(5px)}.edit-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}.edit-heading h2{font:400 28px var(--serif);margin-top:8px}.icon-button{background:none;border:1px solid #c7d0b7;border-radius:50%;width:42px;height:42px;font-size:23px;color:#778e5b}.edit-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px}.edit-layout>div>img{max-height:400px;object-fit:contain;background:#e7ebdf;border-radius:3px}.edit-layout .metadata-panel{padding:16px}.edit-actions{display:flex;gap:10px;align-items:center;margin-top:22px}.edit-actions .primary-button{flex:1;justify-content:center}.object-details{margin-top:20px;font-size:10px;color:#97a585}.object-details summary{cursor:pointer;min-height:35px}.object-details p{overflow-wrap:anywhere;font-size:9px;line-height:1.8;color:#8d9c7a}.edit-fields label{margin-bottom:15px}.edit-fields .check-label{margin-top:16px}.edit-fields .form-status{min-height:0}noscript{padding:25px;color:#906246}
.login-screen .login-card input:not([type=checkbox]){background:#20281b;color:#eef0e7;border-color:#3b482e}
@media(min-width:1500px){.library-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.upload-layout{gap:50px}}
@media(max-width:1150px){.sidebar{width:200px;padding-left:23px;padding-right:23px}.admin-main{margin-left:200px;padding-left:30px;padding-right:30px}.upload-layout{gap:25px;grid-template-columns:minmax(210px,1fr) minmax(230px,1fr)}.library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-heading>p{max-width:170px;text-align:right}.private-badge{display:none}.admin-brand{font-size:25px}.admin-brand span{font-size:6px}}
@media(max-width:820px){.sidebar{position:static;width:100%;padding:18px 24px;display:grid;grid-template-columns:1fr auto;gap:9px 15px}.sidebar-caption{display:none}.sidebar nav{margin:0;flex-direction:row;gap:22px;grid-column:1/-1;font-size:10px}.sidebar nav a{border:0;min-height:34px;gap:7px}.sidebar nav span{font-size:8px}.sidebar-bottom{margin:0;flex-direction:row;gap:14px;align-items:center;font-size:9px;grid-column:2;grid-row:1}.sidebar-bottom a{min-height:34px}.sidebar-bottom p{display:none}.sidebar-bottom button{min-height:30px;padding:0;border:0;max-width:none;font-size:9px}.admin-main{margin:0;padding:31px 25px 10px}.admin-heading{margin-bottom:31px;padding-bottom:28px}.admin-heading h1{font-size:29px}.upload-layout{grid-template-columns:1fr 1fr;gap:24px}.section-heading>p{font-size:10px}.workspace-section{scroll-margin-top:20px}.storage-card{padding:20px}.login-card{margin-top:12vh}.edit-dialog{width:calc(100% - 30px);padding:24px;max-height:calc(100dvh - 40px)}}
@media(max-width:610px){.sidebar{padding:16px 20px}.sidebar nav{gap:24px}.sidebar nav a{font-size:10px}.admin-main{padding:27px 20px 10px}.admin-heading h1{font-size:26px}.eyebrow{font-size:8px;letter-spacing:.13em}.section-heading{align-items:center;margin-bottom:23px}.section-heading h2{font-size:25px}.section-heading>p{display:none}.upload-layout{grid-template-columns:1fr;gap:22px}.drop-zone{aspect-ratio:4/3;max-height:420px}.metadata-panel{margin-top:18px}.upload-fields label{margin-bottom:18px}.library-grid{gap:13px}.card-copy{padding:13px 11px}.card-copy h3{font-size:16px}.library-toolbar{gap:10px;align-items:flex-start}.library-toolbar p{font-size:10px;max-width:170px}.library-toolbar label{font-size:9px;gap:6px}.library-toolbar select{width:98px;font-size:9px;padding:6px 8px}.card-actions{gap:5px;flex-wrap:wrap}.card-actions button{font-size:9px}.storage-card{flex-direction:column;gap:22px;padding:21px}.storage-card .secondary-button{width:100%;text-align:center}.verify-stages{grid-template-columns:1fr}.admin-footer{flex-direction:column;gap:8px}.edit-dialog{width:calc(100% - 24px);padding:21px 18px;max-height:calc(100dvh - 28px)}.edit-layout{grid-template-columns:1fr;gap:25px}.edit-layout>div>img{max-height:300px}.edit-heading{margin-bottom:21px}.edit-heading h2{font-size:26px}.edit-actions{position:sticky;bottom:-21px;background:var(--paper);padding:13px 0;border-top:1px solid #d8dfca;z-index:1}.object-details{margin-top:15px}.login-card{margin-top:11vh}.login-card h1{font-size:33px}.login-intro{font-size:11px}.primary-button,.secondary-button{min-height:45px}}
@media(max-width:360px){.sidebar{padding-left:16px;padding-right:16px}.sidebar nav{gap:16px}.sidebar-bottom{gap:10px}.sidebar-bottom a{font-size:8px}.admin-main{padding-left:16px;padding-right:16px}.library-grid{grid-template-columns:1fr}.login-brand{font-size:26px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* FOUND ON THE WAY — white and cyan workspace.
   The responsive layout and business controls keep their existing structure. */
:root {
  --paper: #fff;
  --card: #fff;
  --surface: #f6fbfc;
  --ink: #172d33;
  --muted: #53696f;
  --line: #e1ebed;
  --dark: #f6fbfc;
  --accent: #087f86;
  --accent-ink: #076f76;
  --cyan-wash: #e9f8f7;
  --error: #b14645;
  --serif: var(--sans);
}

body { background: var(--paper); color: var(--ink); }
.eyebrow { color: var(--accent); }
.login-brand, .admin-brand,
.login-card h1, .admin-heading h1,
.section-heading h2, .edit-heading h2, .card-copy h3 {
  font-family: var(--sans);
  letter-spacing: -.025em;
}
.login-brand, .admin-brand { font-weight: 600; }
.login-card h1, .admin-heading h1,
.section-heading h2, .edit-heading h2 { font-weight: 500; }
button:focus-visible, a:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible,
.drop-zone:focus-within {
  outline: 2px solid var(--accent);
  outline-offset: 4px;
}
button, .sidebar nav a, .library-card, .drop-zone,
input:not([type=checkbox]):not([type=file]), textarea, select {
  transition: background-color .2s ease, border-color .2s ease,
    box-shadow .2s ease, transform .2s ease;
}

/* A clean login surface with one quiet cyan accent. */
.login-screen { color: var(--ink); background: var(--surface); }
.login-screen::after { display: none; }
.login-brand span { color: var(--muted); border-color: #bddee0; }
.login-card {
  width: min(440px, 100%);
  padding: 32px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 16px 48px #172d3308;
}
.login-card h1 { font-size: clamp(27px, 3vw, 34px); }
.login-intro, .login-card label { color: var(--muted); }
.login-back { color: var(--accent); font-family: var(--sans); font-size: 12px; }
.login-screen .login-card input:not([type=checkbox]) {
  background: var(--card);
  color: var(--ink);
  border-color: #b9cdd1;
}
.login-screen .login-card .primary-button { background: var(--accent); color: #fff; }
.login-screen .login-card .primary-button:hover { background: #066b72; }
.login-screen .login-card .primary-button:active { background: #055c62; }

/* Light navigation with a cyan response rather than a dark visual block. */
.sidebar {
  background: var(--surface);
  color: var(--ink);
  border-right: 1px solid var(--line);
}
.admin-brand { flex-direction: column; align-items: flex-start; gap: 8px; }
.admin-brand span { padding-left: 0; border: 0; color: var(--muted); font-size: 8px; letter-spacing: .15em; }
.sidebar-caption { color: var(--muted); font-family: var(--sans); font-size: 11px; letter-spacing: .03em; }
.sidebar nav a { border-color: var(--line); border-radius: 10px; }
.sidebar nav a:hover, .sidebar nav a:focus-visible { color: var(--accent); background: var(--cyan-wash); }
.sidebar nav span { color: var(--muted); }
.sidebar-bottom { color: var(--muted); }
.sidebar-bottom a:hover { color: var(--accent); }
.sidebar-bottom button { color: var(--ink); border-color: #b9cdd1; border-radius: 10px; }
.sidebar-bottom button:hover { color: var(--accent); border-color: var(--accent); background: var(--cyan-wash); }
.private-badge { color: var(--accent-ink); border-color: #b7dedf; background: var(--cyan-wash); border-radius: 999px; }
.section-heading h2 span, .section-heading > p { color: var(--muted); }

/* The photo stays prominent; supporting information uses soft, plain surfaces. */
.drop-zone { background: var(--surface); border-color: #a8c9ce; border-radius: 14px; }
.drop-zone:hover { background: var(--cyan-wash); border-color: var(--accent); }
.drop-zone.dragover { background: var(--cyan-wash); border-color: var(--accent); box-shadow: 0 0 0 3px #087f8614; }
.upload-symbol { color: var(--accent); }
.drop-zone small, .file-summary { color: var(--muted); }
.drop-zone img, .edit-layout > div > img { background: var(--surface); border-radius: 12px; }
.metadata-panel, .storage-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.metadata-panel h3, .metadata-list dd { color: var(--ink); }
.metadata-heading > span { color: var(--accent-ink); border-color: #b7dedf; background: var(--cyan-wash); }
.metadata-panel > p, .metadata-list dt { color: var(--muted); }
label:not(.check-label), .check-label b { color: var(--ink); }
input:not([type=checkbox]):not([type=file]), textarea, select {
  border-color: #b9cdd1;
  border-radius: 10px;
  background: var(--card);
}
input:not([type=checkbox]):not([type=file]):focus,
textarea:focus, select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px #087f8614;
}
.login-screen .login-card input:not([type=checkbox]):focus { border-color: var(--accent); }
input::placeholder, textarea::placeholder { color: #61777d; }
label small { color: var(--muted); }
.required { color: var(--error); }
.check-label input { accent-color: var(--accent); }

.primary-button { background: var(--accent); color: #fff; border-radius: 10px; }
.primary-button:hover { background: #066b72; box-shadow: 0 5px 14px #087f861a; }
.primary-button:active { background: #055c62; transform: translateY(1px); box-shadow: none; }
.secondary-button { background: #fff; border-color: #b9cdd1; color: var(--ink); border-radius: 10px; }
.secondary-button:hover { background: var(--cyan-wash); border-color: #91bec3; }
.secondary-button:active { background: #d9eeef; transform: translateY(1px); }
.text-button, .card-actions button { color: var(--accent); }
.text-button:hover, .card-actions button:hover { color: #055c62; }
.text-button:active, .card-actions button:active { transform: translateY(1px); }
button:disabled { box-shadow: none; transform: none; }
.form-status { color: var(--accent); }
.form-status.error { color: var(--error); }
.global-status { background: var(--cyan-wash); border-color: #b7dedf; color: #17676c; border-radius: 10px; }
.global-status.error { background: #fff3f2; border-color: #efcdca; color: var(--error); }

.library-toolbar, .empty-library, .pagination span { color: var(--muted); }
.library-card { background: var(--card); border-color: var(--line); border-radius: 14px; box-shadow: 0 4px 18px #172d3305; }
.library-card:hover { border-color: #bbd7da; box-shadow: 0 8px 24px #172d3309; }
.library-photo { background: var(--surface); }
.library-photo:hover img { opacity: .94; }
.card-badge { background: #e9f8f7f2; color: #17676c; border-color: #b7dedf; }
.card-badge.archived { background: #f2f5f7f2; border-color: #cbd6db; color: var(--muted); }
.card-copy p, .card-copy small { color: var(--muted); }
.card-actions { border-color: var(--line); }
.storage-card p { color: var(--muted); }
.storage-dot { background: #9dbbc0; }
.storage-dot.configured { background: var(--accent); }
.verify-stages li { background: var(--cyan-wash); border-color: #cce7e8; color: #17676c; border-radius: 10px; }
.verify-stages li.failed { background: #fff3f2; border-color: #efcdca; color: var(--error); }
.admin-footer { color: var(--muted); }
.admin-footer span:last-child { font-family: var(--sans); font-size: 11px; letter-spacing: .02em; }
.edit-dialog { border-color: var(--line); border-radius: 16px; background: var(--paper); box-shadow: 0 24px 80px #172d3326; }
.edit-dialog::backdrop { background: #172d335e; backdrop-filter: blur(7px); }
.icon-button { color: var(--muted); border-color: #b9cdd1; }
.icon-button:hover { color: var(--accent); background: var(--cyan-wash); border-color: #91bec3; }
.icon-button:active { transform: scale(.96); }
.object-details, .object-details p { color: var(--muted); }
noscript { color: var(--error); }

@media (max-width: 820px) {
  .sidebar { border-right: 0; border-bottom: 1px solid var(--line); }
}
@media (max-width: 610px) {
  .login-card { padding: 26px 20px; }
  .login-card h1 { font-size: 27px; }
  .login-brand { gap: 12px; font-size: 27px; }
  .login-brand span { padding-left: 12px; font-size: 7px; letter-spacing: .12em; }
  .edit-actions { border-color: var(--line); }
}
@media (max-width: 360px) {
  .login-brand { align-items: flex-start; flex-direction: column; gap: 7px; }
  .login-brand span { padding-left: 0; border: 0; }
}

/* The batch keeps one photo editor and a compact, individually selectable list. */
.upload-batch-summary { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 18px 20px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.upload-batch-summary h3 { margin: 0; color: var(--ink); font: 500 13px/1.6 var(--sans); }
.upload-batch-summary p { margin: 4px 0 0; color: var(--muted); font-size: 11px; line-height: 1.8; }
.queue-actions { display: flex; align-items: center; gap: 16px; flex-shrink: 0; }
.queue-actions .secondary-button { min-height: 40px; }
.queue-actions .text-button { min-height: 40px; white-space: nowrap; }
.upload-queue { list-style: none; margin: 0 0 28px; padding: 2px; display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 10px; max-height: 232px; overflow-y: auto; scrollbar-gutter: stable; scroll-padding: 8px; }
.upload-queue-item { display: flex; flex-wrap: wrap; align-items: stretch; min-width: 0; position: relative; border: 1px solid var(--line); border-radius: 10px; background: #fff; transition: background .2s, border-color .2s; }
.upload-queue-item:has(.queue-select[aria-current="true"]) { border-color: #91bec3; background: var(--cyan-wash); }
.queue-select { display: flex; align-items: center; text-align: left; gap: 12px; padding: 12px; flex: 1; min-width: 0; min-height: 68px; border-radius: 9px; }
.queue-select:hover { background: #087f8607; }
.queue-select:disabled { opacity: 1; cursor: default; }
.queue-select:focus-visible, .queue-remove:focus-visible { outline-offset: -3px; }
.queue-number { display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; color: var(--accent-ink); background: var(--cyan-wash); border-radius: 8px; font-size: 10px; }
.queue-copy { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.queue-copy b, .queue-copy strong { font: 500 11px/1.5 var(--sans); color: var(--ink); overflow-wrap: anywhere; }
.queue-copy b { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.queue-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.queue-copy small, .queue-state { font-size: 10px; line-height: 1.6; color: var(--muted); }
.queue-state { display: block; flex-shrink: 0; white-space: nowrap; }
.queue-remove { display: grid; place-items: center; flex-shrink: 0; width: 36px; min-height: 44px; border-radius: 9px; color: var(--muted); font-size: 18px; align-self: center; margin-right: 4px; }
.queue-remove:hover { background: #fff3f2; color: var(--error); }
.upload-queue-item[data-state="success"] { background: var(--surface); }
.upload-queue-item[data-state="success"] .queue-state { color: var(--accent-ink); }
.upload-queue-item[data-state="error"], .upload-queue-item[data-state="uncertain"] { border-color: #efcdca; }
.upload-queue-item[data-state="error"] .queue-state, .upload-queue-item[data-state="uncertain"] .queue-state, .queue-error { color: var(--error); }
.queue-error { flex: 0 0 100%; margin: 0; padding: 0 12px 12px; font-size: 10px; line-height: 1.7; overflow-wrap: anywhere; }
.upload-queue-item[data-state="uploading"] .queue-number { color: #fff; background: var(--accent); }
.upload-selection-hint { color: var(--accent-ink); background: var(--cyan-wash); padding: 11px 14px; border-radius: 8px; font-size: 11px; line-height: 1.8; margin-bottom: 20px; overflow-wrap: anywhere; }
.field-helper { color: var(--accent-ink); display: inline-flex; align-items: center; min-height: 36px; margin: -10px 0 12px; padding: 0 2px; border-bottom: 1px solid #b7dedf; text-align: left; font-size: 10px; line-height: 1.7; }
.field-helper:hover { border-color: var(--accent); }
.field-helper:disabled { color: var(--muted); cursor: default; }
.upload-controls { display: flex; align-items: center; gap: 10px; margin-top: 25px; }
.upload-controls .primary-button { flex: 1; min-width: 0; }
.upload-controls .secondary-button { flex-shrink: 0; }
.upload-progress { border: 1px solid var(--line); border-radius: 10px; background: var(--surface); padding: 15px 16px; margin-top: 20px; }
.upload-progress progress { width: 100%; height: 5px; display: block; overflow: hidden; border: 0; border-radius: 999px; accent-color: var(--accent); background: var(--line); }
.upload-progress progress::-webkit-progress-bar { border-radius: 999px; background: var(--line); }
.upload-progress progress::-webkit-progress-value { border-radius: 999px; background: var(--accent); transition: width .25s ease; }
.upload-progress progress::-moz-progress-bar { border-radius: 999px; background: var(--accent); }
.upload-progress p { color: var(--muted); font-size: 10px; line-height: 1.8; margin: 9px 0 0; overflow-wrap: anywhere; }
.upload-fields input:disabled, .upload-fields textarea:disabled { background: var(--surface); opacity: .75; }
@media (max-width: 610px) {
  .upload-batch-summary { align-items: flex-start; flex-direction: column; gap: 12px; padding: 16px; }
  .queue-actions { width: 100%; justify-content: space-between; }
  .upload-queue { grid-template-columns: minmax(0, 1fr); max-height: 250px; margin-bottom: 22px; }
  .queue-select { padding: 11px 12px; min-height: 64px; }
}

/* Pair one optional clip with one photo; previews remain unloaded until requested. */
.live-video-panel, .pending-videos-panel { padding: 17px 18px; margin-top: 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.live-video-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.live-video-heading h3, .pending-videos-panel h3 { font: 500 12px/1.6 var(--sans); color: var(--ink); margin: 0; }
.live-badge, .queue-live { color: var(--accent-ink); font: 600 9px/1.6 var(--sans); letter-spacing: .04em; }
.live-badge { border: 1px solid #b7dedf; border-radius: 999px; padding: 2px 8px; background: var(--cyan-wash); }
.queue-live { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-video-summary, .live-video-hint, .pending-videos-panel > p { color: var(--muted); font-size: 10px; line-height: 1.8; overflow-wrap: anywhere; margin: 9px 0 0; }
.live-video-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 12px; }
.live-video-actions .secondary-button { padding: 8px 12px; min-height: 38px; font-size: 10px; }
.live-video-actions .text-button { min-height: 38px; display: inline-flex; align-items: center; font-size: 10px; }
.live-video-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); opacity: 0; pointer-events: none; }
.live-video-panel video { display: block; width: 100%; max-height: 320px; margin-top: 14px; border-radius: 10px; background: #172d33; object-fit: contain; }
.pending-videos-panel { margin: 0 0 25px; background: #fff; }
.pending-videos-list { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 8px; }
.pending-video-item { display: flex; align-items: center; justify-content: space-between; gap: 15px; min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.pending-video-copy { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pending-video-copy b { font: 500 11px/1.6 var(--sans); overflow-wrap: anywhere; color: var(--ink); }
.pending-video-copy small { font: 10px/1.7 var(--sans); overflow-wrap: anywhere; color: var(--muted); }
.pending-video-actions { display: flex; gap: 15px; flex-shrink: 0; }
.pending-video-actions button { min-height: 40px; font-size: 10px; white-space: nowrap; }
.card-badge.live { font-weight: 600; letter-spacing: .06em; }
@media (max-width: 610px) {
  .live-video-panel, .pending-videos-panel { padding: 15px; }
  .pending-video-item { align-items: flex-start; flex-direction: column; gap: 8px; }
  .pending-video-actions { align-self: stretch; justify-content: space-between; }
}

/* A photo and its information remain side by side while reviewing a draft. */
.edit-dialog { width: min(1160px, calc(100% - 48px)); max-height: calc(100dvh - 48px); padding: 0; }
.edit-heading { position: sticky; top: 0; z-index: 3; margin: 0; padding: 22px 28px; border-bottom: 1px solid var(--line); background: #fffffff5; backdrop-filter: blur(12px); }
.edit-heading h2 { margin-top: 7px; font-size: 25px; }
.edit-layout { grid-template-columns: minmax(0, 1.15fr) minmax(340px, 1fr); gap: 0; align-items: start; }
.edit-preview-column { padding: 28px; position: sticky; top: 106px; }
.edit-preview-column > img { display: block; width: 100%; max-height: min(50dvh, 520px); object-fit: contain; }
.edit-preview-column .metadata-panel { margin-top: 20px; }
.edit-fields { min-width: 0; padding: 28px; border-left: 1px solid var(--line); }
.info-section-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 21px; }
.info-section-heading h3 { font: 600 14px/1.5 var(--sans); color: var(--ink); }
.info-label { flex-shrink: 0; padding: 4px 9px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 9px; line-height: 1.6; }
.draft-label { color: var(--accent-ink); border-color: #b7dedf; background: var(--cyan-wash); }
.ai-draft-panel { scroll-margin-top: 128px; margin-top: 27px; padding: 21px; background: var(--surface); border: 1px solid #cce5e6; border-radius: 12px; }
.ai-draft-panel .info-section-heading { margin-bottom: 12px; }
.ai-draft-panel[data-state="failed"] { border-color: #efcdca; }
.ai-draft-note, .ai-config-hint, .ai-apply-note { display: block; color: var(--muted); font-size: 10px; line-height: 1.9; overflow-wrap: anywhere; }
.ai-config-hint { margin-top: 10px; }
.ai-draft-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 15px; }
.ai-draft-actions button { min-height: 38px; font-size: 10px; }
.ai-draft-panel .form-status { margin: 12px 0; }
.ai-apply-note { margin-top: 10px; }
.ai-draft-panel .primary-button { width: 100%; justify-content: center; }
.tag-editor { margin-bottom: 18px; }
.tag-editor label { display: block; font-size: 11px; line-height: 1.7; margin-bottom: 8px; }
.tag-editor label small { display: block; margin-top: 4px; }
.tag-chips { display: flex; flex-wrap: wrap; gap: 7px; min-width: 0; }
.tag-chips:empty { display: none; }
.tag-chip { display: inline-flex; align-items: center; gap: 3px; min-width: 0; max-width: 100%; margin-bottom: 8px; padding: 2px 3px 2px 10px; color: var(--accent-ink); background: var(--cyan-wash); border: 1px solid #b7dedf; border-radius: 999px; font-size: 10px; line-height: 1.7; }
.tag-chip > span { overflow-wrap: anywhere; }
.tag-chip button { display: grid; place-items: center; flex-shrink: 0; min-height: 28px; width: 28px; border-radius: 50%; font-size: 17px; color: var(--accent); }
.tag-chip button:hover { background: #cfeceb; }
.tag-input-row { display: flex; align-items: center; gap: 8px; }
.tag-input-row input { flex: 1; min-width: 0; margin: 0; }
.tag-input-row .secondary-button { min-height: 40px; padding: 8px 13px; font-size: 10px; }
.tag-status { font-size: 10px; color: var(--muted); line-height: 1.8; margin-top: 5px; }
.tag-status:empty { display: none; }
.tag-status.error { color: var(--error); }
.edit-fields .edit-actions { position: sticky; bottom: -28px; z-index: 2; background: #fffffff5; border-top: 1px solid var(--line); padding: 15px 0; backdrop-filter: blur(12px); }
.queue-organize { width: 100%; text-align: left; font-size: 10px; color: var(--accent); padding: 0 12px 10px; min-height: 32px; }
.queue-organize:hover { color: #055c62; }
.card-actions { flex-wrap: wrap; gap: 6px 12px; }
.ai-upload-option { padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.ai-upload-option input:disabled { opacity: .5; }
@media (max-width: 820px) {
  .edit-layout { grid-template-columns: minmax(0, .9fr) minmax(320px, 1fr); }
  .edit-preview-column, .edit-fields { padding: 22px; }
  .edit-heading { padding: 20px 22px; }
}
@media (max-width: 700px) {
  .edit-dialog { width: 100vw; max-width: none; height: 100dvh; max-height: 100dvh; margin: 0; border: 0; border-radius: 0; }
  .edit-heading { padding: max(16px, env(safe-area-inset-top)) 20px 16px; }
  .edit-heading h2 { font-size: 23px; }
  .edit-layout { grid-template-columns: minmax(0, 1fr); }
  .edit-preview-column { position: static; padding: 20px; }
  .edit-preview-column > img { max-height: 42dvh; }
  .edit-preview-column .metadata-panel { margin-top: 15px; }
  .edit-fields { border-left: 0; border-top: 1px solid var(--line); padding: 22px 20px; }
  .ai-draft-panel { padding: 17px; scroll-margin-top: 112px; }
  .edit-fields .edit-actions { bottom: -22px; padding: 14px 0 max(14px, env(safe-area-inset-bottom)); }
  .info-section-heading { margin-bottom: 18px; }
}
