/* Seed — design system v2 (light) */

*{margin:0;padding:0;box-sizing:border-box}

:root{
  --bg:#f7f5f2;
  --surface:#ffffff;
  --surface-hover:#fafaf8;
  --border:rgba(0,0,0,.1);
  --border-strong:rgba(0,0,0,.16);
  --text:#1a1a2e;
  --text-dim:#555550;
  --text-faint:#88857e;
  --accent:#2d6a4f;
  --accent-hover:#1a5a3f;
  --accent-light:rgba(45,106,79,.08);
  --accent-border:rgba(45,106,79,.2);
  --warm:#5c3d10;
  --text-warm:#3a3530;
  --danger:#b44;
  --serif:Georgia,'Times New Roman',serif;
  --mono:'SF Mono','Fira Code','Cascadia Code',Consolas,monospace;
}

html{scroll-behavior:smooth}
body{font-family:var(--serif);background:var(--bg);color:var(--text);min-height:100vh;line-height:1.7}
::selection{background:rgba(45,106,79,.15);color:var(--text)}

a{color:var(--accent);text-decoration:none;transition:color .15s}
a:hover{color:var(--accent-hover)}

/* Layout */
.page{max-width:680px;margin:0 auto;padding:64px 28px 80px}

/* Back link */
.back{
  font-family:var(--mono);font-size:12px;
  color:var(--text-faint);margin-bottom:40px;display:block;
  transition:color .15s;
}
.back:hover{color:var(--accent)}

/* Page header */
.header{margin-bottom:36px}
.header h1{font-size:26px;font-weight:400;color:var(--text);margin-bottom:6px}
.header .subtitle{font-size:14px;color:var(--text-dim)}

/* Buttons */
.btn{
  font-family:var(--mono);font-size:13px;
  padding:10px 24px;border-radius:8px;
  cursor:pointer;transition:all .15s;
  display:inline-block;
}
.btn-primary{background:var(--accent);color:#fff;border:1px solid var(--accent)}
.btn-primary:hover{background:var(--accent-hover);color:#fff;text-decoration:none;transform:translateY(-1px)}
.btn-secondary{background:transparent;color:var(--text);border:1px solid var(--border)}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent);text-decoration:none;transform:translateY(-1px)}

/* Persistent clone action */
.clone-dock{
  position:fixed;left:50%;bottom:16px;z-index:50;
  transform:translateX(-50%);
  display:flex;align-items:center;gap:10px;
  width:min(620px,calc(100vw - 28px));
  padding:10px 12px;
  background:rgba(255,255,255,.96);
  border:1px solid var(--border-strong);border-radius:8px;
  box-shadow:0 8px 30px rgba(0,0,0,.10);
}
.clone-dock-text{
  flex:1;min-width:0;
  font-family:var(--mono);font-size:11px;line-height:1.45;
  color:var(--text-dim);
}
.clone-dock-text strong{display:block;color:var(--text);font-weight:600}
.clone-dock-actions{display:flex;gap:8px;align-items:center;flex-shrink:0}
.clone-dock .btn{font-size:11px;padding:7px 12px;border-radius:6px;white-space:nowrap}

/* Cards */
.card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:8px;padding:20px;
  transition:border-color .15s;
}
.card:hover{border-color:var(--border-strong)}

/* Section label */
.section-label{
  font-family:var(--mono);font-size:10px;
  color:var(--text-faint);letter-spacing:2px;
  text-transform:uppercase;margin-bottom:14px;
}

/* Footer */
.footer{
  text-align:center;padding-top:24px;margin-top:56px;
  border-top:1px solid var(--border);
  font-family:var(--mono);font-size:11px;color:var(--text-faint);
}
.footer p{margin-bottom:6px}
.footer a{color:var(--text-dim)}
.footer a:hover{color:var(--accent)}

/* Scrollbars */
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1);border-radius:2px}

/* Mobile */
@media(max-width:480px){
  .page{padding:48px 20px 96px}
  .header h1{font-size:22px}
  .clone-dock{bottom:10px;align-items:stretch;gap:8px}
  .clone-dock-text{font-size:10px}
  .clone-dock-actions{flex-direction:column;align-items:stretch}
  .clone-dock .btn{padding:6px 10px;text-align:center}
}