/* Wildkin's sculpted royal-fantasy interface, based on the latest visual direction. */
:root{
  --serif:'Wildkin Display','Lilita One','Outfit',sans-serif;
  --royal-white:#fff;--ink:#fff;--muted:#b8dbf7;--line:#082e62;
  --blue-panel:#173f80;--blue-dark:#061b39;
}
html{background:radial-gradient(ellipse at 50% 25%,#1468aa,#031a39 76%)}
body{
  max-width:520px;color:#fff;background-color:#07558c;
  background-image:radial-gradient(ellipse at 50% 30%,#35c1ed65 0,#0875b812 42%,#001d4870 100%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cdefs%3E%3ClinearGradient id='t' x2='0' y2='1'%3E%3Cstop stop-color='%231d86b5'/%3E%3Cstop offset='1' stop-color='%230e5289'/%3E%3C/linearGradient%3E%3Cpattern id='p' width='56.5685425' height='56.5685425' patternTransform='rotate(45)' patternUnits='userSpaceOnUse'%3E%3Crect x='1' y='1' width='53.5685425' height='53.5685425' rx='5' fill='url(%23t)' stroke='%2303335c' stroke-width='2'/%3E%3Cpath d='M6 3H50Q53 3 53 7V50' fill='none' stroke='%2349add1' stroke-opacity='.35' stroke-width='1.3'/%3E%3Cpath d='M3 7V50Q3 53 7 53H50' fill='none' stroke='%23052750' stroke-opacity='.45' stroke-width='1.5'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E");
  background-size:100% 100%,160px 160px;background-position:center,center top;
  background-attachment:scroll;box-shadow:0 0 0 2px #071b37,0 0 95px #000b1bbb;
  padding-bottom:calc(88px + env(safe-area-inset-bottom));font-size:13px;
}
button{font-weight:600}h1,h2,h3,.brand,.btn,.nav-btn,.resource strong,.parent-slot>strong,.map-btn,.timer-text,.roster-tabs button,.sort-btn,.card-name,.card-level,.card-progress,.collection-summary strong,.keeper-info strong,.keeper-trophies{
  font-family:var(--serif);font-weight:400;color:#fff;letter-spacing:.1px;
  -webkit-text-stroke:1px #071b34;paint-order:stroke fill;
  text-shadow:0 2px 0 #07152d,1px 0 #07152d,-1px 0 #07152d;
}
.header{height:54px;min-height:54px;padding:6px 13px;border:0;border-bottom:1px solid #4a9ec244;background:linear-gradient(#041526d9,#06294d55);box-shadow:none;z-index:5}
.brand{font-size:26px;line-height:1;gap:7px;letter-spacing:.3px;font-style:normal;-webkit-text-stroke:1.3px #061a36;text-shadow:0 3px 0 #061a36,0 -1px #fff0bd}
.brand-symbol{width:31px;height:33px;border-radius:5px 5px 10px 10px;border:2px solid #7f5519;outline:1px solid #081e3c;background:linear-gradient(125deg,#ffed90,#ffc432 50%,#d59620);box-shadow:inset 0 2px #fff6b9,inset -3px -3px #b7751c,0 2px #041a35;font:400 24px/26px var(--serif);text-transform:uppercase;color:#fff2a9;-webkit-text-stroke:0;letter-spacing:-3px;text-shadow:0 2px #9d6818}
.brand-symbol span{font-size:10px;right:0;top:-7px}.header-right{gap:6px}.header .avatar{display:none}.icon-btn{width:33px;height:33px;border:2px solid #0b284f;border-radius:6px;background:linear-gradient(#39a4e6,#1371b8);box-shadow:inset 0 2px #83d6f6,inset 0 -3px #164f8c,0 2px #05182e}.icon-btn .icon{width:18px;height:18px;color:#eafaff;filter:drop-shadow(0 1px #082953)}
main{padding:9px 11px 0}.page-heading{margin-bottom:9px}.resources{height:39px;grid-template-columns:1fr 1fr 1.13fr;gap:7px}.resource,.resource.population{position:relative;height:35px;padding:3px 5px 3px 3px;gap:5px;border:2px solid #488cae;border-radius:6px;background:linear-gradient(#10354a,#061f39);box-shadow:inset 0 3px #06182a,inset 0 -2px #123b58,0 2px #031c34}.resource+.resource{border-left:2px solid #488cae;padding-left:3px}.resource>span{width:26px;min-width:26px;height:28px;border:0;border-radius:50%;background:linear-gradient(130deg,#ffe974,#eaa222);box-shadow:inset 0 0 0 2px #ffef8c,inset -4px -3px #b87915,0 2px #04182b;color:#b07617;filter:drop-shadow(0 1px #04182d)}.resource.food>span{border-radius:10px 10px 10px 4px;background:linear-gradient(130deg,#ff83be,#b7247d);box-shadow:inset 2px 2px #ffb9d8,inset -3px -3px #831a65;color:#ffe4ed}.resource.population>span{border-radius:7px;transform:rotate(-6deg);background:linear-gradient(130deg,#a4f66f,#31a74f);box-shadow:inset 2px 2px #d7ffaa,inset -4px -3px #217641;color:#d2ffc3}.resource>span .icon{width:20px;height:20px}.resource small{font-size:6px;color:#8fbad3;line-height:1;letter-spacing:.6px;margin:0 0 1px}.resource strong{font-size:19px;line-height:1;-webkit-text-stroke:.9px #031525;text-shadow:0 2px #021421}.resource .out-of{font:400 11px var(--serif);color:#9ecbe9;-webkit-text-stroke:.4px #031525}
/* Navigation is a solid metal rail with one bright gold selected slab. */
.header nav{height:calc(82px + env(safe-area-inset-bottom));padding:0 0 env(safe-area-inset-bottom);gap:0;border-top:2px solid #bddef5;background:linear-gradient(#657c96,#374c64 13%,#2d3f58);box-shadow:0 -3px #082743,0 -1px 0 4px #4d87ab55;z-index:45}
.nav-btn{height:80px;min-height:80px;padding:0 4px 5px;gap:0;border:0;border-radius:0;border-right:2px solid #173650;background:linear-gradient(#5e7995,#374a62 60%);box-shadow:inset 1px 2px #91b3cc77,inset -1px 0 #86a5bb55;color:#fff;font-size:15px;line-height:1;-webkit-text-stroke:1px #071b31;text-shadow:0 2px #071b31}
.nav-btn:last-child{border-right:0}.nav-btn.active{border-color:#936921;color:#fff;background:linear-gradient(#fce38a 0,#e6b241 5%,#f8d76d 66%,#d49c30 100%);box-shadow:inset 0 2px #fff5b2,inset 0 -3px #ae7c24;transform:none}.nav-btn.active:after{display:none}.nav-btn>.icon,.nav-btn>span[data-icon]{height:49px;width:49px;margin-top:-2px;margin-bottom:0}.nav-btn.active .icon{color:#e4f8ff;filter:drop-shadow(0 3px #143550)}
.nav-art{display:inline-flex;justify-content:center;align-items:center;width:53px;height:52px;flex:none;overflow:visible;margin-top:-4px;filter:drop-shadow(0 3px 1px #0a203d88)}.nav-art svg,.nav-art img{width:100%;height:100%;display:block;overflow:visible}.small-count{right:calc(50% - 36px);top:5px;min-width:21px;height:22px;padding:0 3px;border-radius:5px;border:2px solid #fd4779;background:linear-gradient(#fb234d,#ce0735);box-shadow:0 2px #680f27,inset 0 1px #ff7391;color:#fff;font:400 13px var(--serif);-webkit-text-stroke:.3px #83122b;text-shadow:0 1px #88122d}.nav-status{top:5px;right:calc(50% - 35px);width:13px;height:13px;border:2px solid #ffa2bc;background:#ef1745;box-shadow:0 2px #941630}
/* The home screen puts the island model directly against the blue tile wall. */
.keeper-banner{display:flex;align-items:center;gap:9px;min-height:58px;padding:5px 8px;margin:0 1px 4px;border-radius:7px;border:1px solid #397a9f85;background:linear-gradient(90deg,#062851a6,#0b3d65a8);box-shadow:inset 0 1px #70b5d02b,0 2px #07335477}.keeper-badge{width:38px;height:42px;flex:none;display:grid;place-items:center;clip-path:polygon(50% 0,94% 13%,88% 74%,50% 100%,12% 74%,6% 13%);background:linear-gradient(130deg,#fff3a2,#efba35 43%,#b3721a);font:400 21px var(--serif);color:#fff;text-shadow:0 2px #795218;-webkit-text-stroke:1px #795218;box-shadow:inset 0 0 0 3px #ffffb6}.keeper-info{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}.keeper-info strong{font-size:18px;line-height:1.05}.keeper-info small{font-size:9px;color:#acdcf4;font-weight:700}.keeper-trophies{display:flex;align-items:center;gap:5px;min-width:58px;padding:5px;color:#ffe16c;font-size:17px}.keeper-trophies .icon{color:#ffdc62;width:23px;height:23px;filter:drop-shadow(0 2px #73501b)}
.game-layout{gap:8px}.game-layout .map-panel,.map-panel{height:332px;min-height:332px;max-height:332px;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}.canvas-wrap{background:transparent;min-height:0}.canvas-wrap canvas{background:transparent;image-rendering:auto;object-fit:cover;filter:drop-shadow(0 10px 8px #00182f80)}.map-toolbar{left:4px;right:4px;top:1px;align-items:flex-start}.location-pill{padding:5px 8px;max-width:73%;gap:6px;border-radius:5px;border:1px solid #70badb77;background:linear-gradient(#0a426ba9,#062d50a6);box-shadow:0 2px #05294255,inset 0 1px #9fdbf32b;color:#e9f8ff}.location-pill strong{font:400 14px var(--serif);color:#fff;-webkit-text-stroke:.6px #062d4f;text-shadow:0 1px #062343}.location-pill small{font-size:6px;color:#a1d3eb;margin-top:1px;letter-spacing:.2px}.location-pill>.icon{color:#b1e9b6;width:15px;height:15px}.weather{padding:5px;border:1px solid #87d5ee77;border-radius:5px;background:#073555a9;color:#d7f2fa;font-size:7px;box-shadow:0 2px #031f38}.weather .icon{height:13px;width:13px;color:#ffdf70}.map-bottom{left:4px;right:4px;bottom:7px}.map-buttons{justify-content:space-between;gap:9px;align-items:center}.map-btn{min-height:39px;padding:8px 10px;border-radius:6px;border:2px solid #0c436d;background:linear-gradient(#46bcf2,#178ed3);box-shadow:inset 0 2px #91e4ff,inset 0 -3px #1064a2,0 3px #052b49;color:#fff;font-size:12px;-webkit-text-stroke:.7px #0e4061;text-shadow:0 2px #0b456e}.map-btn.primary{flex:1;justify-content:center;border-color:#9b6315;background:linear-gradient(#ffe360,#ffc219 65%,#ffb406);box-shadow:inset 0 2px #fff29a,inset 0 -4px #d58b09,0 3px #6d4415;color:#fff;font-size:16px;-webkit-text-stroke:1px #553706;text-shadow:0 2px #553706}.map-btn .icon{width:17px;height:17px;filter:drop-shadow(0 1px #265a78)}.habitat-bar{height:35px;padding:0 3px;gap:5px;border:0;background:transparent;box-shadow:none}.habitat-btn{min-height:29px;padding:4px;font:400 11px var(--serif);color:#c6e7f7;border:1px solid #062b4f;background:#062f5466;border-radius:5px;-webkit-text-stroke:.4px #08243b;box-shadow:inset 0 1px #70b7d155,0 2px #062a4855}.habitat-btn.active{color:#fff;background:linear-gradient(#2797c9,#1469a6);border-color:#73ccec;box-shadow:inset 0 1px #8be1ff,0 2px #052d4b}.habitat-btn .icon{height:12px;width:12px}.habitat-bar .map-size{height:28px;width:24px;padding:4px}.map-size .icon{height:15px;width:15px}.map-panel.expanded{border:2px solid #4fa7d8;background:#0c5688;overflow:hidden;border-radius:8px;box-shadow:0 0 0 100vmax #041931db,0 0 0 2px #0a2a49}.map-panel.expanded .map-dpad{display:grid}
/* Breeding controls retain the compact home layout and large touch targets. */
.side-panel{background:linear-gradient(135deg,#235caa,#143e7c 70%);border:2px solid #69b6ed;border-radius:9px;box-shadow:inset 0 2px #8fcdf36b,inset 0 -4px #10356b,0 4px #07254f,0 0 0 2px #072348;padding:13px}.home-den{min-height:197px;padding:11px;gap:5px 12px;border-color:#e4b74e;background:linear-gradient(#265eaa,#153d7e);grid-template-columns:minmax(0,1.4fr) minmax(70px,.6fr)}.panel-heading h2{font-size:21px;color:#fff;-webkit-text-stroke:1px #091f3f;text-shadow:0 2px #071b34}.panel-heading>span{font-size:7px;padding:4px 6px;border:1px solid #386cab;background:#0a2858;color:#b9d6f0;border-radius:4px;box-shadow:inset 0 1px #88bded22}.panel-heading>span .icon{color:#ffa2d8}.parent-slot,.nursery-info .parent-slot{border:2px solid #a8c5e9;background:radial-gradient(ellipse at 50% 40%,#6ca1b9,#3b73a2 52%,#224c83);border-radius:7px;box-shadow:inset 0 0 0 2px #31619e,0 3px #072b59}.parent-slot:hover{border-color:#ffe68c;background:radial-gradient(ellipse at 50% 40%,#8ac2cf,#4d89b5 52%,#28548c)}.home-den .parent-slot{min-height:82px;padding:2px}.home-den .parent-slot>.creature-art{width:53px;height:49px;filter:drop-shadow(0 2px 1px #09233d66)}.parent-slot>strong{font-size:13px;color:#fff;-webkit-text-stroke:.6px #09223d;text-shadow:0 2px #09223d}.home-den .parent-slot>strong{font-size:11px;letter-spacing:0}.parent-slot>small,.home-den .parent-slot>small{font:400 8px var(--serif);color:#d7effb;text-shadow:0 1px #0b2d4b}.pair-plus{color:#ffb8df;filter:drop-shadow(0 1px #721662)}.home-den>.egg-preview{min-height:77px}.egg-stars{color:#ffea70;text-shadow:0 0 10px #fff063}.egg-art{border-color:#723eaa;box-shadow:inset 3px 3px 5px #fff7ffb3,inset -5px -7px 8px #82609e59,0 4px 0 #092753}.den-tip{color:#b5dbf3;font-size:8px}.den-tip .icon{color:#8cc7ec}.home-den>.den-tip{font-size:7px}.side-kicker{color:#b9d9f5}.den-caption{color:#c1d9f1}.den-caption strong{color:#ffdf75}
.btn,.btn.warm{min-height:47px;padding:9px 14px;border:2px solid #8e5d14;border-radius:7px;background:linear-gradient(#ffe568 0,#ffce2e 12%,#ffbf07 68%,#ffb208 100%);box-shadow:inset 0 2px #fff19a,inset 3px 0 #ffdf65,inset -3px 0 #efb02a,inset 0 -5px #d68a08,0 4px #643e11,0 0 0 1px #072b49;color:#fff;font-size:18px;-webkit-text-stroke:1px #553608;text-shadow:0 2px #553608;letter-spacing:.25px}.btn:hover,.btn.warm:hover{background:linear-gradient(#ffec81,#ffd642 65%,#ffc11c);transform:translateY(-1px);filter:brightness(1.03)}.btn.secondary{border:2px solid #0c4b78;background:linear-gradient(#42b7ef,#1596de 68%,#1688ce);color:#fff;box-shadow:inset 0 2px #89e1ff,inset 0 -4px #1567a8,0 4px #08395b,0 0 0 1px #06254a;-webkit-text-stroke:.8px #103e61;text-shadow:0 2px #103e61}.btn.secondary:hover{background:linear-gradient(#56c8fa,#21a2e7)}.button-price{font:400 12px var(--serif);color:#fff5b3;text-shadow:0 1px #78500f;-webkit-text-stroke:.4px #78500f;border-color:#9d67174d}.home-den>.btn{font-size:18px;min-height:42px}.home-den .breeding-actions .btn{min-height:40px;font-size:15px}.btn.ghost{font:600 10px var(--sans);color:#b8d9f5;-webkit-text-stroke:0;text-shadow:none}.btn .icon{filter:drop-shadow(0 1px #88621b);width:18px;height:18px}.btn.secondary .icon{filter:drop-shadow(0 1px #0f4669)}
.lower-layout{margin-top:15px}.section-head{margin-bottom:8px}.section-head h2{font-size:20px;color:#fff;letter-spacing:.3px;-webkit-text-stroke:1px #09223c}.section-head h2 small{font:400 10px var(--serif);color:#90c5e4;text-shadow:0 1px #062642}.text-btn{color:#b8ebff;font:400 11px var(--serif);text-shadow:0 1px #05223e;min-height:30px}.monster-row{gap:8px}.monster-card{min-height:137px;border:3px solid #e5b643;border-radius:8px;background:linear-gradient(#7bc2d6,#477da7 60%,#264d84);box-shadow:inset 0 0 0 2px #916314,0 3px #08274e,0 0 0 1px #062c4e;padding:6px 3px;gap:1px}.monster-card>.creature-art{width:77px;height:69px;filter:drop-shadow(0 3px #193d6c66)}.monster-card h3{font-size:16px;line-height:1.05;color:#fff;letter-spacing:0;-webkit-text-stroke:.8px #09243e;margin:0 0 3px}.monster-card .mini-level{font:400 10px var(--serif);margin-top:5px;color:#d9eff9}.level-track{background:#0a264d;border-color:#4678a6;height:5px}.level-track i{background:linear-gradient(#69ed72,#21c057);height:4px}.monster-card.empty{border:2px solid #4285ad;background:#082b5180;box-shadow:inset 0 1px #62b5d84d,0 3px #08274e}.monster-card.empty span{font:400 12px var(--serif);color:#c0e4f7}.monster-card.empty small{color:#8ec3de;font-size:8px}.type-tag{font:400 9px var(--serif);padding:3px 5px;color:#e9ffd6;background:#376b2e;border:1px solid #87b269;text-shadow:0 1px #1e4329;box-shadow:inset 0 1px #b8ef9066;-webkit-text-stroke:.2px #27483c}.type-tag.flame{background:#a74c27;color:#ffe2bd;border-color:#e5a45d}.type-tag.water{background:#1a719d;color:#e5faff;border-color:#7ed6f4}.type-tag.spark{background:#a48013;color:#fff0a8;border-color:#eac15e}.type-tag.stone{background:#52636a;color:#f2f6ef;border-color:#afbec2}.type-tag.mystic{background:#7f369e;color:#ffe3ff;border-color:#bf7ad9}.bottom-nudge{border:2px solid #307eaa;border-radius:7px;background:linear-gradient(#0a3e70dd,#072b55dd);box-shadow:inset 0 1px #4ca3c65e,0 3px #061f42;padding:10px;min-height:73px}.nudge-left p{font-size:9px;color:#b5d8ee}.nudge-left strong{font:400 13px var(--serif);color:#fff;-webkit-text-stroke:.4px #092b48;line-height:1.2}.bottom-nudge .btn{font:400 12px var(--serif);min-height:43px;padding:7px 9px;color:#fff;border-radius:6px;border-color:#9b6417;background:linear-gradient(#ffe06a,#ffc52d);box-shadow:inset 0 2px #fff1a0,inset 0 -4px #d49418,0 3px #643e11;-webkit-text-stroke:.6px #69410c;text-shadow:0 2px #69410c}footer{color:#88bbd7;margin:11px 1px 0;font-size:7px}footer>button{font-size:8px;color:#bee6f7}
/* Collection: compact collectible cards, sculpted frames and elemental badges. */
.roster-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:7px 20px 0;position:relative;z-index:2}.roster-tabs button{height:42px;border:2px solid transparent;border-radius:10px 10px 0 0;background:#06284977;box-shadow:inset 0 1px #0b4b7799;font-size:22px;line-height:1;color:#fff;-webkit-text-stroke:1px #04162c;text-shadow:0 2px #04162c}.roster-tabs button.active{background:linear-gradient(#40bae6,#1178bb);border-color:#4dd6ec;box-shadow:inset 0 2px #a0f1f76e,0 -2px #0a365e88}.roster-toolbar{display:flex;align-items:center;gap:7px;min-height:51px;padding:5px 7px;margin:0 -11px 15px;background:linear-gradient(#128df2,#075acf);border-top:3px solid #4ac3ff;border-bottom:3px solid #37abed;box-shadow:0 3px #073476,inset 0 -3px #0645a9}.roster-toolbar .filter-list{display:flex;align-items:center;gap:6px;margin:0;width:100%;max-width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.roster-toolbar .filter-list::-webkit-scrollbar{display:none}.roster-toolbar .filter-list button,.element-filter button{display:flex;align-items:center;justify-content:center;flex-shrink:0;min-width:35px;min-height:36px;height:36px;padding:5px 7px;border:2px solid #07438a;border-radius:7px;background:linear-gradient(#4387ca,#255cae);box-shadow:inset 0 2px #7db8ea,0 2px #04346c;color:#d5ecff;font:400 12px var(--serif);text-shadow:0 2px #0a3263;-webkit-text-stroke:.4px #0a3263}.roster-toolbar .filter-list button.active,.element-filter button.active{color:#fff;border-color:#e3ae30;background:linear-gradient(#ffdf65,#ffbf1a);box-shadow:inset 0 2px #fff0a1,0 2px #77551d;text-shadow:0 2px #77511d;-webkit-text-stroke:.5px #77511d}.roster-toolbar button .icon{width:19px;height:19px}.collection-summary{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 5px;margin:0 0 15px;min-height:54px;border-radius:8px;background:#0629496e;box-shadow:inset 0 1px #4788a855,0 2px #02345744}.collection-summary h2{font:400 22px/1 var(--serif);margin:0;color:#fff;letter-spacing:0;-webkit-text-stroke:1px #061b31;text-shadow:0 2px #061b31}.collection-summary p,.collection-summary .found{font:400 12px var(--serif);color:#f5a2f9;margin:4px 0 0;-webkit-text-stroke:.5px #441a56;text-shadow:0 1px #22133c}.sort-btn{flex:none;display:flex;align-items:center;justify-content:center;gap:6px;min-height:37px;padding:6px 9px;border:2px solid #24567e;border-radius:7px;background:linear-gradient(#6597bf,#3b709d);box-shadow:inset 0 2px #a3c9e3,inset 0 -3px #28547e,0 2px #0a2d4a;font-size:13px;white-space:nowrap;-webkit-text-stroke:.5px #10273d}.sort-btn .icon{width:15px;height:15px;color:#bde3fc}.book-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px 7px;padding:2px 2px 5px;margin:0}.book-card{position:relative;min-width:0;min-height:145px;padding:0 0 4px;display:flex;flex-direction:column;align-items:stretch;text-align:center;overflow:visible;border:3px solid #b6c7e1;border-radius:10px 10px 8px 8px;background:linear-gradient(#6993ba,#305582 69%,#1c376e);box-shadow:inset 0 0 0 2px #29466f,0 3px #092349,0 0 0 1px #0a2b52;isolation:isolate;transition:transform .15s,filter .15s}.book-card:hover{transform:translateY(-3px);filter:brightness(1.07)}.book-card::before{content:'';position:absolute;z-index:-1;left:8px;right:8px;top:-10px;height:21px;clip-path:polygon(50% 0,100% 35%,100% 100%,0 100%,0 35%);background:linear-gradient(120deg,#e6eefb,#7790b6);box-shadow:inset 0 0 0 3px #244373}.book-card.rarity-uncommon{border-color:#ffdc62;background:linear-gradient(#b9dce8,#6799b6 65%,#294a82);box-shadow:inset 0 0 0 2px #bc7a0c,0 3px #092349,0 0 0 1px #153151}.book-card.rarity-uncommon::before{background:linear-gradient(130deg,#fff2b0,#ffcf34 50%,#d69a13)}.book-card.rarity-rare{border-color:#f4a7ff;background:linear-gradient(#b37ee9,#6a47ae 65%,#3a266e);box-shadow:inset 0 0 0 2px #a43fcb,0 3px #092349,0 0 0 1px #5b2193,0 0 9px #cd46f3aa}.book-card.rarity-rare::before{background:linear-gradient(130deg,#d78dff,#9543d8 50%,#6229a9)}
.card-element{position:absolute;left:-6px;top:0;z-index:4;width:25px;height:27px;display:grid;place-items:center;border:2px solid #681077;border-radius:55% 55% 45% 50%;background:linear-gradient(135deg,#f7b2ff,#e342e9 45%,#a718b1 100%);box-shadow:inset 2px 2px #ffccff,0 2px #4c095b;transform:rotate(6deg);color:#fff;font:400 13px var(--serif);-webkit-text-stroke:.5px #72135e;text-shadow:0 1px #72135e}.card-element .icon{width:15px;height:15px;filter:drop-shadow(0 1px #72135e);stroke-width:2.5}.card-rarity-mark{position:absolute;left:calc(50% - 7px);top:-10px;z-index:3;width:15px;height:15px;border:2px solid #ffcf5e;background:linear-gradient(130deg,#e79aff,#8e31bf 45%,#5f1e99);box-shadow:0 0 0 2px #674b50,inset 1px 1px #eccbff,0 2px #062443;transform:rotate(45deg);border-radius:2px}.rarity-common .card-rarity-mark{border-color:#c6d5e5;background:linear-gradient(130deg,#c5d8ed,#657c9c);box-shadow:0 0 0 2px #29466f,inset 1px 1px #fff,0 2px #062443}.rarity-uncommon .card-rarity-mark{background:linear-gradient(130deg,#fff0a0,#d79b18);border-color:#ffe27d;box-shadow:0 0 0 2px #7e5727,inset 1px 1px #fff5bf,0 2px #062443}.card-rarity-mark svg{display:none}
.card-portrait{position:relative;display:grid;place-items:center;width:100%;height:88px;overflow:hidden;margin:0;border-radius:6px 6px 0 0;background:radial-gradient(ellipse at 55% 50%,#b0e9ee 0,#72a8c0 42%,#356495 90%);border:2px solid #466a96;border-bottom:0}.card-portrait::after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 12px #143c6355;pointer-events:none}.rarity-uncommon .card-portrait{border-color:#b68820;background:radial-gradient(ellipse,#d6f8ec,#a3d3cc 47%,#638ea9 100%)}.rarity-rare .card-portrait{border-color:#cb63e3;background:radial-gradient(ellipse,#d3b9fa,#b46bdc 47%,#693c99 100%)}.card-portrait .creature-art{display:block;width:113%;height:100px;max-width:none;object-fit:contain;margin-top:4px;filter:drop-shadow(0 3px 2px #10294b44);transition:transform .2s}.book-card:hover .card-portrait .creature-art{transform:translateY(-3px) scale(1.03)}
.card-name{display:block;position:relative;width:100%;font-size:11px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:clip;margin:0!important;padding:2px 0 1px;color:#fff!important;background:linear-gradient(#23558c,#173b71);border-top:1px solid #81b1cf77;-webkit-text-stroke:.65px #071a36;text-shadow:0 1.5px #071a36;letter-spacing:0}.card-level{display:block;min-height:18px;width:100%;padding:1px 0 2px;background:linear-gradient(#df9aff,#b97be5);color:#fff;font-size:13px;line-height:1.1;text-align:center;border-top:1px solid #e9caff;border-bottom:1px solid #5f3695;-webkit-text-stroke:.7px #3b174f;text-shadow:0 1px #3b174f;letter-spacing:0}.rarity-common .card-level{color:#d9eeff;background:linear-gradient(#7faed6,#4884b8);border-top-color:#c1ddec;border-bottom-color:#1b4c7b;-webkit-text-stroke:.6px #0e315d;text-shadow:0 1px #0e315d}.card-progress{display:block;position:relative;width:calc(100% - 3px);height:12px;min-height:12px;margin:3px auto 0;background:#081b43;border:1px solid #385a8b;border-radius:3px;overflow:hidden;font-size:8px;line-height:10px;text-align:center;color:#fff;-webkit-text-stroke:.35px #092343;text-shadow:0 1px #092343;letter-spacing:0}.card-progress i{position:absolute;left:0;top:0;bottom:0;z-index:-1;background:linear-gradient(#55e5ff,#13b4ee);box-shadow:inset 0 1px #b8f4ff}.card-progress span,.card-progress b{position:relative;z-index:1}.book-card.locked{background:linear-gradient(#526b83,#294768);border-color:#6a92b4;box-shadow:inset 0 0 0 2px #244369,0 3px #092349,0 0 0 1px #0a2b52}.book-card.locked::before{background:linear-gradient(#739bb8,#3f5d7d)}.book-card.locked .card-portrait{background:radial-gradient(ellipse,#5985a2,#355d7d);border-color:#496c8e}.book-card.locked .card-portrait .creature-art{filter:brightness(.15) saturate(.25);opacity:.65}.book-card.locked .card-name{color:#acd1e7!important}.book-card.locked .card-level{background:linear-gradient(#607a9a,#3f5f87);border-color:#7897b3;color:#b3d6ec;-webkit-text-stroke:.4px #183752;text-shadow:0 1px #183752}.book-card.locked .card-rarity-mark{filter:saturate(.4);opacity:.8}.book-card.locked .card-element{background:linear-gradient(#5987b1,#2f5683);border-color:#274a74;box-shadow:inset 0 1px #9ac9e4,0 2px #0b2c4c;opacity:.8}.book-card.locked .card-progress{color:#96bdd6;font-size:7px}.book-card .book-no,.book-card .owned-check{display:none}.collection-head{margin-bottom:10px}.collection-head h2{font:400 24px var(--serif);color:#fff}.collection-head p{color:#cba6f1}.no-results{grid-column:1/-1}
/* Creature detail opens as a character reveal above an opaque royal panel. */
dialog{max-height:calc(100dvh - 28px);width:min(calc(100vw - 24px),470px);padding:16px;color:#fff;border:3px solid #4b97d0;border-radius:11px;background:linear-gradient(#214b8b,#133775 80%);box-shadow:inset 0 2px #72b7e677,inset 0 -5px #0c295b,0 5px #041c42,0 0 0 2px #08294e,0 15px 70px #001026bb}dialog::backdrop{background:#010d20d1;backdrop-filter:blur(1px)}.modal-head{gap:9px;align-items:flex-start;margin-bottom:10px}.modal-head h2{font-size:26px;line-height:1.05;color:#fff;letter-spacing:.2px;-webkit-text-stroke:1px #041a32;text-shadow:0 3px #041a32;flex:1;padding-top:5px}.close{flex:none;width:35px;min-width:35px;height:35px;border:2px solid #81241c;border-radius:6px;color:#fff;background:linear-gradient(#ff9291,#ff4947 55%,#df201f);box-shadow:inset 0 2px #ffb8ae,inset 0 -4px #ac221e,0 2px #071c39,0 0 0 1px #0a1f38}.close .icon{height:23px;width:23px;stroke-width:4;filter:drop-shadow(0 1px #5c171b)}.close:hover{filter:brightness(1.13)}.modal-sub{font-size:11px;color:#bcdbf2}.choice-grid{gap:9px}.choice{padding:7px;background:radial-gradient(ellipse at 50% 30%,#70b4cc,#305a90 76%);border:2px solid #ffd363;border-radius:7px;box-shadow:inset 0 0 0 2px #9d6a20,0 3px #092653}.choice strong{font:400 16px var(--serif);-webkit-text-stroke:.6px #092748;text-shadow:0 2px #092748;color:#fff}.choice .creature-art{width:84px;height:84px}.choice small{font:400 10px var(--serif);color:#ceeafd}.stats-grid{gap:7px;margin:12px 0}.stats-grid div{padding:9px 3px;border:2px solid #092b58;border-radius:6px;background:linear-gradient(#133465,#0b2857);box-shadow:inset 0 1px #6292c455,0 1px #5596c15e}.stats-grid small{font-size:7px;letter-spacing:.3px;color:#a1cae9;margin-bottom:4px}.stats-grid strong{font:400 18px var(--serif);color:#ffdc68;-webkit-text-stroke:.5px #352519;text-shadow:0 2px #1d2743}.progress-track{height:9px;border:1px solid #051d44;background:#081d4b;box-shadow:inset 0 1px #031431,0 1px #69a9d566}.progress-track>i{background:linear-gradient(#68eaff,#1fc7ed);box-shadow:inset 0 1px #d1ffff}.breeding-sub{font-size:9px;color:#b4d4ed}.modal-actions{margin-top:14px;gap:8px}.modal-actions .btn{font-size:16px;min-height:46px;padding:8px 6px}.monster-detail p{font-size:11px;color:#c5dff3;line-height:1.6}
dialog.hero-dialog{width:min(calc(100vw - 24px),470px);max-height:calc(100dvh - 22px);padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#4f8fb7 transparent}.hero-overflow{height:250px;position:relative;display:flex;align-items:flex-end;justify-content:center;isolation:isolate;overflow:visible;pointer-events:none}.hero-overflow::before{content:'';position:absolute;z-index:-1;width:290px;height:230px;left:50%;bottom:-20px;transform:translateX(-50%);background:radial-gradient(ellipse,#df35ffb0, #9a21f680 28%,#8726dc1a 57%,transparent 72%);filter:blur(6px)}.hero-overflow::after{content:'✦';position:absolute;left:17%;top:34%;color:#eac2ff;font-size:16px;text-shadow:126px 14px #fbc0ff,180px 100px #c375ff,-9px 93px #9d69e8;opacity:.75}.hero-overflow>.creature-art{position:relative;z-index:1;width:280px;height:250px;max-width:92%;object-fit:contain;object-position:center bottom;margin-bottom:-15px;filter:drop-shadow(0 5px 4px #04132caa) drop-shadow(0 0 12px #d24dff80);animation:royal-reveal .4s ease-out}.hero-dialog .hero-sheet{position:relative;z-index:2;margin:0 2px 8px;padding:13px 13px 17px;border:3px solid #4b9bd5;border-radius:12px;background:linear-gradient(#1c4383,#12346e 72%);box-shadow:inset 0 2px #6ab8e45e,inset 0 -5px #0b285d,0 5px #061b42,0 0 0 2px #09264a;min-width:0;overflow:hidden}.hero-sheet .modal-head{margin:0;gap:5px;min-height:35px;align-items:flex-start}.hero-sheet .modal-head h2{font-size:27px;padding-top:3px;-webkit-text-stroke:1.1px #06152c;line-height:1.1}.hero-subtitle{margin:3px 0 11px;text-align:left;font:400 18px var(--serif);line-height:1.1;color:#f3a5ff;-webkit-text-stroke:.8px #321343;text-shadow:0 2px #321343}.hero-profile{display:flex;align-items:center;gap:14px;min-height:100px;margin:7px 0 10px}.hero-card-mini{flex:none;position:relative;width:87px;height:104px;padding:2px;border:3px solid #f6c4ff;border-radius:9px;background:radial-gradient(ellipse at 50% 30%,#be90ee,#773bab 70%);box-shadow:inset 0 0 0 2px #b15bd2,0 0 10px #c247f399,0 3px #09234d;display:flex;align-items:center;justify-content:center;overflow:hidden}.hero-card-mini .creature-art{width:105px;height:104px;max-width:none;filter:drop-shadow(0 3px #31144388)}.hero-card-mini .card-level{position:absolute;bottom:0;left:0;right:0;font-size:12px;border:0;background:#b16edfdd}.hero-meta{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:7px}.hero-meta p,.hero-meta small{font-size:10px;line-height:1.45;color:#b8d8ef;margin:0}.hero-meta strong{font:400 20px var(--serif);color:#ffe26f;-webkit-text-stroke:.6px #09243d;text-shadow:0 2px #09243d}.hero-meta .type-tag{font-size:12px;padding:5px 7px}.hero-sheet .stats-grid{margin:10px 0;gap:7px}.hero-sheet .stats-grid div{padding:7px 3px}.hero-sheet .stats-grid strong{font-size:18px}.hero-sheet .hero-description,.hero-sheet .monster-detail p{font-size:10px;line-height:1.55;color:#c2dcef;margin:9px 0}.hero-sheet .modal-actions{margin-top:12px}.hero-sheet .modal-actions .btn{font-size:16px;min-height:45px}.hero-sheet .progress-track{margin:9px 0 5px}.hero-sheet .breeding-sub{text-align:center;font-size:9px}
/* Nursery reveal, rewards and all supporting panels keep the same materials. */
.nursery-feature{border-radius:10px;border:2px solid #b390dd;background:radial-gradient(ellipse at 50% 50%,#b34cdc,#7332ad 44%,#253369 100%);box-shadow:inset 0 2px #f8c1f45e,inset 0 -3px #14265d,0 4px #0a2550,0 0 0 2px #102b51}.nursery-feature h2{font-size:23px;color:#fff;-webkit-text-stroke:1px #2b1746;text-shadow:0 2px #2b1746}.nursery-feature .overline{font-size:7px;color:#d8bbf3;letter-spacing:1.3px}.nursery-feature p{color:#e4c8f3;font-size:10px}.nursery-feature .egg-art{filter:drop-shadow(0 0 10px #f6b9ff85)}.nursery-info .side-panel{padding:14px}.nursery-info .parent-slot{min-height:109px}.nursery-info .parent-slot .creature-art{height:70px;width:70px}.guide-step{border:2px solid #206092;border-radius:7px;background:#0a345edb;box-shadow:inset 0 1px #78b5d04d,0 3px #062348}.guide-step>span{font:400 25px var(--serif);color:#ffe16b;-webkit-text-stroke:.7px #6c4e1e;text-shadow:0 2px #092341}.guide-step h3{font:400 15px var(--serif);color:#fff;-webkit-text-stroke:.5px #062641;text-shadow:0 2px #062641}.guide-step p{font-size:10px;color:#b6d8ef}.timer-text{font-size:27px;color:#ffe869;-webkit-text-stroke:1px #253550;text-shadow:0 2px #062345}.home-den .timer-text{font-size:23px}.encounter-stage{background:radial-gradient(ellipse at 50% 68%,#b44de275,#5649ad28 49%,transparent 70%)}.encounter-stage .creature-art{width:169px;height:169px;filter:drop-shadow(0 4px #14234a66)}.encounter-title h3{font-size:28px;color:#fff}.encounter-status{color:#c4dff1}.hp-row{font-size:9px;color:#bcd7ed}.encounter-buttons .btn{font-size:15px}.result-heading{font-size:28px;color:#fff;-webkit-text-stroke:1px #082343;text-shadow:0 2px #082343}.result-art{background:radial-gradient(ellipse,#b93ed59c,transparent 68%)}.result-sub{font-size:11px;color:#c8def2}.journal-entry{background:#0b2858;border-color:#3b75a8;color:#dceffa}.help-steps p{color:#bddaf0}.help-steps strong{color:#ffe17b}.toast{border-radius:8px;border:2px solid #d1eeff;background:linear-gradient(#f3fbff,#d9ecf7);box-shadow:0 4px #083252,0 0 0 2px #17659a,0 7px 20px #04234199;color:#143858;text-shadow:none;font-size:11px;font-weight:800;bottom:calc(94px + env(safe-area-inset-bottom))}
@keyframes royal-reveal{from{opacity:0;transform:translateY(18px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(min-width:420px){main{padding-left:13px;padding-right:13px}.resources{gap:9px}.resource strong{font-size:21px}.resource small{font-size:7px}.map-panel,.game-layout .map-panel{height:348px;min-height:348px;max-height:348px}.book-grid{gap:15px 9px}.book-card{min-height:160px}.card-portrait{height:100px}.card-portrait .creature-art{height:116px}.card-name{font-size:13px}.card-level{font-size:15px}.card-progress{font-size:9px;height:13px;line-height:11px}.collection-summary h2{font-size:25px}.roster-toolbar{margin-left:-13px;margin-right:-13px;padding-left:11px;padding-right:11px}.hero-overflow{height:280px}.hero-overflow>.creature-art{width:310px;height:280px}.hero-sheet .modal-head h2{font-size:31px}}
@media(min-width:700px){body{border:2px solid #082749;border-radius:14px;margin-top:14px;margin-bottom:14px;min-height:calc(100dvh - 28px)}.header{border-radius:12px 12px 0 0}.header nav{max-width:516px;bottom:14px;border-radius:0 0 11px 11px;overflow:visible}.nav-btn:first-child{border-bottom-left-radius:10px}.nav-btn:last-child{border-bottom-right-radius:10px}.toast{bottom:110px}.map-panel.expanded{top:25px;bottom:110px}}
@media(max-width:359px){main{padding:8px 9px 0}.header{height:50px;min-height:50px;padding:5px 10px}.brand{font-size:24px}.resource{gap:4px}.resource>span{height:25px;width:23px;min-width:23px}.resource strong{font-size:17px}.resource small{font-size:5.5px}.resource .out-of{font-size:10px}.resources{gap:5px}.keeper-banner{min-height:54px;gap:6px;padding:4px 6px}.keeper-info strong{font-size:16px}.keeper-info small{font-size:8px}.keeper-trophies{font-size:15px;gap:3px;padding:3px}.keeper-badge{width:32px;height:37px;font-size:18px}.map-panel,.game-layout .map-panel{height:310px;min-height:310px;max-height:310px}.map-btn.primary{font-size:14px}.map-btn{font-size:11px;padding:7px 8px}.home-den{padding:10px;gap:5px 8px;min-height:193px}.panel-heading h2{font-size:19px}.monster-card h3{font-size:14px}.monster-card>.creature-art{width:67px;height:63px}.monster-card{min-height:131px}.book-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 9px}.book-card{min-height:148px}.card-portrait{height:91px}.card-portrait .creature-art{height:102px}.card-name{font-size:12px}.card-level{font-size:14px}.collection-summary h2{font-size:21px}.collection-summary{padding:6px;margin-bottom:16px}.sort-btn{font-size:12px;padding:5px 7px}.roster-tabs{margin-left:9px;margin-right:9px}.roster-tabs button{font-size:21px}.roster-toolbar{margin-left:-9px;margin-right:-9px;gap:4px;padding-left:6px;padding-right:6px}.roster-toolbar .filter-list{gap:5px}.roster-toolbar .filter-list button,.element-filter button{min-width:32px;padding:5px;font-size:11px}.nav-btn{font-size:14px}.hero-overflow{height:215px}.hero-overflow>.creature-art{height:215px;width:250px}.hero-sheet .modal-head h2{font-size:24px}.hero-subtitle{font-size:17px}.hero-dialog .hero-sheet{padding:11px 10px 14px}.hero-profile{gap:10px;margin:6px 0 8px;min-height:90px}.hero-card-mini{width:75px;height:94px}.hero-card-mini .creature-art{height:96px;width:96px}.hero-meta strong{font-size:17px}.hero-sheet .modal-actions .btn{font-size:14px}.hero-sheet .stats-grid strong{font-size:16px}.hero-sheet .stats-grid small{font-size:6px}}
@media(max-height:720px){.hero-overflow{height:210px}.hero-overflow>.creature-art{height:210px;width:250px}.hero-dialog .hero-sheet{padding-top:10px;padding-bottom:14px}.hero-profile{min-height:89px;margin:5px 0}.hero-card-mini{height:90px;width:76px}.hero-card-mini .creature-art{height:92px;width:92px}.hero-sheet .stats-grid{margin:8px 0}.hero-sheet .hero-description{font-size:9px;margin:6px 0}.hero-sheet .modal-actions{margin-top:9px}.hero-sheet .modal-head h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
/* Hooks shared by the collection templates and the compact keeper strip. */
.keeper-info>span{font-size:9px;color:#add7ef;line-height:1.2}.keeper-trophies{position:relative;gap:4px;min-width:59px;padding:2px 2px 10px}.keeper-trophies strong{font:400 18px var(--serif);color:#ffdf69;-webkit-text-stroke:.6px #654a1d;text-shadow:0 2px #061b32}.keeper-trophies small{position:absolute;right:1px;bottom:0;font:700 5px var(--sans);letter-spacing:.4px;color:#a4cce4;-webkit-text-stroke:0;text-shadow:none}.roster-tabs button{position:relative;padding:0 7px}.roster-tabs button>span{position:absolute;right:5px;top:-7px;min-width:21px;height:22px;padding:2px 4px;border:2px solid #ff698e;border-radius:5px;background:linear-gradient(#fa214e,#ce083b);color:#fff;box-shadow:inset 0 1px #ff83a1,0 2px #6f193a;font:400 12px var(--serif);-webkit-text-stroke:.3px #791637;text-shadow:0 1px #791637}.roster-tabs button:first-child>span{min-width:25px;background:linear-gradient(#4d8fc1,#2a5993);border-color:#97c9e7;color:#dbf4ff;box-shadow:0 2px #12365d;text-shadow:0 1px #173b61;-webkit-text-stroke:0;font-size:10px}.roster-toolbar .filter-list button.element-filter{width:auto;max-width:none;overflow:visible;flex-shrink:0;gap:3px;flex-direction:column;min-width:37px;padding:3px 5px;height:38px}.roster-toolbar .filter-list button.element-filter>span{font-size:7px;line-height:1;-webkit-text-stroke:0;text-shadow:0 1px #0d3e72}.roster-toolbar .filter-list button.element-filter .icon{width:20px;height:20px}.roster-section-label{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 1px 17px;font:400 13px var(--serif);color:#eea4f6;-webkit-text-stroke:.6px #431a63;text-shadow:0 2px #123757}.roster-section-label i{height:3px;flex:1;background:#72b8d448;border-radius:2px;box-shadow:0 1px #04345866}.collection-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:16px;padding:10px 1px 0;border-top:2px solid #509fc433}.collection-footer>span{display:flex;align-items:center;gap:6px;font:400 13px var(--serif);color:#c7eaff;text-shadow:0 1px #052440}.collection-footer>span .icon{width:22px;height:22px;color:#e4a6f6}.collection-footer .btn{min-height:39px;font-size:14px;padding:7px 10px}.hero-subtitle{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.hero-subtitle>.type-tag{font-size:11px;padding:4px 6px;-webkit-text-stroke:.3px #15254c}.hero-subtitle>span:not(.type-tag){font-size:17px;line-height:1}.hero-card-mini{width:89px;height:141px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible;display:block}.hero-card-mini>.book-card{width:89px;min-height:135px;max-height:none;margin:7px 0 0;pointer-events:none}.hero-card-mini .card-portrait{height:80px}.hero-card-mini .card-portrait .creature-art{position:static;width:108%;height:94px;max-width:none}.hero-card-mini .card-level{position:static;font-size:12px;min-height:17px;background:linear-gradient(#db9bfa,#b478e4);border-top:1px solid #eec7ff;border-bottom:1px solid #674092}.hero-card-mini .card-name{font-size:11px}.hero-card-mini .card-progress{font-size:8px}.hero-profile{min-height:141px;gap:15px}.hero-meta>span{font-size:7px;letter-spacing:.8px;color:#8db8dd;font-weight:800}.hero-meta>strong{font-size:40px;color:#ffde61;line-height:1;-webkit-text-stroke:1px #503828;text-shadow:0 3px #071f42}.hero-meta>p{font-size:10px;line-height:1.6;margin:3px 0 0;color:#c0dbef}.growth-label{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#9dc5e5;margin-top:12px}.growth-label strong{font:400 11px var(--serif);color:#e1f6ff;text-shadow:0 1px #092544}.hero-overflow.locked>.creature-art{filter:brightness(.12) drop-shadow(0 0 7px #c895ff66);opacity:.9}.hatch-reward{display:flex;align-items:center;justify-content:center;gap:6px;margin:15px 0;font:400 24px var(--serif);color:#ffe16d;-webkit-text-stroke:1px #5e421b;text-shadow:0 2px #082343}.hatch-reward .icon{width:29px;height:29px}.hatch-dialog .result-heading{margin:10px 0 6px;text-align:center}.hatch-dialog .hero-subtitle{justify-content:center}.hatch-dialog .result-sub{text-align:center;font-size:11px;line-height:1.7;margin:12px 0}.card-progress{isolation:isolate}.card-progress i{z-index:-1}
@media(max-width:359px){.roster-tabs button{font-size:20px}.roster-toolbar .filter-list button.element-filter{min-width:32px;padding:3px 4px}.roster-toolbar .filter-list button.element-filter>span{font-size:6px}.hero-card-mini{width:82px;height:136px}.hero-card-mini>.book-card{width:82px;min-height:131px}.hero-profile{min-height:136px;gap:11px}.hero-meta>strong{font-size:34px}.hero-meta>p{font-size:9px}.hero-card-mini .card-portrait{height:77px}.hero-card-mini .card-portrait .creature-art{height:91px}}
@media(max-height:720px){.hero-profile{min-height:126px}.hero-card-mini{height:126px;width:80px}.hero-card-mini>.book-card{min-height:123px;width:80px}.hero-card-mini .card-portrait{height:68px}.hero-card-mini .card-portrait .creature-art{height:83px}.hero-meta>strong{font-size:32px}.hero-meta>p{font-size:9px}}
/* Game icon artwork is intentionally larger than the supporting line glyphs. */
.nav-btn .icon.game-icon.nav-art{display:block;width:57px;height:56px;margin:-5px 0 -1px;max-width:none;overflow:visible;filter:drop-shadow(0 3px 1px #0a203d88)}.nav-btn.active .icon.game-icon.nav-art{filter:drop-shadow(0 3px 1px #76531c88)}

/* Parent switching uses a small utility control beside the character. */
.parent-slot .change-parent .icon,.nursery-info .parent-slot .change-parent .icon{width:13px;height:13px;filter:none}

/* Keep every hero silhouette inside the scrollable reveal before the sheet overlaps it. */
.hero-overflow{flex:none;min-height:250px}.hero-overflow>.creature-art{flex:none;margin-top:0;margin-bottom:-15px}.hatch-dialog .hero-sheet>.btn.wide{display:flex;align-items:center;justify-content:center;min-height:48px;line-height:1.2;gap:8px;padding:10px 12px;white-space:normal}.hatch-dialog .hero-sheet>.btn.wide .icon{flex-shrink:0}
@media(min-width:420px){.hero-overflow{min-height:280px}}
@media(max-width:359px){.hero-overflow{min-height:215px}}
@media(max-height:720px){.hero-overflow{height:210px;min-height:210px}}