:root { --paper:#fffaf2; --cream:#f4efe5; --cedar:#9f5422; --ember:#d96118; --ember-dark:#a94712; --ink:#102c38; --muted:#60717a; --moss:#536b45; --line:#ded1c0; --white:#fff; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height:1.5; }
button, input, select, textarea { font:inherit; }
a { color:inherit; text-decoration:none; }
.wrap { width:min(1180px, calc(100% - 32px)); margin:0 auto; }
.topbar { position:sticky; top:0; z-index:10; background:rgba(255,250,242,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(16px); }
.nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:10px; font-weight:900; text-transform:uppercase; letter-spacing:.05em; }
.logo { width:58px; height:58px; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.logo img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 8px 14px rgba(16,44,56,.12)); }
.brand-main { display:block; font-family:Impact, "Arial Black", sans-serif; font-size:24px; line-height:.95; letter-spacing:.03em; }
.brand-sub { display:block; color:var(--cedar); font-size:10px; letter-spacing:.32em; }
.links { display:flex; align-items:center; gap:22px; color:#29414b; font-size:13px; font-weight:850; text-transform:uppercase; letter-spacing:.04em; }
.auth-locked .links { display:none; }
.menu-toggle { display:none; width:48px; height:48px; align-items:center; justify-content:center; border:1px solid var(--line); background:#fffdf8; color:var(--ink); cursor:pointer; }
.menu-toggle svg { width:22px; height:22px; }
.mobile-links { display:none; padding:0 0 14px; border-top:1px solid rgba(222,209,192,.7); }
.mobile-links.open { display:grid; }
.mobile-links a { min-height:44px; display:flex; align-items:center; border-bottom:1px solid rgba(222,209,192,.7); color:#29414b; font-size:13px; font-weight:900; text-transform:uppercase; letter-spacing:.06em; }
.auth-locked .menu-toggle, .auth-locked .mobile-links { display:none !important; }
.hero { padding:56px 0 28px; background:var(--ink); color:var(--white); }
.hero[hidden] { display:none !important; }
.tag { display:inline-flex; align-items:center; min-height:30px; padding:0 10px; border:1px solid rgba(222,209,192,.35); color:#ffc49d; background:rgba(255,250,242,.08); font-size:12px; font-weight:950; letter-spacing:.13em; text-transform:uppercase; }
h1, h2, h3 { font-family:Impact, "Arial Black", sans-serif; text-transform:uppercase; letter-spacing:.035em; }
h1 { margin:16px 0 10px; font-size:clamp(44px, 7vw, 78px); line-height:.94; }
.hero p { margin:0; max-width:720px; color:rgba(255,255,255,.78); font-size:18px; }
main section { padding:34px 0 64px; }
.login-section { min-height:calc(100vh - 76px); display:grid; align-items:center; }
.login-panel { width:min(420px, 100%); margin:0 auto; padding:24px; border:1px solid var(--line); background:var(--paper); box-shadow:0 18px 44px rgba(28,43,49,.09); text-align:center; }
.login-panel h2 { margin:14px 0 8px; font-size:38px; line-height:.95; }
.login-panel p { margin:0 0 18px; color:var(--muted); }
.admin-section[hidden], .login-section[hidden] { display:none !important; }
.stats { display:grid; grid-template-columns:repeat(4, 1fr); gap:10px; margin-bottom:14px; }
.stat { min-height:92px; padding:16px; background:var(--paper); border:1px solid var(--line); box-shadow:0 14px 34px rgba(28,43,49,.07); }
.stat span { display:block; color:var(--muted); font-size:12px; font-weight:950; letter-spacing:.12em; text-transform:uppercase; }
.stat strong { display:block; margin-top:8px; font-size:32px; line-height:1; }
.planner { overflow:hidden; background:var(--paper); border:1px solid var(--line); box-shadow:0 14px 34px rgba(28,43,49,.07); }
.tabs { display:flex; gap:8px; padding:8px; border-bottom:1px solid var(--line); background:rgba(244,239,229,.68); }
.tab { min-height:42px; padding:0 16px; border:1px solid transparent; background:transparent; color:#2f4550; font-weight:900; cursor:pointer; }
.tab.active { background:var(--white); border-color:var(--line); color:var(--ink); box-shadow:0 8px 20px rgba(28,43,49,.06); }
.toolbar { display:grid; grid-template-columns:minmax(260px,1fr) auto; gap:12px; padding:12px; align-items:end; border-bottom:1px solid var(--line); background:rgba(255,253,248,.72); }
.toolbar-title h2 { margin:0; font-family:Inter, ui-sans-serif, system-ui, sans-serif; font-size:24px; line-height:1.1; letter-spacing:0; text-transform:none; }
.toolbar-title p { margin:4px 0 0; color:var(--muted); }
.toolbar-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.booking-tools { display:grid; grid-template-columns:minmax(260px, .7fr) minmax(340px, 1fr); gap:12px; padding:12px; border-bottom:1px solid var(--line); background:#fffdf8; }
.booking-tools[hidden] { display:none !important; }
.filter-panel { display:grid; gap:12px; align-content:start; padding:12px; border:1px solid var(--line); background:var(--paper); }
.control-label { color:var(--muted); font-size:12px; font-weight:950; letter-spacing:.1em; text-transform:uppercase; }
.segmented { display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; }
.segmented button { min-height:40px; padding:0 10px; border:1px solid var(--line); background:#fffdf8; color:var(--ink); font-size:12px; font-weight:900; cursor:pointer; }
.segmented button.active { border-color:var(--ember); background:var(--ember); color:var(--white); box-shadow:0 10px 20px rgba(217,97,24,.18); }
.compact-field { display:grid; gap:7px; color:var(--muted); font-size:12px; font-weight:950; letter-spacing:.1em; text-transform:uppercase; }
.compact-field input, .compact-field select { min-height:42px; border:1px solid var(--line); background:#fffdf8; color:var(--ink); padding:8px 10px; font-weight:800; text-transform:none; letter-spacing:0; }
.date-block-form { display:grid; gap:10px; margin-top:2px; padding-top:12px; border-top:1px solid var(--line); }
.admin-calendar { padding:12px; border:1px solid var(--line); background:var(--paper); }
.admin-calendar-top { display:grid; grid-template-columns:40px 1fr 40px; align-items:center; gap:8px; margin-bottom:10px; }
.admin-calendar-top strong { text-align:center; font-size:15px; font-weight:950; }
.admin-calendar-top button { width:40px; height:38px; border:1px solid var(--line); background:#fffdf8; color:var(--ink); font-size:20px; font-weight:900; cursor:pointer; }
.admin-calendar-grid { display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:5px; }
.admin-weekday { color:var(--muted); font-size:10px; font-weight:950; letter-spacing:.06em; text-align:center; text-transform:uppercase; }
.admin-calendar-day { position:relative; min-height:38px; border:1px solid var(--line); background:#fffdf8; color:var(--ink); font-size:12px; font-weight:900; cursor:pointer; }
.admin-calendar-day.outside { color:#9ba8ad; background:#f8f1e8; }
.admin-calendar-day.today { border-color:#6b8a98; }
.admin-calendar-day.booked { background:#edf6ef; border-color:#bfdcc8; color:#174d32; }
.admin-calendar-day.selected { background:var(--ember); border-color:var(--ember); color:var(--white); box-shadow:0 8px 18px rgba(217,97,24,.2); }
.admin-calendar-day span { position:absolute; right:3px; top:3px; display:grid; place-items:center; min-width:16px; height:16px; padding:0 3px; border-radius:999px; background:var(--ink); color:var(--white); font-size:10px; line-height:1; }
.calendar-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; color:var(--muted); font-size:12px; font-weight:850; }
.calendar-actions .open-button { min-height:38px; min-width:94px; }
.record-groups { display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; padding:12px; border-bottom:1px solid var(--line); background:#fffdf8; }
.record-group { display:grid; gap:3px; min-height:92px; padding:12px; border:1px solid var(--line); background:var(--paper); }
.record-group span { color:var(--muted); font-size:11px; font-weight:950; letter-spacing:.1em; text-transform:uppercase; }
.record-group strong { color:var(--ink); font-size:28px; line-height:1; }
.record-group small { color:var(--muted); font-size:12px; line-height:1.35; }
.field { display:grid; gap:7px; }
.field label { color:#314751; font-size:13px; font-weight:900; letter-spacing:.05em; text-transform:uppercase; }
.field input, .field textarea, .field select { min-height:46px; border:1px solid var(--line); background:#fffdf8; color:var(--ink); padding:10px 12px; }
.button { min-height:46px; padding:0 18px; border:0; background:var(--ember); color:var(--white); font-weight:900; text-transform:uppercase; letter-spacing:.04em; cursor:pointer; box-shadow:0 12px 24px rgba(217,97,24,.24); }
.button:hover { background:var(--ember-dark); }
.button.ghost { background:transparent; color:var(--ink); border:1px solid var(--line); box-shadow:none; }
.status { display:inline-flex; align-items:center; min-height:28px; padding:0 9px; border-radius:999px; background:#edf3ea; color:#2f5630; border:1px solid #cadcc1; font-size:12px; font-weight:950; text-transform:uppercase; letter-spacing:.06em; }
.status.pending_payment { background:#fff4eb; color:#90410f; border-color:#edc4a5; }
.status.paid, .status.confirmed { background:#eaf6ef; color:#116b47; border-color:#bfe4cf; }
.status.blocked { background:#eaf2f5; color:#164b60; border-color:#b9d4dc; }
.status.cancelled { background:#f8e8e2; color:#8f2417; border-color:#edbeb5; }
.booking-table { width:100%; border-collapse:collapse; background:#fffdf8; }
.booking-table th { padding:12px 14px; border-bottom:1px solid var(--line); color:#273d47; font-size:12px; font-weight:950; letter-spacing:.1em; text-align:left; text-transform:uppercase; }
.booking-table td { padding:18px 14px; border-bottom:1px solid var(--line); vertical-align:middle; }
.booking-table tr:last-child td { border-bottom:0; }
.booking-table tr[data-booking].is-cancelled { background:#fbf1ec; color:#7a6c64; }
.booking-table tr[data-booking].is-cancelled td:not(.row-actions), .booking-table tr[data-booking].is-cancelled .booking-main strong, .booking-table tr[data-booking].is-cancelled .booking-main span, .booking-table tr[data-booking].is-cancelled .subtle { text-decoration:line-through; text-decoration-thickness:2px; text-decoration-color:rgba(143,36,23,.58); }
.booking-table tr[data-booking].is-released-block { background:#eef5f7; }
.booking-table tr[data-booking].is-released-block td:not(.row-actions), .booking-table tr[data-booking].is-released-block .booking-main strong, .booking-table tr[data-booking].is-released-block .booking-main span, .booking-table tr[data-booking].is-released-block .subtle { text-decoration:line-through; text-decoration-thickness:2px; text-decoration-color:rgba(22,75,96,.6); }
.details-row.is-cancelled .details-panel, .details-row.is-released-block .details-panel { opacity:.82; }
.booking-main strong { display:block; color:#061923; font-size:16px; }
.booking-main span, .subtle { display:block; color:var(--muted); font-size:13px; }
.bar { width:72px; height:8px; border-radius:999px; background:#e5ddcf; overflow:hidden; }
.bar span { display:block; height:100%; width:0%; border-radius:999px; background:linear-gradient(90deg, #2b2119, var(--cedar)); }
.row-actions { display:flex; gap:8px; align-items:center; justify-content:flex-end; }
.open-button { min-height:44px; min-width:96px; padding:0 18px; border:1px solid var(--line); border-radius:999px; background:var(--white); color:var(--ink); font-weight:900; cursor:pointer; }
.details-row { display:none; background:#fffaf2; }
.details-row.open { display:table-row; }
.list-panel { display:none; }
.list-panel.active { display:block; }
.details-panel { display:grid; grid-template-columns:1fr minmax(260px, .8fr); gap:14px; padding:16px; }
.detail-box { padding:14px; border:1px solid var(--line); background:#fffdf8; }
.detail-box h3 { margin:0 0 8px; font-family:Inter, ui-sans-serif, system-ui, sans-serif; font-size:13px; letter-spacing:.08em; text-transform:uppercase; }
.detail-box p { margin:0 0 8px; color:#314751; }
.detail-box p:last-child { margin-bottom:0; }
.admin-actions { display:grid; grid-template-columns:170px 1fr auto; gap:10px; align-items:start; }
.cancel-actions { display:grid; gap:10px; margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.action-block { display:grid; gap:10px; margin-top:14px; padding:14px; border:1px solid var(--line); background:#fffaf2; }
.action-block h3 { margin:0; font-family:Inter, ui-sans-serif, system-ui, sans-serif; font-size:13px; letter-spacing:.08em; text-transform:uppercase; }
.cancel-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.button-row { display:flex; flex-wrap:wrap; gap:10px; }
.button.danger { background:#8f2417; box-shadow:0 12px 24px rgba(143,36,23,.18); }
.button.danger:hover { background:#6f1c12; }
.detail-modal { position:fixed; inset:0; z-index:55; display:none; padding:24px; background:rgba(16,44,56,.62); overflow:auto; backdrop-filter:blur(8px); }
.detail-modal.open { display:block; }
.detail-card { width:min(1040px, 100%); margin:0 auto; border:1px solid var(--line); background:var(--paper); box-shadow:0 24px 70px rgba(16,44,56,.28); }
.detail-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:18px; border-bottom:1px solid var(--line); background:#fffdf8; }
.detail-head h2 { margin:12px 0 4px; font-size:34px; line-height:1; }
.detail-modal-body { padding:18px; }
.detail-modal-grid { display:grid; grid-template-columns:minmax(0, 1fr) minmax(280px, .85fr); gap:14px; }
.detail-admin-box { grid-column:1 / -1; }
.history-list { display:grid; gap:10px; margin:0; padding:0; list-style:none; }
.history-list li { display:grid; gap:3px; padding:10px 0 10px 16px; border-left:3px solid var(--cedar); }
.history-list strong { color:var(--ink); font-size:13px; font-weight:950; letter-spacing:.08em; text-transform:uppercase; }
.history-list span { color:var(--muted); font-size:13px; }
.confirm-modal { position:fixed; inset:0; z-index:60; display:none; place-items:center; padding:22px; background:rgba(16,44,56,.62); backdrop-filter:blur(8px); }
.confirm-modal.open { display:grid; }
.confirm-card { width:min(480px, 100%); padding:22px; border:1px solid var(--line); background:var(--paper); box-shadow:0 24px 70px rgba(16,44,56,.3); }
.confirm-card h2 { margin:14px 0 10px; font-size:34px; line-height:1; }
.confirm-card p { margin:0; color:#334b55; font-size:16px; }
.confirm-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:20px; }
.quote-modal { position:fixed; inset:0; z-index:50; display:none; padding:24px; background:rgba(16,44,56,.62); overflow:auto; }
.quote-modal.open { display:block; }
.quote-card { width:min(980px, 100%); margin:0 auto; background:var(--paper); border:1px solid var(--line); box-shadow:0 24px 70px rgba(16,44,56,.28); }
.settings-card { width:min(760px, 100%); }
.quote-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:18px; border-bottom:1px solid var(--line); }
.quote-head h2 { margin:0; font-size:32px; line-height:1; }
.quote-tools { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.icon-tool { width:46px; height:46px; border:1px solid var(--line); background:#fffdf8; color:var(--ink); font-size:20px; font-weight:900; cursor:pointer; }
.quote-body { display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(280px, .9fr); gap:14px; padding:18px; }
.settings-body { grid-template-columns:1fr; }
.quote-section { padding:14px; border:1px solid var(--line); background:#fffdf8; }
.quote-section h3 { margin:0 0 10px; font-family:Inter, ui-sans-serif, system-ui, sans-serif; font-size:13px; letter-spacing:.08em; text-transform:uppercase; }
.quote-lines { display:grid; gap:10px; }
.quote-line { display:grid; grid-template-columns:minmax(0, 1.2fr) 82px 120px 112px; gap:8px; align-items:end; }
.quote-line output { min-height:46px; display:flex; align-items:center; justify-content:flex-end; padding:10px 12px; border:1px solid var(--line); background:#f8f1e8; font-weight:900; }
.quote-total { display:grid; gap:8px; margin-top:12px; padding-top:12px; border-top:1px solid var(--line); }
.quote-total div { display:flex; justify-content:space-between; gap:12px; font-weight:900; }
.settings-panel { display:none; }
.settings-panel.open { display:block; }
.settings-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:10px; }
.quote-actions { display:flex; flex-wrap:wrap; gap:10px; padding:0 18px 18px; }
.notice { margin:0 0 14px; color:var(--muted); font-weight:760; }
.empty-state, .loading-state { display:grid; gap:4px; margin:0; padding:22px; color:var(--muted); font-weight:800; background:#fffdf8; }
.empty-state strong, .loading-state strong { color:var(--ink); font-size:16px; }
.empty-state span, .loading-state span { color:var(--muted); font-size:13px; }
.loading-state { grid-template-columns:32px 1fr; align-items:center; }
.loader { width:22px; height:22px; border:3px solid #e5ddcf; border-top-color:var(--ember); border-radius:999px; animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
@media(max-width:960px){
  .links{display:none;}
  body:not(.auth-locked) .menu-toggle{display:inline-flex;}
  .stats{grid-template-columns:repeat(2,1fr);}
  .record-groups{grid-template-columns:repeat(2,1fr);}
  .toolbar,.booking-tools,.admin-actions,.details-panel,.detail-modal-grid,.cancel-grid,.quote-body,.quote-line,.settings-grid{grid-template-columns:1fr;}
  .planner{overflow:visible;}
  .tabs{display:grid; grid-template-columns:1fr 1fr;}
  .booking-table, .booking-table thead, .booking-table tbody, .booking-table tr, .booking-table td { display:block; width:100%; }
  .booking-table thead { display:none; }
  .booking-table { border-collapse:separate; border-spacing:0; background:transparent; }
  .booking-table tbody { display:grid; gap:12px; padding:12px; background:#fffdf8; }
  .booking-table tr[data-booking] { display:grid; gap:10px; padding:16px; border:1px solid var(--line); background:var(--white); }
  .booking-table tr[data-booking] td { display:flex; justify-content:space-between; gap:16px; padding:0; border:0; }
  .booking-table tr[data-booking] td::before { content:attr(data-label); color:var(--muted); font-size:12px; font-weight:950; letter-spacing:.08em; text-transform:uppercase; }
  .booking-table tr[data-booking] td.booking-main { display:grid; gap:2px; }
  .booking-table tr[data-booking] td.booking-main::before { margin-bottom:2px; }
  .booking-table tr[data-booking] .row-actions { justify-content:stretch; }
  .booking-table tr[data-booking] .open-button { width:100%; }
  .details-row { display:none !important; }
  .details-row.open { display:block !important; }
  .details-row td { display:block; padding:0 12px 12px; border:0; }
  .details-panel { padding:16px; border:1px solid var(--line); border-top:0; background:#fffaf2; }
  .detail-admin-box { grid-column:auto; }
}
@media(max-width:560px){ .wrap{width:min(100% - 24px, 1180px);} .stats,.record-groups{grid-template-columns:1fr;} .button{width:100%;} .segmented{grid-template-columns:1fr;} .admin-calendar-day{min-height:34px;} .confirm-actions{grid-template-columns:1fr;} .detail-modal,.quote-modal{padding:12px;} .detail-head,.quote-head{display:grid;} .button-row{display:grid;} }