/* Odd Beds — a workshop drawing on warm paper. One accent (dimension orange), one blue (the tape). */
:root{--paper:#F4EFE6;--paper-2:#EBE3D4;--ink:#1B1F24;--ink-2:#4A4F57;--rule:#C9BFAD;--accent:#E8572A;--tape:#2B4C7E;--white:#FFFDF9;
 --sans:"Avenir Next","Helvetica Neue",Helvetica,Arial,sans-serif;--mono:"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;--w:72rem;--text:44rem}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.55 var(--sans);background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px);background-size:64px 64px;background-position:-1px -1px}
body::before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 50% 0,rgba(244,239,230,.2),var(--paper) 70%);pointer-events:none;z-index:-1}
a{color:inherit}.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:.5rem 1rem}.skip:focus{left:1rem;z-index:9}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:1.5rem;padding:.8rem clamp(1rem,4vw,2.5rem);background:rgba(244,239,230,.92);backdrop-filter:blur(8px);border-bottom:2px solid var(--ink)}
.brand{font-weight:800;letter-spacing:-.02em;text-decoration:none;font-size:1.2rem;white-space:nowrap}
.menu ul{display:flex;gap:.2rem 1rem;flex-wrap:wrap;list-style:none;margin:0;padding:0;font-size:.92rem}.menu a{text-decoration:none;padding:.2rem 0;border-bottom:2px solid transparent}.menu a.here,.menu a:hover{border-color:var(--accent)}
.lang{margin-left:auto;font-size:.9rem;text-decoration:none;border:1.5px solid var(--ink);padding:.25rem .7rem;border-radius:999px}
main{max-width:var(--w);margin:0 auto;padding:clamp(1.5rem,5vw,4rem) clamp(1rem,4vw,2.5rem) 4rem}
.lead{max-width:var(--text)}h1{font-size:clamp(2rem,5.5vw,3.6rem);line-height:1.02;letter-spacing:-.03em;margin:0 0 1rem}.lede{font-size:1.25rem;color:var(--ink-2);margin:0}
h2{font-size:clamp(1.35rem,3vw,1.8rem);letter-spacing:-.02em;margin:0 0 .8rem}
.hero{margin:2rem 0 3rem;background:var(--white);border:2px solid var(--ink);border-radius:8px;padding:clamp(1rem,3vw,2rem);box-shadow:8px 8px 0 var(--paper-2)}
.hero .fig{margin:0}.fig{margin:0 0 1.2rem}.fig svg{display:block;width:100%;height:auto;max-height:70vh}.fig figcaption{font-size:.92rem;color:var(--ink-2);margin-top:.6rem;max-width:var(--text)}
.sec{margin:0 0 3rem;padding-top:1.5rem;border-top:1px solid var(--rule)}.sec p,.sec ul{max-width:var(--text)}.sec .fig{background:var(--white);border:1.5px solid var(--rule);border-radius:8px;padding:1rem}
.sec .fig-table{padding:0;border:0;background:none}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1.2rem;margin:0 0 3rem}
.card{display:block;text-decoration:none;background:var(--white);border:2px solid var(--ink);border-radius:8px;padding:1rem;transition:transform .15s,box-shadow .15s}.card:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--accent)}
.card .fig{margin:0 0 .8rem;height:11rem;display:flex;align-items:center}.card svg{max-height:11rem}.card h2{font-size:1.15rem;margin:0 0 .3rem}.card p{margin:0;font-size:.92rem;color:var(--ink-2)}.card figcaption{display:none}
table{border-collapse:collapse;width:100%;background:var(--white);font-variant-numeric:tabular-nums}caption{text-align:left;font-weight:700;padding:.6rem .8rem;background:var(--paper-2)}th,td{text-align:left;padding:.55rem .8rem;border-bottom:1px solid var(--rule)}th[scope=row]{font-weight:600}td{font-family:var(--mono);font-size:.92rem}
[data-fact]{border-bottom:1.5px dotted var(--accent)}sup.src a{text-decoration:none;color:var(--accent);font-weight:700;padding:0 .1em}
.disclosure{border-left:4px solid var(--tape);background:var(--white);padding:1rem 1.2rem;margin:3rem 0 1.5rem;max-width:var(--text)}.disclosure h2{font-size:1rem;margin:0 0 .4rem}.disclosure p{margin:0;font-size:.95rem;color:var(--ink-2)}
.made{background:var(--ink);color:var(--paper);padding:clamp(1.5rem,4vw,2.5rem);border-radius:8px;max-width:var(--text)}.made h2{font-size:clamp(1.5rem,3.5vw,2.2rem);margin:0 0 .5rem}.made p{margin:0 0 1.2rem;color:var(--paper-2)}
.go{display:inline-block;background:var(--accent);color:#fff;text-decoration:none;font-weight:700;padding:.8rem 1.3rem;border-radius:6px;font-size:1.05rem}.go:hover{filter:brightness(1.08)}
.sources{margin-top:3rem;font-size:.85rem;color:var(--ink-2);max-width:var(--text)}.sources h2{font-size:1rem}.sources ol{padding-left:1.2rem}
.foot{border-top:2px solid var(--ink);padding:1.5rem clamp(1rem,4vw,2.5rem) 3rem;font-size:.9rem;color:var(--ink-2)}.fine{max-width:var(--text)}
/* drawings */
svg text{font-family:var(--mono);font-size:11px;fill:var(--ink)}
.shape .mattress,.demo .mattress{fill:var(--white);stroke:var(--ink);stroke-width:2.5;stroke-linejoin:round}
.dim line{stroke:var(--accent);stroke-width:1.5}.dim text{fill:var(--accent);font-weight:700}.dim.cut line{stroke:var(--tape)}.dim.cut text{fill:var(--tape)}
.fold{stroke:var(--ink);stroke-width:2;stroke-dasharray:8 6}.shape .head{fill:var(--ink-2);font-size:10px;letter-spacing:.1em;text-transform:uppercase}
.note{fill:var(--ink-2)}.compare .size{fill:rgba(43,76,126,.08);stroke:var(--ink);stroke-width:1.5}.compare .s0{fill:rgba(232,87,42,.08)}
.demo .frame{fill:var(--paper-2);stroke:var(--ink);stroke-width:2.5}.demo .opening{fill:var(--white);stroke:var(--ink);stroke-width:1.5;stroke-dasharray:4 4}
.demo .tape line{stroke:var(--tape);stroke-width:2.5}.demo .tape circle{fill:var(--tape)}.demo .cap{font-family:var(--sans);font-size:12px;fill:var(--ink)}
.demo .stepno circle{fill:var(--accent)}.demo .stepno text{fill:#fff;font-weight:800;font-size:14px}
.demo .broom{stroke:#8A5A2B;stroke-width:5;stroke-linecap:round}.demo .hull{fill:var(--paper-2);stroke:var(--ink);stroke-width:2.5}.demo .paper{fill:#E9D9B5;stroke:#B89A5E;stroke-width:1.5}.demo .marker{fill:none;stroke:var(--accent);stroke-width:2;stroke-dasharray:6 4}
/* the tool */
.tool{background:var(--white);border:2px solid var(--ink);border-radius:8px;padding:clamp(1rem,3vw,2rem);margin:2rem 0;box-shadow:8px 8px 0 var(--paper-2)}
.tool form{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.8rem 1rem;margin-bottom:1rem}.tool label{display:block;font-size:.85rem;font-weight:600}.tool input,.tool select{width:100%;font:inherit;font-family:var(--mono);padding:.45rem .6rem;border:1.5px solid var(--ink);border-radius:6px;background:var(--paper)}
.tool .canvas{border:1.5px solid var(--rule);border-radius:8px;padding:1rem;background:var(--paper)}.tool .canvas svg{display:block;width:100%;max-height:60vh;height:auto}
.tool .result{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1rem;margin-top:1rem}.tool .result div{background:var(--paper);border-radius:8px;padding:1rem}.tool .result strong{font-family:var(--mono)}
.tool .acts{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem}.tool button{font:inherit;font-weight:700;padding:.6rem 1rem;border:2px solid var(--ink);border-radius:6px;background:var(--white);cursor:pointer}.tool button.primary{background:var(--ink);color:var(--paper)}
.tool .sheet{display:none}
@media print{.top,.foot,.menu,.lang,.cards,.hero,.made,.disclosure,.sources,.tool form,.tool .acts,.skip{display:none!important}body{background:#fff}.tool{border:0;box-shadow:none}.tool .sheet{display:block}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media (max-width:700px){.top{gap:.8rem}.menu{order:3;width:100%}.lang{margin-left:auto}}
.tool .lbl{display:block;font-size:.85rem;font-weight:600}.tool fieldset label,.tool div>label:has(input[type=checkbox]){display:inline-block;font-weight:500;margin:.3rem .9rem .2rem 0}
.tool div:has(.lbl){grid-column:1/-1}
.compare .pin{fill:var(--ink)}.compare .leader{fill:none;stroke:var(--ink-2);stroke-width:1}.compare .num{font-family:var(--mono);fill:var(--ink-2)}
@media (max-width:700px){.top{flex-wrap:wrap;gap:.4rem 1rem;padding:.6rem 1rem}.menu{order:3;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.menu::-webkit-scrollbar{display:none}.menu ul{flex-wrap:nowrap;white-space:nowrap;padding-bottom:.2rem}}
.foot .disclosure{margin:1rem 0 0;max-width:44rem}.foot .disclosure h2{font-size:.95rem}
.foot::after{content:attr(data-brand);display:block;font-weight:800;font-size:clamp(4rem,19vw,17rem);line-height:.78;letter-spacing:-.06em;color:rgba(27,31,36,.07);white-space:nowrap;overflow:hidden;margin:2.5rem 0 -0.12em;pointer-events:none}
.privacy-link{color:inherit;opacity:.75;text-decoration:underline;text-underline-offset:3px}.partner-line{margin:2rem 0 0;font-size:.95rem}.partner-line .go-quiet{color:var(--ink-2);text-decoration:none;border-bottom:1px solid var(--rule)}