*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:#243b3d;color:#f5edda;font:16px system-ui}button,select,input{font:inherit}button{min-height:44px;padding:10px 16px;border:1px solid #ab9667;border-radius:9px;background:#f0ddb4;color:#243b3d;cursor:pointer}button:hover:not(:disabled){background:#fff1d3;box-shadow:0 3px 9px #0003}button:focus-visible{outline:3px solid #64bbca}button:disabled{cursor:default}main{max-width:1500px;margin:auto;padding:8px max(8px,env(safe-area-inset-right))}header{display:flex;align-items:center;justify-content:space-between;gap:12px}header h1{font:clamp(17px,3vw,28px) Georgia;margin:5px}nav{display:flex;gap:8px}.stage{position:relative;width:100%;max-height:calc(100dvh - 115px);aspect-ratio:16/9;margin:auto}canvas{width:100%;height:100%;object-fit:contain}.stage #hotspots{position:absolute;inset:0}.hotspot{position:absolute;opacity:0;padding:0;min-height:0;border:0}.hotspot:focus-visible,.hotspot:hover{opacity:.18;background:#fff}#message{min-height:1.5em;margin:8px;font-size:14px}#loading{position:fixed;inset:0;z-index:100;background:#f3e7ce;color:#243b3d;display:grid;place-content:center}#menu{position:fixed;inset:0;z-index:10;display:grid;place-content:center;background:#5c7764;background-size:cover;background-position:center}.menu-paper{width:min(600px,90vw);background:#f5e7cbeF;padding:28px;border:8px solid #9a7951;border-radius:20px;color:#243b3d;text-align:center}.menu-paper h1{font:clamp(25px,5vw,42px) Georgia}.menu-paper button{display:block;width:100%;margin:8px 0}dialog{width:min(650px,94vw);max-height:94dvh;padding:20px;border:3px solid #9a7951;border-radius:14px;background:#f5e7cb;color:#243b3d;overflow:auto}dialog::backdrop{background:#0a2628aa}dialog h2{font:25px Georgia;margin:0 0 10px}dialog p{line-height:1.4}.badge-locked{opacity:.45;filter:grayscale(1)}.badge-earned{color:#496522;font-weight:bold}.video-dialog{width:min(1000px,94vw)}.video-dialog iframe{border:0;width:100%;aspect-ratio:16/9;background:#152b30}.simple-task-body{display:grid;gap:10px}.simple-task button{width:100%;margin:0}.correct{background:#c9e7bf}.task-dialog{width:min(1400px,calc(100vw - 16px));height:calc(100dvh - 16px);max-height:none;overflow:hidden;padding:14px}.task-shell{height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:10px}.task-header{position:relative;display:block;padding-right:50px}.task-header h2{font-size:clamp(18px,2vw,25px)}.task-header p{font-size:14px;margin:5px 0}.task-touch-help{display:none}.task-x{position:absolute;top:0;right:0}.task-content{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 30%;gap:12px}.task-board,.task-viewport{min-width:0;min-height:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.task-graphic{position:relative;aspect-ratio:16/9;width:100%;height:100%;background-size:100% 100%;background-repeat:no-repeat}.drop-zone{position:absolute;border:2px dashed #b49b63;border-radius:8px;overflow:hidden;background:#fff1ccbb}.drop-target{width:100%;min-height:0;height:auto;font-size:clamp(10px,1.2vw,16px);padding:6px;background:transparent;border:0}.drop-zone img{max-width:100%;max-height:40%;object-fit:contain}.task-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:center;gap:8px;min-height:0}.term-card{position:relative;min-width:0;min-height:50px;padding:8px 26px 8px 5px;font-size:clamp(12px,1.2vw,16px);overflow-wrap:anywhere}.term-card img{height:44px;max-width:100%;object-fit:contain}.drag-handle{position:absolute;right:3px;top:50%;transform:translateY(-50%);touch-action:none;font-size:24px}.term-ghost{position:fixed;z-index:10000;pointer-events:none;background:#fff1cc;padding:8px;border-radius:8px;transform:translate(-50%,-50%)}.term-card.matched{display:block;width:100%;min-height:0;font-size:clamp(10px,1vw,15px);padding:3px;background:#d4e8bf}.matched .drag-handle{display:none}.task-footer{display:grid;grid-template-columns:1fr auto;gap:4px;align-items:center}.task-feedback,.task-selection{font-size:14px;margin:0;min-height:1.5em}.task-selection{grid-column:1}.task-actions{grid-column:2;grid-row:1/3;display:flex;gap:6px}.task-pages{grid-column:1/-1;display:flex;gap:5px}.simple-task{height:auto;max-height:calc(100dvh - 16px)}.simple-task-body button{min-height:56px}.dialogue{max-width:600px}.dialogue button{float:right}@media(max-width:700px){.task-content{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.task-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.term-card{min-height:44px}.task-header p,.task-feedback,.task-selection{font-size:12px}.task-actions button{padding:6px;font-size:12px}.task-header h2{font-size:18px}.task-selection{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.stage{max-height:none}.menu-paper{padding:16px}}@media(max-height:500px){.task-header p{display:none}.task-dialog{padding:8px}.term-card img{height:20px}.task-shell{gap:5px}.task-feedback{font-size:12px}.task-actions button{min-height:36px}.simple-task-body button{min-height:36px;padding:5px}}
.stage #hotspots{pointer-events:none}.stage #hotspots button{pointer-events:auto}.badge-earned.special{border:2px solid #ab9667;padding:10px;border-radius:12px} .term-card[aria-pressed="true"]{outline:3px solid #4d8992}

dialog.simple-task{height:fit-content;min-height:0} @media(max-width:480px){header{flex-wrap:wrap;gap:4px}header h1{font-size:18px}nav{gap:6px}nav button{padding:8px 12px}.task-dialog{padding:10px}.task-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

.task-graphic[data-unique="true"] .drop-zone.filled .drop-target{display:none}@media(max-width:700px){.drop-zone{min-height:44px}.drop-target{font-size:12px;padding:3px}.term-card.matched{font-size:12px;min-height:30px}}

.avatar-options{display:grid;grid-template-columns:1fr 1fr;gap:16px}.avatar-preview{display:block;width:130px;height:150px;margin:auto;background-size:400% 400%;background-position:0 0;background-repeat:no-repeat}.avatar-choice button{font-weight:bold}.stage{max-width:calc((100dvh - 115px)*16/9)}.drop-zone{overflow:visible}.drop-target{height:100%}.term-card.matched{position:relative;z-index:1}.badge-earned img{width:64px;height:64px;object-fit:contain;vertical-align:middle}
.badge-earned::before{content:"";display:inline-block;width:64px;height:64px;background:url("../games/mallorca/assets/kartenprofi.png") center/contain no-repeat;vertical-align:middle;margin-right:10px}
.task-graphic:has([data-zone="balearen"]) [data-zone="balearen"]{background:#fff1cc22;border:3px dashed #243b3d}.task-graphic [data-zone="balearen"]>.drop-target{position:absolute;left:0;top:0;width:56%;height:24%;font-size:12px;background:#f5e7cb}.task-graphic [data-zone="balearen"]>.matched{position:absolute;left:0;top:0;width:56%;max-height:24%}.task-graphic [data-zone="palma"]{border-radius:50%;background:#fff1cc99}.task-graphic [data-zone="palma"]>.drop-target{font-size:12px}
@media(max-width:700px){.task-graphic:has([data-zone="balearen"]) .drop-zone{min-height:0}.task-graphic [data-zone="balearen"]>.drop-target{top:-54px;left:0;width:100px;height:44px}.task-graphic [data-zone="mallorca"]>.drop-target{position:absolute;left:-10px;top:35px;width:90px;height:44px;background:#f5e7cb}.task-graphic [data-zone="palma"]>.drop-target{position:absolute;left:-110px;top:35px;width:90px;height:44px;background:#f5e7cb}.task-graphic:has([data-zone="balearen"]) .drop-target{font-size:12px}.task-graphic [data-zone="palma"]::before{content:"●";position:absolute;left:35%;top:15%;color:#243b3d}.task-graphic [data-zone="mallorca"]::after,.task-graphic [data-zone="palma"]::after{content:"";position:absolute;width:2px;height:35px;left:50%;top:100%;background:#243b3d;pointer-events:none}.task-graphic [data-zone="palma"]::after{width:75px;height:2px;left:-75px;top:30px}}