:root { --ink:#20201e; --muted:#6f6d68; --paper:#f7f4ee; --white:#fff; --orange:#ff5b35; --mint:#bfe8d0; --yellow:#f7d75c; --line:#dedbd4; --sidebar:244px; }
* { box-sizing:border-box; }
html { color-scheme:light; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.45 "Trebuchet MS",Arial,sans-serif; }
button,input,textarea,select { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
[hidden] { display:none !important; }
.eyebrow { color:var(--orange); font-size:.72rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.login-view { min-height:100vh; padding:24px; display:grid; place-items:center; background:radial-gradient(circle at 18% 20%,rgba(255,91,53,.22),transparent 30%),radial-gradient(circle at 85% 80%,rgba(191,232,208,.5),transparent 32%),var(--paper); }
.login-card { width:min(440px,100%); padding:44px; border:1px solid var(--line); border-radius:28px; background:rgba(255,255,255,.9); box-shadow:0 28px 80px rgba(55,46,39,.13); }
.login-card img { width:78px; height:58px; margin-bottom:26px; border-radius:12px; object-fit:cover; }
.login-card h1 { margin:10px 0 12px; font:700 2.8rem/1 Georgia,serif; letter-spacing:-.04em; }
.login-card > p { margin-bottom:30px; color:var(--muted); }
.login-card label { display:block; margin-bottom:8px; font-weight:900; }
.password-field { display:flex; border:1px solid var(--line); border-radius:13px; background:#fff; overflow:hidden; }
.password-field:focus-within { border-color:var(--orange); box-shadow:0 0 0 3px rgba(255,91,53,.12); }
.password-field input { width:100%; min-height:52px; padding:0 15px; border:0; outline:0; font-size:1.1rem; }
.password-field button { padding:0 15px; border:0; color:var(--muted); background:transparent; cursor:pointer; font-size:.8rem; font-weight:900; }
.form-error { min-height:22px; margin:8px 0; color:#bf301e; font-size:.85rem; }
.primary-button,.secondary-button,.upload-button { min-height:48px; padding:0 20px; display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:12px; font-weight:900; text-decoration:none; cursor:pointer; }
.primary-button { color:#fff; background:var(--ink); }.primary-button:hover { background:var(--orange); }
.login-card .primary-button { width:100%; }
.secondary-button,.upload-button { border:1px solid var(--line); color:var(--ink); background:#fff; }
.admin-shell { min-height:100vh; display:grid; grid-template-columns:var(--sidebar) minmax(0,1fr); }
.sidebar { position:sticky; top:0; height:100vh; padding:24px 18px; display:flex; flex-direction:column; overflow-y:auto; color:#fff; background:var(--ink); }
.admin-brand { display:flex; align-items:center; gap:12px; margin:0 5px 34px; color:#fff; text-decoration:none; }
.admin-brand img { width:48px; height:42px; border-radius:10px; object-fit:cover; }
.admin-brand span { display:grid; }.admin-brand small { color:rgba(255,255,255,.55); }
.sidebar nav { display:grid; gap:7px; }
.nav-button { width:100%; min-height:48px; padding:0 13px; display:flex; align-items:center; gap:12px; border:0; border-radius:12px; color:rgba(255,255,255,.7); background:transparent; text-align:left; font-weight:800; cursor:pointer; }
.nav-button span { width:24px; text-align:center; font-size:1.1rem; }.nav-button:hover,.nav-button.is-active { color:#fff; background:rgba(255,255,255,.1); }.nav-button.is-active span { color:var(--orange); }
.sidebar-bottom { margin-top:auto; display:grid; gap:8px; }.sidebar-bottom a,.sidebar-bottom button { min-height:42px; padding:0 12px; display:flex; align-items:center; border:0; border-radius:10px; color:rgba(255,255,255,.72); background:transparent; text-decoration:none; cursor:pointer; }.sidebar-bottom a:hover,.sidebar-bottom button:hover { color:#fff; background:rgba(255,255,255,.08); }
.admin-main { min-width:0; padding:34px clamp(24px,5vw,70px) 100px; }
.admin-header { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:36px; }
.admin-header h1 { margin:4px 0 0; font:700 clamp(2.4rem,4vw,4rem)/1 Georgia,serif; letter-spacing:-.045em; }
.save-state { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.82rem; }.status-dot { width:8px; height:8px; border-radius:50%; background:#52a875; }.save-state.is-saving .status-dot { background:var(--yellow); }.save-state.is-error .status-dot { background:#d33b2d; }
.panel { animation:panel-in .22s ease; } @keyframes panel-in { from { opacity:0; transform:translateY(6px); } }
.welcome-card { padding:38px; display:flex; align-items:center; justify-content:space-between; gap:30px; border-radius:24px; color:#fff; background:var(--orange); }
.welcome-card .eyebrow { color:var(--yellow); }.welcome-card h2 { margin:10px 0; font:700 clamp(2rem,4vw,3.5rem)/1 Georgia,serif; }.welcome-card p { max-width:650px; margin:0; opacity:.82; }.welcome-card .secondary-button { flex:0 0 auto; }
.stat-grid { margin-top:18px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }.stat-grid article { min-height:165px; padding:22px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:19px; background:#fff; }.stat-grid span,.stat-grid small { color:var(--muted); }.stat-grid b { margin:auto 0 2px; font:700 3.2rem/1 Georgia,serif; }.stat-grid .stat-date { font-size:1.35rem; line-height:1.1; }
.quick-grid { margin-top:18px; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.quick-grid button { min-height:160px; padding:22px; display:grid; align-content:end; gap:5px; border:1px solid var(--line); border-radius:19px; color:var(--ink); background:transparent; text-align:left; cursor:pointer; }.quick-grid button:hover { border-color:var(--ink); background:#fff; }.quick-grid button > span { margin-bottom:auto; font-size:1.8rem; }.quick-grid small { color:var(--muted); }
.panel-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:24px; }.panel-toolbar h2 { margin:0 0 7px; font:700 clamp(2rem,3.5vw,3.2rem)/1 Georgia,serif; }.panel-toolbar p { margin:0; color:var(--muted); }
.section-settings,.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.section-settings,.settings-card { margin-bottom:20px; padding:22px; border:1px solid var(--line); border-radius:19px; background:#fff; }.settings-card h3 { margin:0 0 20px; font:700 1.5rem Georgia,serif; }
label { display:grid; gap:7px; font-size:.8rem; font-weight:900; }.wide-field { grid-column:span 2; }
input,textarea,select { width:100%; min-height:46px; padding:11px 13px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:#fff; outline:0; } input:focus,textarea:focus,select:focus { border-color:var(--orange); box-shadow:0 0 0 3px rgba(255,91,53,.1); } textarea { resize:vertical; }
.editor-list,.packages-editor { display:grid; gap:13px; }
.editor-card { padding:20px; border:1px solid var(--line); border-radius:18px; background:#fff; }.editor-card-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px; }.editor-card-head strong { font:700 1.25rem Georgia,serif; }.editor-actions { display:flex; gap:6px; }.icon-button { width:36px; height:36px; display:grid; place-items:center; border:1px solid var(--line); border-radius:9px; background:#fff; cursor:pointer; }.icon-button:hover { border-color:var(--ink); }.icon-button.danger:hover { color:#c32b1b; border-color:#c32b1b; }
.event-fields { display:grid; grid-template-columns:80px 90px 110px 110px minmax(180px,1fr) 110px; gap:10px; }.event-fields label { min-width:0; }
.toggle-row { display:flex; align-items:center; gap:9px; font-size:.8rem; font-weight:800; }.toggle-row input { width:18px; min-height:18px; }
.packages-editor { grid-template-columns:repeat(2,minmax(0,1fr)); }.package-editor-card { padding:24px; border-top:5px solid var(--orange); }.package-editor-card:nth-child(3) { border-top-color:var(--yellow); }.package-editor-card:nth-child(4) { border-top-color:#76bf98; }.package-editor-card:nth-child(5) { grid-column:span 2; border-top-color:var(--ink); }.package-editor-grid { display:grid; grid-template-columns:1fr 160px; gap:12px; }.package-editor-card textarea { min-height:92px; }.package-editor-card .wide-field { margin-top:12px; }
.catalog-editor { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }.collection-card { min-width:0; border-top:4px solid var(--mint); }.collection-card .wide-field,.collection-card .toggle-row { margin-top:12px; }.collection-card textarea { min-height:80px; }
.upload-note { margin:-10px 0 22px; color:var(--muted); font-size:.82rem; }.gallery-editor { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }.gallery-card { min-width:0; padding:10px; border:1px solid var(--line); border-radius:16px; background:#fff; }.gallery-card img { width:100%; aspect-ratio:4/3; border-radius:10px; object-fit:cover; background:#eee; }.gallery-card-fields { padding:11px 3px 3px; display:grid; gap:10px; }.gallery-card .editor-actions { justify-content:space-between; }.gallery-card.is-hidden { opacity:.5; }
.sticky-actions { position:sticky; z-index:5; bottom:16px; margin-top:22px; padding:14px 16px; display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.94); box-shadow:0 15px 45px rgba(45,38,32,.12); backdrop-filter:blur(12px); }.sticky-actions span { color:var(--muted); font-size:.82rem; }
.toast { position:fixed; z-index:30; right:22px; bottom:22px; max-width:360px; padding:14px 18px; border-radius:12px; color:#fff; background:var(--ink); box-shadow:0 16px 50px rgba(0,0,0,.25); opacity:0; transform:translateY(14px); pointer-events:none; transition:.2s ease; }.toast.is-visible { opacity:1; transform:none; }.toast.is-error { background:#b82c1f; }
@media (max-width:1100px) { .stat-grid { grid-template-columns:repeat(2,1fr); }.gallery-editor { grid-template-columns:repeat(3,1fr); }.event-fields { grid-template-columns:repeat(3,1fr); }.event-fields label:nth-child(5) { grid-column:span 2; } }
@media (max-width:760px) { :root { --sidebar:72px; }.sidebar { padding:18px 10px; }.admin-brand { margin:0 auto 26px; }.admin-brand img { width:48px; }.admin-brand span,.nav-button:not(.is-active)::after { display:none; }.nav-button { justify-content:center; padding:0; font-size:0; }.nav-button span { font-size:1.2rem; }.sidebar-bottom a { font-size:0; justify-content:center; }.sidebar-bottom a::after { content:"↗"; font-size:1.2rem; }.sidebar-bottom button { justify-content:center; font-size:0; }.sidebar-bottom button::after { content:"⇥"; font-size:1.2rem; }.admin-main { padding:24px 16px 100px; }.admin-header { align-items:flex-start; }.save-state { max-width:120px; text-align:right; }.welcome-card { padding:26px; display:block; }.welcome-card .secondary-button { margin-top:22px; }.stat-grid,.quick-grid,.packages-editor,.catalog-editor,.gallery-editor { grid-template-columns:1fr; }.package-editor-grid { grid-template-columns:1fr; }.package-editor-card:nth-child(5) { grid-column:1; }.event-fields,.form-grid,.section-settings { grid-template-columns:1fr; }.event-fields label:nth-child(5),.wide-field { grid-column:1; }.panel-toolbar { align-items:flex-start; flex-direction:column; }.sticky-actions { align-items:stretch; flex-direction:column; }.sticky-actions .primary-button { width:100%; }.login-card { padding:30px 24px; } }