:root{
    --bg: #1c1b1f;
    --bg-raised: #242229;
    --card: #2a282e;
    --card-notch: #1c1b1f;
    --ink: #f2efe9;
    --ink-dim: #a8a3ab;
    --line: #3a3740;
    --red: #c8393b;
    --green: #8b9a6b;
    --blue: #4e6e8e;
    --purple: #8a6bab;
    --amber: #c99a3e;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0;background:var(--bg);color:var(--ink);font-family:'Space Grotesk', system-ui, sans-serif;line-height:1.5;}
  a{color:inherit;}

  header{
    display:flex;align-items:center;justify-content:space-between;
    padding:20px clamp(16px,4vw,48px);border-bottom:1px solid var(--line);
    position:sticky;top:0;background:rgba(28,27,31,0.92);backdrop-filter:blur(6px);z-index:20;
  }
  .logo{font-family:'Press Start 2P', monospace;font-size:12px;}
  .logo span{color:var(--red);}
  .header-actions{display:flex;gap:8px;align-items:center;}
  .wa-btn, .admin-toggle{
    display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:2px;
    text-decoration:none;font-weight:600;font-size:13px;white-space:nowrap;border:1px solid transparent;
    cursor:pointer;font-family:inherit;transition:transform .15s ease;
  }
  .wa-btn{background:var(--green);color:#1c1b1f;}
  .admin-toggle{background:transparent;border-color:var(--line);color:var(--ink-dim);}
  .admin-toggle.logged-in{border-color:var(--amber);color:var(--amber);}
  .wa-btn:hover, .admin-toggle:hover{transform:translateY(-1px);}

  /* ---- Admin login panel ---- */
  .admin-panel{
    max-width:1100px;margin:0 auto;padding:0 clamp(16px,4vw,48px);
    display:none;
  }
  .admin-panel.open{display:block;}
  .login-box{
    background:var(--bg-raised);border:1px solid var(--amber);border-radius:2px;
    padding:16px;margin-top:16px;display:flex;gap:10px;flex-wrap:wrap;align-items:center;
  }
  .login-box input{
    background:var(--bg);border:1px solid var(--line);color:var(--ink);
    padding:10px 12px;border-radius:2px;font-family:inherit;font-size:13px;flex:1 1 160px;
  }
  .login-box .error{color:var(--red);font-size:12px;font-family:'JetBrains Mono',monospace;width:100%;}

  /* ---- Hero ---- */
  .hero{padding:clamp(40px,8vw,80px) clamp(16px,4vw,48px) 32px;max-width:1100px;margin:0 auto;}
  .eyebrow{font-family:'JetBrains Mono', monospace;font-size:12px;color:var(--amber);text-transform:uppercase;letter-spacing:2px;margin-bottom:18px;}
  h1{font-family:'Press Start 2P', monospace;font-size:clamp(22px, 5vw, 40px);line-height:1.5;margin:0 0 20px;}
  h1 .accent{color:var(--red);}
  .hero p{max-width:560px;color:var(--ink-dim);font-size:16px;margin:0 0 28px;}

  .ticker-wrap{border:1px solid var(--line);background:var(--bg-raised);border-radius:2px;overflow:hidden;margin-bottom:8px;}
  .ticker-head{display:flex;justify-content:space-between;align-items:center;padding:8px 14px;border-bottom:1px solid var(--line);font-family:'JetBrains Mono', monospace;font-size:11px;color:var(--ink-dim);}
  .dot{width:7px;height:7px;border-radius:50%;background:var(--green);display:inline-block;margin-right:6px;animation:blink 1.6s infinite;}
  @keyframes blink{50%{opacity:.25;}}
  .ticker{white-space:nowrap;overflow:hidden;padding:12px 0;}
  .ticker-track{display:inline-block;padding-left:100%;animation:scroll 22s linear infinite;font-family:'JetBrains Mono', monospace;font-size:13px;color:var(--ink);}
  .ticker-track b{color:var(--amber);}
  @keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-100%);}}
  @media (prefers-reduced-motion: reduce){.ticker-track{animation:none; padding-left:0;}}

  /* ---- Toolbar ---- */
  .toolbar{max-width:1100px;margin:0 auto;padding:0 clamp(16px,4vw,48px) 16px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
  #search{flex:1 1 220px;background:var(--bg-raised);border:1px solid var(--line);color:var(--ink);padding:12px 14px;border-radius:2px;font-family:'Space Grotesk', sans-serif;font-size:14px;}
  #search:focus{outline:2px solid var(--amber); outline-offset:1px;}
  .chip{background:transparent;border:1px solid var(--line);color:var(--ink-dim);padding:10px 14px;border-radius:2px;font-family:'JetBrains Mono', monospace;font-size:12px;cursor:pointer;transition:all .15s ease;}
  .chip:hover{border-color:var(--ink-dim); color:var(--ink);}
  .chip.active{background:var(--ink); color:var(--bg); border-color:var(--ink);}
  .chip:focus-visible{outline:2px solid var(--amber); outline-offset:2px;}
  .add-btn{margin-left:auto;background:var(--amber);color:#1c1b1f;border:none;padding:10px 16px;border-radius:2px;font-weight:700;font-size:13px;cursor:pointer;font-family:inherit;}

  /* ---- Add/edit form panel ---- */
  .form-panel{max-width:1100px;margin:0 auto;padding:0 clamp(16px,4vw,48px) 16px;display:none;}
  .form-panel.open{display:block;}
  .form-grid{
    background:var(--bg-raised);border:1px solid var(--line);border-radius:2px;padding:18px;
    display:grid;grid-template-columns:repeat(auto-fit, minmax(160px,1fr));gap:10px;
  }
  .form-grid input, .form-grid select, .form-grid textarea{
    background:var(--bg);border:1px solid var(--line);color:var(--ink);padding:10px 12px;
    border-radius:2px;font-family:inherit;font-size:13px;width:100%;
  }
  .form-grid textarea{grid-column:1/-1;min-height:70px;resize:vertical;}
  .form-actions{grid-column:1/-1;display:flex;gap:10px;}
  .form-actions button{padding:10px 16px;border-radius:2px;font-weight:600;font-size:13px;cursor:pointer;font-family:inherit;border:1px solid var(--line);}
  .form-actions .save{background:var(--green);color:#1c1b1f;border:none;}
  .form-actions .cancel{background:transparent;color:var(--ink-dim);}

  /* ---- Grid & cards ---- */
  main{max-width:1100px;margin:0 auto;padding:0 clamp(16px,4vw,48px) 60px;}
  .grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));gap:18px;align-items:start;}
  .card{background:var(--card);border:1px solid var(--line);border-radius:2px;position:relative;overflow:hidden;display:flex;flex-direction:column;cursor:pointer;}
  .card::after{content:"";position:absolute;top:0;right:0;width:22px;height:22px;background:var(--card-notch);clip-path:polygon(100% 0, 0 0, 100% 100%);}
  .card-strip{height:6px;}
  .card-body{padding:16px;flex:1;display:flex;flex-direction:column;gap:8px;}
  .tag{font-family:'JetBrains Mono', monospace;font-size:10px;letter-spacing:1px;text-transform:uppercase;padding:3px 8px;border-radius:2px;width:fit-content;color:#1c1b1f;font-weight:600;}
  .card h3{margin:4px 0 0;font-size:16px;font-weight:700;}
  .meta{font-family:'JetBrains Mono', monospace;font-size:11px;color:var(--ink-dim);display:flex;justify-content:space-between;}
  .card-actions{margin-top:auto;display:flex;gap:8px;padding-top:8px;}
  .btn{flex:1;text-align:center;padding:9px 10px;border-radius:2px;font-size:12px;font-weight:600;text-decoration:none;border:1px solid var(--line);color:var(--ink);cursor:pointer;font-family:inherit;background:transparent;}
  .btn.primary{background:var(--ink); color:var(--bg); border-color:var(--ink);}
  .btn.danger{color:var(--red);border-color:var(--red);}
  .btn:hover{opacity:0.85;}

  /* expand-in-card detail */
  .detail{
    max-height:0;overflow:hidden;transition:max-height .25s ease;
    border-top:1px dashed var(--line);
  }
  .detail.open{max-height:600px;}
  .detail-inner{padding:14px 16px;font-size:13px;color:var(--ink-dim);}
  .shots{display:flex;gap:6px;overflow-x:auto;margin-top:10px;padding-bottom:4px;}
  .shots img{height:70px;border-radius:2px;border:1px solid var(--line);}

  .empty{grid-column:1/-1;text-align:center;padding:60px 20px;color:var(--ink-dim);font-family:'JetBrains Mono', monospace;font-size:13px;}

  footer{border-top:1px solid var(--line);padding:32px clamp(16px,4vw,48px) 40px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;color:var(--ink-dim);font-size:13px;}
  footer a{text-decoration:underline; text-underline-offset:3px;}
  .foot-links{display:flex; gap:18px; flex-wrap:wrap;}