/* SINH TỰ ĐỘNG bởi tools/canvas-port/port.mjs từ canvas/Main.dc.html — đừng sửa tay. */
[data-site-page="main"]{--c-paper:#f7f5ee;--c-surface:#fffef9;--c-ink:#203f35;--c-head:#1a3029;--c-muted:#5f665d;--c-line:#dfdccf;--c-acc:#5d5294;--c-accSoft:#eceaf7;--c-band:#efece2;--c-circle:#e3e4cf}
html[data-site-theme="dark"] [data-site-page="main"]{--c-paper:#161826;--c-surface:#1f2131;--c-ink:#e9e9ed;--c-head:#f5f4ff;--c-muted:#cfd3e5;--c-line:#3f424d;--c-acc:#d2cefd;--c-accSoft:#2b2741;--c-band:#1c1e2e;--c-circle:#262a42}
.jb-when-light{display:contents}.jb-when-dark{display:none}
html[data-site-theme="dark"] .jb-when-light{display:none}html[data-site-theme="dark"] .jb-when-dark{display:contents}
[data-jb-variant][hidden],[data-jb-menu][hidden]{display:none!important}
body{margin:0;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
a{color:#5d5294;text-underline-offset:4px}a:hover{color:#423a6a}
:focus-visible{outline:2px solid #f2c14e;outline-offset:3px}
h1,h2,h3{text-wrap:balance}
.jb-stars{background-image:radial-gradient(1.5px 1.5px at 8% 18%,#fff8 50%,transparent 51%),radial-gradient(1px 1px at 22% 62%,#fff6 50%,transparent 51%),radial-gradient(1.5px 1.5px at 35% 12%,#fffa 50%,transparent 51%),radial-gradient(1px 1px at 48% 40%,#fff5 50%,transparent 51%),radial-gradient(2px 2px at 61% 22%,#f2c14eaa 50%,transparent 51%),radial-gradient(1px 1px at 72% 70%,#fff6 50%,transparent 51%),radial-gradient(1.5px 1.5px at 84% 14%,#fff9 50%,transparent 51%),radial-gradient(1px 1px at 93% 48%,#fff5 50%,transparent 51%),radial-gradient(1px 1px at 15% 84%,#fff4 50%,transparent 51%),radial-gradient(1.5px 1.5px at 55% 88%,#fff6 50%,transparent 51%)}
.jb-breathe{transform-origin:50% 72%;animation:jb-breathe 4.2s ease-in-out infinite}
@keyframes jb-breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.006,1.018)}}
@keyframes jb-wag{0%,100%{transform:rotate(calc(var(--a) * -1))}50%{transform:rotate(var(--a))}}
.jb-seg{position:absolute;left:0;top:0;width:100%;height:100%;animation:jb-wag 4.8s cubic-bezier(.37,0,.63,1) infinite}
@keyframes jb-drift{0%,100%{transform:rotate(-1.2deg)}50%{transform:rotate(1.4deg)}}
.jb-tail{transform-origin:8.59% 43.5%;animation:jb-drift 13s ease-in-out infinite}
@keyframes jb-rise{from{opacity:0;transform:translateY(18px)}}
@keyframes jb-bob{from{transform:translateY(0) rotate(-4deg)}to{transform:translateY(-10px) rotate(-4deg)}}
@keyframes jb-fly{0%,100%{transform:translate(0,0) rotate(var(--r))}50%{transform:translate(4px,-10px) rotate(calc(var(--r) + 4deg))}}
@keyframes jb-glow{from{opacity:.55;transform:scale(.94)}to{opacity:1;transform:scale(1.04)}}
@keyframes jb-wave{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
.jb-rise{animation:jb-rise 1s cubic-bezier(.2,.7,.2,1) both}
.jb-rise2{animation:jb-rise 1s .25s cubic-bezier(.2,.7,.2,1) both}
.jb-bob{animation:jb-bob 6s ease-in-out infinite alternate}
.jb-fly{animation:jb-fly 7s ease-in-out infinite}
.jb-glow{animation:jb-glow 5s ease-in-out infinite alternate}
.jb-wave{animation:jb-wave 1.1s ease-in-out infinite;transform-origin:center}
.jb-shelfgrid{grid-template-columns:repeat(6,minmax(0,1fr))}
.jb-libcase{position:relative;padding:30px 12px 0;border-radius:6px 6px 0 0;background:radial-gradient(ellipse 45% 85% at 86% 0,rgba(255,204,140,.42),transparent 70%),linear-gradient(180deg,rgba(40,20,6,.58),rgba(40,20,6,.18) 42%,rgba(40,20,6,.3)),#9a6a3c url('/_content/Jinn.Ui/img/site/wood.png') 0 0/430px auto;box-shadow:inset 0 16px 22px -10px rgba(0,0,0,.55),inset 12px 0 18px -10px rgba(0,0,0,.4),inset -12px 0 18px -10px rgba(0,0,0,.4)}
.jb-libplank{height:22px;background:linear-gradient(180deg,rgba(255,228,186,.6) 0,rgba(255,228,186,.6) 1px,rgba(0,0,0,0) 1px,rgba(0,0,0,0) 58%,rgba(30,14,4,.45)),#8a5a32 url('/_content/Jinn.Ui/img/site/wood.png') 0 0/300px auto;box-shadow:0 18px 22px -10px rgba(30,14,4,.6);border-radius:0 0 3px 3px}
.jb-wall{background:#b98a52 url('/_content/Jinn.Ui/img/site/wood.png') 0 0/430px auto repeat}
.jb-wall.jb-sm{background-size:200px auto}
.jb-row{position:relative}
.jb-shT{position:absolute;top:0;left:0;right:0;height:29px;background:url('/_content/Jinn.Ui/img/site/shelf-shadow-top.png') 0 0/auto 29px repeat-x;opacity:.9;pointer-events:none;z-index:1}
.jb-shL{position:absolute;top:0;bottom:0;left:0;width:103px;background:url('/_content/Jinn.Ui/img/site/shelf-shadow-left.png') 0 0/103px 115px repeat-y;pointer-events:none;z-index:1}
.jb-shR{position:absolute;top:0;bottom:0;right:0;width:103px;background:url('/_content/Jinn.Ui/img/site/shelf-shadow-right.png') 0 0/103px 115px repeat-y;pointer-events:none;z-index:1}
.jb-board{position:absolute;bottom:0;left:0;right:0;height:17px;background:url('/_content/Jinn.Ui/img/site/shelf-board.png') 0 0/auto 17px repeat-x;box-shadow:inset 0 -1px 0 rgba(255,255,255,.25);z-index:3}
.jb-capL{position:absolute;bottom:0;left:0;width:150px;height:17px;background:url('/_content/Jinn.Ui/img/site/shelf-cap-left.png') left bottom/auto 17px no-repeat;z-index:4}
.jb-capR{position:absolute;bottom:0;right:0;width:150px;height:17px;background:url('/_content/Jinn.Ui/img/site/shelf-cap-right.png') right bottom/auto 17px no-repeat;z-index:4}
.jb-sm .jb-shT{height:14px;background-size:auto 14px}.jb-sm .jb-shL,.jb-sm .jb-shR{width:30px;background-size:30px 34px}
.jb-sm .jb-board,.jb-sm .jb-capL,.jb-sm .jb-capR{height:8px;background-size:auto 8px}.jb-sm .jb-capL,.jb-sm .jb-capR{width:70px}
.jb-md .jb-shT{height:20px;background-size:auto 20px}.jb-md .jb-shL,.jb-md .jb-shR{width:60px;background-size:60px 67px}
.jb-md .jb-board,.jb-md .jb-capL,.jb-md .jb-capR{height:11px;background-size:auto 11px}.jb-md .jb-capL,.jb-md .jb-capR{width:97px}
@media (max-width:1180px){.jb-nav{display:none !important}.jb-menu-btn{display:flex !important}}
@media (min-width:1181px){.jb-menu{display:none !important}}
@media (max-width:560px){.jb-hdr-ctl{display:none !important}.jb-shelfgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:561px){.jb-menu-ctl{display:none !important}}
@media (max-width:980px){.jb-side{display:none !important}}
@media (max-width:760px){.jb-panel{display:none !important}.jb-lapphone{display:none !important}}
@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important}}