:root{--font:ui-rounded, "SF Pro Rounded", "Arial Rounded MT Bold", "Nunito", "Varela Round", system-ui, sans-serif;--outline:#36282a;--cream:#fffdf6;--soft-text:#6b5a55;--k:1}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}html,body{overscroll-behavior:none;width:100%;height:100%;margin:0;padding:0;overflow:hidden}body{touch-action:none;background:var(--cream);color:var(--outline);font-family:var(--font);-webkit-text-size-adjust:100%;position:fixed;inset:0}#app{width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}button{font-family:var(--font);color:var(--outline);touch-action:none}.safe-probe{visibility:hidden;pointer-events:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:fixed;top:0;left:0}.scene{position:absolute;inset:0;overflow:hidden}.scene .layer{pointer-events:none;display:block;position:absolute}.scene .sprite{will-change:transform, opacity;top:0;left:0}div.sprite{pointer-events:none;position:absolute}div.sprite>svg{width:100%;height:100%;display:block;position:absolute;top:0;left:0}.scene .drift{pointer-events:none;position:absolute;overflow:hidden}.scene .drift>svg{position:absolute}.controls{pointer-events:none;display:block;position:absolute;overflow:visible}.controls .tappable{pointer-events:visiblePainted;cursor:pointer}.screens,.screen,.card-screen{position:absolute;inset:0;overflow:hidden}.upright-screen{z-index:45}.card-screen-scenery,.card-screen-scenery>svg{width:100%;height:100%;position:absolute;inset:0}.card-screen-piece,.card-screen-card{box-sizing:border-box;display:block;position:absolute}.name-input{opacity:0;pointer-events:none;-webkit-user-select:text;user-select:text;border:0;width:1px;height:1px;padding:0;font-size:16px;position:fixed;top:0;left:0}.placeholder .koala-name{font-size:calc(var(--k) * 72px);font-weight:800}.placeholder .placeholder-label{margin:calc(var(--k) * 16px) 0 calc(var(--k) * 40px);padding:calc(var(--k) * 12px) calc(var(--k) * 28px);border:calc(var(--k) * 4px) dashed #8e8478;border-radius:calc(var(--k) * 16px);font-size:calc(var(--k) * 26px);color:#6b6259;background:#e4e1da;font-weight:700}.placeholder{background:var(--cream);flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.placeholder .counter{width:calc(var(--k) * 260px);height:calc(var(--k) * 260px);border:calc(var(--k) * 5px) solid var(--outline);box-shadow:0 calc(var(--k) * 8px) 0 #36282a29;font-size:calc(var(--k) * 110px);font-variant-numeric:tabular-nums;background:#ffe7a6;border-radius:50%;font-weight:800}.placeholder .counter:active{transform:translateY(calc(var(--k) * 4px));box-shadow:0 calc(var(--k) * 4px) 0 #36282a29}.version-line{font-size:calc(var(--k) * 15px);color:#8e8478;font-weight:700;position:absolute}.save-trouble{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.save-trouble .card{width:calc(var(--k) * 720px);padding:calc(var(--k) * 48px) calc(var(--k) * 56px);background:var(--cream);border:calc(var(--k) * 5px) solid var(--outline);border-radius:calc(var(--k) * 36px);box-shadow:0 calc(var(--k) * 8px) 0 #36282a29}.save-trouble h1{margin:0 0 calc(var(--k) * 18px);font-size:calc(var(--k) * 40px);font-weight:800}.save-trouble p{margin:0 0 calc(var(--k) * 12px);font-size:calc(var(--k) * 26px);color:var(--soft-text);font-weight:700;line-height:1.35}
