:root{
  --paper:#EEF0EC;
  --ink:#1E2422;
  --ink-soft:#151918;
  --accent:#2F6F62;
  --accent-soft:#8FBBAE;
  --brass:#A9824C;
  --text-on-ink:#F7F8F5;
  --muted:#8D8A7E;
  --card-bg:#F7F8F5;
  --font-display:'Space Grotesk', sans-serif;
  --font-body:'IBM Plex Sans', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;
  --radius-lg:28px;
  --radius-md:16px;
  --radius-sm:10px;
  --ease-out:cubic-bezier(.23,1,.32,1);
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  line-height:1.5;
}
h1,h2{ font-family:var(--font-display); font-weight:500; margin:0 0 .5rem; }
p{ margin:0; color:var(--muted); }

.admin-shell{
  display:grid;
  grid-template-columns:260px 1fr;
  min-height:100vh;
}

.sidebar{
  background:var(--ink-soft);
  color:var(--text-on-ink);
  padding:2rem 1.5rem;
  display:flex;
  flex-direction:column;
  gap:2rem;
}
.brand{
  font-family:var(--font-display);
  font-size:1.2rem;
  color:var(--text-on-ink);
  text-decoration:none;
}
.brand span{ color:var(--accent-soft); }
.eyebrow{
  font-family:var(--font-mono);
  font-size:.68rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--accent-soft);
}
.admin-nav{ display:flex; flex-direction:column; gap:.4rem; flex:1; }
.admin-nav-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.5rem;
  border:0;
  background:transparent;
  color:rgba(247,248,245,.65);
  font-family:var(--font-body);
  font-size:.92rem;
  text-align:left;
  padding:.7rem .9rem;
  border-radius:var(--radius-sm);
  cursor:pointer;
  transition:background .2s ease, color .2s ease, transform .15s var(--ease-out);
}
.admin-nav-item:hover{ background:rgba(247,248,245,.06); color:var(--text-on-ink); }
.admin-nav-item:active{ transform:scale(.98); }
.admin-nav-item.active{ background:var(--accent); color:var(--text-on-ink); }
.admin-nav-item span{
  font-family:var(--font-mono);
  font-size:.7rem;
  background:rgba(247,248,245,.14);
  padding:.1rem .5rem;
  border-radius:999px;
}
.admin-nav-item.active span{ background:rgba(21,25,24,.25); }

.back-link, .logout-button{
  font-family:var(--font-mono);
  font-size:.8rem;
  color:rgba(247,248,245,.6);
  text-decoration:none;
  border:1px solid rgba(247,248,245,.16);
  border-radius:var(--radius-sm);
  padding:.65rem .9rem;
  text-align:center;
  background:transparent;
  cursor:pointer;
  transition:background .2s ease, color .2s ease, transform .15s var(--ease-out);
}
.back-link:hover, .logout-button:hover{ background:rgba(247,248,245,.08); color:var(--text-on-ink); }
.back-link:active, .logout-button:active{ transform:scale(.97); }

.admin-content{ padding:3rem 3.5rem; max-width:1100px; }
.admin-header{ margin-bottom:2.5rem; }
.admin-header h1{ font-size:2.2rem; letter-spacing:-.01em; }

.admin-view{ display:none; }
.admin-view.active{ display:block; animation:view-in .35s ease; }
@keyframes view-in{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

.view-heading{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:1rem;
  margin-bottom:1.5rem;
}
.view-heading h2{ font-size:1.4rem; }
.view-heading p{ margin-top:.3rem; font-size:.9rem; }

.text-button{
  border:0; background:transparent; color:var(--accent);
  font-family:var(--font-mono); font-size:.8rem;
  cursor:pointer; text-decoration:underline; text-underline-offset:3px;
  transition:color .2s ease;
}
.text-button:hover{ color:var(--ink); }

.table-wrap{
  background:var(--card-bg);
  border:1px solid rgba(30,36,34,.08);
  border-radius:var(--radius-md);
  overflow:hidden;
}
table{ width:100%; border-collapse:collapse; }
thead th{
  text-align:left;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--muted);
  padding:.9rem 1.2rem;
  border-bottom:1px solid rgba(30,36,34,.08);
}
tbody td{
  padding:1rem 1.2rem;
  border-bottom:1px solid rgba(30,36,34,.06);
  font-size:.92rem;
  vertical-align:top;
}
tbody tr:last-child td{ border-bottom:0; }
tbody tr:hover{ background:rgba(47,111,98,.04); }
tbody small{ display:block; color:var(--muted); font-size:.78rem; margin-top:.15rem; }

.delete-request{
  border:1px solid rgba(30,36,34,.15);
  background:transparent;
  color:var(--muted);
  font-family:var(--font-mono);
  font-size:.75rem;
  padding:.4rem .8rem;
  border-radius:var(--radius-sm);
  cursor:pointer;
  transition:border-color .2s ease, color .2s ease, transform .15s var(--ease-out);
}
.delete-request:hover{ border-color:#b3453f; color:#b3453f; }
.delete-request:active{ transform:scale(.96); }

.empty-state{
  text-align:center;
  padding:3rem 1rem;
  color:var(--muted);
  font-size:.9rem;
}

.editor-form{
  display:grid;
  gap:1.25rem;
  background:var(--card-bg);
  border:1px solid rgba(30,36,34,.08);
  border-radius:var(--radius-md);
  padding:2rem;
}
.editor-form label{
  display:grid;
  gap:.5rem;
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.03em;
  color:var(--ink);
}
.editor-form textarea,
.editor-form input{
  width:100%;
  border:1px solid rgba(30,36,34,.15);
  border-radius:var(--radius-sm);
  background:var(--paper);
  padding:.8rem .9rem;
  font:400 .95rem var(--font-body);
  color:var(--ink);
  resize:vertical;
  outline:0;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.editor-form textarea:focus,
.editor-form input:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 4px rgba(47,111,98,.12);
}

.save-button{
  justify-self:start;
  border:0;
  background:var(--accent);
  color:var(--text-on-ink);
  font-family:var(--font-mono);
  font-size:.85rem;
  letter-spacing:.03em;
  padding:.85rem 1.5rem;
  border-radius:999px;
  cursor:pointer;
  transition:transform .2s var(--ease-out), background .2s ease;
}
@media (hover:hover) and (pointer:fine){
  .save-button:hover{ transform:translateY(-2px); background:#254f45; }
}
.save-button:active{ transform:scale(.97); }
.save-status{ min-height:1.3em; font-size:.85rem; color:var(--accent); }

.photo-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
  gap:1.5rem;
}
.photo-card{
  background:var(--card-bg);
  border:1px solid rgba(30,36,34,.08);
  border-radius:var(--radius-md);
  padding:1.2rem;
  text-align:center;
  transition:transform .25s var(--ease-out), box-shadow .25s var(--ease-out);
}
@media (hover:hover) and (pointer:fine){
  .photo-card:hover{ transform:translateY(-3px); box-shadow:0 16px 34px rgba(0,0,0,.08); }
}
.photo-card p{ font-size:.85rem; margin:.6rem 0; }
.photo-preview{
  width:100%;
  aspect-ratio:4/3;
  border-radius:var(--radius-sm);
  background:var(--ink-soft) center/cover no-repeat;
  border:1px solid rgba(30,36,34,.1);
}
.upload-button{
  display:inline-block;
  border:1px solid rgba(30,36,34,.15);
  border-radius:999px;
  padding:.5rem 1.1rem;
  font-family:var(--font-mono);
  font-size:.75rem;
  cursor:pointer;
  transition:background .2s ease, transform .15s var(--ease-out);
}
.upload-button:hover{ background:rgba(47,111,98,.08); }
.upload-button:active{ transform:scale(.96); }
.upload-button input{ display:none; }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}

@media (max-width:900px){
  .admin-shell{ grid-template-columns:1fr; }
  .sidebar{
    flex-direction:row;
    align-items:center;
    flex-wrap:wrap;
    gap:1rem;
    padding:1.2rem 1.5rem;
  }
  .admin-nav{ flex-direction:row; flex-wrap:wrap; flex:none; }
  .admin-content{ padding:2rem 1.5rem; }
  .table-wrap{ overflow-x:auto; }
  .view-heading{ flex-direction:column; align-items:flex-start; }
}

/* ============ Apple-style continuous corners (progressive enhancement) ============ */
@supports (corner-shape: squircle){
  .table-wrap, .editor-form, .photo-card, .photo-preview{ corner-shape:squircle; }
}