.home-header-actions{display:flex;align-items:center;gap:8px}.home-header{height:51px}.home-header img{width:110px}.profile-entry,.profile-portrait,.frame-sample{--frame-light:#7ec5b6;--frame-dark:#235f59;--frame-shadow:#164840;position:relative;display:block;border:3px solid transparent;border-radius:17px;background:linear-gradient(145deg,#fffef5,#e8f1e9) padding-box,linear-gradient(140deg,var(--frame-light),var(--frame-dark)) border-box;box-shadow:inset 0 2px 2px #ffffffee,0 3px 0 var(--frame-shadow),0 5px 9px #19484b20}.profile-entry{width:47px;height:47px;padding:1px;cursor:pointer;flex-shrink:0}.profile-entry:active{transform:translateY(2px);box-shadow:0 1px 0 var(--frame-shadow)}.animal-sprite{display:block;width:100%;height:100%;background-image:url('assets/player/animals-rounded.png');background-size:300% 300%;background-position:0 0;background-repeat:no-repeat}.profile-entry .animal-sprite{border-radius:10px}.frame-sky{--frame-light:#a3edfa;--frame-dark:#3896b8;--frame-shadow:#2d6b8c}.frame-berry{--frame-light:#f3b2d8;--frame-dark:#b657a6;--frame-shadow:#793b81}.frame-gold{--frame-light:#fff3b7;--frame-dark:#d6a03c;--frame-shadow:#8b6a2d;background-image:linear-gradient(145deg,#fffef5,#faf0ca),linear-gradient(125deg,#d9a83b,#fff8c2 25%,#d2a341 45%,#fff5ba 65%,#bd8c2d)}.frame-forest{--frame-light:#c8e995;--frame-dark:#51947a;--frame-shadow:#356c53}.frame-violet{--frame-light:#d3c1ff;--frame-dark:#8870c4;--frame-shadow:#5a4a8c}.frame-guardian{--frame-light:#fff0ab;--frame-dark:#b28b3a;--frame-shadow:#705c32;background-image:radial-gradient(ellipse at 50% 30%,#d0ebd3,#8fc3a9),linear-gradient(125deg,#a5792c,#fff8ba 28%,#c89c40 55%,#fff2bd);box-shadow:inset 0 1px 1px #fff,0 3px 0 #786035,0 0 0 2px #e6d88b60,0 5px 12px #19484b20}.frame-guardian::after{content:'✦';position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);color:#fff2b5;background:#988042;border:1px solid #faeeb0;border-radius:50%;width:19px;height:19px;display:grid;place-items:center;font-size:13px}
.energy-chip{height:43px;min-width:77px;display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #ffffffd9;background:#fbfcf2a1;border-radius:14px;color:#19484b;padding:4px 8px;box-shadow:inset 0 1px 0 #fff,0 2px 0 #c4d9cd}.energy-chip>span:last-child{display:flex;flex-direction:column;align-items:center;gap:0}.energy-chip b{font-size:16px;line-height:1;font-weight:700}.energy-chip small{font-size:9px;line-height:1.1;color:#759382;min-width:28px}.energy-chip[data-empty="true"]{background:#fff0eb;border-color:#edbfb3}.energy-chip[data-empty="true"] small{color:#b56761}.life-gem{display:block;width:31px;height:31px;background:url('assets/player/life.svg') center/contain no-repeat;font-size:0;filter:drop-shadow(0 2px 2px #9b475626)}
#profileDialog{width:min(94vw,460px);max-height:calc(100dvh - 28px);padding:25px 22px 16px;overflow:auto}#profileDialog h2{font-size:29px;margin-bottom:18px}.player-summary{display:flex;align-items:center;gap:15px;margin-bottom:18px}.profile-portrait{width:76px;height:76px;padding:3px;border-width:4px;border-radius:24px;flex-shrink:0}.profile-portrait .animal-sprite{border-radius:15px}.player-summary>div{display:flex;flex-direction:column;gap:3px;min-width:0}.player-summary strong{font-size:21px;color:#19484b;overflow-wrap:anywhere;line-height:1.15}.player-summary>div>span{font-size:12px;color:#7a927a}.name-form{margin-bottom:18px}.name-form label{display:block;font-size:11px;font-weight:600;color:#6b8877;margin-bottom:5px}.name-form>div{display:flex;gap:7px}.name-form input{min-width:0;width:100%;font:600 16px SourceSans,sans-serif;border:1px solid #c8dbc9;box-shadow:inset 0 2px 3px #19484b08;background:#fffefa;border-radius:13px;padding:11px;color:#19484b}.name-form button{border:1px solid #c9dbc9;border-radius:13px;background:#e0eee1;padding:10px;font-size:12px;font-weight:600;color:#315f54;min-height:44px}.name-form small{display:block;font-size:10px;color:#809481;margin-top:5px}.profile-tabs{display:flex;gap:8px;padding:5px;background:#dfece1;border-radius:16px;margin-bottom:15px}.profile-tabs button{flex:1;min-height:42px;border:0;border-radius:12px;background:none;color:#648472;font-size:14px;font-weight:700}.profile-tabs [aria-selected="true"]{background:linear-gradient(#fffef6,#f4f6e9);color:#19484b;box-shadow:0 3px 0 #bccfbd,0 3px 9px #19484b10}.animal-grid,.frame-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.animal-choice,.frame-choice{position:relative;display:flex;align-items:center;flex-direction:column;gap:7px;min-width:0;min-height:106px;border:1px solid #dce7d7;border-radius:18px;padding:10px 5px 9px;background:linear-gradient(145deg,#fffdf6,#edf4e9);box-shadow:0 3px 0 #cadac7;color:#365d51}.avatar-well{width:67px;height:67px;display:block;border-radius:18px;background:radial-gradient(ellipse,#fffaf0 35%,#e0ede1);box-shadow:inset 0 1px 3px #7b9e7c1a}.animal-choice b,.frame-choice b{font-size:11px;font-weight:600;line-height:1.1}.choice-check{display:none;position:absolute;right:5px;top:5px;width:18px;height:18px;border-radius:50%;background:#357e69;color:#fff9de;box-shadow:0 1px 2px #19484b30;font-size:12px;border:1px solid #fff3}.animal-choice[aria-pressed="true"],.frame-choice[aria-pressed="true"]{border-color:#659e7e;background:linear-gradient(145deg,#f9ffed,#e5f0d8);box-shadow:0 3px 0 #76a486}.animal-choice[aria-pressed="true"] .choice-check,.frame-choice[aria-pressed="true"] .choice-check{display:block}.frame-choice{min-height:123px;gap:8px}.frame-sample{width:57px;height:57px;border-width:4px;padding:3px;border-radius:18px}.frame-choice small{font-size:8px;color:#80927c;margin-top:-3px}.frame-choice.locked{opacity:.4;filter:grayscale(.55)}.profile-saved{font-size:10px!important;line-height:1.4!important;color:#7f9580!important;margin:13px 0 0!important;min-height:28px}
#energyDialog{text-align:center;padding:30px 24px 20px;width:min(92vw,430px)}#energyDialog h2{font-size:30px;margin-top:7px}.energy-hero{position:relative;width:137px;height:132px;margin:19px auto 12px}.energy-hero .life-gem{width:100%;height:100%;filter:drop-shadow(0 8px 8px #be6d762b)}.energy-hero strong{position:absolute;inset:28px 0 auto;font-size:53px;font-weight:700;line-height:1;color:#fff6e9;text-shadow:0 3px 0 #a9466144}.energy-timer{margin:17px auto 20px;background:#e6eee0;border:1px solid #d3dfcd;box-shadow:inset 0 1px 0 #fff;border-radius:17px;padding:11px;display:flex;flex-direction:column;gap:2px;max-width:245px}.energy-timer small{font-size:10px;letter-spacing:.3px;color:#839278}.energy-timer b{font-size:24px;color:#315f54;line-height:1.1;font-variant-numeric:tabular-nums}.energy-explanation{font-size:12px!important;color:#6c8370!important;line-height:1.5!important}.energy-explanation+.primary{width:100%;margin-top:10px}.energy-explanation+.primary:disabled{opacity:.6}#energyDialog .text-btn{display:block;margin:7px auto}.loss-life-status{padding:10px;background:#e7eee0;border-radius:12px;font-size:12px!important;color:#5a7a61!important}
/* Raster item art replaces the outline-only tools, while hit targets and stock stay native. */
.controls .tool-icon{background:none!important;box-shadow:none!important;border:0!important;position:relative;overflow:visible;filter:drop-shadow(0 4px 3px #19484b26)}.controls .tool-icon::before{content:'';display:block;position:absolute;inset:-8px;background-image:url('assets/player/tools-rounded.png');background-size:300% auto;background-position:0 50%;background-repeat:no-repeat}.controls .eraser-icon::before{background-position:50% 50%}.controls .wand-icon::before{background-position:100% 50%}.controls .tool-icon svg{visibility:hidden}.controls button:active .tool-icon{transform:translateY(3px) scale(.96)}
@media(max-width:360px){.home-header-actions{gap:6px}.home-header img{width:93px}.profile-entry{width:43px;height:43px;border-radius:15px}.energy-chip{min-width:69px;padding-inline:5px;gap:2px}.energy-chip .life-gem{width:27px;height:29px}.home-header .shell-icon{width:43px;min-width:43px;height:44px}#profileDialog{padding:23px 14px 13px}.animal-grid,.frame-grid{gap:8px}.avatar-well{width:59px;height:59px}.animal-choice{min-height:98px;padding-top:8px}.player-summary strong{font-size:19px}.name-form input{font-size:15px;padding:10px}.profile-saved{font-size:9px!important}.home-header .profile-entry{min-width:43px}}
@media(max-height:680px){#profileDialog{padding-top:22px}#profileDialog h2{font-size:25px;margin-bottom:11px}.player-summary{margin-bottom:12px;gap:12px}.profile-portrait{width:60px;height:60px;border-radius:19px}.name-form{margin-bottom:12px}.animal-choice{min-height:87px;padding:7px 4px;gap:4px}.avatar-well{width:55px;height:55px}.animal-grid,.frame-grid{gap:8px}.frame-choice{min-height:105px;padding:8px 4px;gap:6px}.frame-sample{width:49px;height:49px;border-radius:16px}.profile-tabs{margin-bottom:11px}.profile-tabs button{min-height:38px}#energyDialog{padding-top:24px}.energy-hero{width:105px;height:101px;margin-block:11px}.energy-hero strong{font-size:42px;top:20px}.energy-timer{margin-block:12px;padding:9px}.energy-explanation{font-size:11px!important}}
@media(orientation:landscape) and (max-height:500px){.home-header img{width:81px}.home-header{width:210px;flex-wrap:wrap;height:auto;align-self:start;gap:5px}.home-header-actions{gap:6px}.home-header .energy-chip{min-width:66px}.home-header .shell-icon{width:39px;min-width:39px;height:40px}.home-header .profile-entry{width:40px;height:40px}.home-heading{margin-top:51px}.home-heading h1{font-size:22px}.home-heading .eyebrow{font-size:7px}.home-rank{margin-bottom:0}#profileDialog{max-width:650px;width:95vw}.animal-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.frame-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.energy-hero{float:left;margin:10px 20px 10px 5px}#energyDialog{max-width:540px;width:90vw}.energy-timer{margin:12px 0 12px auto;width:230px}.energy-explanation{clear:both}}
#profileDialog>.close{position:sticky;float:right;top:0;right:auto;margin:-10px -8px -34px 0;width:44px;height:44px;z-index:4;border-radius:50%;background:#f7fcf3d9;backdrop-filter:blur(6px)}
#profileDialog{scrollbar-width:thin;scrollbar-color:#a8c4af transparent}.frame-choice{min-height:112px}#energyDialog>.close{width:44px;height:44px;top:9px;right:9px;border-radius:50%;display:grid;place-items:center}
@media(max-height:680px){.frame-choice{min-height:105px}}

/* Collectible enamel badges share one original six-rank sprite atlas. */
.rank-art{display:block;width:100%;aspect-ratio:1;background-image:url('assets/player/rank-rounded.png');background-size:300% 200%;background-repeat:no-repeat;font-style:normal;flex-shrink:0}.badge-card>span,.badge-card.locked>span{display:grid;place-items:center;width:88px;max-width:100%;height:92px;clip-path:none;background:none;filter:drop-shadow(0 4px 3px #19484b20)}.badge-card{padding:12px 5px 14px;gap:6px;border-radius:20px}.badge-card.earned{background:linear-gradient(140deg,#fffdf2,#e7f1dd);box-shadow:inset 0 0 0 1px #fff,0 4px 0 #c4d8bd}.badge-card.locked{opacity:1;filter:none;background:linear-gradient(140deg,#f1f4ec,#eaf0e5);box-shadow:inset 0 0 0 1px #ffffff60}.badge-card.locked>span{opacity:.3;filter:grayscale(.85)}.badge-card.locked b{color:#7d8c7d}.badge-card.locked small{color:#8b9987}.home-emblem{display:grid;place-items:center;width:54px;height:54px;filter:drop-shadow(0 4px 3px #19484b25)}.rank-emblem{display:grid;place-items:center}.road-award>span{display:grid;place-items:center;width:56px;height:56px;filter:drop-shadow(0 3px 3px #19484b20)}.rank-medal{display:grid;place-items:center;width:120px;height:120px;clip-path:none;background:none;border-radius:0;filter:drop-shadow(0 7px 5px #19484b25)}body[data-screen="play"] .rank-emblem{width:35px;height:35px}#awardsDialog h2{margin-bottom:12px}#awardsProgress{font-size:13px}.badge-card b{font-size:12px}.badge-card small{font-size:10px;line-height:1.3}
@media(max-width:360px){.badge-gallery{gap:7px}.badge-card>span,.badge-card.locked>span{width:72px;height:76px}.badge-card{padding:10px 4px 11px;gap:5px}.badge-card b{font-size:11px}.badge-card small{font-size:9px}.home-emblem{width:44px;height:44px}}
@media(max-height:680px){.rank-medal{width:98px;height:98px}.home-emblem{width:42px;height:42px}}
@media(orientation:landscape) and (max-height:500px){.home-emblem{width:33px;height:33px}.badge-card>span,.badge-card.locked>span{width:64px;height:67px}}
#awardsDialog>.close{position:sticky;float:right;top:0;right:auto;margin:-10px -8px -34px 0;width:44px;height:44px;z-index:4;border-radius:50%;background:#f7fcf3d9;backdrop-filter:blur(6px)}

.home-heading h1{font-size:30px;max-width:350px;line-height:1.08;letter-spacing:-.8px}.home-heading p{font-size:12px;line-height:1.35;max-width:330px}
@media(max-width:360px){.home-heading h1{font-size:27px}}
@media(max-height:740px){.home-heading h1{font-size:26px}}
@media(orientation:landscape) and (max-height:500px){.home-heading h1{font-size:24px;max-width:200px}}
/* Rendered level tiles and three-dimensional reward stars. Numbers remain sharp text. */
.node-art,.star-art,.check-art{display:block;background-image:url('assets/player/road-rounded.png');background-size:300% 200%;background-repeat:no-repeat;font-style:normal}.node-art{position:absolute;inset:0;background-position:100% 0;z-index:0}.road-node.current .node-art{background-position:0 0}.road-node.done .node-art{background-position:50% 0}.road-node,.road-node.done,.road-node.current,.road-node[data-grade="Schwer"]:not(.done):not(.current),.road-node[data-grade="Sehr schwer"]:not(.done):not(.current){width:100px;height:100px;min-height:100px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;outline:0;position:relative}.road-node .road-number{position:absolute;z-index:2;top:44%;left:50%;transform:translate(-50%,-50%);font-size:31px;line-height:1;font-weight:700;color:#65816e;text-shadow:0 1px 0 #ffffff85}.road-node.current .road-number,.road-node.done .road-number{color:#fff9dc;text-shadow:0 2px 0 #22594780}.road-node.selected{outline:0;transform:translateY(-2px)}.road-node.selected .node-art{filter:drop-shadow(0 0 3px #d5af4f) drop-shadow(0 0 7px #f0d48277)}.road-node:focus-visible{outline:2px solid #357e69;outline-offset:0;border-radius:26px}.road-node[data-grade="Schwer"].upcoming .node-art{filter:sepia(.65) saturate(1.8)}.road-node[data-grade="Sehr schwer"].upcoming .node-art{filter:sepia(.6) saturate(2.2) hue-rotate(310deg)}.road-stop{min-height:116px;margin-bottom:20px}.road-stop::before{top:44px}.road-tag,.road-node.done+.road-tag{margin-top:9px}.road-check{top:4px;right:0;width:27px;height:27px;background:none;border:0;box-shadow:none;z-index:3}.check-art{width:100%;height:100%;background-position:100% 100%}.road-stars{bottom:-8px;height:25px;width:75px;letter-spacing:0;text-shadow:none;z-index:3}.art-stars{display:inline-flex;justify-content:center;align-items:center;gap:0;line-height:1;vertical-align:middle}.star-art{display:block;flex-shrink:0;width:25px;height:25px;background-position:0 100%}.star-art.empty-star{background-position:50% 100%}.mini-stars .star-art{width:12px;height:12px}.result-stars .star-art{width:44px;height:44px}.result-stars{filter:drop-shadow(0 3px 2px #b38c3c22)}#winStars{line-height:1;margin:8px 0 12px}
.level-rail button,.level-rail button.active,.level-rail button.complete:not(.active){background:none;border:0;box-shadow:none;border-radius:15px;min-height:75px;aspect-ratio:auto;position:relative;display:block;color:#577a65;padding:10px 0 0}.level-rail button::before{content:'';position:absolute;left:0;right:0;top:0;aspect-ratio:1;background:url('assets/player/road-rounded.png') 100% 0/300% 200% no-repeat;z-index:0}.level-rail button.complete::before{background-position:50% 0}.level-rail button.active::before{background-position:0 0;filter:drop-shadow(0 0 3px #d9b759)}.level-rail button.complete:after{display:none}.level-rail button>span{display:block;position:absolute;top:15px;left:0;right:0;z-index:1;color:#5d7f69;font-weight:700;font-size:19px}.level-rail button.complete>span,.level-rail button.active>span{color:#fff7dc;text-shadow:0 1px 0 #315b4e90}.level-rail button small{position:absolute;top:56px;left:0;right:0;line-height:1.1;font-size:8px;z-index:1}.level-rail button.active small{color:#718c77}.level-rail button:focus-visible{outline:2px solid #367e68;outline-offset:1px}
body[data-screen="play"] .hearts{gap:1px}body[data-screen="play"] .hearts span{width:14px;height:14px}body[data-screen="play"] .hearts .lost{filter:grayscale(1);opacity:.24}body[data-screen="play"] .hud .level-block #levelNo{font-size:17px}body[data-screen="play"] .life-label{font-size:9px}
@media(max-width:360px){body[data-screen="play"] .hearts span{width:12px;height:12px}body[data-screen="play"] .hud .level-block #levelNo{font-size:16px}.level-rail{gap:6px}.level-rail button{min-height:67px}.level-rail button>span{top:11px;font-size:17px}.level-rail button small{top:48px}.mini-stars .star-art{width:10px;height:10px}.road-node .road-number{font-size:30px}}
@media(orientation:landscape) and (max-height:500px){body[data-screen="play"] .hearts span{width:14px;height:14px}}
/* Readable game HUD: the attempts receive their own full-width row. */
body[data-screen="play"] .hud{padding:10px 11px 11px;border-radius:22px}body[data-screen="play"] .hud-main{display:grid;grid-template-columns:44px minmax(0,1fr) 44px 44px;gap:8px;align-items:center}body[data-screen="play"] #gameHome{grid-column:1;grid-row:1}body[data-screen="play"] .level-block{grid-column:2;grid-row:1;display:flex;flex-direction:column;gap:3px;min-width:0}body[data-screen="play"] .hud .level-block #levelNo{font-size:23px;letter-spacing:-.55px;line-height:1.1}body[data-screen="play"] .hud #difficulty{font-size:11px;padding:2px 7px;line-height:1.2}body[data-screen="play"] .rank-trail{display:block;grid-column:3;grid-row:1;width:44px;min-height:44px}body[data-screen="play"] .rank-summary{width:44px;min-height:44px}body[data-screen="play"] .rank-emblem{width:42px;height:42px}body[data-screen="play"] #help{grid-column:4;grid-row:1;width:44px;height:44px}body[data-screen="play"] #help svg{width:25px;height:25px}body[data-screen="play"] .life-row{grid-column:1/-1;grid-row:2;display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:12px;padding:5px 7px 0}body[data-screen="play"] .life-label{font-size:13px;letter-spacing:0;color:#547965}body[data-screen="play"] .life-label b{font-size:14px;color:#19484b}body[data-screen="play"] .hearts{gap:5px}body[data-screen="play"] .hearts span{width:23px;height:23px}body[data-screen="play"] .progress-capsule{margin-top:8px;padding:0 7px;gap:10px;min-height:13px}body[data-screen="play"] .progress-capsule #count{font-size:12px;margin:0;color:#52735e}body[data-screen="play"] .progress{height:5px}body[data-screen="play"] .case-brief{top:148px}
@media(max-width:360px){body[data-screen="play"] .hud{padding:9px 8px 10px}body[data-screen="play"] .hud-main{gap:5px;grid-template-columns:40px minmax(0,1fr) 38px 40px}body[data-screen="play"] #gameHome{min-width:40px;width:40px}body[data-screen="play"] .hud .level-block #levelNo{font-size:20px;letter-spacing:-.5px}body[data-screen="play"] #help{min-width:40px;width:40px}body[data-screen="play"] .rank-trail,body[data-screen="play"] .rank-summary{width:38px}body[data-screen="play"] .rank-emblem{width:38px;height:38px}body[data-screen="play"] .hearts span{width:22px;height:22px}body[data-screen="play"] .hearts{gap:4px}body[data-screen="play"] .life-label{font-size:12px}body[data-screen="play"] .life-label b{font-size:13px}body[data-screen="play"] .case-brief{top:143px}}
@media(orientation:landscape) and (max-height:500px){body[data-screen="play"] .hud-main{display:flex;gap:12px}body[data-screen="play"] .level-block{flex:1;flex-direction:row;gap:10px;align-items:center}body[data-screen="play"] .hud .level-block #levelNo{font-size:21px}body[data-screen="play"] .life-row{padding:0;gap:10px;flex-direction:row}body[data-screen="play"] .hearts span{width:20px;height:20px}body[data-screen="play"] .hearts{gap:3px}body[data-screen="play"] .rank-trail{margin-left:auto}body[data-screen="play"] .progress-capsule{margin-top:5px}body[data-screen="play"] .controls{top:95px}body[data-screen="play"] .case-brief{top:95px}body[data-training="true"] .training-dock{top:95px}}