/* Routebook Clear – full-colour scenery with local, uniform reading surfaces. */
html[data-routebook] {
 --rb-scene:url(harbor.webp);--rb-partner:url(025.svg);
 --paper:252 249 235;--ink:#182d35;--quiet:#384e54;--line:rgb(46 64 60/.33);
 /* Change the local reading surface opacity here: 0 is clear, 1 is opaque. */
 --rb-panel-opacity:.82;
 --panel:rgb(var(--paper)/var(--rb-panel-opacity));
 --reading:rgb(var(--paper)/clamp(0,calc(var(--rb-panel-opacity) + .08),1));
 --rail:rgb(var(--paper)/clamp(0,calc(var(--rb-panel-opacity) + .04),1));
 --input-face:rgb(var(--paper)/.92);--rb-accent:#135a61;
}
html[data-scene="grove"]{--rb-scene:url(grove.webp)}
html[data-scene="observatory"]{--rb-scene:url(observatory.webp)}
html.dark[data-routebook]{
 --paper:14 27 40;--ink:#f6f4e9;--quiet:#d3dfde;--line:rgb(232 240 221/.34);--rb-accent:#a6ead6;
 --rb-panel-opacity:.86;--input-face:rgb(var(--paper)/.93);
}
html[data-routebook="admin"]{
 --background:44 36% 96%;--foreground:198 32% 16%;--card:44 36% 96%;--card-foreground:198 32% 16%;--popover:43 53% 98%;--popover-foreground:198 32% 16%;
 --primary:190 58% 25%;--primary-foreground:47 70% 98%;--secondary:44 32% 86%;--secondary-foreground:192 40% 17%;
 --muted:44 28% 89%;--muted-foreground:193 19% 29%;--accent:42 53% 84%;--accent-foreground:193 40% 18%;
 --border:42 17% 73%;--input:184 14% 60%;--ring:184 58% 30%;--radius:.6rem;
}
html.dark[data-routebook="admin"]{
 --background:208 35% 12%;--foreground:45 40% 94%;--card:200 29% 18%;--card-foreground:45 40% 94%;--popover:201 31% 16%;--popover-foreground:45 40% 94%;
 --primary:163 46% 74%;--primary-foreground:190 55% 13%;--secondary:200 23% 24%;--secondary-foreground:173 37% 94%;
 --muted:197 21% 24%;--muted-foreground:179 23% 80%;--accent:190 28% 28%;--accent-foreground:45 60% 95%;
 --border:194 19% 37%;--input:193 20% 46%;--ring:161 47% 73%;
}
[data-routebook] body{isolation:isolate;background-color:rgb(var(--paper));color:var(--ink)}
[data-routebook] body::before{content:"";position:fixed;inset:0;pointer-events:none}
[data-routebook] body::before{z-index:-2;background:var(--rb-scene) center / cover no-repeat;transform:scaleX(-1)}

[data-routebook="member"] #app :is(.n-layout,.n-layout-sider,.cus-scroll-y),[data-routebook="member"] article > :is(header,section),
[data-routebook="admin"] #root > .relative.h-full,[data-routebook="admin"] #content > .relative,
[data-routebook="admin"] #content [class*="header-height"].flex-none,[data-routebook="admin"] aside.fixed .bg-background,
[data-routebook="admin"] aside.fixed > .relative,[data-routebook="admin"] #root .container.min-h-svh:has(input[type=password]){background-color:transparent}
[data-routebook="member"] #app .n-layout-sider,[data-routebook="admin"] aside.fixed{border-inline-end:0}
[data-routebook="admin"] aside.fixed .sticky.top-0{box-shadow:none}
[data-routebook="admin"] #content > .relative::after{background-image:none}
[data-routebook="member"] .n-card:not(.n-modal),[data-routebook="member"] .n-card .n-list,
[data-routebook="admin"] #content .border.bg-card,[data-routebook="admin"] #content .rounded-md.border:has(table){
 background:transparent;border-color:transparent;box-shadow:none;border-radius:0;backdrop-filter:none;
}
[data-routebook="member"] .n-card .n-list{--n-color:transparent!important}
[data-routebook="member"] .n-card:has(.n-progress) .n-card-header__main,[data-routebook="member"] .n-card-header__main,[data-routebook="member"] .title-text{color:var(--ink);font-weight:730}
[data-routebook="member"] .n-list-item,[data-routebook="member"] .n-card:not(.n-modal){color:var(--ink)}
[data-routebook="member"] .text-gray-500{color:var(--quiet)}
[data-routebook="member"] .n-menu .n-menu-item-content,.n-list .n-list-item{border-radius:0}
[data-routebook="member"] .side-menu .n-menu-item-content--selected::before{background:rgb(67 136 129/.20);border-radius:0}
[data-routebook="member"] .n-card:has(.text-block):has(.n-progress) .text-block{font-size:clamp(22px,2.6vw,38px);letter-spacing:-.04em;line-height:1.2}
[data-routebook="member"] .n-card:has(.text-block):has(.n-progress) .n-card-header::after {content:"";width:68px;height:42px;background:url(131.svg) right center / contain no-repeat}
[data-routebook="member"] .n-data-table{--n-td-color:var(--reading)!important;--n-th-color:var(--rail)!important;--n-border-color:var(--line)!important;font-variant-numeric:tabular-nums}
[data-routebook="member"] .n-data-table-empty {color:var(--quiet)}
[data-routebook="member"] .card-item .n-card {background:var(--panel);border:0;border-inline-start:3px solid var(--rb-accent)}
[data-routebook="member"] .card-item .n-card::after {content:"";display:block;height:65px;margin:0 20px 12px;background:url(001.svg) right center / contain no-repeat}
[data-routebook="member"] .card-item:nth-child(3n+2) .n-card::after {background-image:url(004.svg)}
[data-routebook="member"] .card-item:nth-child(3n) .n-card::after {background-image:url(007.svg)}
[data-routebook="member"] .n-input,[data-routebook="admin"] #content input {background-color:var(--input-face)}
[data-routebook="admin"] #content table {background:var(--reading);font-variant-numeric:tabular-nums}
[data-routebook="admin"] #content th {background-color:rgb(var(--paper)/.38)}
[data-routebook="admin"] #content .bg-card:has(table) {background:transparent}
[data-routebook="admin"] #content .flex-col-reverse:has(button) {background:var(--reading)}
[data-routebook="admin"] #content .pb-16:has(form),[data-routebook="admin"] #content .grid:has(.bg-card){
 background:var(--panel);
}
[data-routebook="admin"] #content .bg-card:has(.recharts-responsive-container){background:var(--reading)}
[data-routebook="admin"] #content :is(h1,h2) {letter-spacing:-.035em}
[data-routebook="admin"] #content td[colspan].h-24:only-child {color:var(--quiet)}
[data-routebook="admin"] #content td[colspan].h-24:only-child::before{content:"";display:block;height:28px;margin:0 auto 4px;background:var(--rb-partner) center / contain no-repeat}
html[data-rb-page^="server/"]{--rb-partner:url(082.svg)}
html[data-rb-page="finance/order"]{--rb-partner:url(052.svg)}
html[data-rb-page="user/ticket"]{--rb-partner:url(113.svg)}
/* Auth pages keep the scenic focal point open. The site's own logo, name and forms are untouched. */
[data-routebook="member"] .wh-full.flex.items-center.justify-center:has(> .n-card.max-w-md),
[data-routebook="admin"] .container.min-h-svh:has(input[type=password]) {height:auto;min-height:100svh;box-sizing:border-box;padding:clamp(18px,4vw,60px)}
[data-routebook="member"] .n-card.max-w-md,[data-routebook="admin"] .container.min-h-svh > .mx-auto:has(input[type=password]){width:min(100%,27rem);max-width:100%;background:none;border:0;box-shadow:none}
[data-routebook="member"] .n-card.max-w-md .justify-between,[data-routebook="admin"] .container.min-h-svh .bg-card {background:transparent;box-shadow:none;border:0}
[data-routebook="member"] .n-card.max-w-md h1{color:var(--ink);font-weight:740}
[data-routebook="member"] .n-card.max-w-md h5{color:var(--quiet)}
[data-routebook="member"] .n-card.max-w-md::before,[data-routebook="admin"] .container.min-h-svh:has(input[type=password]) > .mx-auto::before{
 content:"";display:block;position:static;width:100%;height:clamp(64px,10svh,100px);background:var(--rb-partner) center / contain no-repeat;
}
[data-rb-icon]{background:var(--rb-icon) center / contain no-repeat}
[data-rb-icon]>:is(i,svg){opacity:0}
[data-routebook="admin"] aside.fixed [data-rb-icon]{min-width:20px;min-height:20px}
[data-routebook="member"] .n-list-item [data-rb-icon]{width:26px;height:26px;flex:none}
@media(min-width:900px){
 [data-routebook="member"] .wh-full.flex.items-center.justify-center:has(> .n-card.max-w-md),
 [data-routebook="admin"] .container.min-h-svh:has(input[type=password]) {padding-inline-start:3%;padding-inline-end:49%}
 [data-routebook="member"][data-rb-page="dashboard"] .cus-scroll-y > div{max-width:min(630px,66%);margin-inline-start:clamp(0px,2vw,38px)}
 [data-routebook="member"]:is([data-rb-page="profile"],[data-rb-page="invite"]) .cus-scroll-y > div{max-width:850px}
}
@media(max-width:899px){
 [data-routebook="admin"] aside.fixed .sticky.top-0,[data-routebook="admin"] aside.fixed:has([aria-expanded="true"]) > .relative,
 [data-routebook="member"] .n-drawer .n-layout-sider {background-color:rgb(var(--paper)/.95)}
 [data-routebook="member"] .cus-scroll-y > div {max-width:100%}
}

/* A single hairline delineates each functional region, without an enclosing fill. */
[data-routebook="member"] .n-card:not(.n-modal):not(.max-w-md),
[data-routebook="admin"] #content .border.bg-card,
[data-routebook="admin"] #content .rounded-md.border:has(table) {
  border:1px solid var(--line); border-radius:9px; box-shadow:none;
}
[data-routebook="member"] .card-item .n-card {border-inline-start-width:2px}
[data-routebook="member"] .n-card:not(.n-modal) .n-list-item:not(:last-child) {border-bottom:1px solid var(--line)}
[data-routebook="member"] .n-card:not(.n-modal) .n-list-item__divider {display:none}
[data-routebook="admin"] #content .pb-16:has(form) {outline:1px solid var(--line);outline-offset:-1px;border-radius:9px;padding:clamp(12px,1.4vw,22px)}
[data-routebook="admin"] #content tr:not(:last-child) {border-bottom-color:var(--line)}
[data-routebook="admin"] #content .flex-col-reverse:has(button) {border-block-start:1px solid var(--line)}
[data-routebook="admin"] #content header:has(h1,h2),[data-routebook="admin"] #content .mb-2.flex:has(h2) {border-block-end:1px solid var(--line);padding-bottom:8px}
[data-routebook="member"] .side-menu .n-menu-item-group:not(:first-child) {border-top:1px solid var(--line);margin-top:6px}
[data-routebook="admin"] aside.fixed [data-state]:has(>button[data-state]) {border-top:1px solid var(--line)}
[data-routebook="member"] .n-card.max-w-md,[data-routebook="admin"] .container.min-h-svh > .mx-auto:has(input[type=password]) {border-block:1px solid var(--line);border-radius:0}
[data-routebook="member"] article > header {
 border-block-end:1px solid var(--line);
 background:var(--rail);
}
[data-routebook="member"] .n-card.max-w-md {padding-block:10px}
[data-rb-icon="bag"]{--rb-icon:url(icons/bag.svg)}
[data-rb-icon="antenna"]{--rb-icon:url(icons/antenna.svg)}
[data-rb-icon="invite"]{--rb-icon:url(icons/invite.svg)}
[data-rb-icon="route"]{--rb-icon:url(icons/route.svg)}
[data-rb-icon="gear"]{--rb-icon:url(icons/gear.svg)}
[data-rb-icon="server"]{--rb-icon:url(icons/server.svg)}
[data-rb-icon="fieldbook"]{--rb-icon:url(icons/fieldbook.svg)}
[data-rb-icon="compass"]{--rb-icon:url(icons/compass.svg)}
[data-rb-icon="pass"]{--rb-icon:url(icons/pass.svg)}
[data-rb-icon="trainer"]{--rb-icon:url(icons/trainer.svg)}
[data-rb-icon="network"]{--rb-icon:url(icons/network.svg)}
[data-rb-icon="notice"]{--rb-icon:url(icons/notice.svg)}
[data-rb-icon="palette"]{--rb-icon:url(icons/palette.svg)}
[data-rb-icon="meter"]{--rb-icon:url(icons/meter.svg)}
[data-rb-icon="shield"]{--rb-icon:url(icons/shield.svg)}
[data-rb-icon="receipt"]{--rb-icon:url(icons/receipt.svg)}
[data-rb-icon="remedy"]{--rb-icon:url(icons/remedy.svg)}
[data-rb-icon="log"]{--rb-icon:url(icons/log.svg)}
[data-rb-icon="module"]{--rb-icon:url(icons/module.svg)}
[data-rb-icon="wallet"]{--rb-icon:url(icons/wallet.svg)}
[data-rb-icon="plug"]{--rb-icon:url(icons/plug.svg)}
[data-rb-icon="gift"]{--rb-icon:url(icons/gift.svg)}
[data-rb-icon="group"]{--rb-icon:url(icons/group.svg)}
[data-rb-icon="voucher"]{--rb-icon:url(icons/voucher.svg)}
html[data-job="shield"]{--rb-partner:url(133.svg)}
html[data-routebook="admin"][data-rb-page="sign-in"]{--rb-partner:url(082.svg)}

/* Only actual work areas carry tint. Empty space shows the unfiltered illustration. */
[data-routebook="member"] #app .n-layout-sider,
[data-routebook="admin"] aside.fixed > .relative,
[data-routebook="admin"] #content [class*="header-height"].flex-none { background-color:var(--rail) }
[data-routebook="member"] .n-card:not(.n-modal),
[data-routebook="admin"] #content .border.bg-card { background-color:var(--panel) }
[data-routebook="member"] .n-card.max-w-md,
[data-routebook="admin"] .container.min-h-svh > .mx-auto:has(input[type=password]) {background:var(--rail);border:1px solid var(--line);border-radius:9px}
[data-routebook="admin"] #content .mb-2.flex:has(h2) > div:first-child,
[data-routebook="admin"] #content header:has(h1,h2) > div:first-child {
 width:fit-content;max-width:100%;background-color:var(--reading);padding:3px 8px;border-radius:4px;
}
[data-routebook="member"] .cus-scroll-y h2:not(.n-card-header__main),
[data-routebook="member"] .n-empty__description {width:fit-content;max-width:100%;background-color:var(--reading);border-radius:4px;padding-inline:5px}

/* Secondary text and empty states share the same legible ink in their existing panels. */
[data-routebook="member"] .n-card :is(.text-gray-500,.n-empty__description),
[data-routebook="member"] .side-menu .n-menu-item-group-title { color:var(--quiet) }
[data-routebook="member"] .n-card:has(.n-progress) .n-progress-icon--as-text {color:var(--ink)}
