/* 2026 Chotto Matte! Generator: darui3018823 All rights reserved. */
/* All works created by darui3018823 associated with this repository are the intellectual property of darui3018823. */
/* Packages and other third-party materials used in this repository are subject to their respective licenses and copyrights. */

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@500;700;800;900&family=Noto+Sans+JP:wght@500;600;700;800;900&family=Nunito+Sans:wght@400&family=Poppins:wght@400&family=Red+Hat+Display:ital,wght@1,700&display=swap');

/* LINE Seed JP Font */
@font-face {
    font-family: 'LINE Seed JP';
    src: url('/fonts/LINESeedJP_OTF_Rg.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

.font-lineseed {
    font-family: 'LINE Seed JP', sans-serif;
}

.font-poppins {
    font-family: 'Poppins', sans-serif;
}

.font-nunito {
    font-family: 'Nunito Sans', sans-serif;
}

/* Base Styles */
body {
    font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
}

/* Preview Area */
.preview-container {
    position: relative;
    display: inline-block;
    max-width: 100%;
}

.overlay-text {
    position: absolute;
    /* Default to center-ish */
    top: 50%;
    left: 20%;
    transform: translate(-50%, -50%);
    /* This will be overridden by JS for rotation */

    white-space: pre-wrap;
    line-height: 1.2;
    pointer-events: none;

    /* Vertical Writing Default */
    writing-mode: vertical-rl;
    text-orientation: upright;

    /* Center vertical text within the text box width */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Font Classes */
.font-hiragino {
    font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
}

.font-mplus {
    font-family: 'M PLUS 1p', sans-serif;
}

.font-noto {
    font-family: 'Noto Sans JP', sans-serif;
}

.font-system {
    font-family: system-ui, sans-serif;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.dark ::-webkit-scrollbar-thumb {
    background: #475569;
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}