@import url('https://fonts.googleapis.com/css2?family=Zilla+Slab:wght@500;700&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --bg:#eae7e0;
  --paper:#f6f4ee;
  --ink:#23241f;
  --steel:#5b6067;
  --steel-light:#9a9d97;
  --rule:#c9c4b8;
  --stamp-orange:#c1601e;
  --stamp-teal:#3f6c5c;
  --stamp-red:#9c3b2e;
  --stamp-mustard:#a9822f;
  --stamp-slate:#4b5157;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
.mono{font-family:'IBM Plex Mono',monospace;}
.slab{font-family:'Zilla Slab',serif;}

#app{max-width:820px;margin:0 auto;padding:18px 16px 90px;}

.factory-header{
  display:flex;justify-content:space-between;align-items:flex-end;
  border-bottom:3px solid var(--ink);
  padding-bottom:10px;margin-bottom:14px;
}
.factory-title{
  font-family:'Zilla Slab',serif;font-weight:700;font-size:26px;
  letter-spacing:0.5px;margin:0;
}
.factory-sub{
  font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--steel);
  margin-top:2px;letter-spacing:0.3px;
}
.count-badge{
  font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--steel);
  text-align:right;
}
.count-badge b{color:var(--ink);font-size:18px;display:block;}

.filters{
  display:flex;gap:6px;overflow-x:auto;padding:2px 0 14px;
  scrollbar-width:none;
}
.filters::-webkit-scrollbar{display:none;}
.chip{
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  padding:6px 11px;border:1px solid var(--rule);border-radius:2px;
  background:var(--paper);color:var(--steel);white-space:nowrap;cursor:pointer;
  flex-shrink:0;letter-spacing:0.3px;
}
.chip.active{background:var(--ink);color:var(--paper);border-color:var(--ink);}

.card{
  background:var(--paper);
  border:1px solid var(--rule);
  border-left:4px solid var(--steel);
  border-radius:2px;
  padding:13px 14px 12px;
  margin-bottom:10px;
  cursor:pointer;
  position:relative;
}
.card[data-status="researching"]{border-left-color:var(--stamp-orange);}
.card[data-status="decision"]{border-left-color:var(--stamp-mustard);}
.card[data-status="active"]{border-left-color:var(--stamp-teal);}
.card[data-status="parked"]{border-left-color:var(--stamp-slate); opacity:0.72;}
.card[data-status="killed"]{border-left-color:var(--stamp-red); opacity:0.6;}

.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}
.card-title{font-family:'Zilla Slab',serif;font-weight:700;font-size:16.5px;margin:0;}
.card-oneliner{font-size:13px;color:var(--steel);margin:3px 0 8px;line-height:1.4;}
.stamp{
  font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:600;
  padding:3px 7px;border-radius:2px;letter-spacing:0.6px;white-space:nowrap;
  border:1px solid currentColor;
}
.stamp.captured{color:var(--steel);}
.stamp.researching{color:var(--stamp-orange);}
.stamp.decision{color:var(--stamp-mustard);}
.stamp.active{color:var(--stamp-teal);}
.stamp.parked{color:var(--stamp-slate);}
.stamp.killed{color:var(--stamp-red);}

.route-strip{display:flex;gap:3px;margin-top:8px;}
.route-seg{flex:1;height:4px;background:var(--rule);border-radius:1px;}
.route-seg.filled{background:var(--ink);}

.card-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px;}
.tag{
  font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--steel);
  background:var(--bg);padding:2px 7px;border-radius:2px;border:1px solid var(--rule);
}
.card-date{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--steel-light);margin-top:6px;}

.empty{
  text-align:center;padding:60px 20px;color:var(--steel);
}
.empty .slab{font-size:18px;color:var(--ink);margin-bottom:6px;}

.fab{
  position:fixed;bottom:22px;right:22px;
  background:var(--ink);color:var(--paper);
  border:none;border-radius:2px;
  font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:500;
  padding:13px 18px;cursor:pointer;letter-spacing:0.3px;
  box-shadow:0 3px 10px rgba(0,0,0,0.25);
}

.logout-link{
  position:fixed;top:14px;right:16px;
  font-size:10px;color:var(--steel);
  text-decoration:none;border:1px solid var(--rule);
  padding:5px 9px;border-radius:2px;background:var(--paper);
}

.overlay{
  position:fixed;inset:0;background:rgba(20,19,16,0.55);
  display:none;align-items:flex-end;justify-content:center;z-index:50;
}
.overlay.show{display:flex;}
.sheet{
  background:var(--paper);width:100%;max-width:820px;
  max-height:92vh;overflow-y:auto;border-radius:10px 10px 0 0;
  padding:20px 18px 40px;position:relative;
}
.sheet-close{
  position:sticky;top:0;float:right;
  background:var(--ink);color:var(--paper);border:none;
  width:28px;height:28px;border-radius:50%;font-size:14px;cursor:pointer;
  margin-bottom:8px;
}
.field-label{
  font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--steel);
  letter-spacing:0.5px;text-transform:uppercase;margin:14px 0 4px;
}
input[type=text], input[type=password], textarea, select{
  width:100%;border:1px solid var(--rule);border-radius:2px;
  background:#fff;padding:9px 10px;font-family:'Inter',sans-serif;
  font-size:14px;color:var(--ink);
}
textarea{resize:vertical;min-height:52px;}
.sheet-title-input{
  font-family:'Zilla Slab',serif;font-weight:700;font-size:20px;
  border:none;border-bottom:2px solid var(--ink);border-radius:0;
  padding:4px 0;background:transparent;
}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px;}

.stage-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px;}
.stage-btn{
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  padding:7px 11px;border:1px solid var(--rule);border-radius:2px;
  background:#fff;color:var(--steel);cursor:pointer;
}
.stage-btn.current{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.stage-btn.kill{border-color:var(--stamp-red);color:var(--stamp-red);}
.stage-btn.kill.current{background:var(--stamp-red);border-color:var(--stamp-red);color:#fff;}
.stage-btn.park{border-color:var(--stamp-slate);color:var(--stamp-slate);}
.stage-btn.park.current{background:var(--stamp-slate);border-color:var(--stamp-slate);color:#fff;}

.slider-row{margin-top:10px;}
.slider-row label{
  font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--steel);
  display:flex;justify-content:space-between;
}
input[type=range]{width:100%;accent-color:var(--ink);}
.score-total{
  font-family:'Zilla Slab',serif;font-weight:700;font-size:22px;
  margin-top:10px;border-top:1px solid var(--rule);padding-top:10px;
}

.log-entry{
  border-left:2px solid var(--rule);padding:6px 0 6px 10px;margin-top:8px;
}
.log-date{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--steel-light);}
.log-note{font-size:13px;margin-top:2px;line-height:1.45;}
.add-log-row{display:flex;gap:6px;margin-top:8px;}
.btn-small{
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  background:var(--ink);color:var(--paper);border:none;border-radius:2px;
  padding:0 12px;cursor:pointer;
}
.danger-zone{
  margin-top:26px;border-top:1px dashed var(--rule);padding-top:12px;
}
.delete-btn{
  font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--stamp-red);
  background:none;border:1px solid var(--stamp-red);border-radius:2px;
  padding:6px 11px;cursor:pointer;
}
.save-hint{
  font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--steel-light);
  position:fixed;bottom:8px;left:50%;transform:translateX(-50%);
  opacity:0;transition:opacity 0.3s;
}
.save-hint.show{opacity:1;}

/* login page */
.login-wrap{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:20px;
}
.login-card{
  background:var(--paper);border:1px solid var(--rule);border-radius:4px;
  padding:26px 22px;max-width:340px;width:100%;
  box-shadow:0 4px 16px rgba(0,0,0,0.12);
}
.login-error{
  color:var(--stamp-red);font-size:11px;margin-top:10px;
  border:1px solid var(--stamp-red);padding:7px 9px;border-radius:2px;
}