:root{color-scheme:dark;--bg: #363636;--text: #f4f4f4;--text-muted: #b9b9b9;--text-soft: #8e8e8e;--accent: #f4cc4f;--layer-size: 160px}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;padding:0;overflow:hidden;background:var(--bg)}body{font-family:Avenir Next,Helvetica Neue,Helvetica,sans-serif;color:var(--text)}a{color:var(--accent)}.startup-message{width:100vw;height:100vh;display:grid;place-items:center;text-align:center;padding:2rem;color:var(--text);font-size:1rem}.startup-message.error{color:#f2c7c7}.editor{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;-webkit-user-select:none;user-select:none;isolation:isolate}.editor.readonly .contextual-ui{display:none}.main-nav{position:absolute;top:.9rem;right:1rem;z-index:30;display:flex;align-items:center;gap:.1rem}.main-nav-history{right:auto;left:1rem}.main-nav-export{right:1rem}.main-nav-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:#d2d2d2;display:block;width:90px;padding:.55rem .5rem;margin:0;font-size:.64rem;text-transform:uppercase;letter-spacing:.11em;cursor:pointer}.main-nav-button:hover:enabled{color:#fff}.main-nav-button-active,.main-nav-button-active:hover:enabled{color:var(--accent)}.main-nav-button:disabled{color:#727272;cursor:default}.main-nav-mode{top:auto;right:auto;bottom:.9rem;left:50%;transform:translate(-50%)}.artwork{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.layer{display:block;position:absolute;top:0;left:0;transition:opacity .3s;pointer-events:none;transform-origin:center;will-change:transform}.layer .hit-area{display:block;position:absolute;width:130px;height:130px;margin:15px;border-radius:130px;pointer-events:auto;cursor:pointer}.layer .sprite{display:block;width:var(--layer-size);height:var(--layer-size);background:url(/ajax-loader.gif) center center no-repeat;background-size:contain;pointer-events:none}.emoji{width:var(--layer-size);height:var(--layer-size);margin-top:calc(var(--layer-size) / -2);margin-left:calc(var(--layer-size) / -2)}.layer.image .hit-area{top:0;right:0;bottom:0;left:0;width:auto;height:auto;margin:0;border-radius:0}.layer.image .sprite{background:none center center no-repeat;background-size:cover}.layer.locked,.layer.locked .hit-area{pointer-events:none}.editor.active-layer .layer{opacity:.42}.editor.active-layer .layer.active,.editor.active-layer .layer.locked{opacity:1}.editor.active-layer .layer.active .hit-area{pointer-events:none}.editor.ongoing-pan .layer{pointer-events:none!important}.contextual-ui{position:absolute;top:50%;margin-top:-113px;opacity:0;visibility:hidden;pointer-events:none;z-index:20;transition:opacity .15s ease,transform .15s ease}.contextual-ui-left{left:.15rem;transform:translate3d(-11px,0,0)}.contextual-ui-right{right:.15rem;transform:translate3d(11px,0,0)}.contextual-ui-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:#ccc;display:block;width:90px;padding:.55rem .5rem;margin:.2rem 0;font-size:.64rem;text-transform:uppercase;letter-spacing:.11em;cursor:pointer}.contextual-ui-button:hover{color:#fff}.contextual-ui-button:disabled,.contextual-ui-button:disabled:hover{color:#727272;cursor:default}.editor.active-layer[data-contextual-nav-side=left] .contextual-ui-left,.editor.active-layer[data-contextual-nav-side=right] .contextual-ui-right{opacity:1;visibility:visible;pointer-events:auto;transform:translateZ(0)}.selection-overlay{--selection-marquee-gap: 4px;display:block;position:absolute;top:0;left:0;width:0;height:0;transform-origin:center;z-index:100000;pointer-events:none}.selection-overlay-bounds{display:block;position:absolute;left:0;top:0;transform:translate(-50%,-50%)}.selection-overlay-box{display:block;position:absolute;inset:calc(var(--selection-marquee-gap) * -1);border:2px dashed rgba(244,204,79,.88);border-radius:12px;box-shadow:0 0 0 1px #00000080;pointer-events:none}.selection-overlay-pivot{display:block;position:absolute;left:50%;top:50%;width:32px;height:32px;margin-left:-16px;margin-top:-16px;pointer-events:auto}.selection-overlay-pivot:after{content:"";position:absolute;top:50%;left:50%;width:10px;height:10px;margin-left:-5px;margin-top:-5px;border-radius:100%;border:2px solid rgba(33,33,33,.95);background:var(--accent)}.selection-overlay-handle{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:absolute;width:16px;height:16px;border:1px solid rgba(244,204,79,.95);border-radius:100%;background:#232323;pointer-events:auto;touch-action:none;cursor:pointer;transform:translate(-50%,-50%)}.selection-overlay-handle:focus-visible{outline:2px solid #fff;outline-offset:2px}.selection-overlay-handle-move{left:calc(var(--selection-marquee-gap) * -1);top:calc(var(--selection-marquee-gap) * -1);cursor:move}.selection-overlay-handle-rotate{left:calc(100% + var(--selection-marquee-gap));top:calc(var(--selection-marquee-gap) * -1);cursor:crosshair}.selection-overlay-handle-scale{left:calc(100% + var(--selection-marquee-gap));top:calc(100% + var(--selection-marquee-gap));cursor:nwse-resize}.help{width:100vw;height:100vh;display:grid;place-content:center;text-align:center;gap:.2rem;padding:2.2rem;color:var(--text-soft)}.help h1{margin:0;color:var(--accent);font-size:clamp(2rem,7vw,3rem);font-weight:700}.help .moji{width:62px;height:62px;display:inline-block;vertical-align:middle;background:url(/emoji.26.3.1/images/hatching-chick.png) center center no-repeat;background-size:cover;border-radius:12px}.help p{margin:.45rem auto;max-width:42rem;line-height:1.45;color:var(--text-muted)}.help p.tagline{text-transform:uppercase;letter-spacing:.2em;font-size:.68rem;color:#b1b1b1}.help p.aux{font-size:.9rem;color:#9f9f9f}.help strong{color:#e4e4e4}.offscreen-export-canvas{position:absolute;width:0;height:0;top:-9999px;left:-9999px;opacity:0;pointer-events:none}@media(min-width:768px){.contextual-ui-left{left:1rem}.contextual-ui-right{right:1rem}}.emoji-settings-dialog{width:calc(100svw - 1rem);height:calc(100svh - 1rem);max-width:calc(100svw - 1rem);max-height:calc(100svh - 1rem);margin:auto;padding:0;border:0;border-radius:.5rem;background:var(--bg);color:var(--text);overflow:hidden}.emoji-settings-dialog::backdrop{background:#0009}.emoji-settings{display:flex;flex-direction:column;height:100%}.emoji-settings-header{flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.9rem 1rem;border-bottom:1px solid #4a4a4a;background:var(--bg)}.emoji-settings-close{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:var(--text-muted);font-size:1.4rem;line-height:1;padding:0 .25rem;cursor:pointer}.emoji-settings-close:hover{color:var(--text)}.image-slots{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;padding:1rem 0;max-width:640px;margin:0 auto}.image-slot{position:relative;aspect-ratio:1 / 1;border-radius:.5rem;overflow:hidden;background:#2a2a2a}.image-slot-empty,.image-slot-thumb{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;width:100%;height:100%;border:1px dashed #5a5a5a;border-radius:.5rem;background:transparent;color:var(--text-muted);cursor:pointer}.image-slot-thumb{border-style:solid;padding:0}.image-slot-thumb img{width:100%;height:100%;object-fit:cover}.image-slot-empty:hover,.image-slot-thumb:hover{border-color:#8e8e8e;color:var(--text)}.image-slot-plus{font-size:2rem;line-height:1}.image-slot-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em}.image-slot-empty input,.image-slot-replace input{display:none}.image-slot-replace{position:absolute;bottom:.4rem;right:.4rem;padding:.3rem .6rem;border-radius:.3rem;background:#000000a6;color:var(--text);font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;cursor:pointer}.image-slot-replace:hover{background:#000000d9}.emoji-settings-title{margin:0;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--text)}.emoji-settings-body{--emoji-grid-gap: 4px;flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 1rem 1.5rem}.emoji-settings-virtualizer{position:relative;width:100%}.emoji-settings-virtual-row{position:absolute;top:0;left:0;width:100%;overflow:hidden}.emoji-settings-virtual-row.sticky{position:sticky;top:0;z-index:2}.emoji-settings-virtual-row-header{background:var(--bg)}.emoji-settings-group-title{box-sizing:border-box;height:100%;margin:0;padding:.8rem 0 .5rem;background:var(--bg);display:flex;justify-content:space-between;align-items:center;gap:.5rem}.emoji-settings-group-name{margin:0;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted)}.emoji-settings-category-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;padding:.2rem .1rem;font-size:.6rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--text-soft);cursor:pointer}.emoji-settings-category-toggle:hover{color:var(--text)}.emoji-settings-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:var(--emoji-grid-gap);height:100%}.emoji-settings-cell{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-sizing:border-box;border:0;margin:0;min-width:0;min-height:0;padding:.25rem;background:transparent;border-radius:.35rem;cursor:pointer;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;transition:opacity .12s ease,background .12s ease}.emoji-settings-cell:hover{background:#ffffff14}.emoji-settings-cell.disabled{opacity:.3}.emoji-settings-cell.selected{box-shadow:inset 0 0 0 2px var(--accent)}.emoji-settings-image{display:block;width:100%;height:100%;max-width:44px;max-height:44px;object-fit:contain;pointer-events:none}@media(max-width:430px){.emoji-settings-body{--emoji-grid-gap: 2px}.emoji-settings-cell{padding:.125rem}}.emoji-settings-actions{flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.75rem 1rem;border-top:1px solid #4a4a4a;background:var(--bg)}.emoji-settings-actions-left{display:flex;align-items:center;gap:.5rem}.emoji-settings-save{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-radius:.35rem;background:var(--accent);color:#1c1c1c;padding:.6rem 1.6rem;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;cursor:pointer}.emoji-settings-save:hover{filter:brightness(1.05)}.emoji-settings-secondary{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:1px solid #5a5a5a;border-radius:.35rem;color:var(--text-muted);padding:.6rem 1.2rem;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;cursor:pointer}.emoji-settings-secondary:hover{border-color:#8e8e8e;color:var(--text)}.emoji-settings-paste{display:flex;flex-direction:column;height:100%;padding-top:1rem}.emoji-settings-paste-error{margin:0 0 .5rem;font-size:.75rem;color:#f2c7c7}.emoji-settings-paste-field{flex:1 1 auto;width:100%;min-height:16rem;resize:none;box-sizing:border-box;padding:.75rem;border:1px solid #4a4a4a;border-radius:.35rem;background:#2a2a2a;color:var(--text);font-family:SFMono-Regular,Menlo,Consolas,monospace;font-size:.8rem;line-height:1.5}.emoji-settings-paste-field:focus{outline:none;border-color:var(--accent)}