html,body{margin:0;min-height:100%;background:#2f1b31}
#kp-stage{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:#2f1b31;overflow:auto}
#kp-stage[hidden]{display:none}
.kp-screen{position:relative;width:min(100vw,calc(100vh * .45));aspect-ratio:1080/2400;overflow:hidden;background:#64caff;font-family:"Source Sans 3",Arial,sans-serif}
.kp-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:10;pointer-events:none}
.kp-photo-mask{position:absolute;z-index:5;overflow:hidden;pointer-events:none}.kp-photo-mask.ellipse{border-radius:50%}.kp-photo-mask canvas{position:absolute;inset:0;width:100%;height:100%}
.kp-layer{position:absolute;z-index:20;box-sizing:border-box;display:flex;align-items:center;white-space:pre-wrap;overflow:hidden;font-family:"Source Sans 3",Arial,sans-serif;font-weight:700}
.kp-layer.center{justify-content:center;text-align:center}.kp-layer.left{justify-content:flex-start;text-align:left}
.kp-layer:has(textarea){overflow:hidden}.kp-control{border:0;background:transparent;outline:none;font:inherit;color:inherit;width:100%;height:100%;padding:0;box-sizing:border-box}
textarea.kp-control{resize:none;overflow-y:auto;padding:.1em 18% .1em 0;scrollbar-width:none}
textarea.kp-control::-webkit-scrollbar{display:none}
textarea.kp-control:placeholder-shown{padding-top:.42em}
textarea.kp-control:disabled{overflow:hidden;padding-right:2%;opacity:1}
.kp-message-counter{position:absolute;right:3%;top:50%;z-index:2;padding:.08em .22em;border-radius:.25em;background:#fff3dcf2;font-size:.5em;line-height:1;color:#71371f;white-space:nowrap;pointer-events:none;transform:translateY(-50%)}.kp-message-counter.max{color:#c9273f}
select.kp-control{appearance:none;cursor:pointer}
button.kp-layer,button.kp-layer:hover,button.kp-layer:active{min-width:0;margin:0;border:0;border-radius:0;padding-top:0;padding-bottom:0;background:transparent;background-image:none;box-shadow:none;text-shadow:none;cursor:pointer;appearance:none}
.kp-slider-host{position:absolute;z-index:250;height:2.9166667%;display:flex;align-items:center;padding:0 1.2962963%;box-sizing:border-box}.kp-slider{width:100%;accent-color:#ed4b86;cursor:pointer;margin:0;padding:0;box-shadow:none}.kp-slider::-webkit-slider-thumb{width:var(--thumb-size);height:var(--thumb-size)}.kp-slider::-moz-range-thumb{width:var(--thumb-size);height:var(--thumb-size)}
.kp-file{display:none}.kp-tap{all:unset;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:82%;height:19%;display:block;box-sizing:border-box;cursor:pointer;z-index:100;touch-action:manipulation}.kp-tap img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.kp-notice-shade{position:absolute;inset:0;z-index:500;display:grid;place-items:center;padding:8%;box-sizing:border-box;background:#2f1b318c}.kp-notice{width:82%;box-sizing:border-box;padding:7% 6%;border:3px solid #fff5de;border-radius:5%;background:#fff4dd;color:#71371f;text-align:center}.kp-notice p{margin:0 0 6%;font-size:clamp(14px,3.2vw,26px);line-height:1.25;font-weight:700}.kp-notice button{min-width:35%;padding:3% 6%;border:0;border-radius:999px;background:#ef5682;color:white;font-weight:700}
#kp-skip{position:absolute;z-index:45;left:6%;bottom:7.2%;border:0;background:transparent;color:#fff;font:900 clamp(9px,2vw,14px)/1 Arial,sans-serif;text-shadow:0 2px 3px #000;cursor:pointer;padding:1%;display:block;white-space:nowrap}.kp-recipient #kp-skip{display:none}
#start-screen,#end-screen,#photo-modal{display:none!important}
@media(max-aspect-ratio:9/20){.kp-screen{width:100vw;height:auto}}

html,body{overflow:clip!important;overscroll-behavior:none}
#kp-stage{overflow:clip!important}.kp-screen{width:min(100vw,calc(100svh * .45));height:auto;container-type:inline-size;background:#120b26}
#game-shell{width:min(100vw,calc(100svh * .45))!important;height:min(100svh,calc(100vw / .45))!important;container-type:inline-size}
#game-placeholder[aria-hidden=true]{visibility:hidden;pointer-events:none}#game-placeholder{touch-action:none}
.kp-control{min-height:0!important;border-radius:0;line-height:inherit;letter-spacing:normal}
textarea.kp-control{padding:0 .12em .65em!important;overflow:auto;scrollbar-width:none}
.kp-message-counter{top:auto;bottom:0;right:0;transform:none;background:transparent}
img,button{-webkit-touch-callout:none;-webkit-user-drag:none;user-select:none}button{touch-action:manipulation}
.instruction{font-size:clamp(12px,3.6cqw,36px);padding:0 2%;line-height:1.08}
.kp-photo-mask{touch-action:none}

#game-placeholder{touch-action:none} .game-mascot-stage .user-photo{object-fit:cover!important} .kp-layer.right{justify-content:flex-end;text-align:right}

#kp-skip{left:50%;bottom:1%;transform:translateX(-50%)}
