:root{color-scheme:dark;--bg:#102227;--panel:#193238;--line:#355057;--text:#f2efe0;--muted:#a3b9b5;--mint:#b7db9b;--gold:#e0b47c;--bad:#efa69f}*{box-sizing:border-box}body{margin:0;color:var(--text);background:radial-gradient(ellipse at 80% 0,#244b4588,transparent 60%),var(--bg);font:15px/1.55 system-ui,-apple-system,'Segoe UI',sans-serif}.shell{max-width:1420px;margin:auto;padding:0 32px}header{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:108px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:14px;align-items:center;letter-spacing:3px;color:var(--text);text-decoration:none;font-size:20px;font-weight:800;line-height:1.3}.brand>span{font-size:48px;color:var(--gold)}.brand b{color:var(--mint)}.brand small{display:block;font-size:8px;font-weight:500;letter-spacing:2px;color:var(--muted);margin-top:8px}.identity{display:flex;align-items:center;gap:12px;font-size:12px;flex-wrap:wrap}.avatar{width:34px;height:34px;border-radius:50%}button,.button{display:inline-block;font:inherit;text-decoration:none;font-size:13px;font-weight:700;padding:11px 18px;border:1px solid #4a6568;background:#29454a;color:var(--text);border-radius:7px;cursor:pointer}button:hover:not(:disabled),.button:hover{border-color:var(--mint);background:#355551}button.primary,.button.primary{background:var(--mint);border-color:var(--mint);color:#19362b}button.quiet{background:transparent;color:var(--muted);font-size:12px}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:3px}h1,h2,h3,p{margin-top:0}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(42px,4.8vw,72px);line-height:1.05;margin-bottom:22px}h2{font-family:Georgia,serif;font-size:30px;font-weight:400;margin-bottom:12px}h3{font-size:18px;margin-bottom:8px}p{color:var(--muted);line-height:1.8}.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:3px;font-weight:700;color:var(--gold);margin-bottom:20px}.hero{position:relative;display:grid;grid-template-columns:1.05fr 1fr;align-items:center;min-height:450px;gap:20px;margin-top:28px;padding:45px;border-radius:18px;border:1px solid #416054;background:radial-gradient(ellipse at 80% 30%,#4b706244,transparent 50%),linear-gradient(120deg,#1b393c,#1c3635);overflow:hidden}.hero:after{content:'';position:absolute;inset:auto 0 0;height:100px;background:linear-gradient(transparent,#99b6a417);pointer-events:none}.hero p{max-width:460px;font-size:14px}.hero-art{position:relative;align-self:stretch;min-height:320px;background:radial-gradient(ellipse at 50% 80%,#b4d09d33,transparent 65%)}.hero-art:before,.hero-art:after{content:'';position:absolute;height:115%;width:15px;background:#102d2a66;left:13%;top:-70px;transform:rotate(13deg);box-shadow:80px 0 #102d2a33,160px 0 #102d2a44,240px 0 #102d2a22}.hero-art:after{left:70%;transform:rotate(-13deg);box-shadow:none}.hero-art img{position:absolute;width:78%;height:100%;object-fit:contain;z-index:1;left:14%;filter:drop-shadow(0 16px 15px #06161666)}.hero-art .little{width:36%;height:46%;left:-2%;bottom:-5%;z-index:2}.hero-art .label{position:absolute;bottom:0;right:10%;z-index:3;color:var(--gold);font-size:10px;letter-spacing:3px}.tag{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;padding:5px 9px;border:1px solid #658373;border-radius:30px;display:inline-block;color:var(--mint)}.tabs{display:flex;gap:6px;flex-wrap:wrap;padding:22px 0;border-bottom:1px solid var(--line);margin-bottom:28px}.tabs button{background:transparent;border-color:transparent;color:var(--muted)}.tabs button.active{border-color:#738e72;color:var(--mint);background:#b7db9b0c}.section-heading{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:22px}.section-heading p{font-size:13px;margin:0}.stats{display:flex;gap:22px;flex-wrap:wrap;font-size:11px;color:var(--muted)}.stats strong{font-size:24px;display:block;color:var(--text);font-weight:500}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.creature{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:var(--panel)}.portrait{background:radial-gradient(ellipse at 50% 80%,#83ae7e30,transparent 75%),linear-gradient(#213f40,#244241);height:220px;position:relative}.portrait img{width:100%;height:100%;object-fit:contain;transition:transform .3s}.creature:hover .portrait img{transform:translateY(-5px)}.portrait .tag{position:absolute;top:15px;left:15px;background:#102b2ad9;z-index:1}.moon .portrait{background:radial-gradient(ellipse at 50% 70%,#a394ce55,transparent 70%),#27374a}.moon .portrait img{filter:hue-rotate(50deg) saturate(.7) brightness(1.13)}.creature-content{padding:20px}.creature-content p{font-size:12px;min-height:42px;margin-bottom:13px}.metadata{font-size:10px;color:var(--muted);line-height:1.8}.row{display:flex;justify-content:space-between;gap:15px;align-items:center}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.pill{font-size:11px;border:1px solid var(--line);border-radius:30px;padding:4px 9px;color:var(--muted)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:25px;margin-bottom:20px}.encounter{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}.encounter img{width:100%;max-height:350px;object-fit:contain}.encounter.moon img{filter:hue-rotate(50deg)}.notice{padding:14px 18px;background:#d6b9850b;border:1px solid #8b78553d;border-radius:8px;color:#d7c8a8;font-size:12px;margin-bottom:18px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:20;background:#243d3b;color:var(--text);border:1px solid var(--mint);box-shadow:0 12px 50px #0009;border-radius:10px;padding:16px 24px;max-width:min(650px,94vw);font-size:14px}.toast.error{border-color:var(--bad)}footer{display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:10px;padding:35px 0}.empty{padding:40px;text-align:center;color:var(--muted)}.loading{padding:60px;text-align:center}.item-icon{font-size:38px;color:var(--gold);line-height:1}.item{display:flex;align-items:center;gap:22px}.item .count{margin-left:auto;font-size:32px;color:var(--mint)}input,select{font:inherit;font-size:13px;display:block;width:100%;border:1px solid #526a6d;border-radius:6px;background:#12282d;padding:11px;color:var(--text);margin-top:8px}label{font-size:12px;color:var(--muted)}.formgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.formgrid .wide{grid-column:1/-1}input[type=checkbox]{width:18px;height:18px;display:inline;margin-right:8px;vertical-align:middle}.tablewrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:12px}th,td{text-align:left;border-bottom:1px solid var(--line);padding:12px;vertical-align:top}th{color:var(--muted);font-weight:500}td button{font-size:11px;padding:7px 10px}details summary{cursor:pointer;color:var(--gold);padding:12px 0}pre{white-space:pre-wrap;word-break:break-word;font-size:11px;color:var(--muted)}.demo-banner{background:#d8b983;color:#233833;font-size:12px;text-align:center;padding:10px}.admin-nav{display:flex;gap:10px;flex-wrap:wrap}.filter{max-width:350px;margin:0}.small{font-size:12px}.error-box{padding:35px;border:1px solid var(--bad);border-radius:12px;color:var(--bad)}[hidden]{display:none!important}@media(max-width:950px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{padding:32px;min-height:370px}.hero-art{min-height:280px}.formgrid{grid-template-columns:1fr 1fr}}@media(max-width:620px){.shell{padding:0 16px}header{min-height:95px}.brand{font-size:15px;letter-spacing:2px}.brand small{font-size:7px}.brand>span{font-size:34px}.identity{justify-content:end}.hero{grid-template-columns:1fr;padding:28px;gap:0}.hero-art{min-height:260px}.hero h1{font-size:46px}.hero .eyebrow{margin-bottom:15px}.grid{grid-template-columns:1fr}.portrait{height:260px}.section-heading{align-items:start;flex-direction:column}.encounter{grid-template-columns:1fr}.encounter img{max-height:260px}.formgrid{grid-template-columns:1fr}.tabs{gap:0}.tabs button{padding:10px;font-size:12px}footer{flex-direction:column}.stats{gap:17px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.progress-info{display:grid;gap:6px;margin:14px 0;color:#bed1c7;font-size:14px}progress{width:100%;height:12px;accent-color:#d2e891}#trainingClock{margin:12px 0;font-weight:600}button[data-train]{margin-right:8px}