Skip to content
KansoMakado design system 1.1
makado.app

Resources

Changelog

Record every change to the system here, newest first: what changed, why, and which screens it affects. Kanso 1.0 is the first public release; the next change is 1.1, and a change that breaks how a component or token is used is 2.0. The internal builds that led up to 1.0 are kept below it.

1.1, October 21, 2026

  • One scrim everywhere: scrim is darker (light rgba(8, 13, 21, 0.62), dark rgba(0, 0, 0, 0.78)) and the same behind side and centered drawers, dialogs and search, each with the same slight blur.
  • Drawer placement: 'center': a large panel in the middle of the screen (a centered peek); phones keep the sheet. New icons peek-side and peek-center for an Open as choice (with open-in for the full page), shown as a small icon group in a drawer's actions.
  • AccountMenu: a highlighted block's detail line stays on one line (an ellipsis if it's ever too long), so the AI credits block in your menu never wraps.
  • CreditMeter: "20% used" on top beside the name, and the count ("60 / 300") under the bar on the right, at every size. MonthCalendar: hiding or showing the day list slides its width and the month resizes with it (still under reduced motion).
  • New DataTable: records with titles that sort when pressed (again to flip), rows that open from anywhere on them (a drawer), and rows that stack into short cards on phones. Used for Projects.
  • The CreditMeter goes right under the button that runs an AI action (ReplyPanel credits too), and size M is roomier for pages like Billing.
  • New tokens button-fill and button-fill-hover: secondary Buttons and ActionButtons that aren't quiet are solid, with no edge, and show on a panel. container-edge is a touch softer.
  • WeekProgress marks today's segment with its outline on Home too, the same as everywhere else.
  • MonthCalendar agendaTitle and onAgendaToggle: the day list gets a title row level with the month's, and a hide or show button that keeps the top right corner whether the list is open or hidden. On phones an open calendar search takes its own line.
  • CreditMeter is laid out as a usage row: the name and when they reset, a bar of what's used, and "60 / 300 used" with what's left; it stacks where it's narrow. New forecast for a heads up when the pace would run out before the reset. The account menu's credits item says what's used too.
  • New tokens: control-border (gray-500, 3:1 on any surface) for text and search fields and ActionButton edges, and container-edge (gray-400) for board columns and the calendar's day list. The ActionButton edge has zero specificity, so the toolbar's glass buttons keep their look.
  • Disabled button text is gray-600, so a disabled button's words (and the cost on an AI button) stay readable.
  • MonthCalendar: the title row never wraps (tools shrink first); the day list lines up with the grid only side by side; chip titles wrap at word boundaries, two lines at most; no edge on the phone's edge-to-edge day list; a right click on a chip opens its options; touch drops use the chip edge band too.
  • KanbanBoard shows the drop line where a card will land. Drop lines sit in the middle of the gap between items.
  • BackLink is accent text. Card footers wrap instead of squeezing their facts. OfferCards fill the row.
  • KanbanBoard columns and the calendar's day list have the same thin edge as the calendar grid, so they stand out on dark panels.
  • Drop markers (gv-touch-before and gv-touch-after) are a straight accent line drawn outside the item, so a card or a rounded corner never hides or bends them.
  • The calendar's day list starts level with the grid, under the month title. MonthCalendar headActions puts tools in the title row (search, show or hide the day list).
  • Search fields sit on a solid surface with the same corners as the buttons beside them; ActionButtons that aren't quiet have a visible edge.
  • CreditMeter S has more room inside. ReplyPanel credits and cost put what's left right above Draft and the cost on the button.
  • ReplyPanel blocked: says why Draft can't run (no AI credits left) beside the disabled button, and an empty comment says "Paste a comment to draft a reply." the same way.
  • SearchDialog: loading says "Loading your workspace" instead of a false "Nothing matches"; Cancel in words on phones (a full size tap target); Home and End; Command or middle click opens a result in a new tab.
  • Rating: picking the current star again does nothing; a small Clear button removes the rating.
  • MonthCalendar: on month chips only a drop near the top or bottom edge changes priority (the middle still moves the date), and the day list says "Higher is more important" when items can be reordered.
  • KanbanBoard: the fill measuring sets up again only when the columns change, not on every render.
  • New SearchDialog: search everything from anywhere with Command K or a Search button. Grouped results, arrow keys and Enter, glass over a scrim, full screen on phones.
  • New Rating: one to five stars with words beside them, a radio group with arrow keys. Used for how working with a brand went.
  • MonthCalendar onReorder: drag an item above or below another, on a chip or in the day list, or press Alt Shift with up or down, to change its priority. Moves are announced.
  • New CreditMeter: AI credits left in a tinted block with a bar, and what the next AI action uses ("This uses 1 AI credit."). Used in the account menu's style in Settings, Billing, Replies and next to every AI action. The account menu's credits bar is deeper with an edge, so its fill and track hold 3:1 in every color theme.
  • During a theme fade only open menus and panels turn solid; the side navigation, toolbar and tab bar keep their glass, so they no longer pop at the start and end.
  • Stepper's Undo names the step it undoes for screen readers. TaskCard treats a stage given as an object as finished when it is, and a late compact card uses the alert diamond. MenuButton's Enter picks the focused option when none is highlighted.
  • SideNav counts carry their meaning in words (screen readers and a tooltip), not an aria-label on a plain span. Toast actions without a link no longer jump the page.
  • Focus never drops to nowhere: KanbanBoard's add field stays open for the next card after Enter, Mark all as read moves focus into the list, and Earlier this week moves focus to the first card it opens.
  • MonthCalendar: a chip moved with Alt and an arrow key opens its new week in full, so it stays in sight with focus on it.
  • ComboField: nothing is highlighted until you type or use the arrow keys, so Enter never picks an option you didn't choose.
  • During a theme or color fade, glass (menus, side navigation) is drawn solid for the moment, so an open menu never shows what's behind it midway.
  • Menus put focus back on their button only when you used the keyboard, so a click leaves no ring behind. Theme and color fades take 300ms.
  • Theme and color cross fades: the old view stays solid while the new one fades in over it, so nothing behind the page shows through midway.
  • AccountMenu: a highlighted item's bar has a deeper track and a solid accent fill so it reads on the tint; highlighted items and the Premium tag get more room inside. Hovering Light or Dark in the theme row previews its motion (the rays burst, the stars fade up) without picking it.
  • Theme changes cross fade the whole page over 420ms (View Transitions), still under reduced motion.
  • MenuButton and AccountMenu: no blue ring on hover. The focus ring shows only while the keyboard moves through the menu (hovering moves focus, and Safari would otherwise draw it). The open account pill shows the selected fill instead of an accent ring. Admin's detail line is subdued.
  • ThemeGlyph: the moon is back to its full size, centered, with five stars around its open side. MenuButton and AccountMenu: an item's hover highlight clears when the pointer leaves it.
  • Stages: every stage can take any of seven colors (gray, blue, cyan, green, yellow, orange, red), built-in ones included. Left alone, a stage keeps its own. Roger's call, October 22, 2026; the name and mark always come with the color.
  • ThemeGlyph: the moon sits lower left with six stars around it that fade up one by one, then twinkle (each star keeps its own place now); the sun's rays burst out and settle. AccountMenu row groups sit in a darker, edged well so the track reads in dark mode.
  • OfferCard is compact: cards keep a set width (up to 260px) instead of stretching, a 28px price, tighter padding, no hover lift (they are not links). One column on phones. Pair them with a monthly or yearly SegmentedControl rather than a card per period.
  • Premium wears the accent: PremiumTag and the crown on your photo are accent filled (the try-it tag an accent outline). AccountMenu: groups take an icon before their label; highlighted items sit inset to line up with the labels and take tone (accent for Premium, neutral for Admin); a little more room between your name, email and tags.
  • ThemeGlyph: seven stars around the moon, each twinkling on its own beat. AccountMenu row choices show the focus ring for the keyboard only, not on hover.
  • OfferCard, more finished: a tinted icon tile, a bigger price, what it includes as checked lines under a rule, a full width action, one height per row, a small lift on hover, and featured for the suggested one (a thin accent ring with its badge).
  • ThemeGlyph: Auto, Light and Dark marks that move. Outlined at rest; chosen, they fill in, the sun turns and reaches out, stars twinkle behind the moon, and Auto's half spins round. Still under reduced motion.
  • AccountMenu: items take glyph in place of an icon; row groups fill the menu's width, lined up with the group labels; a little more room between items and groups.
  • OfferCard: one thing to buy with its price and action, laid out in .gv-offers. current marks the one you have with the selected style and a "Yours" badge.
  • Tabs stay on one line and scroll sideways when there are more than fit (Settings has seven), instead of wrapping.
  • AccountMenu: an item can take progress (0 to 1) for a small Meter under its label. Makado shows assists left this month with it.
  • AccountMenu row groups are icons only (named for screen readers and on hover), with one raised thumb that slides to the chosen icon with a small spring, and the chosen icon turns and grows a little. Still under reduced motion.
  • ReplyPanel: onStop shows Stop beside Draft while it drafts.
  • MonthCalendar: the projects legend is one short row, To do, each stage's mark in order, Published, then Late. Each mark names its stage on hover.
  • SideNav: an item can take children, pages nested under it, shown indented while you are in it or one of them. Makado nests Workspace under Settings.
  • AccountMenu: a choice in a layout: 'row' group applies in place and keeps the menu open.
  • AccountMenu (and every MenuButton menu): a group can take layout: 'row', short choices side by side in a segmented track. Makado's theme choice (Auto, Light, Dark) uses it.
  • MonthCalendar, phones: in the week list the chosen day leads; the busy days before it fold into an Earlier this week row that opens them.
  • TaskCard (projects), ProjectCard and calendar chips: a late project's whole card is a faint red; a published one is a faint green with its contents a little faded. The words and marks still carry the status.
  • Approved: a built-in stage between In review and Scheduled, in the yellow stage color with a thumbs up. Stage lists saved before it get it after In review.
  • MonthCalendar: onItemHold. Hold a card in the day list and let go without moving (or right click it, or press the context menu key) for the item's options; holding and moving still drags it to a day. The touch helper gained the same onHold.
  • WeekProgress: finished days are solid in the accent, the deepest color of the bar's gradient; only today, still filling, carries the gradient. A week of gradients read as busy.
  • Switch: a setting that is on or off and takes effect right away. The track takes the accent when on and the thumb is the raised selected style. Makado Replies uses it for its settings in the bar and the toolbar popup.
  • ComboField: one value, typed or picked. As a picker it filters a list as you type, shows it all from its chevron, and can add what isn't there; as a suggester it keeps your text and offers matches the app looked up, with a quiet loading row. New product uses both: the product name suggests real names, and the brand is a field with a dropdown instead of a row of every brand.
  • Button: premium puts the crown after the label, so a Premium feature is one button (AI help) instead of a button with a PremiumTag beside it.

1.0, October 21, 2026

Kanso's first public release, at makado.app/kanso: the design system behind Makado.

  • Foundations: 82 color tokens in light and dark, the Figtree and Source Code Pro type scale, spacing, radius, elevation and glass, sizes and motion.
  • Seven color themes from the Makado mark: Makado, Ocean, Mint, Sunset, Lavender, Sand and Ember.
  • 70 components, each with its guidelines, its props and a live preview in both themes.
  • 118 icons from the Spectrum 2 workflow set, the Makado illustrations and the logo files.
  • The rules every screen follows: plain, warm copy; status never told by color alone; text at 4.5:1 in both themes; glass for navigation only; everything you can drag can be moved from the keyboard.

Before 1.0: internal builds

85 builds from October 19 to 21, 2026, while Makado and its design system were made together.

Build 3.51, October 21, 2026

  • The design system is named Kanso, the Japanese aesthetic principle of simplicity, and is published at makado.app/kanso. Links to makado.app/design-system redirect there. The source folder stays design-system/.

Build 3.50, October 21, 2026

  • The design system is published at makado.app/design-system as a documentation site: Overview, Brand book, Foundations (color swatches that read the live tokens in light and dark, typography, spacing, shape, elevation, sizes and motion), Brand (the seven color themes rendered live, logos, a searchable icon set, illustrations), and a page per component with its live preview, a props table from index.d.ts and its guidelines. Generated on every build by scripts/copy-design-system.mjs.
  • Docs: Button, ListRow, Avatar and PageHeader, and the type notes in tokens.json, named Outfit, which was retired. They now say Figtree.

Build 3.49, October 21, 2026

  • Card: imageFit: 'contain' for product shots, shown whole on the new background-product token (a light studio gray in both themes), never cropped. See-through PNGs of dark gear stay visible in dark mode, and tall or wide shots sit centered.
  • ListRow: image, a product's cover as the row's lead on the same backdrop.
  • Token background-product.
  • Fix: a tall product shot in a contain card grew past its frame onto the card below. The picture is pinned to the frame now and scales down inside it, and every card picture is clipped to its frame.

Build 3.48, October 21, 2026

  • Picker: long lists scroll inside the menu instead of running down the page. The menu is capped to the room on screen (320px at most), keeps the wheel and swipes to itself (overscroll-behavior: contain), keeps the page still while arrow keys move through it, and opens above the button when there's more room there. Every Picker in the app follows (brands, stages, time zones). The account menu is capped to the window the same way.

Build 3.47, October 21, 2026

  • MonthCalendar: the running weeks view (scroll: 'weeks') no longer shades days outside the month in view, which re-colored whole weeks as you scrolled; month starts are marked by their date ("Nov 1"). Scrolling settles on a week (scroll snap, proximity), and day hover fills apply only to devices that hover, so a swipe leaves no colors behind.

Build 3.46, October 21, 2026

  • PairEditor (new): rows of short fields that save as you go, for a product's key facts and links. Quiet fields until pointed at, dividers between rows, and a quiet x to remove a row (on hover or focus, always on touch) instead of a red trash can. An empty new row leaves nothing behind.
  • PremiumTag: the crown (premium, new from the Spectrum 2 set) on a solid pill in the heading ink, dark on light and light on dark, the same in every color theme. Try free is the same ink as an outline. The small badge on your photo is the crown too. The magic wand stays on the buttons that start the help.
  • Removing a row (a note in the day list, a file, a stage, a passkey) is a quiet x, not a trash can. The trash can is kept for deleting a whole thing (a project, a product, a workspace).
  • SaveStatus: one that appears while a save from another page still reads Saved stays quiet, so switching pages no longer flashes Saved.

Build 3.45, October 21, 2026

  • ImageCropper (new): crop a picture to a square before it's saved, shown as a circle for photos of people and a square for logos. Drag to move, zoom with the slider, its buttons or the wheel; arrow keys move it and plus and minus zoom, and both are announced. ImageCropper.cropImage draws the square (512px PNG). Used for your photo, brand logos and the workspace logo, in a drawer, and again from Crop on a saved one.
  • Icons: zoom-in, zoom-out and crop, from the Spectrum 2 workflow set.
  • Stepper: jump gives every other step a quiet Move here (on hover or focus, always on touch), so a project can go from To do straight to Published in one move. The project Stage panel uses it.
  • MonthCalendar: day notes stack under the date, each in a small outlined box, and wrap. A note over a run of days is one bar through those days, in the same lane on each, with a square end where it carries into the next week. workDays shades the days that aren't workdays with the new background-rest token, a shade darker than the calendar in both themes.
  • PropertyList: stacked lists have more room between groups (32px) and between each label and its control (12px).

Build 3.44, October 21, 2026

  • PremiumTag (new): marks what comes with Makado Premium, the AI help: the magic wand and "Premium" in the accent. trial (an outline) while free uses are left.
  • AccountMenu: addons shows the add-ons you pay for as tags under your name in the menu, and a small wand on your photo (and in its label for screen readers), on desktop and on the phone's Profile tab.

Build 3.43, October 21, 2026

  • ReplyPanel (new): help replying to a viewer's comment. The comment, a product picker slot, Draft (magic wand), then the editable reply with a "Drafted from" line, Copy and Save as answer, and a notice when the notes don't cover it. Used on Replies; the Safari extension's panel follows the same pattern with the same tokens (copied by extensions/build.mjs).

Build 3.42, October 21, 2026

  • Stage colors: a stage can be Gray, Blue, Cyan or Yellow (StageSetting.color, STAGE_COLORS). In review stays orange and Scheduled and Published stay green. New tokens cyan-visual, yellow-visual, gradient-cyan and gradient-yellow (3:1 or better on cards), with marks, dots, calendar chips and meter segments in both.
  • MonthCalendar: weeks size together. A row is as tall as its fullest day (up to 264px, or all the way for this week and an opened week), so every chip shows while there is room; "2 more" opens the whole week.
  • MonthCalendar on phones: the day list sits right on the page, with no container edge under the pinned week. On a tablet in portrait, a filling calendar stacks the month over the day list.
  • TaskCard: late shows the warning triangle.
  • Icons: apple, the Apple logo, only for Sign in with Apple. Token static-white for what must stay white (a QR code).

Build 3.41, October 21, 2026

  • Custom stages: defineProjectStages(list) sets a workspace's stages for every component (STATUS names, PROJECT_STATUSES order and which are on, and stages it added, keyed "c-..."; blue with a flag). Once customized, a stage's mark fills by where it sits. normalizeStages, defaultStageSettings and, in the app port, ALL_STAGES, stageSettings and stageDef. Status colors for built-in stages never change.
  • ReorderList (new): put a list in order by a handle on each row, by drag or Alt with Up or Down, with locked rows and announced moves. Used for Workspace settings, Stages.

Build 3.40, October 21, 2026

  • TagField (new): type to choose several. Choices are removable tokens; the menu suggests matches and can add what's new. Used for a project's brands and products.
  • NotificationCenter (new): a bell with the unread count and a grouped panel of what needs a look (today's deadlines, late projects, money, team and billing), each a link to resolve it. floating is a glass circle beside the account. The count is red only when something is late or overdue (.gv-ab-badge-accent otherwise).

Build 3.39, October 21, 2026

  • SideNav: the current item is one raised thumb (.gv-nav-thumb) that slides to the new item as you go; still with reduced motion.
  • SaveStatus: each word fades in, and the status fades out before it clears.
  • MonthCalendar: a day shows as many chips as fit its height (.gv-cal-daybox), then "2 more" at its foot; maxPerDay is no longer used. Day notes are 11px with less padding around the day. The day list's Day and Week switch spans the list (.gv-cal-agenda-toggle).
  • KanbanBoard: "More below" sits on a soft haze of the column's color (a blurred shadow, not a gradient), so it reads over the cards.

Build 3.38, October 21, 2026

  • Press and hold to drag on touch screens (touchDragStart, touchTarget): KanbanBoard cards move between columns and places; MonthCalendar list cards drop on a day. A lifted copy (.gv-touch-ghost) follows the finger; the original fades (.gv-touch-source).
  • StatTile: compact for a shorter tile on phones.

Build 3.37, October 20, 2026

  • Drawer on phones: drag a sheet down to dismiss it (grab bar on top); side: 'right' fills the whole screen with no rounding.
  • TabBar: the current tab is one raised thumb that slides between tabs (endCurrent for the end tab); tabs are taller (60px) with 12px labels.
  • AccountMenu tab: opens as a full-width bottom sheet of rows on phones.

Build 3.36, October 20, 2026

  • Skeleton: quiet placeholders while a page loads (block, text line, circle, or a stack of lines). A soft opacity pulse, no gradient; still with reduced motion.
  • PullRefresh: the round indicator for pull down to refresh on phones, its arrow turning with the pull and spinning while it refreshes.

Build 3.35, October 20, 2026

  • Drawer on phones: the sheet is as tall as its content, up to just below the status bar.
  • Popover on phones: opens as a bottom sheet (no floating card on phones).
  • MonthCalendar: the note form has a Day field; on phones it opens in a bottom sheet.

Build 3.34, October 20, 2026

  • Drawer: side: 'right' for a full-height panel from the right on phones, rounded on its left side (the phone menu).
  • MonthCalendar on phones: the layout stacks in a column; pinned, the list runs edge to edge and to the bottom of the screen, with bigger cards (16px titles, no format line).

Build 3.33, October 20, 2026

  • MonthCalendar strip: the week now scrolls under your finger and snaps a week at a time (three weeks side by side, .gv-cal-strip-scroll, .gv-cal-strip-page), Left and Right keys on the focused strip; the phone title row drops the arrows and Today is quiet.

Build 3.32, October 20, 2026

  • MonthCalendar: strip for phones (one week, swiped a week at a time, the month title opens and folds the month view) and agendaView: 'week' (the day list always shows the week, notes and adding in place on the chosen day). The Calendar page uses both on phones.

Build 3.31, October 20, 2026

  • Dark mode contrast: background-page is darker (#0f1115, was #15181c), surface-edge is stronger (10% white, was 6%), and shadow-emphasized adds a 7% white hairline, so cards and panels stand off the page, most of all on phones where they sit right on it.

Build 3.30, October 20, 2026

  • Drawer: slides back out when it closes (keeping its content until it is gone). On phones it is a sheet from the bottom that fills the bottom and sides, with rounded top corners, sliding up and down. New token motion-duration-400 (320ms) for the sheet.
  • PageHeader: titles 30/36 (were 36/42), 26/32 on phones (were 28/32); descriptions 16/24 (were 18/27).

Build 3.29, October 20, 2026

  • MonthCalendar: the chosen day is a soft gray fill instead of a blue outline (phones: a gray circle on its number). onItemClick fires when a chip is clicked (Makado opens the project's drawer). Day notes no longer take picture icons (the icon picker is gone; one icon per kind in the day list). Removing a repeating note asks This day, This and later, or All (skip on DayNote).
  • TaskCard: a project card opens as a whole, so its title no longer underlines like a separate link; the card lifts on hover.
  • KanbanBoard: with fill, a column with more below shows a "More below" pill at its foot that scrolls it down (.gv-col-below).

Build 3.28, October 20, 2026

  • KanbanBoard: fill fits the board to its container's height with each column scrolling on its own (.gv-board-fill).
  • MonthCalendar: day notes in the grid are italic subdued text instead of a pill; repeating notes (repeat: week, biweek, month, with until) and noteFallsOn; Add a project and Add a day note are icons in the day list header; a hairline frame around the grid; 16 between the grid and the day list (was 32).

Build 3.27, October 20, 2026

  • MonthCalendar: fill takes the container's height, with the grid scrolling inside and the day list matching the calendar's height and scrolling on its own (.gv-cal-fill). The Calendar page fits the window on desktop.

Build 3.26, October 20, 2026

  • TabBar: end for one more tab that isn't a link. AccountMenu: tab and current show it as that tab (photo above the label, the menu opening upward via MenuButton's new up-end place). Makado's phone tab bar ends with Profile.

Build 3.25, October 20, 2026

  • MonthCalendar: scroll: 'weeks' shows one continuous run of weeks that scrolls vertically without end, opening with this week on top (.gv-cal-weeks, height from --gv-cal-height, sticky weekday row). The title follows the month in view.
  • MonthCalendar: agendaWeek adds a Day and Week switch to the day list; Week lists the chosen day's week day by day (.gv-cal-weekday).

Build 3.24, October 20, 2026

  • MonthCalendar: pinned keeps the month in place while the day list scrolls under it (.gv-cal-pinned, with --gv-cal-pin-top, --gv-cal-pin-surface and --gv-cal-pin-bleed), with slightly shorter compact days. For the new Calendar page on phones.

Build 3.23, October 20, 2026

  • MonthCalendar: "2 more" opens the day in place to show all of it, with "Show less" to fold it back (it used to only pick the day). The month also changes with a sideways swipe on touch or trackpad, or Page Up and Page Down, and each change is announced.

Build 3.22, October 20, 2026

  • KanbanBoard: a column can show only some of its cards, with total for the header count and more for a link to the rest at its foot (.gv-col-more). Home's Published column shows the last 14 days and links to all published projects in Projects.

Build 3.21, October 20, 2026

  • Token side-nav-width-collapsed (72px): the side navigation's icon rail on narrower desktops, so the app no longer hard-codes it.
  • Types: ActionButton negative, TextField ariaLabel, and KanbanColumn's items, over and dropProps (set by KanbanBoard) are now in index.d.ts, matching the source.
  • This changelog: 3.4 to 3.9 are back in newest-first order.

Build 3.20, October 20, 2026

  • Tabs: a solid track (background-layer-1 with a surface-edge hairline) instead of glass, since tabs are content. Docs no longer mention the old underline.
  • Toast: a solid raised surface (background-elevated, shadow-elevated) instead of glass.
  • Sunset theme: the glow uses the Sunset mark's own colors (rose, coral, orange and its berry pink) instead of a purple that isn't in the mark.
  • SetupChecklist: on phones, tighter steps and done steps show only their name.

Build 3.19, October 20, 2026

  • SetupChecklist: each step in its own inset container (background-layer-1, surface-edge hairline, radius-lg), and onDismissStep now dismisses done steps too.

Build 3.18, October 20, 2026

  • MonthCalendar: deadlines read "Draft Due" and "Publish", and with onDeadlineMove they drag to another day or move with Alt and an arrow key, announced like project moves (.gv-cal-deadline-move shows the grab cursor).

Build 3.17, October 20, 2026

  • SegmentedControl: stays as wide as its choices inside a column or grid that stretches its children; before, its track stretched across the whole panel with the choices bunched at the left (Settings, Billing).

Build 3.16, October 20, 2026

  • Hero: the title is pulled left by its letters' own side space (-0.058em), so the visible edge of "Make more." lines up with the kicker above it at every size.
  • SiteBar: room for a medium action (Start free at 32px): 16px around it in the 64px bar, 12px in the 56px bar on phones.

Build 3.15, October 20, 2026

  • Showcase: the layers are staggered so no two share an edge. The back window sits 7% in from the left (the front-start card overhangs it), the middle panel 5% in from the right (the front-end card overhangs it), front-start sits a little lower with a clear gap before the middle panel (whose heading starts at its edge), and front-end starts well below the window's top edge. Tablet uses the same steps, narrower. Affects the landing page.

Build 3.14, October 20, 2026

  • Menus (Account, WorkspaceSwitcher, AccountMenu): roomier, 8px inside the glass and between groups, items 40px tall with 12px at their sides, labels and the header lined up with the items.
  • Menu items: highlight, for an item that stands apart from the rest (Admin): tinted with the color theme and bold.
  • Icons: building and buildings from Spectrum 2. Workspaces use building instead of folder; New workspace uses add.
  • Footer: a link can take onClick to open something in place (Terms and Privacy in a modal sheet), with its href as the fallback.

Build 3.13, October 20, 2026

  • SetupChecklist: onDismissStep, a quiet dismiss button on each step that isn't done, so someone can drop a step they don't need.
  • AccountMenu: the photo sits 6px in from the capsule's edge on every side (it was 4px on the left).
  • Footer: a link that leaves Makado (the studio) opens in a new tab and says so to screen readers.

Build 3.12, October 20, 2026

  • WorkspaceSwitcher: onSettings adds Workspace settings above New workspace; each item's src shows the workspace logo in the mark (.gv-ws-mark-img).
  • Popover: stays inside what you can see, using the visual viewport, so an on-screen keyboard on iPad or iPhone pushes it up instead of covering its fields.

Build 3.11, October 20, 2026

  • Hero: the kicker ("For creators who work with brands") is plain text in heading, without the chip.
  • WorkspaceSwitcher: no chooser arrows; the workspace's mark and name are the button.
  • AccountMenu: shows your first name beside the photo in a glass capsule (shortName, hideName); phones keep the circle.
  • SetupChecklist: each step has a text link under it (action, such as "Add a brand") instead of the whole row being a link with a caret; the link goes away once the step is done.

Build 3.10, October 20, 2026

  • SiteBar: the actions sit as far from the pill's right edge as from its top and bottom (64px tall with 20px around its buttons; 56px with 16px on phones, up from 8px), and 12px apart. Sign in and Start free no longer crowd the edge.
  • Footer: the line is just "© 2026 Roger Seng Studios" (a second sentence repeated it), with the studio name linking to rogerseng.me. A link in the line is underlined so it reads as a link without relying on color.

Build 3.9, October 20, 2026 (landing)

Pieces for the landing page at makado.app, which signed-out visitors see at /.

  • Added SiteBar: the floating glass bar at the top of public pages, the theme's mark and wordmark linking home, Sign in and Start free on the right (.gv-sitebar).
  • Added Hero: display type for public pages, left aligned, the title's second line in accent-content; size L for the top of the page, M to open a section. The kicker sits on a small solid chip so its accent text holds 4.5:1 over every theme's glow (.gv-hero).
  • Added Showcase, ShowcaseLayer and ShowcaseWindow: a still life of the app made of real components on sample data, layered at four depths over the glow. Glass only on the rail and the float toolbar. It is inert with one label for screen readers. Layers settle in on load and drift apart on scroll with a CSS scroll timeline; nothing moves with reduced motion (.gv-showcase).
  • Added StageTrack: the project stages in order with their marks, names and captions, across on wide screens and down on narrow ones (.gv-stagetrack).
  • Added PlanCard: the one plan on a solid surface, price, the other way to pay, checked lines and the calls to action (.gv-plan).
  • Backdrop: phoneGlow keeps the glow on phones, for public pages only (.gv-backdrop-glow-phone). The app still falls back to the plain page.

Build 3.8, October 20, 2026 (admin)

  • ListRow: stack. Trailing content moves to its own line under the title when it doesn't fit, and always on phones, indented to line up with the text and with the chevron at the far right. For rows with several badges, like the admin portal's people list (a plan badge plus a Stripe badge). Preview added.

Build 3.7, October 20, 2026 (hours and saving)

  • Added TimeField: the browser's own time input in a Makado field (.gv-time), "HH:MM" in and out, with color-scheme following the theme so the native picker reads in light and dark. For work hours in Settings, Week.
  • Added TimeRange: a start and an end time in a fieldset named by its legend ("Monday starts", "Monday ends"), with a note such as "8 hours" and help or an error underneath (.gv-timerange). Settings, Week shows one per workday, or one for every workday.
  • Added SaveStatus: a quiet word for things that save as you go (.gv-save). "Saving" only after 300ms so instant saves never flash it, "Saved" for two seconds, and "Couldn't save." with Try again on a failure. Words and an icon, a polite live region, and the fade respects reduced motion. Shown in the page header area on Home, Settings, Profile and every detail page. A page header whose only action is an idle SaveStatus takes no room, so phones get no empty row.
  • WeekProgress: hours (hours of work per day) makes each segment as wide as its day and counts hours instead of days; valueText sets what a screen reader hears. The default caption on a day off is now "Off today". Home's This week tile runs today's segment from the day's start to its end.

Build 3.6, October 20, 2026 (projects quick add)

  • Added Popover: a small glass card anchored to an element, in a portal on body so no container clips it, opening below its anchor and flipping above or beside it near the window edges (.gv-popover). Focus moves in, Tab stays inside, Escape or a click outside closes it and focus goes back. For the calendar's quick add on Home.
  • Added Toast: a short glass note at the bottom of the window with one action, a polite live region that leaves on its own (.gv-toast). Confirms a project made in the New project drawer or the quick add, with Open project.
  • MonthCalendar: onDayDoubleClick now also gets the day's cell (to anchor a Popover) and moves focus to the day's date first. New onAdd(date, cell) makes the day list's add button open the same quick add, the keyboard and phone path. Day cells carry data-date.
  • Drawer: a field in the content marked data-drawer-focus takes focus when it opens, before the close button. The New project drawer starts at the title. Affects every New project button.
  • EmptyState: empty lists use a line icon in the gray circle, not an illustration (Roger's call). Projects use folder, Brands briefcase, Contracts file-text, Invoices wallet, matching Products' tag. Affects Home, Projects, Brands, Contracts and Invoices.

Build 3.5, October 20, 2026 (onboarding)

  • SetupChecklist: new. The setup list on Home for someone's first few visits: steps that link to where they are done and check themselves off, "3 of 7 done" with a positive Meter, optional steps, a quiet Hide setup, and a short celebration with the caught-up illustration when every required step is done. Solid surface like WinsCard; states in words and shaped marks; progress announced politely; motion skipped with reduced motion.
  • WelcomePanel: new. A skippable first-run welcome, one panel or two to three tips ("Tip 1 of 3", dots), each able to point at part of the page with Show me. Inline, never a modal; Next moves focus to the new tip's title.
  • Affects Home (desktop and phone).

Build 3.4, October 20, 2026 (nav and motion)

  • WorkspaceSwitcher (new): the open workspace, always in view at the top of the side navigation (initial tile, name, your role), opening a glass menu of every workspace and New workspace. collapsed for the rail, layout: pill for phone pages. Workspaces and you are now separate things, the way Slack, Linear and Notion do it.
  • AccountMenu (new): your photo or initials in a 48px glass circle at the top right of every page, opening a menu with your name and email, then Profile, Settings and Sign out. Replaces the Account card at the foot of the side navigation.
  • Footer (new): the quiet line at the bottom of app pages, sign in, Terms and Privacy ("Makado is a Roger Seng Studios product.", Terms and Privacy links), subdued so it holds 4.5:1 on the backdrop.
  • Account: the menu engine is shared with WorkspaceSwitcher and AccountMenu (menus can now open above, below, or below and right aligned, and take a header). Account itself is unchanged; the docs point the app to the new pieces.
  • Button: primary is of a piece with the glass. New cta-rim, cta-shadow, cta-shadow-hover and cta-shadow-pressed tokens: an inner rim, a 1px lift with a slightly lighter fill on hover instead of a flat color swap, a settled pressed state. Every button and ActionButton presses in a little.
  • Motion tokens (new): motion-duration-100 (120ms), -200 (160ms), -300 (220ms), motion-ease-out, motion-ease-in-out, motion-press-scale, motion-rise. Tabs and SegmentedControl slide their raised thumb between choices; menus and Picker ease in; the drawer uses the tokens; a gv-enter class fades a page in with a 6px rise on route change. All of it is off under prefers-reduced-motion.

Build 3.3, October 20, 2026

  • Account: menu, which makes the card a button that opens a glass menu above it (workspaces to switch to with a check on the current one, New workspace, Profile, Sign out). Keyboard and screen reader behavior match Picker. For billing that follows the person and people who belong to several workspaces. Affects the side navigation.
  • Icons: switch-vertical (the chooser mark on the card) and folder-add refreshed from Spectrum 2.

Build 3.2, October 19, 2026

  • ThemeToggle: variant: swatches, big previews of Auto, Light and Dark that match BackdropPicker.
  • BackdropPicker: bigger swatches (104 by 68) and marks.

Build 3.1, October 19, 2026

  • Account card: tinted with the color theme, a theme-colored ring around the photo, the workspace line in accent-content.

Build 3.0, October 19, 2026

  • Color themes: Makado, Ocean, Mint, Sunset, Lavender, Sand and Ember, each from a version of the Makado mark. data-backdrop on <html> now recolors the accent family (accent, accent-hover, accent-content, accent-subtle, accent-visual, focus-indicator, gradient-informative) as well as the four glow pools, in light and dark; contrast checked for each. Sunrise and Plain are gone (Sunrise reads as Sunset, Plain as Makado).
  • Logos: new lockup and wordmark (with a white wordmark and lockup for dark backgrounds, recolored from the black), the new Makado mark, and the six theme marks (makado-mark-ocean.png and the rest).
  • BackdropPicker: now the color theme picker; images shows each theme's mark on its swatch.

Build 2.20, October 19, 2026

From a full UI audit (contrast, names, inputs, overflow and focus on every page, light and dark, desktop and phone):

  • Button: the outline negative (delete) style sits on background-elevated, so its red text holds 4.5:1 when the button is on the page backdrop (it was 4.2:1).
  • SectionHeader: the description is subdued instead of detail, so group captions on the page backdrop hold 4.5:1 (they were 4.25:1).
  • Tabs: on phones the row stays on one line and scrolls sideways instead of wrapping.
  • tokens.json: the color note now matches the rules for sky, mint and gradients.
  • Card: a preview with no photo is a short, quiet strip (72px, background-layer-1, 24px icon in gray-400) instead of a 140px gray block. Affects product cards.

Build 2.19, October 19, 2026

  • PageHeader: align: center for rare centered pages. Profile and Settings went back to left-aligned headers with their section tabs directly underneath.
  • Tabs: larger (32px tall, 88px minimum width) and a glass bar shaped like the panels (radius-lg, radius-default pills) instead of a gray track.

Build 2.18, October 19, 2026

  • Icons: added thumb-up and thumb-down from Spectrum 2. Home's month tile uses them for on pace or a little behind.
  • StatTile: an icon with no tone is a faint gray (gray-500).
  • Icons: added thumb-up-filled and thumb-down-filled (Makado's own; Spectrum 2 has no filled thumbs). The month tile uses them.

Build 2.17, October 19, 2026

  • ThemeToggle: the track is recessed glass (new glass-track and glass-track-edge tokens) instead of flat gray.
  • SideNav: counts are circles again: a raised white circle, or deep red (negative-hover, white text, 4.5:1 in both themes) when overdue.
  • Icons: calendar-day-filled and wallet-filled are more solid at small sizes (fewer cut-outs).

Build 2.16, October 19, 2026

  • Selected style: a raised thumb (new selected-fill, selected-shadow) with bold heading text replaces the flat black fill for the current nav item, SegmentedControl, Tabs, ThemeToggle, TabBar and the note icon picker.
  • SideNav: counts are plain numbers (red and bold when overdue); collapsed, a small raised badge.
  • ThemeToggle: vertical gets 36px options with spacing.
  • MonthCalendar: larger type (15px day numbers, 13px weekdays and chip titles, 12px brands, 11px note pills), 144px days, and chips put the title on the full width with the stage mark beside the brand.
  • StatTile: no tinted tile behind the icon; 22px numbers; tighter spacing. New filled icons checkmark-circle-filled, alert-triangle-filled, calendar-day-filled, wallet-filled (Makado's own).

Build 2.15, October 19, 2026

  • One selected style: SegmentedControl, Tabs, TabBar and ThemeToggle now mark the chosen item with the neutral fill and bold text, like the current nav item. SegmentedControl and Tabs are a gray track with rounded segments (Tabs lost the underline).
  • ThemeToggle: reshaped like SegmentedControl and stretches to the side navigation's width.
  • Added NavButton (an action styled as a nav item; Collapse sidebar) and BackdropPicker (swatches for the backdrop color).
  • Backdrop colors: glow-1 to glow-4 replace the named glow tokens; data-backdrop presets Makado, Ocean, Sunrise, Mint and Plain, light and dark. Mint may appear in the backdrop when chosen.

Build 2.14, October 19, 2026

  • SideNav: the current item is a solid neutral fill with bold text (it was white on white glass, hard to see).
  • Account: layout: card, the profile in its own container with the photo on top. The app's side navigation foot is now the theme toggle, the profile card, then Collapse sidebar.
  • Button: calls to action use primary (black, white in dark) instead of accent. New outline negative style for delete buttons.
  • ActionButton: negative; any ActionButton with the delete icon is red.
  • Spacing: more room in MonthCalendar (32px between the grid and the day list) and the board (12px between columns). The app's page sections, panels and tiles were spaced out too.

Build 2.13, October 19, 2026

  • Backdrop: new glow pattern, soft radial pools of the logo's blue, sky and sand fixed behind the whole app (new glow-blue, glow-sky, glow-sand tokens, light and dark). Plain page on phones. By Roger's call the gradient rule now allows this backdrop, and sky may appear in it; CLAUDE.md and the brand book record it.
  • The app frame and main area are transparent so the backdrop shows around the solid content and through the glass navigation.

Build 2.12, October 19, 2026

  • Glass reworked the Apple way: only the navigation layer is glass (side navigation, the floating toolbar, the floating phone tab bar, the drawer, menus); content is solid again. New tokens glass-rim, glass-shadow, glass-elevation, surface-edge and surface-shadow; the glass fill is lighter with a stronger blur, and every glass surface has a hairline, a bright inner rim, a specular top line and a deep soft shadow.
  • Card primary: solid background-elevated with surface-edge and surface-shadow (no glass).
  • Drawer: an inset sheet, every corner rounded, glass strong.
  • TabBar: floating, a glass capsule.
  • MonthCalendar: no frame border or header fill inside a panel; days sit on the panel itself, with the grid lines only.

Build 2.11, October 19, 2026

  • Frosted glass: new glass-surface, glass-surface-strong, glass-highlight, glass-edge and glass-blur tokens (light and dark, solid with prefers-reduced-transparency). Card primary, the Picker menu, the Drawer and its scrim, and TabBar use them. The app's side navigation and panels are glass on the frame.
  • Added ThemeToggle: Auto, Light and Dark as a pill of icon buttons, horizontal or vertical.
  • SideNav and Account: collapsed for an icons-only side navigation.
  • Icons: added sun, contrast, chevron-double-left and chevron-double-right from Spectrum 2, and moon, drawn to match (Spectrum 2 has no moon).
  • TaskCard: project cards in narrow columns stack one thing per line (a container query on .gv-col).
  • KanbanColumn: the stage mark lines up with the first line of a title that wraps.

Build 2.10, October 19, 2026

  • Statuses: new shipping project stage after to-do (neutral, clock, stage mark at 0.1). PROJECT_STATUSES now runs To do, Shipping, Pre-production, Filming, Editing, In review, Scheduled, Published.
  • Stepper: steps can carry a status; the marker then shows that stage's mark. New currentLabel and actionLabel.
  • KanbanColumn and KanbanBoard: status shows the stage mark before the column title (.gv-col-mark). A project TaskCard with a link shows the pointer across the whole card.
  • WeekProgress: off days are open, outlined segments labeled Off, not counted (.gv-week-off).
  • MonthCalendar: day notes are Note or Time off; holiday merged into Note (the flag preset, labeled Holiday). New onDayDoubleClick.

Build 2.9, October 19, 2026

  • MonthCalendar: new deadlines prop (CalendarDeadline, kinds in MonthCalendar.deadlineKinds) shows each project's publish date and draft due date. In the grid they are quiet lines with no fill (.gv-cal-deadline: icon, "Publishes:" or "Draft due:", then the title), listed after the chips and counted in "2 more". They cannot be dragged. Late ones swap the icon for alert-triangle in negative-content and say "late" to screen readers; met ones read "Published" or "Draft in" with a check. The day list lists them under its notes (.gv-cal-due), and on the phone grid a deadline adds a small outlined diamond after the dots (.gv-cal-deadmark). With an href each one is a link, so Home opens the project drawer. Affects Home.

Build 2.8, October 19, 2026

  • Type: Figtree is the interface typeface again (its files were already in fonts/). Space Grotesk stays in fonts/ but is no longer loaded.
  • Statuses: scheduled is now a project stage between in-review and published (PROJECT_STATUSES, Picker.projectStatuses, the board). It turned positive (green, like the Complete group it came from in Notion) with a stage mark at 0.9. Calendar chips for scheduled projects use the positive tint.

Build 2.7, October 19, 2026

  • Type: Space Grotesk (SIL Open Font License) replaces Geist Sans for the whole interface. Added fonts/SpaceGrotesk-Variable.woff2 (weight 300 to 700, no italic). Geist stays in fonts/ but is no longer loaded.
  • MonthCalendar: custom day notes show their icon in the grid pill again (white on gray); holidays and time off stay label only. calendar joins MonthCalendar.noteIcons as Event.

Build 2.6, October 19, 2026

  • Type: Geist Sans (SIL Open Font License) replaces Satoshi for the whole interface. Added fonts/Geist-Variable.woff2 and the italic (weight 100 to 900). Satoshi stays in fonts/ but is no longer loaded.
  • Tokens: new label-fill and on-label-fill (gray with white text, 4.5:1 or better in both themes).
  • MonthCalendar: day note pills in the grid are plain gray with white text and no icon, the same for every kind. The day list keeps each note's icon.

Build 2.5, October 19, 2026

  • Shadows: all three shadow tokens are much softer (a light ambient layer and a faint key line), in both themes.
  • MonthCalendar: project chips are tinted by stage (.gv-cal-chip-<variant>: accent-subtle in production, notice-subtle in review, positive-subtle published, negative-subtle late) and titles are bold. Day notes are pill labels (.gv-cal-note-<kind>, 10px bold, 12px icon): holidays use flag on yellow-subtle, time off gray, custom blue. The calendar frame and day list use radius-lg; the day list has more padding.
  • StatTile: the icon sits in a tinted square in its tone's color; new brand tone (the logo's sand) for money.
  • PageHeader: the eyebrow uses accent-content at SemiBold.

Build 2.4, October 19, 2026

  • Type: Satoshi (Indian Type Foundry, via Fontshare, ITF Free Font License) replaces DM Sans for the whole interface. Added fonts/Satoshi-Variable.woff2 and the italic (weight 300 to 900). DM Sans stays in fonts/ but is no longer loaded.
  • Icons: added rocket, smile, music-note, microphone, magic-wand and brush from the Spectrum 2 workflow set.
  • MonthCalendar: day notes sit on the same line as the date number. Holidays use gift and time off uses clock. Custom notes can pick a preset icon (MonthCalendar.noteIcons, including a rocket) from a new icon radio group in the note form (.gv-cal-iconpick). The brand line under a project chip is lighter (regular weight, between subdued and detail gray, still above 4.5:1).
  • Meter: blend fades each segment's color into the next in one fill. Home's On track bar uses it; CLAUDE.md and the brand book allow this one multi-hue bar gradient.
  • WeekProgress: with labels: false, today's segment has no outline.

Build 2.3, October 19, 2026

  • Gradients for progress bars, by Roger's call: new tokens gradient-informative, gradient-positive, gradient-notice, gradient-negative, gradient-neutral (one hue, deeper to lighter, left to right; light and dark values). Meter fills and segments and WeekProgress days use them. Bar fills are the only place gradients are allowed besides the logo; CLAUDE.md and the brand book record the exception.
  • Meter: segments sit flush with no gap, one continuous bar.
  • WeekProgress: labels: false hides the day names, so the segments sit like any other bar in a row of tiles.

Build 2.2, October 19, 2026

  • Layout: the page now runs to the window edges beside the side navigation, separated by a 1px divider, instead of floating as an inset rounded container. No Backdrop behind it; the app no longer offers one.
  • Meter: segments splits one bar into colored parts side by side (.gv-meter-split, .gv-meter-seg-*), and valueText says what the bar shows. Home's On track card uses it for projects by stage.
  • Type: DM Sans replaces Source Sans 3 for the whole interface (optical size and weight axes). Added fonts/DMSans-Variable.woff2 and the italic (SIL Open Font License). Source Sans 3 stays in fonts/ but is no longer loaded.

Build 2.1, October 19, 2026

  • Added Stepper: a linear flow of steps (.gv-steps). Steps finish in order; only the next has Mark done, the last finished has Undo; each step says Done, Up next or Later. Replaces to-dos on the project page.
  • Type: Source Sans 3 (formerly Source Sans Pro) replaces Inter for the whole interface. Added fonts/SourceSans3-Variable.woff2 and the italic (SIL Open Font License). Inter's files stay in fonts/ but are no longer loaded; its cv11 and ss01 settings are gone.

Build 2.0, October 19, 2026

A look refresh: rounder, one professional typeface, and a framed page.

  • Type: Inter replaces Outfit (display) and Figtree (text) everywhere in the interface, with cv11 and ss01 on. font-display and font-sans both point to it. Added fonts/Inter-Variable.woff2 and the italic (SIL Open Font License, noted in licenses.md). The Outfit and Figtree files stay in fonts/ but are no longer loaded.
  • Radii: radius-sm 6px (was 4), radius-default 10px (was 8), radius-lg 14px (was 10), radius-xl 20px (was 16).
  • New color tokens: background-frame (light #eef0f3, dark #0d0f13), the gray around everything and behind the side navigation; background-page (light #ffffff, dark #15181c), the rounded page in the frame.
  • Card (primary), WinsCard and panels: a hairline divider ring joins the shadow, so cards read on a white page.
  • SideNav: the current item fills with background-elevated (on the frame); hover uses neutral-subtle.
  • StatTile: children now sit under the number as a visual (.gv-stat-visual), and the caption is pinned to the bottom, so a row of tiles lines up exactly.

Build 1.11, October 19, 2026

  • MonthCalendar: a project chip leads with the mark and title; the brand moves underneath, smaller (11px) and lined up with the title. The brand tile and logo leave the calendar (they stay on board and day list cards).
  • WeekProgress: head: false hides the caption row, for use inside a StatTile.
  • SideNav: roomier. Items are 40px tall (was 32) with 4px between them, labels at weight 500, a softer hover, and headings with more space above for grouping.

Build 1.10, October 19, 2026

  • Backdrop is quieter: dots move to gray-200 at half opacity, peaks drop to 30% and get smaller, and the default is dots. Peaks felt distracting behind real work.

Build 1.9, October 19, 2026

  • MonthCalendar: a project chip now shows its brand the same way a board card does: the 20px brand tile and the name (.gv-task-brand inside .gv-cal-chip-stack), then the stage mark and title. The name uses subdued on chips to hold 4.5:1 on the chip fill. Replaces the plain brand line from 1.4.
  • TaskCard and calendar items take brandLogo: the brand's logo in the tile in place of initials, on the board and the calendar.

Build 1.8, October 19, 2026

  • ProjectCard: step may be 0 (an empty meter), and stepLabel overrides "Step 3 of 6". Projects use it to show finished production steps ("3 of 8 steps").
  • Added Backdrop: a quiet texture behind the page (.gv-backdrop): peaks (the logo's two rounded peaks as faint lines in accent-subtle, over dots), dots (gray-300 dots alone) or plain. Solid tokens only, no gradient, no motion; people choose it in Settings.

Build 1.7, October 19, 2026

  • New token scrim (light and dark): the dimmed page behind a drawer or dialog.
  • Added Drawer: a panel from the right with a dimmed page behind it, focus kept inside, Escape to close (unless a menu or form inside already used it), and focus returned (.gv-drawer). Home opens projects in it.
  • Added WeekProgress: one solid segment per shown day, past days filled and today filled as far as the day has gone, with day labels and a "Day 3 of 5" caption (.gv-week). Sits beside the greeting on Home.
  • MonthCalendar: weekStart takes any day (0 to 6), and days chooses which weekdays show (for a five day or custom week). Hidden days leave the grid, and Alt with Left or Right skips them.

Build 1.6, October 19, 2026

  • Card: the body grows to fill the card, so cards stretched to the same height in a grid keep their footers lined up along the bottom.
  • ProjectCard: amount shows the fee at the right of the footer (.gv-project-amount). Used by the card view on Projects, where sorting by revenue needs the number in view.
  • New project stage In review between Editing and Published, for when a cut is with the brand. It uses the notice (orange) mark, the waiting color, with the visibility icon. The stage pie now fills in fifths (0, 0.2, 0.4, 0.6, 0.8, then the check). The Projects board has six columns. Affects Badge, StatusLight, Picker, MonthCalendar, KanbanBoard and every project screen.

Build 1.5, October 19, 2026

  • PropertyList: stacked puts each label above its value (.gv-props-stacked), for setup forms on phones.
  • Fix: a quiet Picker pulled itself left with a negative margin, which also made it 6px narrower than its label, so names were cut short ("Northpeak Au..."). It now shifts with left and keeps its full width.
  • Fix: a selected Tag kept its white text on the light hover fill, so it nearly vanished under the pointer. Selected tags now darken to neutral-hover on hover.
  • Added BackLink: chevron and destination name at the top of a detail page (.gv-back). Replaces the prototype-only .back in design/prototypes/shell.css. Used on the Project, Brand, Product, Contract and Invoice pages.

Build 1.4, October 19, 2026

  • TagGroup: selectionMode: 'single' (with required) for picking one option by tapping, and sizes M (32px) and L (40px) for forms, so setting up a project is tap to choose (brand, content type, contract kind). Children after items sit at the end of the row. New .gv-tags-m, .gv-tags-l.
  • Added FileDrop: a drop zone with a Choose files button for documents and images (.gv-drop). Used by Products and Contracts.
  • MonthCalendar: in projects mode each chip shows the brand above the title (.gv-cal-chip-text, .gv-cal-chip-brand), so the Home calendar says who each project is for at a glance.

Build 1.3, October 19, 2026

  • MonthCalendar: day notes. New dayNotes and onDayNotesChange props for holidays, time off and custom notes on a day or a range, shown in the grid (label and icon, with a soft shade for holidays and time off), as a bar on the phone grid, and at the top of the day list with Add, Edit and Remove. New .gv-cal-off, .gv-cal-note*, .gv-cal-daynote* and .gv-cal-noteform* styles. Affects the Home calendar and the future Calendar page.

Build 1.2, October 19, 2026

  • Added Account: avatar, name and a detail line for the foot of the side navigation (.gv-account). Replaces the prototype-only .me block in design/prototypes/shell.css. Affects the app frame on desktop.

Build 1.1, October 19, 2026

  • Added Logo: the lockup with a light and a dark source, swapped by data-theme in CSS (.gv-logo). Replaces the prototype-only swap in design/prototypes/shell.css for the app frame. Affects the side navigation and the phone top bar.

Build 1.0, October 19, 2026

First version handed to the app, exported from the Makado design system on claude.ai.

  • Structure from Adobe Spectrum 2 (layers, gray ramp, semantic colors, type roles, spacing, radii, three-layer shadows, workflow icons). Brand from the Makado logo: accent blue #174AF2, sand, sky and mint, Outfit and Figtree.
  • Components: Icon, Illustration, Button, ActionButton, SegmentedControl, Link, Badge, StatusLight, Tag, TagGroup, Avatar, Meter, PageHeader, SectionHeader, SideNav, Tabs, TabBar, Card, InlineAlert, Divider, ListRow, ListView, Meta, StatTile, ProjectCard, EmptyState, TextField, Checkbox, Picker, PropertyList, Property, ScheduleTable, TaskCard, KanbanColumn, KanbanBoard, MonthCalendar, WinsCard.
  • Project statuses (To do, Pre-production, Filming, Editing, Published) with stage pie marks.
  • MonthCalendar projects mode with drag to reschedule and a drop preview.
  • Fix: the board's hidden column labels no longer widen the page on phones (.gv-board-scroll is now positioned).