CosMate Bar — Mockup 總覽

聊天室與後台的所有設計稿。點卡片開啟。

聊天室 · 風格 B 霓虹玻璃

目前主推的版本。居酒屋實景背景依 GMT+8 時間自動換白天／夜晚，霓虹玻璃介面、Listen.moe 直播音樂、長按選單與回覆。對話框維持現狀的 iOS 半透明圓角。

lofi-bar-b-neon.html

後台管理台

人數上限、每日重置、跑馬燈公告、背景音樂、聊天室背景、在線成員與封鎖管理。新增「對話框造型」待選清單（八款候選，尚未選定）。

admin-demo.html

對話框造型 — 八款候選

同一段對話、同一組配色，只換氣泡造型。造型 1–3 為第一輪提案；造型 4–6 是漫畫路線的修正版（解掉造型 1 尾巴接縫的破損感）；造型 7–8 換完全不同的做法。選好後才會套進聊天室，目前聊天室維持現狀。

bubble-shapes-demo.html

聊天室 · 風格 A 復古像素

第一輪的另一個方向：點陣字、掃描線、復古終端機配色。目前沒有繼續往下做。

lofi-bar-a-retro.html

滑卡聽歌 UX Demo

滑卡試聽的五種互動方案（v2–v5 與參考實作），與聊天室分開的獨立主題。

../demos/index.html

目前待辦：對話框造型八選一尚未拍板，聊天室先維持現狀的 iOS 半透明圓角。
選定後需同步更新的地方：聊天室 lofi-bar-b-neon.html 的 .bub 樣式，以及後台造型卡片的「目前套用」欄位。