diff --git a/skills/hyperframes/templates/presentations/raw-grid/design.html b/skills/hyperframes/templates/presentations/raw-grid/design.html
index 2fa64ae2d4..e0681ac41e 100644
--- a/skills/hyperframes/templates/presentations/raw-grid/design.html
+++ b/skills/hyperframes/templates/presentations/raw-grid/design.html
@@ -5,236 +5,306 @@
 <meta name="viewport" content="width=device-width,initial-scale=1" />
 <title>__NAME__ — Design System</title>
 <link rel="preconnect" href="https://fonts.googleapis.com" />
-<link href="https://fonts.googleapis.com/css2?__FONT_LINK_EXTRA__&display=swap" rel="stylesheet" />
+<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Manrope:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600__FONT_LINK_EXTRA__&display=swap" rel="stylesheet" />
+
 <script type="importmap">
 {"imports":{"three":"https://cdn.jsdelivr.net/npm/three@0.167.0/build/three.module.js","three/addons/":"https://cdn.jsdelivr.net/npm/three@0.167.0/examples/jsm/"}}
 </script>
+
 <style id="ds-tokens">
 :root{
   --primary:__PRIMARY__; --secondary:__SECONDARY__; --tertiary:__TERTIARY__; --accent:__ACCENT__;
-  --hairline:color-mix(in srgb,var(--primary) 12%,transparent);
-  --f-disp:"system-ui",sans-serif; --f-mono:"monospace",monospace;
-  --pad-x:clamp(24px,5vw,88px); --pad-y:clamp(40px,6vh,100px);
+  --paper:__PRIMARY__; --ink:__SECONDARY__;
+  --sage:__TERTIARY__; --pink:__ACCENT__; --pale:#F7F1E8;
+  --ink-dim:color-mix(in srgb,var(--ink) 65%,var(--paper));
+  --ink-fade:color-mix(in srgb,var(--ink) 32%,var(--paper));
+  --hairline:color-mix(in srgb,var(--ink) 16%,transparent);
+  --shadow:6px 6px 0 var(--ink);
+  --shadow-sm:4px 4px 0 var(--ink);
+  --f-disp:"Space Grotesk",sans-serif;
+  --f-body:"Manrope",sans-serif;
+  --f-mono:"JetBrains Mono",monospace;
+  --pad-x:clamp(28px,5vw,80px); --pad-y:clamp(48px,7vh,120px);
 }
 </style>
+
 <style>
 *,*::before,*::after{box-sizing:border-box}
-html,body{margin:0;padding:0;background:var(--secondary)}
-body{color:var(--primary);font:400 14px/1.6 "monospace",monospace;-webkit-font-smoothing:antialiased;overflow-x:hidden}
-::selection{background:var(--accent);color:var(--secondary)}
+html,body{margin:0;padding:0;background:var(--paper)}
+body{color:var(--ink);font:500 14px/1.65 var(--f-body);overflow-x:hidden}
+::selection{background:var(--pink);color:var(--ink)}
 
-#design-bg{position:fixed;inset:0;width:100%;height:100%;z-index:-2;opacity:.85;pointer-events:none}
-#bg-veil{position:fixed;inset:0;z-index:-1;pointer-events:none;background:none}
+#design-bg{position:fixed;inset:0;width:100%;height:100%;z-index:-2;opacity:.55;pointer-events:none}
+#bg-veil{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 30% 20%,transparent 0%,var(--paper) 75%)}
 
-.rail{position:fixed;top:0;left:0;right:0;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad-x);background:var(--primary);border-bottom:4px solid var(--black,var(--secondary));box-shadow:4px 4px 0 var(--black,var(--secondary));z-index:100;font:500 12px/1 "monospace",monospace;letter-spacing:.06em;text-transform:uppercase}
-.rail .brand{color:var(--accent);display:inline-flex;align-items:center;gap:10px;font:400 22px/1 "system-ui",sans-serif}
-.rail .brand .dot{width:22px;height:22px;background:var(--accent);border:3px solid var(--secondary);transform:rotate(-6deg)}
-.rail nav{display:flex;gap:6px}
-.rail nav a{color:var(--secondary);text-decoration:none;padding:6px 10px;border:2px solid transparent;transition:all .15s}
-.rail nav a:hover{color:var(--accent);background:var(--accent);border-color:var(--secondary)}
-@media(max-width:880px){.rail nav{display:none}}
+.rail{position:fixed;top:16px;left:16px;right:16px;height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;background:var(--paper);border:3px solid var(--ink);box-shadow:var(--shadow-sm);z-index:100;font:600 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
+.rail .brand{display:inline-flex;align-items:center;gap:12px}
+.rail .brand b{font-family:var(--f-disp);font-weight:700;letter-spacing:-.02em;text-transform:none;font-size:22px;color:var(--ink)}
+.rail .brand .grid{display:inline-grid;grid-template-columns:repeat(2,1fr);gap:2px}
+.rail .brand .grid span{width:8px;height:8px;border:1.5px solid var(--ink)}
+.rail .brand .grid span:nth-child(1){background:var(--pink)}
+.rail .brand .grid span:nth-child(2){background:var(--sage)}
+.rail .brand .grid span:nth-child(3){background:var(--ink)}
+.rail .brand .grid span:nth-child(4){background:var(--paper)}
+.rail nav{display:flex;gap:18px}
+.rail nav a{color:var(--ink-dim);text-decoration:none;padding:6px 10px;border:2px solid transparent;transition:all .12s}
+.rail nav a:hover{background:var(--pink);border-color:var(--ink);transform:translate(-1px,-1px);box-shadow:2px 2px 0 var(--ink)}
+.rail .meta{padding:4px 12px;background:var(--sage);border:2px solid var(--ink)}
+@media(max-width:760px){.rail nav{display:none}}
 
 section{position:relative;padding:var(--pad-y) var(--pad-x)}
-.section-head{display:grid;grid-template-columns:11em 1fr;gap:clamp(24px,4vw,56px);align-items:end;margin-bottom:clamp(36px,5vh,64px)}
-.section-head .num{font:600 12px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);display:inline-block;border:3px solid var(--secondary);background:var(--primary);padding:6px 14px;box-shadow:4px 4px 0 var(--black,var(--secondary));justify-self:start;transform:rotate(-3deg)}
-.section-head h2{font:400 clamp(48px,8vw,128px)/.88 "system-ui",sans-serif;letter-spacing:-.01em;margin:0;text-transform:uppercase}
-.section-head .lede{grid-column:2;max-width:60ch;margin-top:18px;font-size:15px;line-height:1.6}
+.section-head{display:grid;grid-template-columns:11em 1fr;gap:clamp(24px,4vw,56px);align-items:end;border-top:3px solid var(--ink);padding-top:32px;margin-bottom:clamp(40px,6vh,72px)}
+.section-head .num{display:inline-block;font:600 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);padding:8px 14px;background:var(--pink);border:2px solid var(--ink);box-shadow:var(--shadow-sm);justify-self:start;transform:rotate(-2deg)}
+.section-head h2{margin:0;font:700 clamp(56px,9vw,128px)/.92 var(--f-disp);letter-spacing:-.035em;color:var(--ink)}
+.section-head h2 em{font-style:normal;background:var(--pink);padding:0 .08em;border:3px solid var(--ink);box-shadow:var(--shadow-sm);display:inline-block;line-height:.92;transform:rotate(-1deg)}
+.section-head .lede{grid-column:2;max-width:54ch;margin-top:18px;font:500 15px/1.7 var(--f-body);color:var(--ink-dim)}
 
-.cover{background:var(--primary);color:var(--secondary)};min-height:100vh;padding:110px var(--pad-x) 60px;display:flex;flex-direction:column;justify-content:center}
-.cover-headline{margin:0;font:900 clamp(64px,13vw,200px)/.88 "system-ui",sans-serif;letter-spacing:-.04em;text-transform:uppercase}
-.cover-foot{margin-top:56px;padding-top:28px;border-top:4px solid var(--black,var(--secondary));display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
-.cover-foot .cell{display:flex;flex-direction:column;gap:6px}
-.cover-foot .k{font:500 11px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;opacity:.55}
-.cover-foot .v{font:500 13px/1.4 "monospace",monospace}
-.cover-foot .v.big{font:800 32px/1 "system-ui",sans-serif;letter-spacing:-.02em}
+/* Cover */
+.cover{min-height:100vh;padding:96px var(--pad-x) 56px;display:grid;grid-template-rows:auto 1fr auto;position:relative;overflow:hidden}
+.cover-chrome{display:flex;justify-content:space-between;font:600 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
+.cover-chrome .accent{padding:6px 12px;background:var(--pink);border:2px solid var(--ink);box-shadow:var(--shadow-sm)}
+.cover-headline{align-self:end;margin:0;font:700 clamp(96px,21vw,360px)/.85 var(--f-disp);letter-spacing:-.045em;color:var(--ink)}
+.cover-headline em{font-style:normal;background:var(--sage);padding:0 .06em;border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink);display:inline-block;line-height:.85;transform:rotate(-1deg);margin:0 .04em}
+.cover-foot{margin-top:48px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
+.cover-foot .cell{padding:18px 20px;background:var(--paper);border:3px solid var(--ink);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:6px}
+.cover-foot .cell:nth-child(1){background:var(--pink);transform:rotate(-1.5deg)}
+.cover-foot .cell:nth-child(2){background:var(--paper);transform:rotate(1deg)}
+.cover-foot .cell:nth-child(3){background:var(--sage);transform:rotate(-1deg)}
+.cover-foot .cell:nth-child(4){background:var(--ink);color:var(--paper);transform:rotate(1.5deg)}
+.cover-foot .cell:nth-child(4) .k{color:color-mix(in srgb,var(--paper) 70%,transparent)}
+.cover-foot .k{font:600 10px/1.4 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim)}
+.cover-foot .v{font:700 22px/1.15 var(--f-disp);letter-spacing:-.022em;color:var(--ink)}
+.cover-foot .cell:nth-child(4) .v{color:var(--paper)}
+.cover-foot .v.plain{font-family:var(--f-body);font-weight:600;font-size:14px;letter-spacing:.02em}
 @media(max-width:760px){.cover-foot{grid-template-columns:1fr 1fr}}
 
-.manifesto{padding:clamp(60px,9vh,120px) var(--pad-x);border-top:4px solid var(--black,var(--secondary));border-bottom:4px solid var(--black,var(--secondary))}
-.manifesto-grid{display:grid;grid-template-columns:11em 1fr;gap:clamp(24px,4vw,56px);align-items:start;max-width:1400px;margin:0 auto}
-.manifesto-grid .num{font:500 12px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
-.manifesto p{font:800 clamp(28px,4vw,60px)/1.05 "system-ui",sans-serif;letter-spacing:-.025em;max-width:22ch;margin:0;text-transform:uppercase}
-.manifesto p em{font-style:normal;background:var(--secondary);color:var(--accent);padding:0 .15em}
+/* Manifesto */
+.manifesto{padding:clamp(60px,9vh,120px) var(--pad-x);background:var(--ink);color:var(--paper);border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
+.manifesto-grid{display:grid;grid-template-columns:11em 1fr;gap:clamp(24px,4vw,56px);align-items:start}
+.manifesto-grid .num{display:inline-block;font:600 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);padding:8px 14px;background:var(--pink);border:2px solid var(--paper);box-shadow:4px 4px 0 var(--pink);align-self:flex-start;justify-self:start;transform:rotate(-2deg)}
+.manifesto p{font:700 clamp(36px,5.5vw,80px)/1 var(--f-disp);max-width:22ch;margin:0;color:var(--paper);letter-spacing:-.035em}
+.manifesto p em{font-style:normal;background:var(--pink);color:var(--ink);padding:0 .08em;border:3px solid var(--paper);display:inline-block;line-height:1;transform:rotate(-1deg)}
 
-.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
-.swatch{border:4px solid var(--black,var(--secondary));box-shadow:8px 8px 0 var(--black,var(--secondary));padding:28px 24px;aspect-ratio:3/4;display:flex;flex-direction:column;justify-content:space-between;border-radius:0;transition:all .2s}
-.swatch:hover{transform:translate(-3px,-3px);box-shadow:11px 11px 0 var(--black,var(--secondary))}
-.swatch .role{font:500 11px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;background:var(--primary);border:2px solid var(--secondary);align-self:flex-start}
-.swatch .name{font:900 clamp(28px,3.4vw,48px)/.92 "system-ui",sans-serif;letter-spacing:-.025em;text-transform:uppercase;margin-top:auto}
-.swatch .hex{font:500 12px/1 "monospace",monospace;margin-top:8px}
-.swatch .usage{font:400 11px/1.5 "monospace",monospace;margin-top:6px;opacity:.65}
-.swatch--primary{background:var(--primary);color:var(--secondary)}
-.swatch--secondary{background:var(--secondary);color:var(--primary)}
-.swatch--tertiary{background:var(--tertiary);color:var(--primary)}
-.swatch--accent{background:var(--accent);color:var(--secondary)}
+/* Palette */
+.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
 @media(max-width:880px){.palette{grid-template-columns:repeat(2,1fr)}}
+.swatch{aspect-ratio:3/4;padding:24px;display:flex;flex-direction:column;justify-content:space-between;border:3px solid var(--ink);box-shadow:var(--shadow);transition:transform .15s}
+.swatch:nth-child(1){transform:rotate(-1.5deg)}
+.swatch:nth-child(2){transform:rotate(1deg)}
+.swatch:nth-child(3){transform:rotate(-1deg)}
+.swatch:nth-child(4){transform:rotate(1.5deg)}
+.swatch:hover{transform:translate(-3px,-3px)}
+.swatch:nth-child(1):hover{transform:rotate(-1.5deg) translate(-3px,-3px)}
+.swatch:nth-child(2):hover{transform:rotate(1deg) translate(-3px,-3px)}
+.swatch:nth-child(3):hover{transform:rotate(-1deg) translate(-3px,-3px)}
+.swatch:nth-child(4):hover{transform:rotate(1.5deg) translate(-3px,-3px)}
+.swatch .role{font:600 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;background:var(--paper);color:var(--ink);border:2px solid var(--ink);align-self:flex-start}
+.swatch .name{font:700 clamp(28px,3.4vw,48px)/.95 var(--f-disp);letter-spacing:-.03em;margin-top:auto}
+.swatch .hex{font:600 13px/1 var(--f-mono);margin-top:8px}
+.swatch .usage{font:500 13px/1.55 var(--f-body);margin-top:6px;opacity:.8}
+.swatch--paper{background:var(--paper);color:var(--ink)}
+.swatch--ink{background:var(--ink);color:var(--paper)}
+.swatch--ink .role{background:var(--paper);color:var(--ink)}
+.swatch--sage{background:var(--sage);color:var(--ink)}
+.swatch--pink{background:var(--pink);color:var(--ink)}
 
-.specimen{border:4px solid var(--black,var(--secondary));background:var(--primary);color:var(--secondary);box-shadow:8px 8px 0 var(--black,var(--secondary));max-width:1400px;margin:0 auto;display:flex;flex-direction:column}
-.spec-row{display:grid;grid-template-columns:12em 1fr;gap:28px;padding:28px 32px;border-bottom:3px solid var(--secondary);align-items:baseline}
-.spec-row:last-child{border:0;padding-top:0}
-.spec-row .meta{font:500 11px/1.4 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;display:flex;flex-direction:column;gap:4px;color:var(--secondary);opacity:.6}
-.spec-row .meta b{color:var(--accent);font:400 22px/1 "system-ui",sans-serif}
-.spec-display{font:900 clamp(56px,10vw,152px)/.88 "system-ui",sans-serif;letter-spacing:-.04em;text-transform:uppercase}
-.spec-h1{font:800 clamp(40px,7vw,104px)/.9 "system-ui",sans-serif;letter-spacing:-.03em;text-transform:uppercase}
-.spec-h2{font:700 clamp(28px,4.2vw,64px)/1 "system-ui",sans-serif;letter-spacing:-.02em}
-.spec-lead{font:500 clamp(18px,2vw,26px)/1.45 "system-ui",sans-serif}
-.spec-body{font:500 17px/1.65 "system-ui",sans-serif;max-width:60ch}
-.spec-label{font:600 13px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase}
+/* Type specimen */
+.specimen{display:flex;flex-direction:column;border:3px solid var(--ink);background:var(--paper);box-shadow:var(--shadow)}
+.spec-row{display:grid;grid-template-columns:13em 1fr;gap:32px;padding:28px 32px;border-bottom:2px solid var(--ink);align-items:baseline}
+.spec-row:last-child{border:0}
+.spec-row .meta{font:600 11px/1.5 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);display:flex;flex-direction:column;gap:6px}
+.spec-row .meta b{color:var(--ink);font-weight:700;font-family:var(--f-disp);font-size:18px;letter-spacing:-.022em;text-transform:none}
+.spec-display{font:700 clamp(56px,10vw,156px)/.92 var(--f-disp);letter-spacing:-.04em;color:var(--ink)}
+.spec-display em{font-style:normal;background:var(--pink);padding:0 .06em;border:3px solid var(--ink);box-shadow:var(--shadow-sm);display:inline-block;line-height:.92}
+.spec-h1{font:700 clamp(40px,7vw,104px)/.95 var(--f-disp);letter-spacing:-.035em;color:var(--ink)}
+.spec-h1 em{font-style:normal;background:var(--sage);padding:0 .06em;border:3px solid var(--ink);display:inline-block;line-height:.95}
+.spec-h2{font:600 clamp(28px,4.2vw,64px)/1 var(--f-disp);letter-spacing:-.028em;color:var(--ink)}
+.spec-lead{font:600 clamp(18px,2vw,28px)/1.45 var(--f-body);color:var(--ink);max-width:38ch}
+.spec-body{font:500 16px/1.7 var(--f-body);color:var(--ink);max-width:60ch}
+.spec-label{font:600 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:var(--pink);padding:6px 12px;border:2px solid var(--ink);display:inline-block}
 
-.surface-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;max-width:1400px;margin:0 auto}
+/* Surface */
+.surface-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:32px}
 @media(max-width:880px){.surface-grid{grid-template-columns:1fr}}
-.demo-card{background:var(--primary);color:var(--secondary);border-radius:0;padding:32px;border:4px solid var(--black,var(--secondary));box-shadow:8px 8px 0 var(--black,var(--secondary));display:flex;flex-direction:column;gap:18px}
-.demo-card .tag{align-self:flex-start;font:600 11px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;border:3px solid var(--secondary);background:var(--accent);padding:6px 14px;box-shadow:4px 4px 0 var(--black,var(--secondary))}
-.demo-card h3{margin:0;font:900 36px/1 "system-ui",sans-serif;letter-spacing:-.02em;text-transform:uppercase}
-.demo-card p{margin:0;font:400 15px/1.6 "system-ui",sans-serif;opacity:.7}
-.tokens{list-style:none;padding:0;margin:0;border:4px solid var(--black,var(--secondary));background:var(--primary);color:var(--secondary);box-shadow:8px 8px 0 var(--black,var(--secondary))}
-.tokens li{display:grid;grid-template-columns:1fr auto auto;gap:18px;align-items:center;padding:18px 24px;border-bottom:3px solid var(--secondary)}
+.demo-card{background:var(--paper);color:var(--ink);padding:32px;display:flex;flex-direction:column;gap:18px;border:3px solid var(--ink);box-shadow:var(--shadow);position:relative;transform:rotate(-1deg)}
+.demo-card .tag{align-self:flex-start;font:600 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:var(--pink);padding:6px 12px;border:2px solid var(--ink);box-shadow:var(--shadow-sm)}
+.demo-card h3{margin:0;font:700 44px/.95 var(--f-disp);letter-spacing:-.04em}
+.demo-card h3 em{font-style:normal;background:var(--sage);padding:0 .06em;border:3px solid var(--ink);display:inline-block;line-height:.95;transform:rotate(-1deg)}
+.demo-card p{margin:0;font:500 14px/1.7 var(--f-body)}
+.demo-card .num-stat{font:700 96px/.95 var(--f-disp);color:var(--ink);letter-spacing:-.045em}
+.demo-card .btn{align-self:flex-start;padding:10px 20px;background:var(--ink);color:var(--paper);font:600 12px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;border:2px solid var(--ink);box-shadow:var(--shadow-sm)}
+.tokens{list-style:none;padding:0;margin:0;border:3px solid var(--ink);background:var(--paper);box-shadow:var(--shadow);transform:rotate(.4deg)}
+.tokens li{display:grid;grid-template-columns:1fr auto auto;gap:18px;align-items:center;padding:14px 22px;border-bottom:2px solid var(--ink)}
 .tokens li:last-child{border:0}
-.tokens .name{font:600 12px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase}
-.tokens .val{font:800 20px/1 "system-ui",sans-serif}
-.tokens .bar{height:8px;background:var(--accent);border:2px solid var(--secondary)}
+.tokens li:nth-child(odd){background:color-mix(in srgb,var(--pink) 25%,var(--paper))}
+.tokens .name{font:600 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
+.tokens .val{font:700 22px/1 var(--f-disp);letter-spacing:-.025em;color:var(--ink)}
+.tokens .bar{height:8px;background:var(--pink);border:2px solid var(--ink)}
 
-.two-col{display:grid;grid-template-columns:1fr 1fr;gap:32px;max-width:1400px;margin:0 auto}
+/* Motion */
+.two-col{display:grid;grid-template-columns:1fr 1fr;gap:32px}
 @media(max-width:880px){.two-col{grid-template-columns:1fr}}
-.panel{background:var(--primary);border:4px solid var(--black,var(--secondary));box-shadow:8px 8px 0 var(--black,var(--secondary))};padding:32px;border-radius:0;display:flex;flex-direction:column;gap:22px}
-.panel .label-row{font:500 11px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);display:inline-block;align-self:flex-start;background:var(--accent);color:var(--secondary);border:3px solid var(--secondary);padding:6px 14px;box-shadow:4px 4px 0 var(--black,var(--secondary))}
-.panel h4{margin:0;font:400 40px/1 "system-ui",sans-serif;text-transform:uppercase}
-.panel p{margin:0;font:500 14px/1.65 "system-ui",sans-serif;max-width:42ch}
+.panel{background:var(--paper);border:3px solid var(--ink);padding:32px;display:flex;flex-direction:column;gap:18px;box-shadow:var(--shadow)}
+.panel:first-child{background:var(--sage);transform:rotate(-.5deg)}
+.panel:last-child{background:var(--pink);transform:rotate(.5deg)}
+.panel .label-row{font:600 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--paper);background:var(--ink);padding:6px 12px;align-self:flex-start;box-shadow:var(--shadow-sm)}
+.panel h4{margin:0;font:700 36px/1 var(--f-disp);letter-spacing:-.035em;color:var(--ink)}
+.panel h4 em{font-style:normal;background:var(--paper);padding:0 .08em;border:3px solid var(--ink);display:inline-block;line-height:1}
+.panel p{margin:0;font:500 14px/1.7 var(--f-body);color:var(--ink);max-width:38ch}
+.panel pre{margin:0;padding:14px;border:2px solid var(--ink);background:var(--paper);font:500 12px/1.6 var(--f-mono);color:var(--ink);overflow-x:auto}
 
-.bg-preview{border:4px solid var(--black,var(--secondary));box-shadow:8px 8px 0 var(--black,var(--secondary));aspect-ratio:4/3;position:relative;overflow:hidden;background:var(--secondary);border-radius:0}
+/* Background */
+.bg-preview{border:3px solid var(--ink);aspect-ratio:4/3;position:relative;overflow:hidden;background:var(--paper);box-shadow:var(--shadow);transform:rotate(-.5deg)}
 .bg-preview canvas{width:100%;height:100%;display:block}
-.bg-preview .badge{position:absolute;bottom:14px;left:14px;font:600 11px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--secondary);background:var(--accent);border:3px solid var(--secondary);padding:6px 12px}
-
-details.code-block{background:var(--primary);border:3px solid var(--secondary)};margin-top:12px;border-radius:0}
-details.code-block summary{cursor:pointer;padding:12px 16px;list-style:none;font:600 12px/1 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;display:flex;justify-content:space-between;background:var(--accent)}
+.bg-preview .badge{position:absolute;bottom:12px;left:12px;font:600 10px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;background:var(--paper);padding:6px 12px;border:2px solid var(--ink);box-shadow:var(--shadow-sm)}
+details.code-block{border:3px solid var(--ink);background:var(--paper);margin-top:12px;box-shadow:var(--shadow-sm)}
+details.code-block summary{cursor:pointer;padding:14px 18px;list-style:none;font:600 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);display:flex;justify-content:space-between}
 details.code-block summary::-webkit-details-marker{display:none}
-details.code-block summary::after{content:"+";font:900 18px/1 "system-ui",sans-serif}
+details.code-block summary::after{content:"+";font:700 18px/1 var(--f-disp);color:var(--ink)}
 details.code-block[open] summary::after{content:"\2212"}
-details.code-block pre{margin:0;padding:16px;border-top:3px solid var(--secondary);font:11px/1.6 "monospace",monospace;background:var(--primary);color:var(--secondary);opacity:.7;overflow-x:auto;white-space:pre-wrap;word-break:break-word;max-height:320px;overflow-y:auto}
+details.code-block pre{margin:0;padding:16px 18px;border-top:2px solid var(--ink);font:500 11px/1.6 var(--f-mono);color:var(--ink);background:transparent;overflow-x:auto;white-space:pre-wrap;word-break:break-word;max-height:320px;overflow-y:auto}
 
-.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;max-width:1400px;margin:0 auto}
+/* Guidelines */
+.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
 @media(max-width:880px){.rules-grid{grid-template-columns:1fr}}
-.rules-col{border:4px solid var(--black,var(--secondary));padding:32px;box-shadow:8px 8px 0 var(--black,var(--secondary))}
-.rules-col.do{background:var(--accent);transform:rotate(-.6deg)}
-.rules-col.dont{background:var(--primary);color:var(--secondary);transform:rotate(.6deg)}
-.rules-col h3{font:400 64px/1 "system-ui",sans-serif;letter-spacing:-.03em;margin:0 0 24px;text-transform:uppercase}
-.rules-col.do h3{color:var(--accent)}
-.rules-col.dont h3{opacity:.4}
-.rules-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
-.rules-col li{display:grid;grid-template-columns:2em 1fr;gap:12px;padding:14px 16px;background:var(--primary);border:3px solid var(--secondary);box-shadow:4px 4px 0 var(--black,var(--secondary));font:500 15px/1.45 "system-ui",sans-serif}
-.rules-col li::before{font:900 22px/1 "system-ui",sans-serif;align-self:center;text-align:center;width:1.6em;height:1.6em;display:flex;align-items:center;justify-content:center;border:2px solid var(--secondary)}
-.rules-col.do li::before{content:"\2713";background:var(--accent)}
-.rules-col.dont li::before{content:"\2717";opacity:.4}
+.rules-col{padding:32px;border:3px solid var(--ink);box-shadow:var(--shadow)}
+.rules-col.do{background:var(--sage);transform:rotate(-.5deg)}
+.rules-col.dont{background:var(--pink);transform:rotate(.5deg)}
+.rules-col h3{font:700 56px/1 var(--f-disp);margin:0 0 20px;letter-spacing:-.04em;color:var(--ink)}
+.rules-col h3 em{font-style:normal;background:var(--paper);padding:0 .08em;border:3px solid var(--ink);display:inline-block;line-height:1}
+.rules-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
+.rules-col li{display:grid;grid-template-columns:2em 1fr;gap:14px;padding:12px 16px;background:var(--paper);border:2px solid var(--ink);box-shadow:var(--shadow-sm);font:500 15px/1.55 var(--f-body);color:var(--ink)}
+.rules-col li::before{font:700 18px/1 var(--f-disp);align-self:center;text-align:center}
+.rules-col.do li::before{content:"+";color:var(--ink)}
+.rules-col.dont li::before{content:"×";color:var(--ink)}
 
-.templates-wrap{background:var(--accent);border-top:4px solid var(--black,var(--secondary));border-bottom:4px solid var(--black,var(--secondary))}
-.templates-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:1400px;margin:0 auto}
+/* Templates */
+.templates-wrap{border-top:3px solid var(--ink);background:color-mix(in srgb,var(--sage) 18%,var(--paper))}
+.templates-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
 @media(max-width:1100px){.templates-grid{grid-template-columns:repeat(2,1fr)}}
 @media(max-width:720px){.templates-grid{grid-template-columns:1fr}}
-.tmpl{background:var(--primary);border:4px solid var(--black,var(--secondary));box-shadow:8px 8px 0 var(--black,var(--secondary));overflow:hidden;border-radius:0;transition:all .2s}
-.tmpl:hover{transform:translate(-3px,-3px);box-shadow:11px 11px 0 var(--black,var(--secondary))}
-.tmpl-thumb{width:100%;aspect-ratio:16/9;overflow:hidden;position:relative;background:var(--secondary);border-bottom:3px solid var(--secondary)}
+.tmpl{background:var(--paper);border:3px solid var(--ink);box-shadow:var(--shadow);overflow:hidden;transition:transform .15s}
+.tmpl:hover{transform:translate(-3px,-3px)}
+.tmpl-thumb{width:100%;aspect-ratio:16/9;overflow:hidden;position:relative;background:var(--paper);border-bottom:2px solid var(--ink)}
 .tmpl-thumb .scale-wrap{width:1920px;height:1080px;transform-origin:top left}
-.tmpl-foot{display:flex;justify-content:space-between;padding:12px 16px;font:600 12px/1 "monospace",monospace;letter-spacing:.08em;text-transform:uppercase}
-.tmpl-foot .idx{background:var(--accent);border:2px solid var(--secondary);padding:2px 8px}
+.tmpl-foot{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;font:600 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
+.tmpl-foot .name{color:var(--ink);font-family:var(--f-disp);font-weight:700;font-size:20px;letter-spacing:-.025em;text-transform:none}
+.tmpl-foot .idx{color:var(--ink);background:var(--pink);padding:4px 10px;border:2px solid var(--ink)}
 
-footer.endcap{background:var(--secondary);color:var(--primary);padding:80px var(--pad-x) 60px;display:grid;grid-template-columns:1fr auto;gap:48px;align-items:end}
-footer.endcap .endmark{font:900 clamp(72px,14vw,220px)/.85 "system-ui",sans-serif;letter-spacing:-.04em;text-transform:uppercase;margin:0}
-footer.endcap .meta{font:500 12px/2 "monospace",monospace;letter-spacing:.1em;text-transform:uppercase;opacity:.6;text-align:right}
-footer.endcap .meta b{opacity:1;color:var(--accent)}
+/* Endcap */
+footer.endcap{padding:96px var(--pad-x) 56px;background:var(--pink);color:var(--ink);border-top:6px solid var(--ink);display:grid;grid-template-columns:1fr auto;gap:48px;align-items:end}
+footer.endcap .endmark{font:700 clamp(60px,14vw,240px)/.85 var(--f-disp);letter-spacing:-.05em;margin:0;color:var(--ink)}
+footer.endcap .endmark em{font-style:normal;background:var(--ink);color:var(--pink);padding:0 .06em;border:4px solid var(--paper);box-shadow:8px 8px 0 var(--paper);display:inline-block;line-height:.85;transform:rotate(-1deg)}
+footer.endcap .meta{font:600 12px/2 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);text-align:right}
+footer.endcap .meta b{color:var(--paper);background:var(--ink);padding:2px 10px}
 </style>
+
+<!-- TEMPLATE STYLES -->
 <style id="template-css">
 __TEMPLATE_CSS__
 </style>
 </head>
 <body>
+
 <canvas id="design-bg"></canvas>
 <div id="bg-veil"></div>
 
 <div class="rail">
-  <div class="brand"><span class="dot"></span>__NAME__</div>
+  <div class="brand"><span class="grid"><span></span><span></span><span></span><span></span></span><b>__NAME__</b></div>
   <nav><a href="#palette">01</a><a href="#type">02</a><a href="#surface">03</a><a href="#motion">04</a><a href="#background">05</a><a href="#guidelines">06</a><a href="#templates">07</a></nav>
+  <div class="meta">v 1.0 · 2026</div>
 </div>
 
-<header class="cover">
-  <h1 class="cover-headline">__NAME_LINE1____NAME_LINE2__.</h1>
+<header class="cover" data-screen-label="00 Cover">
+  <div class="cover-chrome">
+    <div>Design System · No. 030</div>
+    <div class="accent">__ACCENT_LABEL__</div>
+  </div>
+  <h1 class="cover-headline"><em>__NAME__</em>.</h1>
   <div class="cover-foot">
-    <div class="cell"><span class="k">Template</span><span class="v">raw-grid</span></div>
-    <div class="cell"><span class="k">Type</span><span class="v big">system-ui</span></div>
-    <div class="cell"><span class="k">Accent</span><span class="v">__ACCENT_LABEL__</span></div>
-    <div class="cell"><span class="k">Doc</span><span class="v">07 sections · __SLIDE_COUNT__ templates</span></div>
+    <div class="cell"><span class="k">Discipline</span><span class="v plain">Founder · Demo day · Brand</span></div>
+    <div class="cell"><span class="k">Display</span><span class="v">Space Grotesk 700</span></div>
+    <div class="cell"><span class="k">Pull</span><span class="v">Pink · Sage</span></div>
+    <div class="cell"><span class="k">Volume</span><span class="v plain">07 sections · __SLIDE_COUNT__ frames</span></div>
   </div>
 </header>
 
-<section class="manifesto">
+<section class="manifesto" data-screen-label="00 Manifesto">
   <div class="manifesto-grid">
-    <div class="num">&#8212; Manifesto</div>
-    <p>Neo-brutalist deck with thick borders, offset shadows, and a pink/sage/ink palette.</p>
+    <div class="num">+ manifesto</div>
+    <p>borders are <em>structural</em>. tilt is <em>energy</em>. nothing apologises — every block earns its place.</p>
   </div>
 </section>
 
-<section id="palette">
+<section id="palette" data-screen-label="01 Palette">
   <div class="section-head">
-    <div class="num">01 &#8212; Palette</div>
-    <h2>Four Tokens.</h2>
+    <span class="num">01 / palette</span>
+    <h2>Four <em>blocks</em>.</h2>
     <p class="lede">__PALETTE_LEDE__</p>
   </div>
   <div class="palette">
-    <div class="swatch swatch--primary"><div class="role">Primary</div><div><div class="name">__PRIMARY_NAME__</div><div class="hex">__PRIMARY__</div><div class="usage">Canvas.</div></div></div>
-    <div class="swatch swatch--secondary"><div class="role">Secondary</div><div><div class="name">__SECONDARY_NAME__</div><div class="hex">__SECONDARY__</div><div class="usage">Ink.</div></div></div>
-    <div class="swatch swatch--tertiary"><div class="role">Tertiary</div><div><div class="name">__TERTIARY_NAME__</div><div class="hex">__TERTIARY__</div><div class="usage">Muted. Borders.</div></div></div>
-    <div class="swatch swatch--accent"><div class="role">Accent</div><div><div class="name">__ACCENT_NAME__</div><div class="hex">__ACCENT__</div><div class="usage">Signal. Reserved.</div></div></div>
+    <div class="swatch swatch--paper"><div class="role">01 / paper</div><div><div class="name">__PRIMARY_NAME__</div><div class="hex">__PRIMARY__</div><div class="usage">Warm canvas.</div></div></div>
+    <div class="swatch swatch--ink"><div class="role">02 / ink</div><div><div class="name">__SECONDARY_NAME__</div><div class="hex">__SECONDARY__</div><div class="usage">Near-black. Borders, type.</div></div></div>
+    <div class="swatch swatch--sage"><div class="role">03 / sage</div><div><div class="name">__TERTIARY_NAME__</div><div class="hex">__TERTIARY__</div><div class="usage">Cool pull. Calm callouts.</div></div></div>
+    <div class="swatch swatch--pink"><div class="role">04 / pink</div><div><div class="name">__ACCENT_NAME__</div><div class="hex">__ACCENT__</div><div class="usage">Warm pull. Headlines, accents.</div></div></div>
   </div>
 </section>
 
-<section id="type">
+<section id="type" data-screen-label="02 Type">
   <div class="section-head">
-    <div class="num">02 &#8212; Typography</div>
-    <h2>Big. Heavy.</h2>
+    <span class="num">02 / type</span>
+    <h2>Space Grotesk,<br/><em>punched.</em></h2>
+    <p class="lede">Space Grotesk 700 carries every headline at maximum scale. Manrope handles body in 500. JetBrains Mono runs labels and chrome. Tight tracking, hard cuts.</p>
   </div>
   <div class="specimen">
-    <div class="spec-row"><div class="meta"><span>Display</span><b>system-ui</b></div><div class="spec-display">HELLO WORLD.</div></div>
-    <div class="spec-row"><div class="meta"><span>H1</span><b>system-ui</b></div><div class="spec-h1">CHAPTER ONE</div></div>
-    <div class="spec-row"><div class="meta"><span>H2</span><b>system-ui</b></div><div class="spec-h2">Slide headlines.</div></div>
-    <div class="spec-row"><div class="meta"><span>Body</span><b>system-ui</b></div><p class="spec-body">Body copy below 24px is forbidden in video compositions.</p></div>
-    <div class="spec-row"><div class="meta"><span>Label</span><b>monospace</b></div><div class="spec-label">// chrome · labels · metadata</div></div>
+    <div class="spec-row"><div class="meta"><span>Display</span><b>Space Grotesk 700</b><span>11vw · −0.05em</span></div><div class="spec-display">hello <em>world</em>.</div></div>
+    <div class="spec-row"><div class="meta"><span>H1</span><b>Space Grotesk 700</b><span>7vw · pulled</span></div><div class="spec-h1">chapter <em>one</em></div></div>
+    <div class="spec-row"><div class="meta"><span>H2</span><b>Space Grotesk 600</b><span>4.2vw</span></div><div class="spec-h2">slide headlines.</div></div>
+    <div class="spec-row"><div class="meta"><span>Lead</span><b>Manrope 600</b><span>2vw</span></div><div class="spec-lead">The lead carries the brief in one direct, founder-voice sentence.</div></div>
+    <div class="spec-row"><div class="meta"><span>Body</span><b>Manrope 500</b><span>16px · 60ch</span></div><p class="spec-body">Pack my box with five dozen liquor jugs. Body type stays at 500 weight. Below 24px is forbidden in 1080p compositions. The pull blocks do the lifting; body stays quiet.</p></div>
+    <div class="spec-row"><div class="meta"><span>Label</span><b>JetBrains Mono 600</b><span>12px · pink chip</span></div><div><span class="spec-label">// label · pink chip</span></div></div>
   </div>
 </section>
 
-<section id="surface">
+<section id="surface" data-screen-label="03 Surface">
   <div class="section-head">
-    <div class="num">03 &#8212; Surface</div>
-    <h2>Borders. Shadows.</h2>
+    <span class="num">03 / surface</span>
+    <h2>Thick borders,<br/><em>offset shadow.</em></h2>
+    <p class="lede">3px ink border on every card, 6px offset shadow (no blur), and a ±1° tilt. Surfaces never align to the grid — that's the whole point.</p>
   </div>
   <div class="surface-grid">
     <div class="demo-card">
-      <span class="tag">// example</span>
-      <h3>EXAMPLE CARD.</h3>
-      <p>Configured corners, padding, shadow.</p>
+      <span class="tag">+ card · example</span>
+      <h3>example <em>card</em>.</h3>
+      <p>3px ink border. 6px offset shadow. ±1° tilt. The pull block carries the meaning; body stays minimal.</p>
+      <div class="num-stat">+42%</div>
+      <button class="btn">▸ view details</button>
     </div>
     <ul class="tokens">
-      <li><span class="name">Corners</span><span class="val">__CORNER_RADIUS__</span><span class="bar" style="width:8px"></span></li>
-      <li><span class="name">Padding</span><span class="val">__PADDING__</span><span class="bar" style="width:32px"></span></li>
+      <li><span class="name">Corners</span><span class="val">__CORNER_RADIUS__</span><span class="bar" style="width:6px"></span></li>
+      <li><span class="name">Padding</span><span class="val">__PADDING__</span><span class="bar" style="width:40px"></span></li>
       <li><span class="name">Gap</span><span class="val">__GAP__</span><span class="bar" style="width:32px"></span></li>
-      <li><span class="name">Elevation</span><span class="val">__ELEVATION__</span><span class="bar" style="width:18px"></span></li>
+      <li><span class="name">Elevation</span><span class="val">__ELEVATION__</span><span class="bar" style="width:36px"></span></li>
       <li><span class="name">Density</span><span class="val">__DENSITY__</span><span class="bar" style="width:48px"></span></li>
     </ul>
   </div>
 </section>
 
-<section id="motion">
+<section id="motion" data-screen-label="04 Motion">
   <div class="section-head">
-    <div class="num">04 &#8212; Motion</div>
+    <span class="num">04 / motion</span>
     <h2>__EASING_HEADLINE__</h2>
     <p class="lede">__EASING_LEDE__</p>
   </div>
   <div class="two-col">
     <div class="panel">
-      <div class="label-row">// easing</div>
+      <span class="label-row">+ easing</span>
       <h4>__EASING_NAME__</h4>
       <p>__EASING_DESC__</p>
       <pre>__EASING_VALUE__</pre>
     </div>
     <div class="panel">
-      <div class="label-row">// duration</div>
+      <span class="label-row">+ duration</span>
       <h4>__DURATION_DEFAULT__</h4>
       <p>__DURATION_DESC__</p>
       <pre>__DURATION_VALUES__</pre>
@@ -242,9 +312,9 @@ __TEMPLATE_CSS__
   </div>
 </section>
 
-<section id="background">
+<section id="background" data-screen-label="05 Background">
   <div class="section-head">
-    <div class="num">05 &#8212; Background</div>
+    <span class="num">05 / background</span>
     <h2>__BG_HEADLINE__</h2>
     <p class="lede">__BG_LEDE__</p>
   </div>
@@ -254,38 +324,40 @@ __TEMPLATE_CSS__
       <ul class="tokens" style="border-top:none">
         <li><span class="name">Geometry</span><span class="val">__BG_TYPE__</span><span class="bar" style="width:36px"></span></li>
         <li><span class="name">Density</span><span class="val">__BG_DENSITY__</span><span class="bar" style="width:42px"></span></li>
-        <li><span class="name">Speed</span><span class="val">__BG_SPEED__</span><span class="bar" style="width:18px"></span></li>
+        <li><span class="name">Speed</span><span class="val">__BG_SPEED__</span><span class="bar" style="width:18px;opacity:.7"></span></li>
         <li><span class="name">Strength</span><span class="val">__BG_STRENGTH__</span><span class="bar" style="width:52px"></span></li>
         <li><span class="name">Grain</span><span class="val">__BG_GRAIN__</span><span class="bar" style="width:24px"></span></li>
       </ul>
-      <details class="code-block"><summary>// shader config</summary>
+      <details class="code-block"><summary>// shader config (json)</summary>
 <pre>__SHADER_CONFIG__</pre>
       </details>
-      <details class="code-block"><summary>// vertex shader</summary>
+      <details class="code-block"><summary>// vertex shader (glsl)</summary>
 <pre id="vtx-src">__SHADER_VERTEX__</pre>
       </details>
-      <details class="code-block"><summary>// fragment shader</summary>
+      <details class="code-block"><summary>// fragment shader (glsl)</summary>
 <pre id="frg-src">__SHADER_FRAGMENT__</pre>
       </details>
     </div>
   </div>
 </section>
 
-<section id="guidelines">
+<section id="guidelines" data-screen-label="06 Guidelines">
   <div class="section-head">
-    <div class="num">06 &#8212; Guidelines</div>
-    <h2>Do. Don’t.</h2>
+    <span class="num">06 / rules</span>
+    <h2>Yes.<br/><em>No.</em></h2>
+    <p class="lede">A short list. The grid loses its energy the moment any of these slip.</p>
   </div>
   <div class="rules-grid">
-    <div class="rules-col do"><h3>DO.</h3><ul>__DOS__</ul></div>
-    <div class="rules-col dont"><h3>DON'T.</h3><ul>__DONTS__</ul></div>
+    <div class="rules-col do"><h3>Yes <em>.</em></h3><ul>__DOS__</ul></div>
+    <div class="rules-col dont"><h3>No <em>.</em></h3><ul>__DONTS__</ul></div>
   </div>
 </section>
 
-<section id="templates" class="templates-wrap">
+<section id="templates" class="templates-wrap" data-screen-label="07 Templates">
   <div class="section-head">
-    <div class="num">07 &#8212; Templates</div>
-    <h2>__SLIDE_COUNT_WORD__<br/>Frames.</h2>
+    <span class="num">07 / templates</span>
+    <h2>__SLIDE_COUNT_WORD__<br/><em>frames.</em></h2>
+    <p class="lede">The full library at 1920×1080. Each thumbnail is the live slide, scaled.</p>
   </div>
   <div class="templates-grid" id="templates-grid"></div>
 </section>
@@ -294,11 +366,11 @@ __TEMPLATE_CSS__
 __SLIDE_CARDS__
 </template>
 
-<footer class="endcap">
-  <h2 class="endmark">THE END.</h2>
+<footer class="endcap" data-screen-label="08 End">
+  <h2 class="endmark">that's a <em>wrap.</em></h2>
   <div class="meta">
-    <div><b>__NAME__</b> · v1</div>
-    <div>system-ui / monospace</div>
+    <div><b>__NAME__</b> · v 1.0</div>
+    <div>Space Grotesk · Manrope</div>
     <div>__DATE__</div>
   </div>
 </footer>
@@ -315,4 +387,4 @@ __SLIDE_CARDS__
 __SHADER_SCRIPT__
 
 </body>
-</html>
\ No newline at end of file
+</html>