diff --git a/style_dev/doc.php b/style_dev/doc.php
index 6a759a8..b864513 100644
--- a/style_dev/doc.php
+++ b/style_dev/doc.php
@@ -80,7 +80,7 @@
 <style>
     .pub-content {
         <?php
-        $pubvars = json_decode($_POST['vars']);//json_decode(file_get_contents(__DIR__ . "/pub_styles/" . $_GET["pub"] . "/vars.json"), TRUE);
+        $pubvars = json_decode($_POST['vars']);
         foreach ($pubvars as $name => $val) {
             echo "--$name: $val;\n";
         }
@@ -111,8 +111,17 @@
     }
 </style>
 <style media="all">
-    .tile-style-1 {
-        <?php include __DIR__ . "/tile_styles/" . $_GET["tile"] . "/tile.css"; ?>
+    .tile-style-dots {
+        <?php include __DIR__ . "/tile_styles/dots/tile.css"; ?>
+    }
+    .tile-style-double {
+        <?php include __DIR__ . "/tile_styles/double/tile.css"; ?>
+    }
+    .tile-style-line {
+        <?php include __DIR__ . "/tile_styles/line/tile.css"; ?>
+    }
+    .tile-style-shadow {
+        <?php include __DIR__ . "/tile_styles/shadow/tile.css"; ?>
     }
     #tile-29 {
         order: 1;
@@ -163,12 +172,12 @@
     </div>
     <div class="tile-bin">
         <div class="tile" id="tile-29" data-tileid="29" data-page="1" data-styleid="1" data-width="4" data-order="1">
-            <div id="tile-29-content" class="tile-style-1">
+            <div id="tile-29-content" class="tile-style-none">
                 <div class="tile-html"><h1>Test Publication Header 1</h1><h2>Header 2</h2><h3>Header 3<br></h3></div>
             </div>
         </div>
         <div class="tile" id="tile-31" data-tileid="31" data-page="1" data-styleid="1" data-width="2" data-order="1">
-            <div id="tile-31-content" class="tile-style-1">
+            <div id="tile-31-content" class="tile-style-dots">
                 <div class="tile-html"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praeclare hoc 
                         quidem. Quis istum dolorem timet? Bonum integritas corporis: misera 
                         debilitas. Estne, quaeso, inquam, sitienti in bibendo voluptas? Memini 
@@ -176,7 +185,7 @@
             </div>
         </div>
         <div class="tile" id="tile-30" data-tileid="30" data-page="1" data-styleid="1" data-width="2" data-order="2">
-            <div id="tile-30-content" class="tile-style-1">
+            <div id="tile-30-content" class="tile-style-double">
                 <div class="tile-html"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praeclare hoc 
                         quidem. Quis istum dolorem timet? Bonum integritas corporis: misera 
                         debilitas. Estne, quaeso, inquam, sitienti in bibendo voluptas? Memini 
@@ -184,7 +193,7 @@
             </div>
         </div>
         <div class="tile" id="tile-32" data-tileid="32" data-page="1" data-styleid="1" data-width="4" data-order="3">
-            <div id="tile-32-content" class="tile-style-1">
+            <div id="tile-32-content" class="tile-style-line">
                 <div class="tile-html"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. <b>Nunc agendum est subtilius.</b> Aut, Pylades cum sis, dices te esse Orestem, ut moriare pro amico? Causa autem fuit huc veniendi ut quosdam hinc libros promerem. Hoc loco tenere se Triarius non potuit. <i>De illis, cum volemus.</i> Duo Reges: constructio interrete. </p><p>
                         <br></p><pre>Nam cum in Graeco sermone haec ipsa quondam rerum nomina
 novarum * * non videbantur, quae nunc consuetudo diuturna
@@ -203,7 +212,7 @@ trivit;
     </div>
     <div class="tile-bin">
         <div class="tile" id="tile-33" data-tileid="33" data-page="2" data-styleid="1" data-width="3" data-order="1">
-            <div id="tile-33-content" class="tile-style-1">
+            <div id="tile-33-content" class="tile-style-shadow">
                 <div class="tile-html"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ita graviter et severe voluptatem secrevit a bono. Bonum negas esse divitias, praeposìtum esse dicis? Facillimum id quidem est, inquam. Qui potest igitur habitare in beata vita summi mali metus? </p><p>
                         <br></p><ul><li>Nam aliquando posse recte fieri dicunt nulla expectata nec quaesita voluptate.</li><li>Inquit, dasne adolescenti veniam?</li><li>Duo Reges: constructio interrete.</li><li>Idem etiam dolorem saepe perpetiuntur, ne, si id non faciant, incidant in maiorem.</li></ul><p>
                         <br></p><blockquote cite="http://loripsum.net">
diff --git a/style_dev/index.php b/style_dev/index.php
index 4233998..b114758 100644
--- a/style_dev/index.php
+++ b/style_dev/index.php
@@ -24,38 +24,29 @@
     <form action="doc.php" method="POST" target="preview" id="editform">
         <label>CSS rules to apply to each page:</label>
         <textarea name="pub" id="pub" placeholder="Publication CSS rules" class="form-control" rows="6">
-background-position: right bottom;
-background-repeat: no-repeat;</textarea>
-        <label>Extra CSS:</label>
+background-color: var(--background);</textarea>
+        <label>Extra CSS rules for tile content:</label>
         <textarea name="extra" id="extra" placeholder="Extra CSS" class="form-control" rows="8">
 .tile-html h1,h2,h3,h4,h5,h6 {
-    color: var(--text);
-}
-
-.tile-html blockquote {
-    background-color: var(--light-alpha);
-    border-left: 3px solid var(--secondary);
-    padding: 5px 10px;
-    display: inline-block;
-}
-
-.tile-html pre {
-    background-color: var(--light-alpha);
-    border: 1px solid var(--secondary);
-    border-left: 3px solid var(--secondary);
-    padding: 5px 10px;
-    display: inline-block;
+    color: var(--headings);
 }</textarea>
-        <label>CSS variables (as JSON):</label>
-        <textarea name="vars" id="vars" placeholder="JSON CSS variables" class="form-control" rows="4">
+        <label>Color variables:</label>
+        <textarea name="vars" id="vars" placeholder="Color variables" class="form-control" rows="4">
 {
-    "primary": "#973b01",
-    "secondary": "#bc525b",
-    "text": "#2f0701",
-    "light": "#ffe46f",
-    "light-alpha": "rgba(255,228,111,.25)",
-    "medium": "#ff9e01"
+    "primary": "#ff0000",
+    "secondary": "#00ff00",
+    "medium": "#0000ff",
+    "headings": "#ff00ff",
+    "background": "#ffffff",
+    "text": "#000000"
 }</textarea>
+        <label>Metadata (used for generating theme picker UI):</label>
+        <textarea name="meta" id="meta" placeholder="JSON metadata" class="form-control" rows="4">
+{
+    "name": "Theme Name",
+    "colors": ["#ff0000", "#00ff00", "#0000ff"]
+}
+</textarea>
         <input type="text" class="form-control" name="bgurl" placeholder="Background image URL" />
         <input type="submit" class="btn btn-block btn-primary" value="Reload Preview" />
     </form>