@origingame/create-game 0.2.0 → 0.3.0

package/archetypes/rhythm/assets/{skins/lanebeat/skin.ogt → styles/lanebeat/style.ogt}

@@ -1,52 +1,52 @@
-type skin
+type style
 version 1
 ---
-# Three-Lane Beat's skin: the engine's sci-fi style pack (templates/ui-kit/tools/make-skins.py,
+# Three-Lane Beat's skin: the engine's sci-fi style pack (templates/ui-kit/tools/make-styles.py,
 # CC0 art, OFL fonts; LICENSES.md) with this game's palette and its Chinese fallback font, by hand.
 name "lanebeat"
-base dark
-atlas "skins/lanebeat/atlas.png" 384 256
+scheme dark
+atlas "styles/lanebeat/atlas.png" 384 256
 scale 1
 palette {
-  bg "#03080f"
-  bgSubtle "#071220"
-  surface "#0f2a3d"
-  surfaceRaised "#0f2a3d"
-  surfaceHover "#16384f"
-  materialThick "#0f2a3d"
-  materialRegular "#0f2a3de6"
-  materialThin "#0f2a3dcc"
-  fg "#e2f7ff"
-  fgMuted "#a6cde0"
-  fgSubtle "#8fb3c6"
-  fgInverse "#03080f"
-  fill "#3f8fb3"
-  fillStrong "#5aaed4"
-  border "#2c6a88"
-  borderStrong "#6fd3f5"
-  accent "#38e1ff"
-  accentHover "#30d4f0"
-  accentActive "#16c4e6"
-  accentFg "#e2f7ff"
-  accentInk "#7fecff"
-  accentSoft "#38e1ff2a"
+  backdrop "#03080f"
+  well "#071220"
+  panel "#0f2a3d"
+  panelHover "#16384f"
+  panelRaised "#0f2a3d"
+  line "#2c6a88"
+  lineStrong "#6fd3f5"
+  ink "#e2f7ff"
+  inkMuted "#a6cde0"
+  inkFaint "#8fb3c6"
+  inkInverse "#03080f"
+  control "#3f8fb3"
+  controlStrong "#5aaed4"
+  primary "#38e1ff"
+  primaryHover "#30d4f0"
+  primaryActive "#16c4e6"
+  onPrimary "#e2f7ff"
+  primarySoft "#38e1ff2a"
+  highlight "#7fecff"
   focus "#ffd23f"
-  thumb "#2f7194"
+  knob "#2f7194"
+  hud "#0f2a3d"
   scrim "#010409cc"
+  shadow "#00000099"
+  sheen "#ffffff52"
   success "#3dffa0"
   warn "#ffc53d"
   danger "#ff4d6a"
   info "#38e1ff"
-  shadow "#00000099"
+  health "#3dffa0"
+  mana "#0a84ff"
+  xp "#bf5af2"
+  gold "#38e1ff"
 }
 radius {
+  small 2
   control 2
-  field 2
-  block 2
-  card 2
+  bar 2
   panel 2
-  sheet 2
-  button 2
 }
 ramp {
   body 16 22
@@ -67,12 +67,12 @@ durations {
   slow 360
 }
 fonts {
-  body "skins/lanebeat/ChakraPetch-Medium.ttf"
-  display "skins/lanebeat/Orbitron-Bold.ttf"
-  numeric "skins/lanebeat/JetBrainsMono-Regular.ttf"
+  body "styles/lanebeat/ChakraPetch-Medium.ttf"
+  display "styles/lanebeat/Orbitron-Bold.ttf"
+  numeric "styles/lanebeat/JetBrainsMono-Regular.ttf"
   fallback "fonts/NotoSansSC-subset.ttf"
 }
-icons "skins/lanebeat/icons.png" 8 4 {
+icons "styles/lanebeat/icons.png" 8 4 {
   names "heart" "star" "coin" "lock" "pause" "gear" "sword" "shield" "potion" "gem" "key" "map" "bolt" "clock" "trophy" "home" "plus" "close" "check" "play" "back" "bag" "bomb" "crown" "flag" "apple" "leaf" "fire" "drop" "skull" "music" "person"
 }
 slice panel 4 4 96 96 18 tint
@@ -84,20 +84,20 @@ slice buttonDisabled 328 4 48 48 12 tint
 slice field 4 104 48 48 8 tint
 slice slot 56 104 48 48 10 tint
 slice tooltip 108 104 32 32 8 tint
-slice capsule 144 104 32 32 10 tint
+slice hud 144 104 32 32 10 tint
 slice track 180 104 32 16 5 tint
 slice fill 216 104 32 16 2 tint
 soft 252 104 64 64 24
-corner 320 104 32 32 18 18 accent 4
+corner 320 104 32 32 18 18 primary 4
 corners panel card slot
-divider 4 172 128 24 128 24 accent
-flourish 136 172 64 24 32 14 accent 0
+divider 4 172 128 24 128 24 primary
+flourish 136 172 64 24 32 14 primary 0
 tile 204 172 64 64 64 64 0.08 3 panel
 shadow panel 0 0 18 0 "#000000aa"
-glow button 5 accent 0.22
-glow panel 10 accent 0.12
-glow capsule 4 accent 0.18
-textGlow display 1.5 accent 0.55
+glow button 5 primary 0.22
+glow panel 10 primary 0.12
+glow hud 4 primary 0.18
+textGlow display 1.5 primary 0.55
 press 0.98 0.98 0
 hover 0 1.02
 motion {

package/archetypes/rhythm/package.json

@@ -13,6 +13,6 @@
     "test": "og test ."
   },
   "dependencies": {
-    "@origingame/engine": "0.2.0"
+    "@origingame/engine": "0.3.0"
   }
 }

package/archetypes/rhythm/project.ogt

@@ -3,7 +3,7 @@ version 1
 ---
 name "Three-Lane Beat"
 id "rhythm"
-engine "0.2.0"
+engine "0.3.0"
 entry "src/main.ts"
 profile "2d"
 tick 60

package/archetypes/rhythm/src/main.ts

@@ -32,9 +32,9 @@ function must<T>(r: { ok: true; value?: T } | { ok: false; reason: string }): T
 
 function start(world: World): void {
   for (const l of LANGUAGES) must(og.i18n.load(world, `strings/${l.code}.ogt`));
-  const skin = must(og.load.skin(world, "skins/lanebeat/skin.ogt"));
+  const skin = must(og.load.style(world, "styles/lanebeat/style.ogt"));
   const sound = (path: string) => must(og.load.sound(world, path));
-  must(og.ui.configure(world, { skin, sounds: { press: sound("audio/ui-press.ogt"), open: sound("audio/ui-open.ogt"), close: sound("audio/ui-close.ogt"), error: sound("audio/ui-error.ogt"), success: sound("audio/ui-success.ogt") } }));
+  must(og.ui.configure(world, { style: skin, sounds: { press: sound("audio/ui-press.ogt"), open: sound("audio/ui-open.ogt"), close: sound("audio/ui-close.ogt"), error: sound("audio/ui-error.ogt"), success: sound("audio/ui-success.ogt") } }));
 
   const settings = must(world.resource(og.RenderSettings));
   settings.environmentIntensity = 0;

package/archetypes/rhythm/src/ui.ts

@@ -1,4 +1,4 @@
-// Three-Lane Beat's screens on og.ui and the skin in assets/skins/lanebeat
+// Three-Lane Beat's screens on og.ui and the skin in assets/styles/lanebeat
 // (the engine's sci-fi pack): the title, the HUD (the score and the groove
 // top left, Pause top right, the combo and its multiplier beside the
 // highway), the pause menu, the settings with the offset, the calibration
@@ -204,7 +204,7 @@ export function grade(acc: number): string {
 }
 
 function capsule(id: string, build: () => void): void {
-  og.ui.row(id, { gap: S.sm, cross: "center", padding: { left: S.sm, top: S.xs, right: S.md, bottom: S.xs }, frame: "capsule", background: { token: "surface" } }, build);
+  og.ui.row(id, { gap: S.sm, cross: "center", padding: { left: S.sm, top: S.xs, right: S.md, bottom: S.xs }, frame: "hud", background: { token: "panel" } }, build);
 }
 
 function hud(world: World, g: GameV): void {
@@ -215,11 +215,11 @@ function hud(world: World, g: GameV): void {
   og.ui.setNavigation(g.paused || g.settingsOpen);
   og.ui.anchor("Status", { anchor: "topLeft", direction: "column", gap: S.sm }, () => {
     capsule("Score", () => {
-      og.ui.label("Label", say(world, "hud.score"), { step: "caption", color: { token: "fgMuted" }, nowrap: true });
+      og.ui.label("Label", say(world, "hud.score"), { step: "caption", color: { token: "inkMuted" }, nowrap: true });
       og.ui.counter("Value", g.score, { step: "xl", font: "display", durationMs: 300, width: px(phone ? 104 : 130) });
     });
     capsule("Groove", () => {
-      og.ui.label("Label", say(world, "hud.groove"), { step: "caption", color: { token: "fgMuted" }, nowrap: true });
+      og.ui.label("Label", say(world, "hud.groove"), { step: "caption", color: { token: "inkMuted" }, nowrap: true });
       og.ui.meter("Bar", g.groove, 1, { kind: "health", width: px(phone ? 90 : 130) });
     });
   });
@@ -233,8 +233,8 @@ function hud(world: World, g: GameV): void {
   og.ui.anchor("Combo", { anchor: phone ? "top" : "right", offsetY: phone ? 64 : 40, offsetX: phone ? 0 : -48, direction: "column", cross: "center", gap: S.xxs }, () => {
     og.ui.counter("Count", g.combo, { step: "displaySm", font: "display", durationMs: 120, align: "center", width: px(96) });
     og.ui.row("Head", { gap: S.xs, cross: "center" }, () => {
-      og.ui.label("Label", say(world, "hud.combo"), { step: "caption", color: { token: "fgMuted" }, nowrap: true });
-      og.ui.label("Multiplier", say(world, "hud.multiplier", { n: multiplier }), { step: "caption", color: { token: "accent" }, nowrap: true });
+      og.ui.label("Label", say(world, "hud.combo"), { step: "caption", color: { token: "inkMuted" }, nowrap: true });
+      og.ui.label("Multiplier", say(world, "hud.multiplier", { n: multiplier }), { step: "caption", color: { token: "primary" }, nowrap: true });
     });
     og.ui.meter("Next", multiplier >= 4 ? 1 : (g.combo % t.comboStep) / t.comboStep, 1, { width: px(96) });
   });
@@ -258,7 +258,7 @@ function settings(world: World, g: GameV, p: PrefsV): void {
     p.music = slider("Music", "settings.music", p.music);
     p.effects = slider("Effects", "settings.effects", p.effects);
     p.offsetMs = slider("Offset", "settings.offset", p.offsetMs, -200, 200, 5, (v) => say(world, "settings.ms", { n: Math.round(v) }));
-    og.ui.label("LanguageLabel", say(world, "settings.language"), { color: { token: "fgMuted" } });
+    og.ui.label("LanguageLabel", say(world, "settings.language"), { color: { token: "inkMuted" } });
     const r = og.ui.radio("Language", LANGUAGES.map((l) => say(world, l.key)), p.language, { horizontal: true });
     if (r.selected !== p.language) setLanguage(world, p, r.selected);
     p.reducedMotion = og.ui.toggle("Motion", p.reducedMotion, say(world, "settings.motion")).on;
@@ -284,7 +284,7 @@ function calibration(world: World, g: GameV, p: PrefsV): void {
     og.ui.label("Body", say(world, "cal.body"), { width: grow });
     og.ui.row("Taps", { width: grow, gap: S.md, cross: "center" }, () => {
       og.ui.label("Count", say(world, "cal.taps", { n: g.calTaps }), { nowrap: true, width: grow });
-      og.ui.label("Offset", say(world, "cal.offset", { n: Math.round(measured) }), { font: "mono", nowrap: true, color: { token: "accent" } });
+      og.ui.label("Offset", say(world, "cal.offset", { n: Math.round(measured) }), { font: "mono", nowrap: true, color: { token: "primary" } });
     });
     og.ui.meter("Progress", g.calTaps, 8, { width: grow });
     og.ui.row("Actions", { width: grow, gap: S.sm, align: "end" }, () => {
@@ -312,8 +312,8 @@ function results(world: World, g: GameV): "again" | "title" | null {
   const acc = accuracy(g);
   og.ui.modal("Results", true, { title: say(world, g.cleared ? "results.cleared" : "results.failed"), locked: true, width: px(Math.min(420, og.ui.frameViewport().width - 32)) }, () => {
     og.ui.row("Mark", { width: grow, align: "center", gap: S.md, cross: "center" }, () => {
-      og.ui.transition("Grade", true, { kind: "pop" }, () => og.ui.label("Letter", g.cleared ? grade(acc) : "–", { step: "displayMd", font: "display", color: { token: g.cleared ? "accent" : "fgMuted" } }));
-      if (g.newBest) og.ui.label("NewBest", say(world, "results.newBest"), { color: { token: "accent" }, nowrap: true });
+      og.ui.transition("Grade", true, { kind: "pop" }, () => og.ui.label("Letter", g.cleared ? grade(acc) : "–", { step: "displayMd", font: "display", color: { token: g.cleared ? "primary" : "inkMuted" } }));
+      if (g.newBest) og.ui.label("NewBest", say(world, "results.newBest"), { color: { token: "primary" }, nowrap: true });
     });
     og.ui.column("Stats", { width: grow, gap: 0 }, () => {
       og.ui.keyValue("Score", say(world, "results.score"), `${g.score}`, true);
@@ -324,7 +324,7 @@ function results(world: World, g: GameV): "again" | "title" | null {
       og.ui.keyValue("Good", say(world, "results.good"), `${g.good}`, true);
       og.ui.keyValue("Miss", say(world, "results.miss"), `${g.miss}`, true);
     });
-    og.ui.label("Best", say(world, "results.best", { n: g.best }), { color: { token: "fgMuted" }, align: "center", width: grow });
+    og.ui.label("Best", say(world, "results.best", { n: g.best }), { color: { token: "inkMuted" }, align: "center", width: grow });
     og.ui.row("Actions", { width: grow, gap: S.sm }, () => {
       if (og.ui.button("Again", say(world, "results.again"), { variant: "primary", width: grow }).clicked) chose = "again";
       if (og.ui.button("Title", say(world, "results.title"), { width: grow }).clicked) chose = "title";

package/archetypes/roguelike/LICENSES.md

@@ -10,5 +10,5 @@
 | `assets/audio/*.ogt` | CC0 1.0 | `og sfx` presets (click, select, back, error, levelup, and a footstep) that `og cook` synthesises, written by the same script |
 | `assets/strings/*.ogt` | CC0 1.0 | self-made: the English and Chinese string tables |
 | `assets/fonts/NotoSansSC-subset.ttf` | SIL Open Font License 1.1 (`assets/fonts/OFL.txt`) | Noto Sans SC Regular, subset to Latin-1 and the characters of `assets/strings/zh-CN.ogt` by the same script from the project template's `assets/fonts/NotoSansSC-Regular-subset.ttf` |
-| `assets/skins/lampdive/*` | CC0 1.0 art, SIL OFL 1.1 fonts | the engine's pixel style pack (`templates/ui-kit/assets/skins/pixel`, `assets/skins/lampdive/LICENSES.md`) with this game's palette |
+| `assets/styles/lampdive/*` | CC0 1.0 art, SIL OFL 1.1 fonts | the engine's pixel style pack (`templates/styles/pixel`, `assets/styles/lampdive/LICENSES.md`) with this game's palette |
 | `references/*/*.png` | CC0 1.0 | frames of this game recorded by `tests/frames.og.ts` |

package/archetypes/roguelike/README.md

@@ -62,7 +62,7 @@ og build . --publish         # dist/: the play page as it ships
   glows red and shows "!" the turn before a charged strike (twice the hit
   stop and trauma); its fall and the lamp going out are heavier still.
 - **Screens on og.ui with a skin** (og-ui §2–§6, og-taste §1–§7): the
-  engine's pixel pack recoloured as `assets/skins/lampdive` (the tomb's
+  engine's pixel pack recoloured as `assets/styles/lampdive` (the tomb's
   violet panels, the lamp's amber as the one accent); the title over the
   lamp-lit first room, the HUD as capsules in the corners (health meter,
   strike, armour, gold, the floor, Pause), the draught button (it shakes
@@ -188,7 +188,7 @@ next tick).
    and a mind.
 3. **The finds**: `LootKind`, the `finds` lists in `planFloor`, a `take`
    case.
-4. **The look**: `assets/skins/lampdive/skin.ogt`'s palette and the art in
+4. **The look**: `assets/styles/lampdive/style.ogt`'s palette and the art in
    `tools/make-assets.py`, then `python3 tools/make-assets.py && og cook .`.
 5. **Words**: `assets/strings/*.ogt`; a new Chinese string needs the
    script run again to subset the font.
@@ -238,7 +238,7 @@ in the engine repository).
 give the same bytes): the tileset, the map, the sprite sheet and the glow,
 the sounds and the music, the `og sfx` preset files of the UI's sounds and
 the footstep, and the font subset. `LICENSES.md` lists them; the skin's
-are in `assets/skins/lampdive/LICENSES.md`.
+are in `assets/styles/lampdive/LICENSES.md`.
 
 ## Known limits (engine gaps, not design)
 

package/archetypes/roguelike/assets/{skins → styles}/lampdive/LICENSES.md

@@ -1,14 +1,14 @@
 # Lamp Dive's skin (the engine's pixel style pack, recoloured): licences
 
 The palette, the body text's 1 px dark shadow and the fallback font in
-`skin.ogt` are this game's edits by hand; the rest is the pack as
-`templates/ui-kit/assets/skins/pixel` ships it.
+`style.ogt` are this game's edits by hand; the rest is the pack as
+`templates/styles/pixel` ships it.
 
 | File | Licence | Origin |
 |---|---|---|
-| `atlas.png` | CC0 1.0 | self-made by the Origin Engine authors: drawn by `templates/ui-kit/tools/make-skins.py` (deterministic) |
+| `atlas.png` | CC0 1.0 | self-made by the Origin Engine authors: drawn by `templates/ui-kit/tools/make-styles.py` (deterministic) |
 | `icons.png` | CC0 1.0 | self-made: the kit's 32 icons (`tools/make-assets.py`) restyled by the same script |
-| `skin.ogt`, `*.ogt` | CC0 1.0 | written by the same script |
+| `style.ogt`, `*.ogt` | CC0 1.0 | written by the same script |
 | `DotGothic16-Regular.ttf` | SIL Open Font License 1.1 (`OFL.txt`) | DotGothic16 (github.com/fontworks-fonts/DotGothic16); subset to Latin-1 with fontTools. Copyright 2020 The DotGothic16 Project Authors (https://github.com/fontworks-fonts/DotGothic16/) |
 
 Characters these fonts lack (Chinese, Japanese, Korean) are drawn with the

package/archetypes/roguelike/assets/{skins/lampdive/skin.ogt → styles/lampdive/style.ogt}

@@ -1,52 +1,52 @@
-type skin
+type style
 version 1
 ---
-# Lamp Dive's skin: the engine's pixel style pack (templates/ui-kit/tools/make-skins.py; CC0 art, OFL
+# Lamp Dive's skin: the engine's pixel style pack (templates/ui-kit/tools/make-styles.py; CC0 art, OFL
 # fonts; LICENSES.md) in tomb colours: plum stone panels, the lamp's amber as the one accent.
 name "lampdive"
-base dark
-atlas "skins/lampdive/atlas.png" 384 256
+scheme dark
+atlas "styles/lampdive/atlas.png" 384 256
 scale 1
 palette {
-  bg "#100c14"
-  bgSubtle "#17121d"
-  surface "#2a2131"
-  surfaceRaised "#2a2131"
-  surfaceHover "#382c41"
-  materialThick "#211a28f2"
-  materialRegular "#211a28e6"
-  materialThin "#211a28cc"
-  fg "#f4f1de"
-  fgMuted "#c9c2a8"
-  fgSubtle "#b8b29a"
-  fgInverse "#14111f"
-  fill "#4c3d58"
-  fillStrong "#5e4b6b"
-  border "#5a4866"
-  borderStrong "#a990b8"
-  accent "#ffb347"
-  accentHover "#ffc56e"
-  accentActive "#e69a2e"
-  accentFg "#14111f"
-  accentInk "#ffc56e"
-  accentSoft "#ffb34724"
+  backdrop "#100c14"
+  well "#17121d"
+  panel "#2a2131"
+  panelHover "#382c41"
+  panelRaised "#2a2131"
+  line "#5a4866"
+  lineStrong "#a990b8"
+  ink "#f4f1de"
+  inkMuted "#c9c2a8"
+  inkFaint "#b8b29a"
+  inkInverse "#14111f"
+  control "#4c3d58"
+  controlStrong "#5e4b6b"
+  primary "#ffb347"
+  primaryHover "#ffc56e"
+  primaryActive "#e69a2e"
+  onPrimary "#14111f"
+  primarySoft "#ffb34724"
+  highlight "#ffc56e"
   focus "#ffb347"
-  thumb "#5a4866"
+  knob "#5a4866"
+  hud "#211a28f2"
   scrim "#08060bb8"
+  shadow "#00000099"
+  sheen "#ffffff52"
   success "#6fad74"
   warn "#ffa53d"
   danger "#fa7771"
   info "#5dc2ff"
-  shadow "#00000099"
+  health "#6fad74"
+  mana "#0a84ff"
+  xp "#bf5af2"
+  gold "#ffb347"
 }
 radius {
+  small 0
   control 0
-  field 0
-  block 0
-  card 0
+  bar 0
   panel 0
-  sheet 0
-  button 0
 }
 ramp {
   xs 12 16
@@ -71,12 +71,12 @@ durations {
   slow 320
 }
 fonts {
-  body "skins/lampdive/DotGothic16-Regular.ttf"
-  display "skins/lampdive/DotGothic16-Regular.ttf"
-  numeric "skins/lampdive/DotGothic16-Regular.ttf"
+  body "styles/lampdive/DotGothic16-Regular.ttf"
+  display "styles/lampdive/DotGothic16-Regular.ttf"
+  numeric "styles/lampdive/DotGothic16-Regular.ttf"
   fallback "fonts/NotoSansSC-subset.ttf"
 }
-icons "skins/lampdive/icons.png" 8 4 {
+icons "styles/lampdive/icons.png" 8 4 {
   names "heart" "star" "coin" "lock" "pause" "gear" "sword" "shield" "potion" "gem" "key" "map" "bolt" "clock" "trophy" "home" "plus" "close" "check" "play" "back" "bag" "bomb" "crown" "flag" "apple" "leaf" "fire" "drop" "skull" "music" "person"
 }
 slice panel 4 4 96 96 8 tint
@@ -88,17 +88,17 @@ slice buttonDisabled 328 4 48 48 6 tint
 slice field 4 104 48 48 4 tint
 slice slot 56 104 48 48 4 tint
 slice tooltip 108 104 32 32 4 tint
-slice capsule 144 104 32 32 4 tint
+slice hud 144 104 32 32 4 tint
 slice track 180 104 32 16 4 tint
 slice fill 216 104 32 16 4 tint
 soft 252 104 64 64 24
-divider 4 172 128 24 128 24 border
-flourish 136 172 64 24 32 12 accent 0
+divider 4 172 128 24 128 24 line
+flourish 136 172 64 24 32 12 primary 0
 tile 204 172 64 64 16 16 0.06 6 panel
 shadow panel 6 6 0 0 "#000000b0"
 shadow card 4 4 0 0 "#00000080"
 shadow button 0 4 0 0 "#000000a0"
-shadow capsule 3 3 0 0 "#00000080"
+shadow hud 3 3 0 0 "#00000080"
 shadow tooltip 3 3 0 0 "#00000080"
 textShadow display 3 3 0 "#000000c0"
 textShadow body 1 0 0 "#14111f"

package/archetypes/roguelike/package.json

@@ -13,6 +13,6 @@
     "test": "og test ."
   },
   "dependencies": {
-    "@origingame/engine": "0.2.0"
+    "@origingame/engine": "0.3.0"
   }
 }

package/archetypes/roguelike/project.ogt

@@ -3,7 +3,7 @@ version 1
 ---
 name "Lamp Dive"
 id "roguelike"
-engine "0.2.0"
+engine "0.3.0"
 entry "src/main.ts"
 profile "2d"
 tick 60

package/archetypes/roguelike/src/main.ts

@@ -37,9 +37,9 @@ function must<T>(r: { ok: true; value?: T } | { ok: false; reason: string }): T
 
 function start(world: World): void {
   for (const l of LANGUAGES) must(og.i18n.load(world, `strings/${l.code}.ogt`));
-  const skin = must(og.load.skin(world, "skins/lampdive/skin.ogt"));
+  const skin = must(og.load.style(world, "styles/lampdive/style.ogt"));
   const sound = (path: string) => must(og.load.sound(world, path));
-  must(og.ui.configure(world, { skin, sounds: { press: sound("audio/ui-press.ogt"), open: sound("audio/ui-open.ogt"), close: sound("audio/ui-close.ogt"), error: sound("audio/ui-error.ogt"), success: sound("audio/ui-success.ogt") } }));
+  must(og.ui.configure(world, { style: skin, sounds: { press: sound("audio/ui-press.ogt"), open: sound("audio/ui-open.ogt"), close: sound("audio/ui-close.ogt"), error: sound("audio/ui-error.ogt"), success: sound("audio/ui-success.ogt") } }));
 
   const settings = must(world.resource(og.RenderSettings));
   settings.environmentIntensity = 0;

package/archetypes/roguelike/src/ui.ts

@@ -1,4 +1,4 @@
-// Lamp Dive's screens on og.ui and the skin in assets/skins/lampdive (the
+// Lamp Dive's screens on og.ui and the skin in assets/styles/lampdive (the
 // engine's pixel pack in tomb colours): the title, the HUD (health, strike,
 // armour and gold in the top-left corner, the floor and pause in the
 // top-right, the draught and, on a touch screen, Wait and a d-pad along the
@@ -167,7 +167,7 @@ function platform(world: World, g: GameV, p: PrefsV): void {
 }
 
 function capsule(id: string, build: () => void): void {
-  og.ui.row(id, { gap: S.xs, cross: "center", padding: { left: S.sm, top: S.xs, right: S.md, bottom: S.xs }, frame: "capsule", background: { token: "surface" } }, build);
+  og.ui.row(id, { gap: S.xs, cross: "center", padding: { left: S.sm, top: S.xs, right: S.md, bottom: S.xs }, frame: "hud", background: { token: "panel" } }, build);
 }
 
 function hud(world: World, g: GameV): void {
@@ -176,7 +176,7 @@ function hud(world: World, g: GameV): void {
   og.ui.setNavigation(false);
   og.ui.anchor("Status", { anchor: "topLeft", direction: "column", gap: S.sm }, () => {
     capsule("Health", () => {
-      og.ui.icon("Heart", "heart", { size: 22, tint: { token: g.hp * 3 <= g.hpMax ? "danger" : "fg" } });
+      og.ui.icon("Heart", "heart", { size: 22, tint: { token: g.hp * 3 <= g.hpMax ? "danger" : "ink" } });
       og.ui.meter("Bar", g.hp, g.hpMax, { kind: "health", label: `${g.hp}/${g.hpMax}`, width: px(touch ? 110 : 150) });
     });
     capsule("Stats", () => {
@@ -184,7 +184,7 @@ function hud(world: World, g: GameV): void {
       og.ui.counter("Attack", g.attack, { font: "mono", width: px(22) });
       og.ui.icon("Shield", "shield", { size: 20 });
       og.ui.counter("Armour", g.armour, { font: "mono", width: px(22) });
-      og.ui.icon("Coin", "coin", { size: 20, tint: { token: "accent" } });
+      og.ui.icon("Coin", "coin", { size: 20, tint: { token: "gold" } });
       og.ui.counter("Gold", g.gold, { font: "mono", width: px(40) });
     });
   });
@@ -229,7 +229,7 @@ function settings(world: World, g: GameV, p: PrefsV): void {
     p.master = slider("Master", "settings.master", p.master);
     p.music = slider("Music", "settings.music", p.music);
     p.effects = slider("Effects", "settings.effects", p.effects);
-    og.ui.label("LanguageLabel", say(world, "settings.language"), { color: { token: "fgMuted" } });
+    og.ui.label("LanguageLabel", say(world, "settings.language"), { color: { token: "inkMuted" } });
     const r = og.ui.radio("Language", LANGUAGES.map((l) => say(world, l.key)), p.language, { horizontal: true });
     if (r.selected !== p.language) setLanguage(world, p, r.selected);
     p.reducedMotion = og.ui.toggle("Motion", p.reducedMotion, say(world, "settings.motion")).on;
@@ -250,7 +250,7 @@ function summary(world: World, g: GameV): "again" | "menu" | null {
   let chose: "again" | "menu" | null = null;
   og.ui.modal("Summary", g.phase === Phase.Over, { title: g.won ? say(world, "over.won") : say(world, "over.lost", { n: g.floor }), locked: true, width: px(Math.min(400, og.ui.frameViewport().width - 32)) }, () => {
     og.ui.row("Mark", { width: grow, align: "center" }, () => {
-      og.ui.transition("Icon", true, { kind: "pop" }, () => og.ui.icon("Glyph", g.won ? "crown" : "skull", { size: 48, tint: { token: g.won ? "accent" : "fgMuted" } }));
+      og.ui.transition("Icon", true, { kind: "pop" }, () => og.ui.icon("Glyph", g.won ? "crown" : "skull", { size: 48, tint: { token: g.won ? "primary" : "inkMuted" } }));
       if (g.won && g.overTicks === OVER_DELAY + 20) og.ui.burst({ count: 12 });
     });
     og.ui.column("Stats", { width: grow, gap: 0 }, () => {
@@ -261,7 +261,7 @@ function summary(world: World, g: GameV): "again" | "menu" | null {
       og.ui.keyValue("Finds", say(world, "over.finds"), `${g.finds}`, true);
       if (!g.won) og.ui.keyValue("By", say(world, "over.by"), say(world, g.killedBy >= 0 ? `foe.${FOES[g.killedBy]}` : "foe.none"), false);
     });
-    og.ui.label("Record", say(world, "over.record", { dives: g.dives, relics: g.relics }), { color: { token: "fgMuted" }, align: "center", width: grow });
+    og.ui.label("Record", say(world, "over.record", { dives: g.dives, relics: g.relics }), { color: { token: "inkMuted" }, align: "center", width: grow });
     og.ui.row("Actions", { width: grow, gap: S.sm }, () => {
       if (og.ui.button("Again", say(world, "over.again"), { variant: "primary", width: grow }).clicked) chose = "again";
       if (og.ui.button("Menu", say(world, "over.menu"), { width: grow }).clicked) chose = "menu";

package/archetypes/runner/package.json

@@ -13,6 +13,6 @@
     "test": "og test ."
   },
   "dependencies": {
-    "@origingame/engine": "0.2.0"
+    "@origingame/engine": "0.3.0"
   }
 }

package/archetypes/runner/project.ogt

@@ -3,7 +3,7 @@ version 1
 ---
 name "Runner"
 id "runner"
-engine "0.2.0"
+engine "0.3.0"
 entry "src/main.ts"
 profile "2d"
 tick 60

package/archetypes/third-person/LICENSES.md

@@ -19,5 +19,5 @@ Origin Engine authors or one of the engine's CC0 assets.
 | `assets/audio/*.ogt` | CC0 1.0 | `og sfx` presets (click, select, back, error, levelup and a footstep) that `og cook` synthesises, written by the same script |
 | `assets/strings/*.ogt` | CC0 1.0 | self-made: the English and Chinese string tables |
 | `assets/fonts/NotoSansSC-subset.ttf` | SIL Open Font License 1.1 (`assets/fonts/OFL.txt`) | Noto Sans SC Regular, subset to Latin-1, CJK punctuation and the characters of `assets/strings/zh-CN.ogt` by the same script from the project template's `assets/fonts/NotoSansSC-Regular-subset.ttf` |
-| `assets/skins/ember/*` | CC0 1.0 art, SIL OFL 1.1 fonts | the engine's fantasy style pack (`templates/ui-kit`), `assets/skins/ember/LICENSES.md` |
+| `assets/styles/ember/*` | CC0 1.0 art, SIL OFL 1.1 fonts | the engine's fantasy style pack (`templates/ui-kit`), `assets/styles/ember/LICENSES.md` |
 | `references/*/*.png` | CC0 1.0 | frames of this game recorded by `tests/frames.og.ts` |

package/archetypes/third-person/README.md

@@ -60,7 +60,7 @@ og build . --publish         # dist/: the play page as it ships (behind "tap to
   vignette, the teal-orange LUT and film grain, the sky, height fog and
   `og.DayNight` running from late afternoon to night as the run's clock.
 - **Screens on og.ui with tokens and MSDF text** (og-ui §2–§6, og-taste):
-  the engine's fantasy pack as `assets/skins/ember` (Cinzel and Newsreader,
+  the engine's fantasy pack as `assets/styles/ember` (Cinzel and Newsreader,
   Noto Sans SC as the fallback, every font an MSDF atlas at cook time); the
   title over an orbit of the vale, the HUD (hearts and beacons top-left,
   the dusk clock and Pause top-right, the kindling prompt and its progress
@@ -180,7 +180,7 @@ stages.
 2. **The pressure**: `duskSeconds`, the sentinels' speeds and sight, their
    minds in `assets/ai/`, `HEARTS` in `src/components.ts`.
 3. **The look**: the post stack, fog and sky in `buildVale`, the water's
-   colours, the skin's palette in `assets/skins/ember/skin.ogt`.
+   colours, the skin's palette in `assets/styles/ember/style.ogt`.
 4. **The characters**: another CC0 humanoid in `assets/models/` with the
    clip library retargeted onto it (`src/anim.ts`), the graphs' thresholds.
 5. **Words**: `assets/strings/*.ogt`; a new Chinese string needs the script
@@ -231,7 +231,7 @@ heightmap and control map, the sounds and music, the `og sfx` presets, the
 sentinels' minds and the font subset byte for byte; the characters, the
 clip library, the textures and the beacon's effects are the engine's own
 CC0 assets. `LICENSES.md` lists every file; the skin's are in
-`assets/skins/ember/LICENSES.md`.
+`assets/styles/ember/LICENSES.md`.
 
 ## Known limits (engine gaps, not design)
 

package/archetypes/third-person/assets/{skins → styles}/ember/LICENSES.md

@@ -2,9 +2,9 @@
 
 | File | Licence | Origin |
 |---|---|---|
-| `atlas.png` | CC0 1.0 | self-made by the Origin Engine authors: drawn by `templates/ui-kit/tools/make-skins.py` (deterministic) |
+| `atlas.png` | CC0 1.0 | self-made by the Origin Engine authors: drawn by `templates/ui-kit/tools/make-styles.py` (deterministic) |
 | `icons.png` | CC0 1.0 | self-made: the kit's 32 icons (`tools/make-assets.py`) restyled by the same script |
-| `skin.ogt`, `*.ogt` | CC0 1.0 | written by the same script |
+| `style.ogt`, `*.ogt` | CC0 1.0 | written by the same script |
 | `Cinzel-Bold.ttf` | SIL Open Font License 1.1 (`OFL.txt`) | Cinzel Bold (github.com/NDISCOVER/Cinzel); unmodified. Copyright 2020 The Cinzel Project Authors (https://github.com/NDISCOVER/Cinzel) |
 | `Newsreader-Medium.ttf` | SIL Open Font License 1.1 (`OFL.txt`) | Newsreader (github.com/productiontype/Newsreader); a static instance (wght 500, opsz 16) of the variable font, subset to Latin-1 with fontTools. Copyright 2020 The Newsreader Project Authors (http://github.com/productiontype/Newsreader) |