portal/app/resources/js/components/AppShell.vue

<script setup lang="ts">
/**
 * Корневая Vuetify-обёртка приложения.
 *
 * Пока минимальный layout (app-bar + main + footer-placeholder) — реальные
 * экраны будут отдельными components/views, мапящимися в Vue Router
 * по SPA-маршрутам. На MVP-старт фазы 2 — smoke-test того, что Vue +
 * Vuetify собираются и палитра Forest применяется.
 *
 * Источник дизайна: liderra_v8_handoff/concepts/v8_dashboard.html.
 */
import { ref } from 'vue';

const product = ref('Лидерра.');
</script>

<template>
    <v-app>
        <v-app-bar color="secondary" :elevation="0">
            <v-app-bar-title class="text-h6">
                {{ product }}
            </v-app-bar-title>
            <template #append>
                <v-chip color="primary" size="small" variant="elevated">phase 2</v-chip>
            </template>
        </v-app-bar>

        <v-main>
            <v-container>
                <v-card class="pa-6" :max-width="640">
                    <h1 class="text-h4 mb-2">Vue 3 + Vuetify 3 — фаза 2 запущена</h1>
                    <p class="mb-4">
                        Триггер фазы 2 по
                        <code>CLAUDE.md §6</code> — первый коммит в <code>resources/js/</code>. Активирует tooling:
                        Volar, vue-tsc, ESLint+Prettier+Vue, Vitest, Histoire.
                    </p>
                    <v-btn color="primary">primary</v-btn>
                    <v-btn class="ms-2" color="secondary">secondary</v-btn>
                </v-card>
            </v-container>
        </v-main>
    </v-app>
</template>