/* =====================================================
   JJAPTOON Notice UI v3
   Design Tokens
===================================================== */

:root{

    /* ========================
       Brand
    ======================== */

    --primary:#facc15;
    --primary-hover:#eab308;

    --secondary:#facc15;

    /* ========================
       Background
    ======================== */

    --bg:#ffffff;

    --bg-soft:#fefce8;

    --bg-card:rgba(250,204,21,.08);

    --bg-card-hover:rgba(250,204,21,.15);

    /* ========================
       Glass
    ======================== */

    --glass:rgba(250,204,21,.08);

    --glass-border:rgba(250,204,21,.20);

    --glass-highlight:rgba(250,204,21,.30);

    --backdrop:blur(22px);

    /* ========================
       Text
    ======================== */

    --text:#1a1a1a;

    --text-light:#713f12;

    --text-muted:#a16207;

    /* ========================
       Border
    ======================== */

    --border:rgba(250,204,21,.15);

    /* ========================
       Radius
    ======================== */

    --radius-xs:8px;

    --radius-sm:12px;

    --radius:18px;

    --radius-lg:28px;

    --radius-xl:40px;

    /* ========================
       Shadow
    ======================== */

    --shadow-sm:
        0 8px 20px rgba(0,0,0,.18);

    --shadow:

        0 15px 40px rgba(0,0,0,.30);

    --shadow-blue:

        0 0 30px rgba(250,204,21,.15);

    --shadow-purple:

        0 0 40px rgba(250,204,21,.10);

    /* ========================
       Layout
    ======================== */

    --container:1200px;

    --header-height:80px;

    --section-gap:32px;

    /* ========================
       Font
    ======================== */

    --font:

    "Pretendard",

    "Noto Sans KR",

    "Microsoft YaHei",

    sans-serif;

    --font-size-xs:12px;

    --font-size-sm:14px;

    --font-size:16px;

    --font-size-lg:18px;

    --font-size-xl:24px;

    --font-size-title:44px;

    /* ========================
       Transition
    ======================== */

    --transition:.25s ease;

    --transition-slow:.5s ease;

    /* ========================
       Z-index
    ======================== */

    --z-loading:9999;

    --z-toast:9998;

    --z-header:100;

}

/* ===========================
   Dark Theme (for toggle)
=========================== */

html.dark{

    color-scheme:dark;

    --bg:#0f0f0f;

    --bg-soft:#1a1a1a;

    --bg-card:rgba(255,255,255,.04);

    --bg-card-hover:rgba(255,255,255,.08);

    --glass:rgba(255,255,255,.05);

    --glass-border:rgba(255,255,255,.10);

    --glass-highlight:rgba(255,255,255,.15);

    --text:#FFFFFF;

    --text-light:#D1D5DB;

    --text-muted:#94A3B8;

    --border:rgba(255,255,255,.08);

}

/* ===========================
   Reset Variables
=========================== */

*{

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    margin:0;

    font-family:var(--font);

    background:var(--bg);

    color:var(--text);

    overflow-x:hidden;

}