:root {
    --theme-accent: #f59e0b;
    --theme-accent-gold: #f59e0b;
    --theme-accent-red: #5C2D2D;
    --theme-background: #FFFBEB;
    --theme-background-alt: #FFFFFF;
    --theme-badge-error-bg: #F5E8E8;
    --theme-badge-error-text: #963333;
    --theme-badge-info-bg: #F3EEED;
    --theme-badge-info-text: #5C2D2D;
    --theme-badge-success-bg: #E8F5ED;
    --theme-badge-success-text: #2D6B48;
    --theme-badge-warning-bg: #FBF3E5;
    --theme-badge-warning-text: #7A5A1A;
    --theme-border: #fde68a;
    --theme-border-hover: #C4BEB6;
    --theme-button-disabled: #D5CFC8;
    --theme-button-primary: #b45309;
    --theme-button-primary-active: #3D1B1B;
    --theme-button-primary-hover: #92400e;
    --theme-button-primary-text-hover: #ffffff;
    --theme-button-secondary: #78350f;
    --theme-button-secondary-active: #2D2926;
    --theme-button-secondary-hover: #92400e;
    --theme-button-secondary-text-hover: #ffffff;
    --theme-button-text: #ffffff;
    --theme-card-background: #FFFFFF;
    --theme-card-hover-background: #FAF8F6;
    --theme-card-hover-border: #C4A882;
    --theme-card-text-light: rgba(255, 255, 255, 0.9);
    --theme-card-text-white: #FFFFFF;
    --theme-error: #dc2626;
    --theme-footer-background: #451a03;
    --theme-footer-link: #fde68a;
    --theme-footer-link-hover: #fef3c7;
    --theme-footer-text: #fef3c7;
    --theme-gradient-error-from: #B84040;
    --theme-gradient-error-to: #963333;
    --theme-gradient-info-from: #5C2D2D;
    --theme-gradient-info-to: #4A2323;
    --theme-gradient-success-from: #3D8B5E;
    --theme-gradient-success-to: #2D6B48;
    --theme-gradient-warning-from: #C08B30;
    --theme-gradient-warning-to: #A07428;
    --theme-header-background: #ffffff;
    --theme-header-link: #b45309;
    --theme-header-link-hover: #92400e;
    --theme-header-text: #92400e;
    --theme-heading: #2D2926;
    --theme-info: #3B6FA0;
    --theme-input-background: #FFFFFF;
    --theme-input-disabled-background: #EDEBE8;
    --theme-input-focus-border: #5C2D2D;
    --theme-input-focus-shadow: rgba(92, 45, 45, 0.12);
    --theme-input-hover-border: #C4BEB6;
    --theme-link: #b45309;
    --theme-link-active: #3D1B1B;
    --theme-link-hover: #4A2323;
    --theme-logo-text-color: #92400e;
    --theme-menu-card-background: #FFFFFF;
    --theme-menu-card-border: #E5E0DB;
    --theme-menu-card-hover: #FAF8F6;
    --theme-muted: #64748b;
    --theme-overlay: rgba(45, 41, 38, 0.6);
    --theme-overlay-card-96: rgba(255, 252, 249, 0.96);
    --theme-overlay-dark: rgba(0, 0, 0, 0.55);
    --theme-overlay-dark-05: rgba(0, 0, 0, 0.05);
    --theme-overlay-dark-08: rgba(0, 0, 0, 0.08);
    --theme-overlay-dark-14: rgba(0, 0, 0, 0.14);
    --theme-overlay-dark-20: rgba(0, 0, 0, 0.2);
    --theme-overlay-dark-40: rgba(0, 0, 0, 0.4);
    --theme-overlay-dark-60: rgba(0, 0, 0, 0.6);
    --theme-overlay-dark-72: rgba(0, 0, 0, 0.72);
    --theme-overlay-dark-82: rgba(0, 0, 0, 0.82);
    --theme-overlay-gradient-dark: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.5) 35%, rgba(0, 0, 0, 0.2) 60%, transparent 100%);
    --theme-overlay-gradient-dark-compact: linear-gradient(to top, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.38) 35%, rgba(0, 0, 0, 0.12) 65%, transparent 100%);
    --theme-overlay-light: rgba(255, 255, 255, 0.9);
    --theme-overlay-light-15: rgba(255, 255, 255, 0.15);
    --theme-overlay-light-20: rgba(255, 255, 255, 0.2);
    --theme-overlay-light-30: rgba(255, 255, 255, 0.3);
    --theme-overlay-light-80: rgba(255, 255, 255, 0.8);
    --theme-overlay-light-95: rgba(255, 255, 255, 0.95);
    --theme-overlay-light-96: rgba(255, 255, 255, 0.96);
    --theme-primary: #b45309;
    --theme-primary-active: #3D1B1B;
    --theme-primary-hover: #92400e;
    --theme-secondary: #78350f;
    --theme-secondary-active: #2D2926;
    --theme-secondary-hover: #92400e;
    --theme-success: #059669;
    --theme-text: #451a03;
    --theme-text-dark: #2D2926;
    --theme-text-disabled: #A09A94;
    --theme-text-light: #64748b;
    --theme-text-on-primary: #ffffff;
    --theme-warning: #d97706;

    /* Typography */
    --theme-font-primary: 'Noto Serif JP', sans-serif;
    --theme-font-secondary: 'Noto Sans JP', sans-serif;
    --theme-font-size-xs: 0.75rem;
    --theme-font-size-sm: 0.875rem;
    --theme-font-size-base: 1rem;
    --theme-font-size-lg: 1.125rem;
    --theme-font-size-xl: 1.25rem;
    --theme-font-size-2xl: 1.5rem;
    --theme-font-size-h1: 2rem;
    --theme-font-size-h2: 1.75rem;
    --theme-font-size-h3: 1.5rem;
    --theme-font-size-h4: 1.25rem;
    --theme-font-weight-normal: 400;
    --theme-font-weight-medium: 500;
    --theme-font-weight-semibold: 600;
    --theme-font-weight-bold: 700;
    --theme-line-height-none: 1;
    --theme-line-height-tight: 1.25;
    --theme-line-height-snug: 1.375;
    --theme-line-height-normal: 1.5;
    --theme-line-height-relaxed: 1.625;
    --theme-line-height-loose: 2;

    /* Component Settings */
    --theme-radius-none: 0;
    --theme-radius-sm: 0.125rem;
    --theme-radius-base: 0.25rem;
    --theme-radius-md: 0.375rem;
    --theme-radius-lg: 0.5rem;
    --theme-radius-xl: 0.75rem;
    --theme-radius-2xl: 1rem;
    --theme-radius-full: 9999px;
    --theme-radius-button: 0.375rem;
    --theme-radius-card: 0.75rem;
    --theme-shadow-none: none;
    --theme-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --theme-shadow-base: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    --theme-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --theme-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --theme-transition-duration: 0.2s;
    --theme-transition-easing: ease;

    /* Advanced: Border Radius */
    --theme-radius-button: 0.5rem;

    /* Advanced: Shadows */
    --theme-shadow-base: 0 1px 3px 0 rgba(0, 0, 0, 0.06);

    /* Theme Gradients */
    --theme-gradient-primary: linear-gradient(135deg, var(--theme-primary), var(--theme-secondary));
    --theme-gradient-info: linear-gradient(to bottom right, var(--theme-gradient-info-from), var(--theme-gradient-info-to));
    --theme-gradient-success: linear-gradient(to bottom right, var(--theme-gradient-success-from), var(--theme-gradient-success-to));
    --theme-gradient-error: linear-gradient(to bottom right, var(--theme-gradient-error-from), var(--theme-gradient-error-to));
    --theme-gradient-warning: linear-gradient(to bottom right, var(--theme-gradient-warning-from), var(--theme-gradient-warning-to));

    /* RGB Color Values for Opacity Usage */
    --theme-primary-rgb: 180, 83, 9;
    --theme-secondary-rgb: 120, 53, 15;
    --theme-info-rgb: 59, 111, 160;
    --theme-success-rgb: 5, 150, 105;
    --theme-warning-rgb: 217, 119, 6;
    --theme-error-rgb: 220, 38, 38;
}


body {
    background-color: var(--theme-background);
    color: var(--theme-text);
    font-family: var(--theme-font-primary, 'Noto Sans JP', sans-serif);
    font-size: var(--theme-font-size-base, 1rem);
    line-height: var(--theme-line-height-normal, 1.5);
}

h1 {
    font-size: var(--theme-font-size-h1, var(--theme-font-size-xl));
    font-weight: var(--theme-font-weight-h1, 600);
    margin-bottom: 1rem;
}

h2 {
    font-size: var(--theme-font-size-h2, var(--theme-font-size-xl));
    font-weight: var(--theme-font-weight-h2, 600);
    margin-bottom: 1rem;
}

h3 {
    font-size: var(--theme-font-size-h3, var(--theme-font-size-xl));
    font-weight: var(--theme-font-weight-h3, 600);
    margin-bottom: 1rem;
}

h4 {
    font-size: var(--theme-font-size-h4, var(--theme-font-size-xl));
    font-weight: var(--theme-font-weight-h4, 600);
    margin-bottom: 1rem;
}

h5 {
    font-size: var(--theme-font-size-h5, var(--theme-font-size-xl));
    font-weight: var(--theme-font-weight-h5, 600);
    margin-bottom: 1rem;
}

h6 {
    font-size: var(--theme-font-size-h6, var(--theme-font-size-xl));
    font-weight: var(--theme-font-weight-h6, 600);
    margin-bottom: 1rem;
}

header {
    background-color: var(--theme-header-background);
}

footer {
    background-color: var(--theme-footer-background);
}

a {
    color: var(--theme-link);
    text-decoration: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    transition: all var(--theme-transition-duration, 0.2s) var(--theme-transition-easing, ease);
}

a:hover {
    color: var(--theme-link-hover, var(--theme-primary));
    text-decoration: none;
}

a:active {
    color: var(--theme-link-active, var(--theme-link-hover));
}

header a, header nav a {
    text-decoration: none !important;
}

header a:hover, header nav a:hover {
    text-decoration: none !important;
}

.btn-primary {
    background-color: var(--theme-button-primary, var(--theme-primary));
    border-color: var(--theme-button-primary, var(--theme-primary));
    color: var(--theme-button-text, #ffffff);
    border-radius: var(--theme-radius-button, 0.375rem);
    transition: all var(--theme-transition-duration, 0.2s) var(--theme-transition-easing, ease);
}

.btn-primary:hover {
    background-color: var(--theme-button-primary-hover, var(--theme-primary-hover));
    border-color: var(--theme-button-primary-hover, var(--theme-primary-hover));
    transform: translateY(-1px);
    box-shadow: var(--theme-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.1));
}

.btn-primary:active {
    background-color: var(--theme-button-primary-active, var(--theme-button-primary-hover));
    border-color: var(--theme-button-primary-active, var(--theme-button-primary-hover));
    transform: translateY(0);
}

.btn-secondary {
    background-color: var(--theme-button-secondary, var(--theme-secondary));
    border-color: var(--theme-button-secondary, var(--theme-secondary));
    color: var(--theme-button-text, #ffffff);
    border-radius: var(--theme-radius-button, 0.375rem);
    transition: all var(--theme-transition-duration, 0.2s) var(--theme-transition-easing, ease);
}

.btn-secondary:hover {
    background-color: var(--theme-button-secondary-hover, var(--theme-secondary-hover));
    border-color: var(--theme-button-secondary-hover, var(--theme-secondary-hover));
    transform: translateY(-1px);
    box-shadow: var(--theme-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.1));
}

.btn-secondary:active {
    background-color: var(--theme-button-secondary-active, var(--theme-button-secondary-hover));
    border-color: var(--theme-button-secondary-active, var(--theme-button-secondary-hover));
    transform: translateY(0);
}

.btn:disabled, .btn.disabled {
    background-color: var(--theme-button-disabled, #e9ecef);
    border-color: var(--theme-button-disabled, #e9ecef);
    color: var(--theme-text-disabled, #adb5bd);
    cursor: not-allowed;
    opacity: 0.65;
}

.card {
    background-color: var(--theme-card-background, #ffffff);
    border-radius: var(--theme-radius-card, 0.75rem);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow-sm, 0 1px 2px 0 rgba(0, 0, 0, 0.05));
    transition: all var(--theme-transition-duration, 0.2s) var(--theme-transition-easing, ease);
}

.card:hover, .card.hover-enabled:hover {
    background-color: var(--theme-card-hover-background, var(--theme-card-background));
    box-shadow: var(--theme-card-hover-shadow, var(--theme-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.1)));
    transform: translateY(var(--theme-card-hover-transform, -2px));
}

.hover-lift {
    transition: all var(--theme-transition-duration, 0.2s) var(--theme-transition-easing, ease);
}

.hover-lift:hover {
    transform: translateY(var(--theme-card-hover-transform, -2px));
    box-shadow: var(--theme-card-hover-shadow, var(--theme-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.1)));
}

.form-control:focus, .form-select:focus {
    border-color: var(--theme-input-focus-border, var(--theme-primary));
    box-shadow: 0 0 0 0.25rem var(--theme-input-focus-shadow, rgba(var(--theme-primary-rgb, 13, 110, 253), 0.25));
}

.form-control:hover, .form-select:hover {
    border-color: var(--theme-input-hover-border, var(--theme-border-hover));
}

.form-control:disabled, .form-select:disabled {
    background-color: var(--theme-input-disabled-background, var(--theme-button-disabled));
}

/* Theme Utility Classes */

/* Gradient Classes */
.theme-gradient-primary {
    background: var(--theme-gradient-primary);
}

.theme-gradient-info {
    background: var(--theme-gradient-info);
}

.theme-gradient-success {
    background: var(--theme-gradient-success);
}

.theme-gradient-error {
    background: var(--theme-gradient-error);
}

.theme-gradient-warning {
    background: var(--theme-gradient-warning);
}

/* Badge Classes */
.theme-badge-info {
    background-color: var(--theme-badge-info-bg);
    color: var(--theme-badge-info-text);
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
    display: inline-block;
}

.theme-badge-success {
    background-color: var(--theme-badge-success-bg);
    color: var(--theme-badge-success-text);
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
    display: inline-block;
}

.theme-badge-error {
    background-color: var(--theme-badge-error-bg);
    color: var(--theme-badge-error-text);
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
    display: inline-block;
}

.theme-badge-warning {
    background-color: var(--theme-badge-warning-bg);
    color: var(--theme-badge-warning-text);
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
    display: inline-block;
}

/* Card Classes */
.theme-card {
    background-color: var(--theme-card-background);
    border: 1px solid var(--theme-border);
    border-radius: 0.75rem;
    padding: 1.5rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.theme-card-text-white {
    color: var(--theme-card-text-white);
}

.theme-card-text-light {
    color: var(--theme-card-text-light);
}

/* Alert Box Classes */
.theme-alert-info {
    background-color: var(--theme-badge-info-bg);
    border-left: 4px solid var(--theme-badge-info-text);
    color: var(--theme-badge-info-text);
    padding: 1rem;
    border-radius: 0 0.375rem 0.375rem 0;
}

.theme-alert-success {
    background-color: var(--theme-badge-success-bg);
    border-left: 4px solid var(--theme-badge-success-text);
    color: var(--theme-badge-success-text);
    padding: 1rem;
    border-radius: 0 0.375rem 0.375rem 0;
}

.theme-alert-warning {
    background-color: var(--theme-badge-warning-bg);
    border-left: 4px solid var(--theme-badge-warning-text);
    color: var(--theme-badge-warning-text);
    padding: 1rem;
    border-radius: 0 0.375rem 0.375rem 0;
}

.theme-alert-error {
    background-color: var(--theme-badge-error-bg);
    border-left: 4px solid var(--theme-badge-error-text);
    color: var(--theme-badge-error-text);
    padding: 1rem;
    border-radius: 0 0.375rem 0.375rem 0;
}