@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&display=swap');

:root {
    --navy: #233b32;
    --navy-deep: #172b24;
    --lime: #dfc48b;
    --green: #376d55;
    --ink: #2d3933;
    --muted: #7d8479;
    --line: #e9e5da;
    --bg: #f7f5ef;
    --gold: #a48245;
    --gold-light: #f4ebd9;
}

body { background: var(--bg); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible { outline-color: #b48d48; }
.sidebar { background: linear-gradient(160deg, #263d32, #14271f 80%); border-right: 1px solid #b4945633; }
.brand { margin: 0 7px 29px; gap: 0; font-size: inherit; }
.royal-brand { display: inline-flex; align-items: center; gap: 11px; color: #dfc48b; letter-spacing: 0; flex-shrink: 0; }
.royal-crest { display: grid; place-items: center; width: 43px; flex-shrink: 0; }
.royal-crest svg { display: block; width: 100%; height: auto; }
.royal-wordmark { display: flex; flex-direction: column; align-items: center; text-align: center; }
.royal-overline { font-size: 9px; letter-spacing: 4px; padding-left: 4px; font-weight: 500; }
.royal-name { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 19px; font-weight: 600; line-height: 1.5; letter-spacing: .7px; }
.royal-hotel { display: flex; align-items: center; gap: 8px; font-size: 7px; letter-spacing: 4px; padding-left: 4px; font-weight: 400; }
.royal-hotel:before, .royal-hotel:after { content: ''; height: 1px; width: 20px; background: #b5985f77; }
.property { border-color: #d7bd7c26; background: #ffffff04; padding: 13px 10px; }
.property-icon { color: #d3b982; background: #d3b9820c; }
.property small { font-size: 7px; letter-spacing: .5px; color: #a8b1a0; }
.online-dot { width: 5px; height: 5px; background: #c8ac6d; }
.nav-label { color: #9baf99; letter-spacing: 2px; }
.nav-link { font-size: 12px; padding-top: 14px; padding-bottom: 14px; color: #b7c2b2; }
.nav-link.active { background: linear-gradient(105deg, #ebd4a1, #d2b374); color: #263b2c; box-shadow: 0 4px 15px #00000015; }
.nav-link.active b { background: #263b2c16; }
.sidebar-tip { border-color: #d8bc7b1c; background: linear-gradient(130deg, #c3a05f0b, transparent); }
.tip-spark { color: #cfb077; }
.sidebar-tip a { color: #d9bb7e; }
.sidebar-tip p { color: #a0b09a; }
.account { border-top-color: #d8bc7b1c; }
.account .avatar { background: #dbc89d; color: #354631; }
.account small, .account .icon-btn { color: #a9b79f; }
.topbar { background: #fffdf9; border-bottom-color: #e8e0d0; }
.topbar:before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, #8e6e39, #e7d4a6 50%, #a58344); }
.breadcrumb { color: #8a8e82; }
.live { color: #6a7d69; }
.live i { background: #a58c52; }
.avatar.small { background: #eee6d3; color: #7f663a; }
.top-date { color: #858778; border-color: #e8e0d0; }
.page-heading { position: relative; padding: 27px 28px; border: 1px solid #e8dfcd; border-radius: 10px; background: linear-gradient(110deg, #fffdf8 25%, #f3eddf); overflow: hidden; min-height: 144px; }
.page-heading:after { content: ''; position: absolute; top: 17px; bottom: 17px; right: 17px; width: 150px; border: 1px solid #b3915022; border-radius: 70px 70px 0 0; pointer-events: none; }
.page-heading>div { position: relative; z-index: 1; }
.heading-ornament { position: absolute; right: 34px; bottom: -40px; font-family: 'Cormorant Garamond', Georgia, serif; color: #ae8f4d0b; font-size: 160px; line-height: 1.3; letter-spacing: -20px; pointer-events: none; }
.eyebrow { color: #9c814f; letter-spacing: 2px; font-size: 9px; }
.page-heading h1 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 35px; font-weight: 600; letter-spacing: -.9px; color: #273e31; }
.heading-dot { color: #b99b5d; }
.page-heading p { color: #818477; font-size: 12px; line-height: 1.7; }
.heading-actions { padding-top: 0; }
.primary { background: #294333; border: 1px solid #294333; box-shadow: 0 3px 8px #1b34200a; }
.primary:hover { background: #3a5840; border-color: #3a5840; box-shadow: 0 4px 14px #2036221c; }
.secondary { border-color: #dfd4bc; background: #fffdf8; color: #806438; }
.secondary:hover { background: #f7f0e2; }
.btn { padding: 11px 16px; border-radius: 5px; }
.period-tabs { background: #eeebe2; border-color: #e3ddcf; }
.period-tabs a { color: #8d897b; }
.period-tabs a.selected { color: #7c6133; background: #fffdf8; }
.date-filter { background: #fffdf9; border-color: #e3ddcf; color: #a48b5c; }
.date-filter input { color: #727866; }
.stat { border-color: #e8e3d6; box-shadow: 0 3px 12px #35321a03; border-radius: 9px; }
.stat-top { color: #777e6e; font-size: 12px; }
.stat-value { color: #2d3e30; font-variant-numeric: tabular-nums; }
.stat-value>small { color: #969a83; }
.stat-foot { color: #8b917f; }
.stat.dark { background: radial-gradient(ellipse at 100% 0, #4f6240, transparent 80%), #253e30; border-color: #3b5037; }
.dark .stat-value { color: #f5ecd5; }
.dark .stat-icon { background: #e6c68318; color: #dfc48b; }
.dark .stat-value small { color: #c6c4a1; }
.dark .stat-foot { color: #b8c2a5; }
.dark .stat-top { color: #d7d9bd; }
.lime-dot, .legend .lime-dot { background: #c8aa6a; }
.income-bar { background: linear-gradient(#dfc995, #c4a66a); }
.expense-bar { background: #8b9c8c; }
.stat-icon.purple { background: #f3ecdf; color: #a78c58; }
.occupancy-track { background: #f1ece0; }
.occupancy-track span { background: #c1a56b; }
.panel, .room-card, .guest-summary>div { border-color: #e8e3d6; box-shadow: 0 3px 13px #2c351504; }
.panel-heading h2, .section-heading h2 { color: #3b4938; letter-spacing: -.3px; }
.panel-heading p, .section-heading p { color: #8b917e; }
.chart-axis, .chart-group>small, .chart-caption { color: #8b927d; }
.chart-empty strong { color: #7a785a; }
.chart-empty span { color: #8b917e; }
.source-total>span { color: #96886b; }
.source-track { background: #f1ede3; }
.source-list>div>span { color: #7e8971; }
.source-list strong { color: #465a3c; }
.panel-link, .text-btn { color: #8c6e38; }
.panel-link { border-color: #ece6d8; }
.quick-actions>button { border-color: #e8e1d2; background: #fffdfa; box-shadow: 0 2px 8px #3a341b03; }
.quick-actions>button:hover { background: #fffdf7; border-color: #bea36e; box-shadow: 0 5px 16px #9c804810; }
.quick-icon { background: #f7f1e6; border-color: #ede3cf; color: #a38952; }
.quick-actions strong { color: #4d5b41; font-size: 12px; }
.quick-actions small { color: #929782; }
.quick-actions>button>svg { color: #b3a17a; }
th { background: #faf8f2; color: #8b8a75; border-color: #ece6d8; font-size: 10px; }
td { color: #778269; border-color: #f0ece2; font-size: 11px; }
td strong, .transaction-name strong { color: #47583b; }
td small { color: #909781; font-size: 9px; }
.transaction-name strong { font-size: 11px; }
.text-green, .text-green strong { color: #447554; }
.badge { font-size: 9px; }
.mint { background: #edf4e9; color: #668653; }
.neutral { color: #8b8d72; background: #f3f1e9; }
.amber { color: #a48648; background: #f8f0de; }
.search { background: #fcfaf4; border-color: #e9e1d1; color: #ac986e; }
.search input { color: #536447; }
.room-card-top .room-symbol { color: #b49a63; }
.room-card h3 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 29px; color: #3b5037; }
.room-rate { color: #7a704c; }
.room-actions { border-color: #ece7da; }
.room-card.is-occupied { border-color: #e8dcc2; background: #fffcf6; }
.room-guest { color: #89917a; }
.room-summary { color: #8b8d77; }
.guest-summary strong { color: #415438; }
.guest-summary span { color: #8b917b; }
.report-source.selected { border-color: #bea268; background: #faf5e9; box-shadow: 0 0 0 1px #bea268; }
.report-source { border-color: #e8e1d1; }
.report-source>a:first-child>svg { color: #ac9059; }
.report-source strong { color: #4b583d; }
.report-source small { color: #8d927b; }
.report-net { background: #f7f0e0; color: #7e6638; }
.report-net strong { color: #705a2d; }
.report-line { color: #808b70; border-color: #ede8db; }
.report-line strong { color: #5b6a48; }
.department-summary { border-color: #e9e3d4; }
.department-summary strong { color: #4d603f; }
.department-summary span, .department-note, .table-note { color: #858d76; }
.table-note { border-color: #eae5d7; }
.page-footer { border-color: #e3dccb; color: #989783; font-size: 9px; }
.footer-brand { font: 500 10px 'DM Sans', sans-serif; letter-spacing: 1px; color: #9d824b; }
.print-letterhead { display: none; }
dialog { border-color: #dfd4bb; box-shadow: 0 25px 100px #10261840; background: #fffdf8; }
dialog::backdrop { background: #14291f8c; }
.dialog-heading h2 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 29px; font-weight: 600; color: #344b33; }
.close-btn { background: #f3eddf; color: #9a8a65; }
dialog label, .login-form label { color: #6f785f; font-size: 12px; }
dialog input, dialog select, .login-form input { border-color: #ded7c5; background: #fffefa; color: #475b3c; font-size: 13px; }
.charge-preview { background: #f8f1df; color: #947641; }
.form-help { color: #889078; }
.info { background: #f8f1e2; color: #998052; }
.login-body { background: radial-gradient(ellipse at 12% 10%, #ded5bc66, transparent 50%), radial-gradient(ellipse at 100% 100%, #c5cdb355, transparent 50%), #f5f2e9; padding: 45px; }
.login-shell { max-width: 1120px; min-height: 740px; grid-template-columns: 1.05fr 1fr; border-color: #ded6c1; border-radius: 12px; box-shadow: 0 25px 90px #26321c12; }
.login-story { position: relative; background: radial-gradient(ellipse at 80% 15%, #46543a99, transparent 60%), linear-gradient(160deg, #293e30, #14281f); padding: 43px 42px 30px; }
.login-story:before { content: ''; position: absolute; inset: 16px; border: 1px solid #c2a1632d; pointer-events: none; border-radius: 5px; }
.login-story .brand { margin: 0 0 44px; }
.login-story .royal-brand { gap: 15px; }
.login-story .royal-crest { width: 52px; }
.login-story .royal-name { font-size: 25px; }
.login-story .royal-overline { font-size: 10px; letter-spacing: 6px; }
.login-story .royal-hotel { font-size: 8px; }
.login-story .eyebrow { color: #c0a36b; letter-spacing: 2.4px; font-size: 8px; }
.login-story h1 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 47px; font-weight: 500; line-height: 1.15; color: #f3ead5; margin: 18px 0; letter-spacing: -.9px; }
.login-story p { font-size: 12px; color: #b6bea9; line-height: 1.9; }
.royal-hotel-art { display: block; width: calc(100% + 30px); max-width: 450px; height: auto; margin: -2px -15px -3px; opacity: .9; }
.login-story>small { text-align: center; color: #b79f6d; font-size: 7px; letter-spacing: 1.7px; line-height: 2; margin: 12px 0 0; }
.login-form { padding: 60px 52px; background: #fffdf9; }
.login-form .tag { color: #a68b56; font-size: 9px; letter-spacing: 2px; }
.login-form h2 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 37px; font-weight: 600; color: #314b33; letter-spacing: -.8px; }
.login-form>p { color: #8b927e; font-size: 12px; }
.login-form label { color: #6d775e; }
.login-form input { border-color: #e0d8c5; background: #fff; padding: 13px; }
.login-form .btn { margin-top: 9px; padding: 13px; font-size: 12px; }
.login-form .login-note { color: #969b86; font-size: 10px; border-top: 1px solid #eee7d8; padding-top: 19px; margin-top: 25px; }

@media(min-width:1500px) {
    .page-heading { padding: 32px; }
    .page-heading h1 { font-size: 40px; }
    .brand { margin-left: 7px; }
    .royal-name { font-size: 20px; }
}
@media(max-width:1250px) {
    .sidebar .royal-brand { gap: 8px; }
    .sidebar .royal-crest { width: 33px; }
    .sidebar .royal-name { font-size: 16px; }
    .sidebar .royal-overline { font-size: 8px; }
    .sidebar .royal-hotel { font-size: 6px; }
    .page-heading { padding: 23px; }
    .page-heading h1 { font-size: 30px; }
    .stat-top { font-size: 10px; }
}
@media(max-width:1000px) {
    .page-heading { gap: 18px; }
    .page-heading h1 { font-size: 29px; }
    .page-heading .btn { padding: 10px 12px; }
    .login-shell { max-width: 850px; min-height: 680px; }
    .login-story { padding: 36px 30px 27px; }
    .login-story .royal-name { font-size: 21px; }
    .login-story .royal-crest { width: 43px; }
    .login-story h1 { font-size: 40px; }
    .login-story p { font-size: 11px; }
    .login-form { padding: 40px 32px; }
    .login-form h2 { font-size: 33px; }
}
@media(max-width:720px) {
    .sidebar .brand>.royal-brand { display: flex; }
    .sidebar .royal-wordmark { display: none; }
    .sidebar .royal-crest { width: 36px; }
    .sidebar .brand { margin-bottom: 30px; }
    .page-heading { padding: 22px 19px; border-radius: 8px; }
    .page-heading h1 { font-size: 30px; }
    .page-heading:after { width: 105px; right: 12px; }
    .heading-ornament { font-size: 135px; bottom: -27px; right: 16px; }
    .page-heading p { font-size: 11px; }
    .page-heading .eyebrow { font-size: 7px; letter-spacing: 1.4px; }
    .heading-actions .btn { font-size: 10px; }
    .stat-top { font-size: 9px; }
    .stat-value { font-size: 21px; }
    .footer-brand { display: block; font-size: 9px; margin-bottom: 5px; }
    .login-body { padding: 18px; }
    .login-shell { display: block; max-width: 470px; min-height: 0; }
    .login-story { padding: 27px 26px; }
    .login-story:before { inset: 10px; }
    .login-story .brand { margin: 0; }
    .login-story .royal-brand { gap: 12px; }
    .login-story .royal-crest { width: 40px; }
    .login-story .royal-name { font-size: 21px; }
    .login-story .royal-overline { font-size: 8px; }
    .login-story .royal-hotel { font-size: 7px; }
    .login-form { padding: 32px 27px; }
    .login-form h2 { font-size: 34px; }
}
@media(prefers-reduced-motion:no-preference) {
    .page-heading { animation: royal-arrive .4s ease-out both; }
    .royal-hotel-art { animation: royal-arrive .8s ease-out both; }
    @keyframes royal-arrive { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
}
@media print {
    .print-letterhead { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-bottom: 18px; margin-bottom: 20px; border-bottom: 2px solid #ab8b50; }
    .print-letterhead .royal-brand { color: #7a622e; }
    .print-letterhead p { font-size: 8px; color: #777; max-width: 180px; line-height: 1.8; text-align: right; }
    .print-letterhead .royal-name { font-size: 21px; }
    .page-heading { background: white; border: 0; padding: 0; min-height: 0; margin-bottom: 20px; }
    .page-heading:after, .heading-ornament { display: none; }
    .page-heading h1 { font-size: 28px; }
    .panel, .stat { box-shadow: none; }
    .stat.dark { background: white; }
    .stat.dark .stat-value { color: #333; }
    .stat.dark .stat-top, .stat.dark .stat-foot { color: #777; }
    .report-net { background: white; color: #333; }
    .report-net strong { color: #333; }
}
