@import url('/competition/challenge.css');
.desktop-wall-art{display:none;pointer-events:none}.desktop-playground{--map-size:min(15cm,calc(100vw - 640px));min-width:760px;background-color:#24192e!important;background-image:linear-gradient(110deg,#24152f4d,#2819304d),url('/desktop-assets/werkhain-facade-v1.webp')!important;background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important;background-attachment:fixed!important;isolation:isolate}
.desktop-playground .desktop-wall-art{display:block;position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}.desktop-wall-art img{position:absolute;display:block;height:auto;object-fit:contain;opacity:1}.wall-unicorn{top:24px;right:24px;width:clamp(190px,20vw,310px);max-height:50dvh;object-position:right top}.wall-cyberbear{left:0;bottom:0;width:clamp(250px,25vw,420px);max-height:65dvh;object-position:left bottom;transform:translate(-1%,8%)}
.desktop-wall-art .wall-brand-logo{right:clamp(18px,2.5vw,52px);bottom:24px;width:clamp(230px,27vw,400px);max-height:36dvh;object-position:right bottom;border-radius:16px;filter:drop-shadow(0 5px 10px #160b2380)}
.desktop-playground .top,.desktop-playground[data-in-world=true] .top{height:78px;max-width:1240px;margin:auto;padding:14px 22px;background:transparent;grid-template-columns:1fr auto auto;grid-template-rows:1fr}.desktop-playground .top>a,.desktop-playground[data-in-world=true] .top>a{font-size:23px;grid-row:1}.desktop-playground .top>a span{display:block!important;font-size:8px}.desktop-playground .top #phone{grid-row:1;grid-column:2}.desktop-playground .top .language-switch{grid-row:1;grid-column:3}.desktop-playground>.dev,.desktop-playground>.hub-links{display:none!important}.desktop-playground #component,.desktop-playground[data-in-world=true] #component{height:auto;min-height:0;padding:18px 20px 50px;max-width:1280px;margin:0 auto}.desktop-playground .component-bar{background:transparent!important;color:#f2dbf7;max-width:var(--map-size);margin:0 auto 10px}.desktop-playground .component-bar #sync{display:none}
.desktop-board{display:grid;grid-template-columns:minmax(210px,280px) minmax(300px,15cm) minmax(210px,280px);justify-content:center;align-items:start;gap:18px}.desktop-map{position:relative;width:var(--map-size);max-width:15cm;height:var(--map-size);max-height:15cm;overflow:hidden;border:3px solid #b97be0;border-radius:18px 6px 20px 7px;box-shadow:0 15px 50px #12071ed9,5px 5px 0 #ec9bca55;background:#201528}.desktop-playground #component .desktop-map iframe{width:100%;height:100%;border:0;display:block}.desktop-map iframe[hidden]{display:none!important}.desktop-challenge,.desktop-chat{box-sizing:border-box;min-width:0;background:#291638;backdrop-filter:blur(8px);border:1px solid #b087bd77;border-radius:7px 17px 6px 13px;box-shadow:0 8px 35px #160b2388;padding:19px;color:#fff5e9;max-height:15cm;overflow:auto;scrollbar-width:thin}.desk-kicker{font-size:9px;letter-spacing:2px;color:#d0a0eb;font-weight:800}.desktop-challenge h1{font-size:30px;line-height:1.04;margin:12px 0 24px;letter-spacing:-1.5px}.desktop-challenge h1 em{color:#e8a1d6;font-style:normal}.desktop-challenge h2{font-size:20px;line-height:1.16;letter-spacing:-.6px;margin:14px 0}.desktop-challenge p,.desktop-chat p{font-size:12px;line-height:1.6;color:#ddcce5}.event-phase{display:inline-block;padding:5px 7px;background:#dfb6ef;color:#321842;font-size:9px;letter-spacing:1px;font-weight:900;transform:rotate(-2deg)}.desktop-challenge button,.desktop-chat button,.map-device-cover button,#phoneCompanion button{background:#d5a5e5;border:1px solid #eac5f5;color:#2c1938;border-radius:8px;font:inherit;font-size:12px;font-weight:800;padding:9px 12px;cursor:pointer}.desktop-playground #component .desktop-challenge iframe{display:block;width:100%;height:410px;border:0;border-radius:8px}.desktop-playground #component .desktop-challenge iframe[hidden]{display:none}.desktop-challenge.has-competition>h1{font-size:21px;margin-bottom:15px}.desktop-chat{height:var(--map-size);max-height:15cm;display:flex;flex-direction:column}.desktop-chat header{position:relative}.desktop-chat h2{font-size:27px;letter-spacing:-1px;margin:9px 0 12px}.desktop-chat [data-chat-sound]{padding:4px 7px;font-size:9px;position:absolute;top:0;right:0;background:transparent;color:#e2c4ed}.desktop-chat nav{display:flex;gap:6px;flex-wrap:wrap;max-height:90px;overflow:auto}.desktop-chat nav button{padding:6px 8px;font-size:10px;background:#4a3159;color:#fff}.desktop-chat nav button[aria-current=true]{background:#d5a5e5;color:#2c1938}.desktop-chat b[data-chat-count],.desktop-chat nav b{font-size:10px;background:#efba67;color:#21102e;padding:2px 5px;border-radius:20px;margin-left:5px}.desktop-chat [data-chat-conversation]{display:flex;flex:1;min-height:0;flex-direction:column}.desktop-chat [data-chat-conversation][hidden]{display:none}.desktop-chat h3{font-size:13px;margin:12px 0}.desk-chat-messages{overflow:auto;flex:1;min-height:80px;scrollbar-width:thin}.desk-chat-messages article{padding:8px 10px;background:#4c315e;margin:0 16px 8px 0;border-radius:10px 10px 10px 2px;overflow-wrap:anywhere}.desk-chat-messages article.own{margin-left:16px;margin-right:0;background:#71547d;border-radius:10px 10px 2px 10px}.desk-chat-messages small{font-size:9px;color:#e0b5e8}.desk-chat-messages p{margin:3px 0;font-size:12px;color:#fff}.desktop-chat form label{font-size:10px;color:#c9abc9}.desktop-chat textarea{box-sizing:border-box;width:100%;resize:vertical;min-height:55px;max-height:110px;border-radius:7px;border:1px solid #b380bc;background:#1b1025;color:#fff;padding:9px;font:inherit;font-size:12px}.desktop-chat form>button{float:right;margin-top:5px}.desktop-chat [data-chat-status]{font-size:10px;margin:5px 0 0;color:#efba67}.map-device-cover{position:absolute;inset:0;background:#291638f5;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:25px;z-index:10}.map-device-cover[hidden]{display:none}.map-device-cover h2{font-size:24px;color:#e6b9ed}.map-device-cover p{font-size:13px;color:#d1b8d9}.desktop-playground #frame:not([hidden]){position:fixed;z-index:80;left:50%;top:50%;transform:translate(-50%,-50%);width:min(550px,90vw);height:min(720px,85dvh);border:3px solid #bc8ad0;box-shadow:0 0 0 100vmax #100919bc}
#phoneCompanion{padding:22px 16px;max-width:490px;margin:auto;color:#fff5e9}#phoneCompanion .companion-badge{font-size:10px;letter-spacing:2px;color:#d0a0eb}#phoneCompanion h1{font-size:35px;line-height:1.05}#phoneCompanion p{font-size:14px;line-height:1.6;color:#ddcce5}#phoneCompanion .companion-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:24px 0}#phoneCompanion .companion-actions button{min-height:70px}#phoneCompanion [data-take-map]{background:transparent;color:#edc8f3}body[data-device-mode=companion] .hub-links{display:none}body[data-device=phone] .desktop-board{display:contents}body[data-device=phone] .desktop-challenge,body[data-device=phone] .desktop-chat{display:none}
@media(min-width:1550px){.desktop-playground #component{padding-left:100px;max-width:1400px}}@media(max-width:1020px){.desktop-playground{--map-size:min(15cm,calc(100vw - 290px));min-width:0}.desktop-board{grid-template-columns:minmax(190px,230px) minmax(300px,15cm);gap:14px}.desktop-chat{grid-column:2;height:300px}.desktop-challenge{grid-row:1 / 3}.desktop-playground #component{padding:10px}}@media(max-width:700px){.desktop-playground{--map-size:min(15cm,calc(100vw - 28px))}.desktop-board{display:flex;flex-direction:column;align-items:center}.desktop-map{order:0;flex:none}.desktop-challenge{order:1;width:var(--map-size)}.desktop-chat{order:2;width:var(--map-size)}.desktop-playground .top>a span{display:none!important}.desktop-playground .top>a{font-size:16px!important}.desktop-playground .top{padding:8px}}

.chat-incoming{margin:8px 0;text-align:left;font-size:11px!important;line-height:1.45;background:#eab9e2!important;white-space:normal;overflow-wrap:anywhere}.companion-chat{margin-top:20px;background:#291638;padding:16px;border:1px solid #a879b8;border-radius:12px}.companion-chat [data-chat-conversation][hidden]{display:none}.companion-chat textarea{width:100%;box-sizing:border-box}.companion-chat [data-chat-messages]{max-height:240px;overflow:auto}

/* The desktop header has room for readable account and navigation controls. */
body.desktop-playground.player-app .top{height:98px;gap:16px;padding-top:15px;padding-bottom:15px}
body.desktop-playground.player-app .top #phone{font-size:16px;line-height:1.2;min-width:134px;max-width:none;height:38px;min-height:38px;padding:6px 18px}
body.desktop-playground.player-app .top #balance{display:none}
body.desktop-playground.player-app .top .language-switch{box-sizing:border-box;height:38px;align-items:center;padding:2px}
body.desktop-playground.player-app #balance{font-size:16px;line-height:1.2;margin-top:5px}
body.desktop-playground.player-app #component .component-bar{height:58px;padding:4px 0;gap:16px;margin-bottom:12px}
body.desktop-playground.player-app #component #back{font-size:20px;line-height:1.15;min-height:46px;min-width:112px;padding:10px 22px}
@media(max-width:700px){body.desktop-playground.player-app .top{gap:8px}body.desktop-playground.player-app .top #phone{min-width:145px;font-size:16px;padding:9px 14px}body.desktop-playground.player-app #balance{font-size:14px}}

.desktop-chat .chat-preview-note{font-size:10px;line-height:1.3;color:#efcf81;margin:0 0 8px}

/* Account and menu share a row aligned with the map and chat columns. */
.desktop-controls{display:grid;grid-template-columns:minmax(210px,280px) minmax(300px,15cm) minmax(210px,280px);justify-content:center;align-items:center;gap:18px;margin-bottom:12px}
body.desktop-playground.player-app #component .desktop-controls>.component-bar{grid-column:2;width:100%;max-width:none;height:58px;margin:0;padding:4px 0}
.desktop-account-slot{grid-column:3;min-width:0}
body.desktop-playground.player-app .desktop-account-slot #phone{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-width:0;min-height:46px;padding:10px 12px;font-size:18px;line-height:1.2;white-space:nowrap;background:#422b50e8;color:#fff0dc;border:1px solid #c9a4d688;border-radius:7px 15px 7px 12px}
body.desktop-playground.player-app .desktop-account-slot #balance{display:block;margin:0;padding-left:10px;border-left:1px solid #c9a4d666;font-size:15px;line-height:1.4;white-space:nowrap}
@media(max-width:1020px){.desktop-controls{grid-template-columns:minmax(190px,230px) minmax(300px,15cm);gap:14px}body.desktop-playground.player-app #component .desktop-controls>.component-bar{grid-column:1}.desktop-account-slot{grid-column:2}}
@media(max-width:700px){.desktop-controls{display:flex;gap:10px;max-width:var(--map-size);margin:0 auto 12px}body.desktop-playground.player-app #component .desktop-controls>.component-bar{width:auto;flex:none}.desktop-account-slot{flex:1}body.desktop-playground.player-app .desktop-account-slot #phone{font-size:15px;padding:10px 8px;gap:7px}body.desktop-playground.player-app .desktop-account-slot #balance{font-size:12px;padding-left:7px}}

/* Read the whole physical board in an expanded desktop view, then return to the map frame. */
/* Keep Kiezcam at the right edge of the map toolbar. */
body.desktop-playground.player-app #component .desktop-controls>.component-bar{height:58px;justify-content:space-between}
body.desktop-playground.player-app #component .component-bar .street-mode-soon{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;flex:none;margin-left:auto;box-sizing:border-box;width:180px;height:46px;min-height:46px;padding:6px 13px;overflow:visible;opacity:1;cursor:not-allowed;background:#392940e8;color:#d8c5de;border:1px dashed #bd9bc9;border-radius:6px 12px 7px 10px;box-shadow:2px 3px 0 #1c102a66;transform:rotate(-1deg);text-align:left}
.desktop-playground #component .street-mode-soon .street-mode-name{margin:0;font-size:17px;font-weight:900;font-style:italic;line-height:1;letter-spacing:-.4px;color:#e7d6ec}
.desktop-playground #component .street-mode-soon .street-mode-note{margin:0;font:600 9px/1.2 Arial,sans-serif;letter-spacing:.2px;color:#cbb5d3}
.desktop-playground #component .street-mode-soon .unicorn-plaster{position:absolute;left:-22px;top:-24px;display:flex;align-items:center;justify-content:center;gap:3px;margin:0;width:112px;height:26px;transform:rotate(-18deg);border:1px solid #fff0f6;border-radius:10px;background:radial-gradient(circle,#a877a955 .8px,transparent 1px) 0 0/5px 5px,#f3bbd6;box-shadow:1px 3px 3px #20102780;pointer-events:none}
.unicorn-plaster::before{content:'';position:absolute;inset:3px 16px;border-radius:5px;border:1px solid #d798bd;background:#f9d7e7}
.unicorn-plaster i{position:relative;font:normal 13px/1 sans-serif}
.unicorn-plaster b{position:relative;font:900 10px/1 Arial,sans-serif;color:#5a2854;white-space:nowrap}
@media(min-width:701px) and (max-width:1020px){body.desktop-playground.player-app #component .desktop-controls>.component-bar{grid-column:2;grid-row:1}.desktop-account-slot{grid-column:1;grid-row:1}}
@media(max-width:700px){.desktop-controls{flex-wrap:wrap}body.desktop-playground.player-app #component .desktop-controls>.component-bar{flex:1 0 100%;gap:10px}.desktop-account-slot{min-width:145px}}
.desktop-playground.board-focus .desktop-map{position:fixed!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%);width:min(1100px,96vw)!important;height:min(760px,94dvh)!important;max-width:none!important;max-height:none!important;aspect-ratio:auto!important;z-index:100;box-shadow:0 0 0 100vmax #1d1229bb}
.desktop-playground.board-focus #worldFrame{width:100%!important;height:100%!important}

.desktop-challenge.has-competition{padding:0;border-color:#65d3e580;background:#0b2036;height:var(--map-size);max-height:15cm;overflow:hidden}.desktop-challenge.has-competition>.desk-kicker,.desktop-challenge.has-competition>h1{display:none}.desktop-playground #component .desktop-challenge.has-competition iframe{height:100%;border-radius:0}