:root{
  --bg:#f6f3ef;
  --surface:#ffffff;
  --surface-alt:#fbf7f2;
  --ink:#1f2430;
  --ink-soft:#4b5263;
  --line:#e6dfd4;
  --accent:#ff7a59;
  --accent-dark:#e55a37;
  --accent-ink:#7a1f0a;
  --good:#2e8b57;
  --warn:#b4692c;
  --radius:12px;
  --shadow:0 1px 0 rgba(31,36,48,0.04), 0 8px 24px -18px rgba(31,36,48,0.3);
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--accent-dark);text-decoration:none}
a:hover{text-decoration:underline}
img,svg{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:1rem}

.site-header{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:18px 28px;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:20;
}
.brand{display:flex;align-items:center;gap:12px}
.brand-link{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
.brand-mark{display:inline-flex;align-items:center;justify-content:center}
.brand-title{font-weight:700;font-size:1.05rem}
.brand-sub{font-size:.85rem;color:var(--ink-soft)}
.site-nav{display:flex;gap:18px;flex-wrap:wrap}
.site-nav a{color:var(--ink-soft);font-weight:500}
.site-nav a:hover{color:var(--accent-dark)}

main{max-width:1180px;margin:0 auto;padding:32px 24px 64px}

.planner{
  display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;
  align-items:start;
}
@media (max-width: 960px){
  .planner{grid-template-columns:1fr}
}
.planner-main{display:flex;flex-direction:column;gap:28px}
.planner-side{display:flex;flex-direction:column;gap:18px;position:sticky;top:96px}

.planner-head h1{font-size:2rem;margin:0 0 6px;letter-spacing:-.01em}
.planner-lede{color:var(--ink-soft);margin:0;max-width:64ch}

.presets{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.presets-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:8px}
.presets h2{font-size:1.05rem;margin:0}
.presets-hint{font-size:.85rem;color:var(--ink-soft)}
.preset-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.preset{
  text-align:left;
  background:var(--surface-alt);
  border:1px solid var(--line);
  border-radius:10px;
  padding:12px 14px;
  color:var(--ink);
  display:flex;flex-direction:column;gap:4px;
  transition:border-color .15s, transform .15s, background .15s;
}
.preset strong{font-size:.95rem}
.preset span{font-size:.82rem;color:var(--ink-soft)}
.preset:hover{border-color:var(--accent);transform:translateY(-1px)}
.preset.active{background:#fff4ef;border-color:var(--accent)}

.plan-form,.preview,.recent,.examples,.tips,.side-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.plan-form{display:grid;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-weight:600;font-size:.92rem}
.req{color:var(--accent-dark)}
.field-hint{font-size:.82rem;color:var(--ink-soft)}
.field-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width: 720px){.field-row{grid-template-columns:1fr}}
input[type="text"],textarea,select{
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  color:var(--ink);
  transition:border-color .15s, box-shadow .15s;
}
input[type="text"]:focus,textarea:focus,select:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(255,122,89,.18);
}
textarea{resize:vertical}

.variations{display:flex;flex-direction:column;gap:8px}
.variation-row{display:flex;gap:8px;align-items:stretch}
.var-input{flex:1}
.remove-var{
  width:36px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink-soft);
  font-size:1.2rem;line-height:1;
}
.remove-var:hover{border-color:var(--accent-dark);color:var(--accent-dark)}
.add-var{
  align-self:flex-start;
  background:transparent;border:1px dashed var(--line);border-radius:8px;
  padding:8px 12px;color:var(--ink-soft);font-size:.9rem;
}
.add-var:hover{border-color:var(--accent);color:var(--accent-dark)}

.actions{display:flex;flex-wrap:wrap;gap:8px}
.btn,.btn-primary,.btn-ghost{
  padding:10px 14px;border-radius:8px;border:1px solid var(--line);
  background:#fff;color:var(--ink);font-weight:500;font-size:.92rem;
  transition:background .15s,border-color .15s,transform .1s;
}
.btn:hover{border-color:var(--accent-dark);color:var(--accent-dark)}
.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-primary:hover{background:var(--accent-dark);border-color:var(--accent-dark)}
.btn-ghost{background:transparent}
.btn-small{padding:6px 10px;font-size:.85rem}

.preview-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.preview-head h2{margin:0;font-size:1.15rem}
.preview-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--ink-soft);font-size:.85rem}
.preview-core{background:var(--surface-alt);border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin-bottom:14px}
.preview-core h3{margin:0 0 4px;font-size:.85rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em}
.preview-core p{margin:0}
.preview-cta{margin-top:6px;color:var(--accent-dark);font-weight:600}
.preview-table-wrap{overflow-x:auto}
.preview-table{width:100%;border-collapse:collapse;font-size:.92rem}
.preview-table th,.preview-table td{
  text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);
}
.preview-table th{background:var(--surface-alt);font-size:.82rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em}
.preview-table td.empty{text-align:center;color:var(--ink-soft);padding:24px 12px}
.preview-table .copy-cell{white-space:nowrap}
.preview-table .score{display:inline-block;min-width:28px;text-align:center;padding:2px 8px;border-radius:999px;background:#eee;color:var(--ink);font-variant-numeric:tabular-nums}
.preview-table .score.good{background:#dff0e6;color:#1f5f3a}
.preview-table .score.warn{background:#fbe6d1;color:#7a3a0a}
.preview-empty{display:none;text-align:center;color:var(--ink-soft);margin-top:12px}

.recent-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.recent-head h2{margin:0;font-size:1.1rem}
.recent-hint{font-size:.82rem;color:var(--ink-soft)}
.recent-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.recent-item{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
.recent-item .when{font-size:.8rem;color:var(--ink-soft)}
.recent-item .summary{font-size:.92rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recent-item .open{color:var(--accent-dark);font-size:.85rem}

.side-card h2{margin:0 0 8px;font-size:1rem}
.side-card p,.side-card li{font-size:.92rem;color:var(--ink-soft)}
.side-card ol,.side-card ul{padding-left:18px;margin:0}
.side-card li{margin:4px 0}
.checklist li::marker{color:var(--accent-dark);font-weight:700}

.section-head{margin-bottom:18px}
.section-head h2{margin:0 0 4px;font-size:1.6rem}
.section-head p{margin:0;color:var(--ink-soft);max-width:70ch}

.examples .example-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.example-card{border:1px solid var(--line);border-radius:10px;padding:16px;background:#fff}
.example-card h3{margin:0 0 8px;font-size:1rem}
.example-card dl{margin:0 0 8px;display:grid;grid-template-columns:auto 1fr;gap:2px 10px;font-size:.9rem}
.example-card dt{color:var(--ink-soft)}
.example-card dd{margin:0}
.example-card ul{margin:0 0 10px;padding-left:18px;font-size:.9rem}
.example-card li{margin:2px 0}

.tips{margin-top:28px}
.tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.tip{border:1px solid var(--line);border-radius:10px;padding:16px;background:#fff}
.tip h3{margin:0 0 6px;font-size:1rem}
.tip p,.tip dd{font-size:.92rem;color:var(--ink-soft);margin:0}
.tip dl{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;margin:0}
.tip dt{font-weight:600;color:var(--ink)}

.site-footer{
  border-top:1px solid var(--line);
  background:var(--surface);
  color:var(--ink-soft);
  margin-top:40px;
}
.footer-inner{max-width:1180px;margin:0 auto;padding:22px 24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.footer-inner strong{color:var(--ink)}
.footer-inner span{display:block;font-size:.85rem}
.footer-nav{display:flex;gap:14px;flex-wrap:wrap;font-size:.9rem}
.footer-nav a{color:var(--ink-soft)}
.footer-nav a:hover{color:var(--accent-dark)}

.about main,.legal main{max-width:760px;margin:0 auto;padding:40px 24px}
.about h1,.legal h1{font-size:1.8rem;margin:0 0 12px}
.about-note,.legal-note{color:var(--ink-soft);font-size:.9rem;border-top:1px solid var(--line);padding-top:12px;margin-top:20px}

@media print{
  .site-header,.site-footer,.presets,.actions,.planner-side,.add-var,.remove-var,.preview-table .copy-cell,#recent,.examples,.tips,nav{display:none!important}
  body{background:#fff}
  .plan-form,.preview{border:none;box-shadow:none;padding:0}
  main{max-width:100%;padding:0}
  .planner{grid-template-columns:1fr}
  .preview-table{width:100%}
}



/* Factory-injected deployment helpers. The AI owns the site design above this block. */
.ad-unit {
  width: min(100%, 720px);
  min-height: 120px;
  margin: 24px auto;
  display: block;
}

.legal-page {
  width: min(900px, calc(100% - 32px));
  margin: 40px auto;
}

.factory-fallback-nav {
  width: min(900px, calc(100% - 32px));
  margin: 24px auto 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  font-size: 0.95rem;
}

.factory-fallback-nav a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}