フィウ旅 · Design System

旅フィウ旅 · Fiu Tabi

Dvě plnohodnotné identity — Tokyo Neon jako vyběraný cyberpunk po setmění a Sakura Garden jako klidná tradiční zahrada. Stejný layout, stejná data, dvě atmosféry.

Phase 1Tailwind v4Geist · Shippori · Dela Gothic

Typography

文字

Latin: Geist Sans + Geist Mono. JP: Noto Sans JP + Shippori Mincho. Display accent: Dela Gothic One (Tokyo Neon) / Shippori Mincho ExtraBold (Sakura).

Display & headlines

Hero kanji + section titles

旅

Tokyo at midnight

京都の朝

Headline H3 · sloupec dne

Body & support

Reading sizes + JP mincho

Aplikace je konfigurátor variant cesty, ne booking. Skládáme dny jako lego z atrakcí, restaurací a přesunů.

浅草寺の朝、雷門をくぐると、まだ静かな仲見世通りが続く。

Sekundární text · 14px · pro popisky a metadata

Caption · 12px · uppercase, tight tracking

$ pnpm db:seed → Varianta A 12 nocí

Color tokens

色彩

Sémantické tokeny. Mění se per téma, kód se nemění.

--bg

Application background

--bg-elevated

Elevated surface

--surface

Card / panel

--surface-2

Secondary surface

--fg

Primary text

--fg-muted

Muted text

--fg-subtle

Subtle text / hints

--border

Default border

--border-strong

Strong border / hover

--accent

Brand accent

--accent-2

Secondary accent

--accent-3

Tertiary accent

--success

Success state

--warning

Warning state

--danger

Danger / risk

Day palette

日々の色

Akcenty pro označení dní v plánu (D1–D14 cyklicky). V Tokyo Neonu neon, v Sakuře tlumeně.

D1#ff3d8a

D2#29e7ff

D3#b65bff

D4#ffd84d

D5#4ade80

D6#ff9f59

Buttons

ボタン

Varianty pro různé akce. Aktivní stav má microshadow / glow.

Badges

ラベル

Stavy rezervací, energy budgety, priority.

NOT_BOOKEDTODOCONFIRMEDOKAT_RISKCRITICALEMOTIONAL HIGHLIGHT10/10 ENERGYDENSITY ⚠

Plan card preview

計画

Tak vypadá karta dne v Board view.

D524. 10. 2026

10/10⚠

Tokyo · Asakusa

09:00Adidas Futsal Park★
12:30Ichiran Shibuya
15:00teamLab Borderless
20:00Shibuya Sky

4 položky · ~ 12.4 km · ¥ 14 800

D625. 10. 2026

6/10

Tokyo → Hakone

09:00Shinkansen Kodama
11:30Owakudani lanovka
14:00Pirátská loď
16:00Mount View Ryokan

4 položky · ~ 12.4 km · ¥ 14 800

D928. 10. 2026

7/10

Kyoto · Higashiyama

07:30Fushimi Inari (sunrise)
11:00Kiyomizu-dera
13:30Nishiki market
19:00Gion Hatanaka kaiseki

4 položky · ~ 12.4 km · ¥ 14 800

Japan icon set

絵記号

Domácí SVG ikony pro typy entit (Item, Lodging, Transport).

Atrakce

Restaurace

Shinkansen

Sakura

Onsen

Highlight

Forms

入力

Inputs, textarea, focus state.

Název atrakce(name)

Japonsky(nameJa)

Poznámka

Reservations alert

予約

Critical alert banner (zobrazený napříč aplikací při blízkých deadlinech).

🔴

3 kritické rezervace do 30 dní

Ghibli Museum (10. 9. 03:00 SEČ) · teamLab (23. 8.) · USJ Express (15. 8.)

Shibuya rooftop

渋谷屋上

Drone shot pohled přes střechu mrakodrapu na fotbalové hřiště (Adidas Futsal Park, 4. patro Shibuya Stream — Lukášův emocionální highlight). Tokyo Drift inspirace: červené auto driftuje po obvodu, kouř za pneumatikami, hráči 4v4, míč v nekonečném oběhu, ulice Shibuye dole. Preview komponenty — ne v hlavní landing.

Pure SVG + CSS animations: animateMotion pro auto a míč, @keyframes player-drift-* pro mikro-pohyby hráčů, perspektiva ulice s flow markerů, HUD rohy + REC indikátor. Reaguje na motiv (Tokyo Neon vs Sakura).

一期一会

Ichi-go ichi-e — jednou v životě, jedinečné setkání