/* Functional evolution of the 12ui B / planning-page reference: ivory canvas,
   forest-green navigation, serif headings, thin rules, compact analytical tables.
   The picture's invented product art and metrics are intentionally not executable UI. */
:root{--ink:#173f35;--forest:#113d32;--deep:#0d3029;--paper:#f6f4eb;--white:#fffef8;--line:#d8ded1;--muted:#637269;--sage:#e6ece0;--amber:#94601e;--amber-bg:#fbedd6;--red:#a13c30;--radius:6px}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.55 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}button,input,select,textarea{font:inherit}button,a,select,input,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #bc893d;outline-offset:3px}button:disabled{cursor:not-allowed}a{color:inherit}p{margin:8px 0 16px}small{font-size:12px}strong{font-weight:600}h1,h2,h3,.wordmark,.big-number,.stats strong{font-family:Georgia,'Times New Roman',serif;font-weight:400}h1{font-size:clamp(30px,3.1vw,46px);line-height:1.15;letter-spacing:-1.1px;margin:7px 0 12px}h2{font-size:21px;margin:0 0 22px}h3{font-size:20px;line-height:1.3;margin:10px 0}.sidebar{position:fixed;left:0;top:0;bottom:0;width:230px;background:linear-gradient(150deg,var(--forest),var(--deep));color:#fbfaf0;padding:30px 20px;display:flex;flex-direction:column;z-index:5}.wordmark{text-decoration:none;font-size:33px;letter-spacing:-.7px;margin:0 8px 28px}.wordmark span{display:block;letter-spacing:2px;font:9px/2 -apple-system,BlinkMacSystemFont,sans-serif;margin-top:6px;color:#c9d5c6}.project-label{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:#becfc2;margin:0 9px 6px}.sidebar select{width:100%;background:#234e41;border:1px solid #527363;color:#fff;min-height:45px;border-radius:4px;padding:8px 12px}.sidebar select option{background:var(--forest)}nav{margin-top:26px;display:flex;flex-direction:column;gap:5px}nav a{display:flex;align-items:center;gap:14px;text-decoration:none;padding:11px 12px;border-left:2px solid transparent;color:#d2dfd5;font-size:14px;min-height:45px}nav a span{width:18px;font:20px/1 Georgia}nav a:hover{background:#ffffff0a}nav a.active{color:white;background:#426c564f;border-color:#e7d5ad}.sidebar-foot{margin-top:auto;padding:25px 8px 0;border-top:1px solid #6c84785e;font:italic 16px/1.6 Georgia;color:#cbd7c9}.sidebar-foot small{font:11px/1.4 -apple-system,BlinkMacSystemFont,sans-serif;display:block;margin-top:25px;color:#a6baac}main{margin-left:230px;padding:0 34px 24px;max-width:2000px}.topbar{display:flex;justify-content:space-between;align-items:center;min-height:75px;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted)}.separator{padding:0 12px;color:#a7b2a4}.badge{font:11px/1.4 -apple-system,BlinkMacSystemFont,sans-serif;font-weight:500;display:inline-block;padding:4px 10px;border-radius:20px;background:var(--sage);color:var(--ink);white-space:nowrap}.badge.amber{background:var(--amber-bg);color:#79521d}.demo-note{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;padding:13px 0;color:var(--muted)}.page-heading{display:flex;justify-content:space-between;gap:25px;align-items:center;margin:25px 0 30px}.page-heading p{max-width:750px;color:var(--muted);margin-bottom:0}.page-heading .eyebrow{color:var(--ink)}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:600}.primary,.secondary{display:inline-flex;justify-content:space-between;align-items:center;gap:24px;min-height:44px;padding:10px 16px;border:1px solid var(--forest);border-radius:4px;white-space:nowrap;font-size:13px}.primary{background:var(--forest);color:#fff}.primary:hover{background:#24543f}.secondary{background:transparent;color:var(--ink);border-color:var(--line)}.secondary:hover{background:var(--sage)}.text-button{border:0;background:none;color:var(--ink);padding:5px 0;text-decoration:underline;text-underline-offset:4px;font-size:12px;min-height:36px}.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:28px}.stats>div{padding:22px 25px 22px 0}.stats>div+div{border-left:1px solid var(--line);padding-left:25px}.stats span{font-size:12px;color:var(--muted)}.stats strong{display:block;font-size:40px;line-height:1.3;margin:8px 0}.stats strong em{font:normal 13px -apple-system,BlinkMacSystemFont,sans-serif;padding-left:9px}.stats small{display:block;color:var(--muted)}.columns{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}.panel{padding:24px;background:#fffef540;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:20px;min-width:0}.tinted{background:var(--sage)}.panel>p{color:var(--muted)}.action-row{display:flex;gap:12px;align-items:center;padding:15px 0;border-top:1px solid var(--line)}.action-row:first-of-type{border-top:0}.action-row>div{flex:1}.action-row p{font-size:13px;color:var(--muted);margin:4px 0}.dot{width:8px;height:8px;border-radius:50%;background:#73987f;flex-shrink:0}.dot.amber{background:#c48c36}.callout{padding:15px 18px;background:#e8ecdf;color:#43584b;font-size:13px;border-radius:4px;margin-top:15px;margin-bottom:15px}.pool{font:34px/1.3 Georgia;text-align:center;border:1px solid #ccd8c6;padding:30px;margin:25px 0;background:var(--sage)}.pool small{display:block;font:12px/1.5 -apple-system,BlinkMacSystemFont,sans-serif;margin-top:8px}.fine{font-size:12px!important;color:var(--muted);margin-top:16px!important;margin-bottom:0!important}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}th{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line);padding:0 16px 13px 0}td{padding:17px 16px 17px 0;border-bottom:1px solid var(--line);vertical-align:middle}tr:last-child td{border-bottom:0}td small{display:block;color:var(--muted);margin-top:4px}input,textarea,select{border:1px solid #bdcdbc;border-radius:4px;background:#fffef9;color:var(--ink);padding:10px 12px;min-height:44px;max-width:100%}input:invalid{border-color:var(--red)}input[type=checkbox]{width:17px;height:17px;min-height:0;accent-color:var(--forest)}input[type=search]{min-width:280px;margin-left:12px}.search-label{display:block;margin-bottom:25px;font-size:12px}.equation{font:26px/1.5 Georgia;padding:15px 0 25px}.equation span{padding:0 25px;color:var(--muted)}.segmented{display:flex;gap:4px;flex-wrap:wrap}.segmented button{background:transparent;border:1px solid var(--line);border-radius:4px;padding:8px 13px;color:var(--ink);min-height:40px;font-size:12px}.segmented .selected{background:var(--forest);color:white}.sample-bars{display:flex;align-items:flex-end;justify-content:space-between;gap:7px;height:120px;border-bottom:1px solid var(--line);margin:15px 0}.sample-bars i{background:#799681;width:6%;border-radius:3px 3px 0 0}.proposal-top{display:flex;gap:15px;align-items:center;margin-bottom:15px;flex-wrap:wrap}.option{border-top:1px solid var(--line);padding-top:8px;margin-top:15px}.option p{font-size:13px}.option p small{display:block}.fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.field{display:flex;flex-direction:column;gap:8px;font-size:12px;color:var(--muted);margin-bottom:8px}.field>span{display:flex;position:relative}.field input{width:100%;padding-right:45px;font-size:17px;color:var(--ink)}.field>span small{position:absolute;right:10px;top:14px;font-size:11px}.checkbox{display:flex;gap:10px;align-items:flex-start;font-size:12px;color:var(--muted);margin:15px 0}.planner-columns{grid-template-columns:2fr 1fr}.big-number{font-size:62px;line-height:1.2;margin:15px 0 24px}.big-number small{display:block;font:13px/1.5 -apple-system,BlinkMacSystemFont,sans-serif;margin-top:10px}.strategy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.strategy-grid article+article{border-left:1px solid var(--line);padding-left:26px}.strategy-grid p{font-size:13px;color:var(--muted)}.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.timeline>div{border-top:1px solid var(--line);padding:18px 0}.timeline strong{display:block;margin:10px 0}.step{display:inline-grid;place-items:center;width:30px;height:30px;background:var(--sage);border-radius:50%;font-size:12px}.timeline h3{font-size:17px}.empty-state{text-align:center;padding:35px 10px}.empty-state p{max-width:600px;margin:auto;color:var(--muted)}.cost-table input{width:105px;min-height:40px;font-size:13px;padding:8px}.cost-table td:first-child{min-width:140px}.quality-row{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid var(--line);font-size:12px}.quality-row span{max-width:180px}#new-project{margin-top:25px;border-top:1px solid var(--line);padding-top:20px}label{font-size:13px}.inline-form{display:flex;gap:12px;margin:12px 0}.inline-form input{flex:1}textarea{display:block;width:100%;margin-top:10px;resize:vertical}.error{color:var(--red)!important}footer{border-top:1px solid var(--line);padding:20px 0;font-size:11px;color:var(--muted)}#notice:not(:empty){position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--forest);color:white;padding:15px 24px;border-radius:6px;box-shadow:0 5px 25px #103b3122;z-index:20;max-width:90vw}
@media(min-width:1600px){main{padding-left:48px;padding-right:48px}.panel{padding:30px}.page-heading{margin-top:35px}}@media(max-width:1150px){.sidebar{width:200px;padding:25px 15px}main{margin-left:200px;padding:0 24px}.columns,.planner-columns{grid-template-columns:1fr}.fields{grid-template-columns:repeat(3,1fr)}.page-heading{align-items:flex-start}.stats strong{font-size:34px}.strategy-grid{gap:18px}.strategy-grid article+article{padding-left:18px}}@media(max-width:760px){.sidebar{position:sticky;top:0;bottom:auto;width:100%;padding:12px 18px 0;display:grid;grid-template-columns:1fr 150px;align-items:center;gap:4px 15px}.wordmark{font-size:26px;margin:0}.wordmark span,.project-label,.sidebar-foot{display:none}.sidebar select{min-height:40px;padding:7px;font-size:13px}.sidebar nav{grid-column:1/-1;margin:8px -18px 0;display:flex;flex-direction:row;overflow-x:auto;gap:0;scrollbar-width:none;padding:0 12px}nav a{padding:11px 12px;font-size:12px;white-space:nowrap;min-height:44px;border-left:0;border-bottom:2px solid transparent}nav a.active{border-bottom-color:#e7d5ad}nav a span{display:none}main{margin-left:0;padding:0 18px 20px}.topbar{min-height:52px;font-size:11px}.demo-note{font-size:10px;line-height:1.6}.demo-note .text-button{font-size:11px}.page-heading{display:block;margin:20px 0 25px}.page-heading>.primary,.page-heading>.secondary{margin-top:18px}h1{font-size:33px;letter-spacing:-.6px}h2{font-size:21px;margin-bottom:18px}.page-heading p{font-size:13px}.stats{grid-template-columns:1fr;margin-bottom:20px}.stats>div,.stats>div+div{border-left:0;padding:16px 0;display:grid;grid-template-columns:1fr auto;column-gap:12px}.stats>div+div{border-top:1px solid var(--line)}.stats strong{grid-column:2;grid-row:1/3;margin:0;font-size:30px;text-align:right}.stats strong em{font-size:11px;display:block}.stats small{font-size:10px;max-width:200px}.stats span{font-size:11px}.panel{padding:18px;margin-bottom:16px}.action-row{flex-wrap:wrap}.action-row .secondary{margin-left:20px}.fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.field{font-size:11px}.field input{font-size:17px}.strategy-grid{grid-template-columns:1fr}.strategy-grid article+article{border-left:0;border-top:1px solid var(--line);padding:16px 0 0}.timeline{grid-template-columns:1fr}.timeline>div{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:12px;padding:14px 0}.timeline h3,.timeline strong{margin:0;font-size:14px}.timeline .badge{grid-column:2/4;justify-self:start}.big-number{font-size:50px}.inline-form{flex-direction:column}.search-label input{min-width:0;width:100%;margin:10px 0 0}.equation{font-size:21px}.equation span{padding:0 8px}.proposal-top strong{font-size:14px}table{font-size:12px}th{font-size:9px}td,th{padding-right:20px;white-space:nowrap}.fine{line-height:1.6}.quality-row{flex-wrap:wrap}.quality-row span{max-width:100%}}