zugzbot 1.0.21 → 1.0.22

package/.opencode/oh-my-design/web/references/laftel/.verification.md

@@ -1,39 +0,0 @@
-# Laftel — Verification Notes (2026-06-03)
-
-## Proof — Tier 1 live inspect
-**Inspected:** 2026-06-03
-**Method:** raw source-file fetch (homepage HTML + CSS bundles + JS styled-components chunk)
-**Sources:**
-- https://laftel.net (homepage HTML, 67 501 bytes)
-- https://laftel.net/_next/static/css/362d5636d1faf962.css (simplebar CSS, 2 898 bytes)
-- https://laftel.net/_next/static/css/4e57b743a29280e8.css (Pretendard import + slick carousel, 3 603 bytes)
-- https://laftel.net/_next/static/chunks/b3ccd441-eef37a2225571c0d.js (363 246 bytes — styled-components definitions)
-- https://apps.apple.com/kr/app/라프텔/id1169440095 (App Store listing)
-
-### Raw samples
-- live laftel.net HTML inline `<style>`: `--foreground-slight:#816BFF` (light mode), `--background-highlight:#F0EDFF`, `--button-slight-1:#F0EDFF`, `--button-slight-2:#D9D3FF`, `--button-purple-gray:#191B2A`, `--background-toast:#000000` (light) / `#242537` (dark), `--foreground-1:#121212` (light) / `#F7F7F7` (dark)
-- live laftel.net HTML inline `<style>` `.ghsWCp`: `background:#816BFF; border-radius:50%; height:1.0625rem; font-size:0.625rem; font-weight:700; color:#FFFFFF`
-- live laftel.net HTML inline `<style>` `.gaokQc` (Toast): `border-radius:0.25rem; padding:1rem 0.75rem; background-color:var(--background-toast); font-size:0.875rem; min-height:3rem; transition:opacity 0.2s ease,transform 0.2s ease`
-- live laftel.net HTML inline `<style>` `.ksUJkh` (NavBar): `height:4rem; padding:0 3.125rem; color:#FFFFFF` + `scrollbar-thumb border-radius:8px`
-- live laftel.net `b3ccd441` JS chunk — lJ color map: `PURPLE50:"#F0EDFF"`, `PURPLE100:"#D9D3FF"`, `PURPLE200:"#C0B5FF"`, `PURPLE300:"#A797FF"`, `PURPLE400:"#9481FF"`, `PURPLE500:"#816BFF"`, `PURPLE600:"#7963FF"`, `PURPLE700:"#6E58FF"`, `PURPLE800:"#644EFF"`, `PURPLE900:"#513CFF"`
-- live laftel.net `b3ccd441` JS chunk — gray map: `DARKGRAY900:"18, 18, 18"` (#121212), `DARKGRAY800:"50, 50, 50"` (#323232), `PURPLEGRAY800:"36, 37, 55"` (#242537), `PURPLEGRAY900:"25, 27, 42"` (#191B2A); `RED300:"241, 99, 97"` (#F16361), `RED500:"255, 16, 16"` (#FF1010)
-- live laftel.net `b3ccd441` JS chunk — button lK primary: `background: ${lJ.PURPLE500}` (#816BFF); hover: `background: ${lJ.PURPLE700}` (#6E58FF); disabled: `background: ${lk.buttonDisable}` (#EEEEEE), `color: ${lk.foregroundDisable}` (#D0D0D0)
-- live laftel.net `b3ccd441` JS chunk — button lq sizes: sm `height:hO(48)=48px; font-size:hO(16)=16px; padding-left:hO(20)=20px`; md `height:hO(56)=56px; font-size:hO(18)=18px; padding-left:hO(18)=18px`
-- live laftel.net `b3ccd441` JS chunk — button l$ base: `border-radius:hO(4)=4px; font-weight:700; border:none`
-- live laftel.net `b3ccd441` JS chunk — fontSize.web: `{"title-xxl":40,"title-xl":32,"title-l":28,"title-m":24,"title-s":20,"text-l":18,"text-m":16,"text-s":14,"text-xs":13,"text-xxs":12}`
-- live laftel.net CSS bundle 4e57b743: `@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.6/dist/web/static/pretendard.css")` — confirms Pretendard as brand font
-- live laftel.net HTML inline `<style>` skeleton: `background:linear-gradient(to right,var(--background-3) 0%,var(--background-1) 25%,var(--background-3) 50%,var(--background-3) 100%);background-size:200% 100%;animation:ganiTH 1.5s infinite linear`
-- live laftel.net HTML inline `<style>` spinner `.hxIXDd`: `stroke-dasharray:22.51...px,90.05...px; animation:hpaRNO 1.4s ease-in-out infinite`
-- live laftel.net HTML `<style>` transitions: `transition:color 0.4s`, `transition:background-color 0.4s,box-shadow 0.4s`, `transition:opacity 0.2s ease,transform 0.2s ease`
-- live laftel.net HTML meta `<title>`: "라프텔 - 애니 추천 · 애니 스트리밍 · 애니 굿즈"; `og:site_name="Laftel"`; `og:image="https://static.laftel.net/og_image_1200x1200.png"`; `html lang="ko"`; font-family declaration: `Pretendard,-apple-system,BlinkMacSystemFont,system-ui,Roboto,'Helvetica Neue','Segoe UI','Apple SD Gothic Neo','Noto Sans KR',...,sans-serif!important`
-
-## Tier 2 — cross-check
-- getdesign.md/laftel — NOT LISTED. Page returns: "No designs found for 'laftel'."
-- refero ?q=Laftel — no result. Page returned 4 201 bytes with no Laftel listing.
-
-## Country + regional sources
-- country: KR; parent company Aniplus (애니플러스) HQ: Seoul, Korea
-- brand-owned regional sources (≥2):
-  1. https://laftel.net — Korean-language homepage (`html lang="ko"`, Korean meta description, Korean title)
-  2. https://laftel.net/_next/static/chunks/b3ccd441-eef37a2225571c0d.js — production JS served from Korean OTT's own CDN
-  3. https://apps.apple.com/kr/app/라프텔/id1169440095 — Korean App Store listing published by Laftel

package/.opencode/oh-my-design/web/references/laftel/DESIGN.md

@@ -1,293 +0,0 @@
----
-id: laftel
-name: "Laftel"
-country: KR
-category: consumer-tech
-homepage: "https://laftel.net"
-primary_color: "#816BFF"
-logo:
-  type: favicon
-  slug: "https://www.google.com/s2/favicons?domain=laftel.net&sz=256"
-verified: "2026-06-03"
-omd: "0.1"
-tokens:
-  source: prose-derived
-  extracted: "2026-06-09"
-  colors:
-    primary: "#816bff"
-    primary-hover: "#6e58ff"
-    brand: "#816bff"
-    canvas: "#ffffff"
-    foreground: "#121212"
-    muted: "#8a8a8a"
-    surface: "#242537"
-    hairline: "#eeeeee"
-    accent-wash: "#f0edff"
-    error: "#f16361"
-    on-primary: "#ffffff"
-  typography:
-    family: { sans: "Pretendard", mono: "Pretendard" }
-    title-xxl: { size: 40, weight: 700, lineHeight: 1.5, use: "Largest display title" }
-    title-xl:  { size: 32, weight: 700, lineHeight: 1.5, use: "Section title" }
-    title-l:   { size: 28, weight: 700, lineHeight: 1.5, use: "Sub-section title" }
-    title-m:   { size: 24, weight: 700, lineHeight: 1.5, use: "Card / block title" }
-    title-s:   { size: 20, weight: 700, lineHeight: 1.5, use: "Small title" }
-    text-l:    { size: 18, weight: 700, lineHeight: 1.5, use: "Large body / button label" }
-    text-m:    { size: 16, weight: 400, lineHeight: 1.5, use: "Default body" }
-    text-s:    { size: 14, weight: 700, lineHeight: 1.5, use: "Nav link, toast, small label" }
-    text-xs:   { size: 13, weight: 400, lineHeight: 1.5, use: "Metadata" }
-    text-xxs:  { size: 12, weight: 400, lineHeight: 1.5, use: "Fine print" }
-  spacing: { xs: 4, sm: 8, md: 12, base: 16, lg: 24, xl: 32, xxl: 48 }
-  rounded: { sm: 4, md: 4, lg: 8, full: 9999 }
-  shadow:
-    none: "none"
-  components_harvested: true
-  components:
-    button-primary: { type: button, bg: "#816bff", fg: "#ffffff", radius: "4px", height: "56px", padding: "0 18px", font: "18px / 700", states: "hover #6e58ff", use: "Primary CTA (md)" }
-    button-primary-sm: { type: button, bg: "#816bff", fg: "#ffffff", radius: "4px", height: "48px", padding: "0 20px", font: "16px / 700", use: "Primary CTA (sm)" }
-    button-slight: { type: button, bg: "#f0edff", fg: "#816bff", radius: "4px", height: "56px", font: "18px / 700", states: "hover #d9d3ff", use: "Secondary action" }
-    button-disabled: { type: button, bg: "#eeeeee", fg: "#8a8a8a", radius: "4px", height: "56px", use: "Disabled action" }
-    nav-bar: { type: tab, bg: "#ffffff", fg: "#121212", height: "64px", padding: "0 50px", border: "1px solid #eeeeee", font: "14px / 700", active: "link color #816bff", use: "Desktop nav — active/hover link purple" }
-    badge-notification: { type: badge, bg: "#816bff", fg: "#ffffff", radius: "9999px", height: "17px", font: "10px / 700", use: "Notification count badge" }
-    toast: { type: toast, bg: "#242537", fg: "#ffffff", radius: "4px", padding: "16px 12px", height: "48px", font: "14px / 400", use: "Default toast (#000000 light / #242537 dark)" }
----
-
-# Laftel
-
-Korea's largest anime streaming platform — a dual-mode (light/dark) product built around a vivid purple identity, fan-curated discovery, and legal access to Japan's animation catalog.
-
-## 1. Visual Theme & Atmosphere
-
-Laftel's interface reads as a dark-first entertainment shell with a saturated violet accent, much like a premium streaming dashboard tuned for anime fans. The default experience leans toward deep charcoal backgrounds (#121212 / #000000) layered with a luminous purple (#816BFF) that signals interactivity, brand moments, and delight. In light mode the same purple pops against near-white surfaces (#FFFFFF / #F7F7F7), giving the product a punchy, youthful energy without the visual fatigue of a fully dark app. Thumbnail-heavy grids dominate layouts, so colour takes a supporting role — framing content rather than competing with it. The result is a streaming UI that feels simultaneously otaku-authentic and modern enough for a mainstream Korean OTT audience.
-
-## 2. Color Palette & Roles
-
-- **Purple 500 (Brand Primary):** `#816BFF` — primary CTA buttons, active nav links, badges, icons, brand foreground
-- **Purple 50 (Highlight):** `#F0EDFF` — slight button background (light), hover highlight wash
-- **Purple 100 (Slight 2):** `#D9D3FF` — hover state for slight buttons
-- **Purple Gray 800 (Dark Surface):** `#242537` — dark toast background, dark button-purple-gray surface
-- **Purple Gray 900 (Deep Nav):** `#191B2A` — light-mode button-purple-gray accent, deep overlay
-- **Background 1 (Light):** `#FFFFFF` — primary surface in light mode
-- **Background 1 (Dark):** `#121212` — primary surface in dark mode
-- **Background 2 (Dark base):** `#000000` — deepest dark background
-- **Background 3:** `#EEEEEE` / `#323232` — skeleton, subtle dividers (light/dark)
-- **Foreground 1 (Light):** `#121212` — primary text on light
-- **Foreground 1 (Dark):** `#F7F7F7` — primary text on dark
-- **Foreground 2:** `#505050` / `#E2E2E2` — secondary text (light/dark)
-- **Foreground 3:** `#8A8A8A` / `#ABABAB` — tertiary / metadata text
-- **Border 1:** `#EEEEEE` / `#323232` — default hairline separator
-- **Red 300:** `#F16361` — error / destructive state
-- **Red 500:** `#FF1010` — critical alert
-
-## 3. Typography Rules
-
-- **Font family:** Pretendard (loaded via cdn.jsdelivr.net/gh/orioncactus/pretendard), falling back to -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Noto Sans KR"
-- **Base size:** 16px on `html, body`
-- **Scale (web):** title-xxl 40px · title-xl 32px · title-l 28px · title-m 24px · title-s 20px · text-l 18px · text-m 16px · text-s 14px · text-xs 13px · text-xxs 12px
-- **Weight:** 700 is the only declared weight in component CSS (nav links, badges, buttons, labels); body inherits from Pretendard's default
-- **Line height:** 1.5 globally via `:root`; badge label `line-height: 150%`
-- **Letter spacing:** `normal` reset on all elements
-- **Smoothing:** `-webkit-font-smoothing: antialiased`
-
-## 4. Component Stylings
-
-### Buttons
-
-**Primary (md)**
-- Background: `#816BFF`
-- Text: `#FFFFFF`
-- Border: none
-- Radius: 4px
-- Height: 56px
-- Padding: 0 18px
-- Font: 18px / 700
-- Hover background: `#6E58FF`
-
-**Primary (sm)**
-- Background: `#816BFF`
-- Text: `#FFFFFF`
-- Border: none
-- Radius: 4px
-- Height: 48px
-- Padding: 0 20px
-- Font: 16px / 700
-
-**Slight (secondary)**
-- Background: `#F0EDFF`
-- Text: `#816BFF`
-- Border: none
-- Radius: 4px
-- Height: 56px
-- Hover background: `#D9D3FF`
-
-**Disabled**
-- Background: `#EEEEEE`
-- Text: `#D0D0D0`
-- Radius: 4px
-- Height: 56px
-
-### Navigation Bar
-
-**Desktop Nav**
-- Background: `#FFFFFF` / `#121212` (themed via CSS var)
-- Height: 4rem (64px)
-- Padding: 0 3.125rem (50px)
-- Active link color: `#816BFF`
-- Default link color: `var(--foreground-1)`
-- Hover link color: `#816BFF`
-- Font: 0.875rem (14px) / 700
-- Bottom border: 1px solid `var(--border-1)`
-
-### Badge / Pill
-
-**Notification Badge**
-- Background: `#816BFF`
-- Text: `#FFFFFF`
-- Radius: 50%
-- Height: 1.0625rem (17px)
-- Font: 0.625rem (10px) / 700
-
-### Toast
-
-**Default Toast**
-- Background: `#000000` (light) / `#242537` (dark)
-- Text: `#FFFFFF`
-- Radius: 0.25rem (4px)
-- Padding: 1rem 0.75rem
-- Min-height: 3rem (48px)
-- Font: 0.875rem (14px)
-- Transition: opacity 0.2s ease, transform 0.2s ease
-
----
-**Verified:** 2026-06-03
-**Tier 1 sources:** https://laftel.net (homepage HTML — full CSS custom properties block in inline `<style>`); https://laftel.net/_next/static/chunks/b3ccd441-eef37a2225571c0d.js (styled-components button/badge/nav definitions, full PURPLE scale, font scale); https://laftel.net/_next/static/css/4e57b743a29280e8.css (Pretendard font import); https://apps.apple.com/kr/app/라프텔/id1169440095 (App Store listing, brand copy)
-**Tier 2 sources:** getdesign.md/laftel — NOT LISTED ("No designs found for 'laftel'"). refero ?q=Laftel — no result (page returned empty listing, 4201 bytes).
-**Conflicts unresolved:** none
-
-## 5. Layout Principles
-
-- **Grid:** Thumbnail-first horizontal carousels and vertical grid layouts; desktop max-width ~1920px reference in font-size calc
-- **Breakpoints:** desktop ≤1280px · tablet ≤1024px · tabletVertical ≤768px · mobile ≤480px · mobileLandscape (orientation: landscape, max-height 576px)
-- **Nav hidden below:** 1024px (`.ksUJkh` display:none at tablet)
-- **Content padding:** 3.125rem (50px) horizontal on desktop nav; responsive fluid via vw-based font-size calc
-- **Spacing rhythm:** base unit 0.5rem (8px); typical component margin 1rem (16px), 1.5rem (24px), 2.5rem (40px)
-
-## 6. Depth & Elevation
-
-- **Hairline separator:** `box-shadow: 0 1px 0 0 var(--border-1)` on sticky nav
-- **Basic shadow:** `rgba(0,0,0,0.25)` light / `rgba(0,0,0,0.5)` dark
-- **Dropdown shadow:** `rgba(0,0,0,0.16)` light / `rgba(0,0,0,0.6)` dark
-- **Scroll thumb:** 4px transparent border, `background-clip: content-box`, `border-radius: 8px`
-- **Dim overlays:** `rgba(0,0,0,0.5)` (dim-1 light) · `rgba(0,0,0,0.7)` (dim-1/2 dark)
-- **Skeleton:** gradient shimmer `linear-gradient(to right, --background-3 0%, --background-1 25%, --background-3 50%)`, animated at 1.5s infinite linear
-
-## 7. Do's and Don'ts
-
-### Do
-- Use `#816BFF` (PURPLE500) for all primary CTAs and interactive accent moments
-- Apply the purple-50 wash (`#F0EDFF`) for non-primary ("slight") button backgrounds
-- Use Pretendard at 700 weight for all button labels and nav text
-- Respect the dual-mode token system — always reference CSS custom properties (`--foreground-1`, `--background-1`) rather than hardcoded colours in themed contexts
-- Use 4px border-radius on buttons and toast components for brand consistency
-- Ensure scrollbars use the 8px border-radius thumb treatment
-
-### Don't
-- Mix hardcoded hex literals in themed components — breaks dark mode
-- Use border-radius values other than 4px (buttons), 8px (scrollbar/card accent), or 50% (circular badges) without design intent
-- Replace Pretendard with a generic sans-serif — the Korean glyph quality matters for this audience
-- Use purple accent on disabled states — disabled buttons must use `#EEEEEE` / `#D0D0D0`
-- Increase font-weight above 700 — the scale tops out here in the design system
-
-## 8. Responsive Behavior
-
-- Desktop (>1280px): Full horizontal nav with 50px side padding; wide carousels; large hero at 51.375em height; font-size calculated from 1920px reference width
-- Tablet (768px–1024px): Nav collapses to mobile; layout adapts fluid grids; hero resizes
-- Mobile (≤480px): Font-size recalculated from 360px reference width via `calc(16vw / 360 * 100)`; mobile-specific image proportions; thumbnail grids shift to 2-column
-- Touch devices: `-webkit-tap-highlight-color: transparent`; `touch-action: pan-y` on sliders; `maximum-scale=1` in viewport to prevent iOS zoom
-
-## 9. Agent Prompt Guide
-
-When generating Laftel-style UI:
-- **Palette:** primary = `#816BFF`; slight surface = `#F0EDFF`; deep dark = `#121212`; toast dark = `#242537`
-- **Buttons:** 4px radius, 48px (sm) or 56px (md) height, font-weight 700, Pretendard
-- **Mode:** always implement both light and dark variants via CSS custom properties
-- **Typography:** Pretendard, 16px base, scale: 12/13/14/16/18/20/24/28/32/40px
-- **Transitions:** colour changes at 0.4s, opacity/transform at 0.2s ease
-- **Skeleton:** shimmer gradient from `--background-3` to `--background-1` at 1.5s linear infinite
-- **Layout:** breakpoints at 480/768/1024/1280px; horizontal padding 50px desktop, fluid below
-
-## 10. Voice & Tone
-
-**Three adjectives:** Fan-fluent, warm-direct, quietly authoritative
-
-| Dimension | Do | Don't |
-|---|---|---|
-| Register | Speak as a knowledgeable fellow fan ("덕후") | Sound like a corporate broadcast | 
-| Sentence length | Short, punchy; one idea per sentence | Long nested clauses |
-| Vocabulary | K-anime vernacular where natural; plain Korean elsewhere | Jargon-heavy or overly formal keigo-style |
-| Punctuation | Light use of `:D` emoticons in taglines only | Exclamation marks on every line |
-
-**Voice samples (illustrative):**
-- *Illustrative:* "세상 모든 애니를 라프텔에서 :D" — the brand's own App Store tagline; warm, inclusive, fan-to-fan energy.
-- *Illustrative:* "추억의 애니부터 분기별 신작까지, 무제한 스트리밍 가능한 곳은 오직 라프텔." — confident authority without boasting; the "only Laftel" claim lands as fact, not hype.
-- *Illustrative:* "뭘 볼지 모를 땐, 덕후가 직접 엄선한 애니 명작들을 시청!" — peer credibility; the recommendation comes from fans, not algorithms.
-
-## 11. Brand Narrative
-
-Laftel was founded in October 2014 by Kim Beom-jun, a Yonsei University student who saw that Korea's vast appetite for Japanese animation was being served almost entirely by illegal download sites. The name "라프텔(Laftel)" is a play on "마지막 화까지 봤다" — "I watched all the way to the last episode" — enshrining the complete, satisfying anime experience in the brand itself. The service launched streaming in May 2017, building on a personalization-first model: new users rate a set of anime to calibrate their taste, and the platform surfaces recommendations through both AI-driven signals and hand-curated selections by in-house "덕후" (hardcore fans).
-
-In 2019 Ridi, Korea's leading digital content platform, acquired Laftel, bringing engineering scale and content licensing resources. In November 2022 an Aniplus-led consortium (Aniplus — Korea’s largest anime broadcaster — with Keistone Partners) acquired a controlling 87.75 % stake, giving Laftel deeper ties to broadcast rights and a clearer path to simulcast programming. Through each ownership transition the product's core mission remained stable: make legal anime viewing so convenient and affordable that piracy becomes the inferior choice.
-
-Today Laftel offers SVOD (unlimited streaming), TVOD (pay-per-episode rental/purchase), and AVOD (ad-supported free tier), available across web, iOS, Android, smart TV, and Chromecast. The Laftel Store extends the brand into anime merchandise, while original productions — including webtoon adaptations like "Super Secret" — signal ambitions beyond licensing.
-
-## 12. Principles
-
-1. **Legal first, fan always.** Every content deal is a legitimate contract; the product's legitimacy is a brand promise, not just a legal formality. *UI implication:* never use dark-pattern flows to upsell; membership upgrade prompts must be clear and skippable.
-
-2. **Personalization over browsing.** The preference-test onboarding and tag-based discovery are not features — they are the product. *UI implication:* recommendation surfaces should occupy prime real estate and update dynamically; generic "Popular" lists are a fallback, not the default.
-
-3. **Complete the series.** The name encodes the ideal outcome: watch every episode. *UI implication:* auto-play next episode is on by default; progress tracking, episode skips (OP/ED), and continue-watching rails are first-class features.
-
-4. **Fan credibility at every touch-point.** Editorial selections are attributed to "덕후" curators, not anonymous algorithms. *UI implication:* show curator handles or "staff pick" labels on themed collections; avoid anonymous "Recommended for you" copy.
-
-5. **Dual-mode comfort.** Fans watch at night; the dark theme must be as polished as the light theme. *UI implication:* all design tokens must resolve correctly in both modes; never hard-code colours in theme-sensitive components.
-
-## 13. Personas
-
-*Illustrative — Classic Fan (클래식 덕후):* Tomoyuki, 32, IT engineer in Seoul. Has watched anime since high school; wants a reliable legal home for classics (2000s titles) that free-tier competitors don't carry. Values breadth of catalog and tag-based search. Pays for the annual plan without hesitation.
-
-*Illustrative — Seasonal Watcher (분기 팔로워):* Ji-yeon, 24, university student. Follows 3–5 simulcast series each season. She checks Laftel every Monday for the latest episode. Skips OP/ED religiously. Sensitive to price; on the base plan, occasionally upgrades for a single season.
-
-*Illustrative — New Discoverer (입문자):* Soo-min, 19, high school senior whose friends are into anime. Took the preference quiz and got hooked on a romance series. Mostly watches on mobile; uses the free AVOD tier but nudgeable toward membership via free-trial CTA.
-
-*Illustrative — Goods Fan (굿즈 덕후):* Mi-rae, 28, designer. Subscribes mainly to access Laftel Store drops and exclusive merch. Browses the store tab weekly. For her, the streaming subscription is a loyalty perk on top of merchandise access.
-
-## 14. States
-
-- **Empty (no history):** Show the preference quiz CTA prominently — "어떤 애니를 좋아하세요? 취향 테스트로 시작해요" with a primary purple button; no blank grid.
-- **Loading / Streaming buffer:** Purple spinner (32×32px, `#816BFF`, stroke-dasharray animated at 1.4s ease-in-out infinite) centered in the player.
-- **Skeleton:** Shimmer gradient tiles (`linear-gradient(to right, --background-3 0%, --background-1 25%, --background-3 50%)`) at 1.5s linear infinite in place of thumbnails and text rows.
-- **Error — Network:** Inline message "잠시 후 다시 시도해 주세요" with a secondary retry button (slight variant); red 300 (`#F16361`) icon accent.
-- **Error — Unlicensed Content:** Overlay with dim-1 backdrop (`rgba(0,0,0,0.5)`) and a locked-icon illustration; "이 작품은 현재 지역 서비스 불가" copy; no CTA escalation.
-- **Success — Subscription:** Toast notification slides up from bottom center: dark background (`#000000` light / `#242537` dark), white text, 4px radius, 0.2s ease slide + fade; auto-dismisses after ~3s.
-- **Disabled:** Buttons use `#EEEEEE` background, `#D0D0D0` text; cursor: default; no hover effect.
-- **Offline / Download available:** Download badge in purple; offline indicator swaps to muted foreground-3 (`#8A8A8A`).
-
-## 15. Motion & Easing
-
-**Duration scale:**
-- Micro (state toggle, colour): 200ms
-- Short (slide-in, fade): 400ms  
-- Medium (skeleton shimmer): 1400ms–1500ms (loop)
-
-**Easing:**
-- Default transitions: `ease` (cubic-bezier(0.25, 0.1, 0.25, 1))
-- Spinner stroke animation: `ease-in-out` at 1.4s infinite
-- Skeleton shimmer: `linear` at 1.5s infinite
-- Toast slide: `ease` on both `opacity` and `transform`
-
-**Rules:**
-- Colour and background-colour transitions run at 0.4s (`transition:color 0.4s`, `transition:background-color 0.4s,box-shadow 0.4s`) for interactive elements
-- Opacity and positional transforms run at 0.2s ease for overlays and toasts
-- Never animate layout-affecting properties (width, height) on the main content grid — use opacity/transform only
-- Skeleton shimmer uses `background-size: 200% 100%` sweep; clip-path masks define thumbnail shapes

package/.opencode/oh-my-design/web/references/lamborghini/.verification.md

@@ -1,127 +0,0 @@
-# Lamborghini — Verification Notes (2026-05-08)
-
-Pipeline: `spec/verification-pipeline.md` · Skill: `omd:migrate`
-
-## Tier 1 — live DOM (playwright getComputedStyle)
-
-### Surfaces inspected (G3 ≥2)
-- `lamborghini.com/en-en` (corporate home — total-darkness cinematic hero)
-- `lamborghini.com/en-en/models` (Models lineup — same chrome confirmed)
-
-### Raw observations
-
-**Top-level Nav — ALL CAPS Ghost (Both surfaces)**
-- bg `rgba(0, 0, 0, 0)` (transparent)
-- color `rgb(255, 255, 255)` `#ffffff`
-- radius **0px** (sharp)
-- padding 16×0
-- 49px / **18px·400 ALL CAPS**
-- Items: `MODELS / OWNERSHIP / DEALERSHIPS / BEYOND / COMPANY / MOTORSPORT / MUSEUM / STORE / NEWS`
-- Use: every brand-chrome navigation item; Lamborghini's Primary discipline is text-only on dark canvas
-
-**Sub-nav — Mixed-case smaller**
-- bg transparent
-- color `#ffffff`
-- radius 0px
-- padding 16×0
-- 41px / 12px·400
-- Items: `Design / Sustainability / ...`
-
-**Skip-to-main-content — A11y Black**
-- bg `#000000`
-- color `#fff`
-- radius 0px
-- padding 16px (square)
-- 56px / 16px·400
-- Use: keyboard A11y skip link
-
-**Cookie banner CTAs (prior B9 measurement)**
-- bg `#ffffff`
-- color `#000`
-- radius 2px
-- padding 12×10
-- 42px / 13.008px·600 ALL CAPS
-- Use: GDPR consent (utility-only)
-
-### Single-system: ALL CAPS 18px·400 ghost chrome on total-darkness canvas
-
-Lamborghini, like Ferrari, uses an **imagery-led no-button discipline** — the page is a cinematic film reel, and the chrome is reduced to ALL CAPS text-only labels on transparent black:
-- All nav: 18px·400 ALL CAPS, no fills, no radii — the imagery carries everything
-- 0px sharp radius globally (Italian-precision shared with Ferrari)
-- Cookie banner is the only filled CTA pattern, and it's a utility track (GDPR), not the canonical brand chrome
-- No discoverable Primary CTA on home or /models in standard `a/button` queries — the brand operates **entirely on hover-revealed image overlays + arrow-link affordances**, not buttons
-
-**This is intentional positioning**: Lamborghini doesn't sell on a "Get started" button. The supercar register is browse → contact dealership IRL, so the website doesn't need a high-affordance CTA system. The chrome is there to **not interfere with the imagery**.
-
-This corrects the prior footer's "cookie CTAs / 2px / 13.008px·600" claim — that was the GDPR utility, not the brand canon. The actual brand canon is **ALL CAPS 18px·400 ghost text on `#000` canvas**.
-
----
-
-## Tier 2a — getdesign.md
-- `getdesign.md/lamborghini` — directory only
-
-## Tier 2b — styles.refero.design
-- `?q=Lamborghini` — no record
-
-**Tier 2 status: unavailable.** Tier 1 (lamborghini.com home + /models) treated as authoritative.
-
----
-
-## Conflict Matrix
-
-| Field | Tier 1 home | Tier 1 /models | refero/getdesign | Resolution |
-|---|---|---|---|---|
-| Nav style | ALL CAPS 18px·400 ghost | ALL CAPS 18px·400 ghost ✓ | n/a | ✓ canonical |
-| Radius | 0px | 0px ✓ | n/a | ✓ sharp |
-| Canvas | `#000000` total dark | `#000000` ✓ | n/a | ✓ cinematic |
-| Skip-nav (A11y) | `#000` square 16px | n/a | n/a | ✓ |
-| Cookie banner | `#fff` 2px / 12×10 / 42px / 13.008px·600 | n/a | n/a | utility exception |
-
-### Unresolved
-- **None.** Single-discipline canonical (no-button by intent).
-
-### Earlier mistakes reverted
-- Prior footer cited cookie banner as canonical Primary geometry. Tier 1 confirms: **canonical chrome is ALL CAPS ghost nav**, cookie banner is GDPR utility only. The brand explicitly does not use filled-Primary buttons on home/models — Lamborghini sells through cinematic imagery + dealership routing, not webform-CTA flow.
-
----
-
-## Components in §4
-
-§4 (prior B9 batch) — should document:
-1. ALL CAPS 18px·400 ghost nav as the **canonical brand chrome** (not a "secondary" or "navigation only" treatment)
-2. Total-darkness `#000` canvas as the page surface
-3. Cookie banner 2px / 13.008px·600 as a separate utility-only track
-4. **Note**: no Primary filled CTA exists on home/models — this is intentional positioning, not a missing pattern
-
----
-
-## Philosophy sources (G6)
-
-### Founder/founding facts
-- **Automobili Ferruccio Lamborghini S.p.A. founded 1963** at **Sant'Agata Bolognese**
-  - Source: [Lamborghini — Wikipedia](https://en.wikipedia.org/wiki/Lamborghini)
-  - Source: [Lamborghini.com — History/Company](https://www.lamborghini.com/en-en/history/company)
-- Founder: **Ferruccio Lamborghini** — Italian manufacturing magnate; ran **Lamborghini Trattori** (tractor business) before founding the car company
-  - Source: [Ferruccio Lamborghini — Wikipedia](https://en.wikipedia.org/wiki/Ferruccio_Lamborghini)
-- **Founding engineering team**: Giotto Bizzarrini (engine) + Gian Paolo Dallara + Paolo Stanzani (chassis) + Franco Scaglione (bodywork)
-- **First series-produced car**: **350 GT** (V-12 grand tourer)
-- **1973 oil crisis** → sales decline → **1972 majority stake sold to Georges-Henri Rossetti** → **1974 remaining interest sold to René Leimer**, Ferruccio retired
-- **1998: Mycom Setdco + V'Power sold Lamborghini to Volkswagen Group** — placed under **Audi** control
-  - Source: [Volkswagen Group — History of Lamborghini](https://www.volkswagen-group.com/en/the-history-of-the-brands-17668/the-history-of-lamborghini-17676)
-- **Bull theme**: Aventador, Huracán, Urus, Revuelto — names from Spanish fighting-bull lineage; Ferruccio was Taurus zodiac
-- **Famous Ferrari-clutch dispute origin** is **apocryphal but widely circulated** — should not be presented as verified fact
-
-### Voice samples (live-verified)
-- *"MODELS"* / *"OWNERSHIP"* / *"DEALERSHIPS"* / *"BEYOND"* / *"COMPANY"* / *"MOTORSPORT"* / *"MUSEUM"* / *"STORE"* / *"NEWS"* — primary nav <!-- verified: lamborghini.com/en-en 2026-05 -->
-
-### Existing §10-15 retained from prior augmentation (B9 batch)
-- Voice & Tone — supercar register, ALL CAPS aggression
-- §11 narrative — Ferruccio 1963 founding + 1998 Audi/VW
-- §12 Principles — total-darkness canvas, sharp 0px, ALL CAPS as register
-
----
-
-**Verified-against:**
-- Tier 1: lamborghini.com/en-en, lamborghini.com/en-en/models (live DOM via playwright)
-- Tier 2: refero/getdesign — no record
-- History/ownership: Wikipedia (Lamborghini, Ferruccio Lamborghini, History of Lamborghini), Volkswagen Group corporate, Lamborghini.com/history, Automotive Hall of Fame