*{box-sizing:border-box;margin:0;padding:0}body{background-color:#1a1a2e;background-repeat:repeat;justify-content:center;align-items:center;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:background-color .5s,background-image .5s;display:flex}.controls{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-sizing:border-box;background:#0009;border:1px solid #fff3;border-radius:16px;flex-direction:column;align-items:center;gap:16px;width:240px;padding:20px;display:flex}.color-control{align-items:center;gap:12px;display:flex}.color-control label{color:#fffc;font-size:14px;font-weight:500}.color-control input[type=color]{cursor:pointer;background:0 0;border:none;border-radius:8px;width:40px;height:32px;padding:0}.presets-section{flex-direction:column;align-items:center;gap:12px;width:100%;display:flex}.presets-label{color:#fffc;font-size:14px;font-weight:500}.presets-grid{grid-template-columns:repeat(3,1fr);justify-items:center;gap:8px;width:100%;display:grid}.controls-section{border-top:1px solid #ffffff1a;flex-direction:column;align-items:center;gap:12px;width:100%;padding-top:8px;display:flex}.controls-grid{grid-template-columns:repeat(3,1fr);justify-items:center;gap:8px;width:100%;display:grid}.preset-btn{cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff1a;border:1px solid #fff3;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;padding:8px;font-size:20px;transition:all .2s;display:flex}.preset-btn:hover{background:#fff3;border-color:#fff6;transform:scale(1.05)}.emoji-grid{grid-template-columns:repeat(2,1fr);place-items:center;gap:15px;width:160px;height:160px;display:grid}.emoji-btn{cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:70px;height:70px;padding:12px;font-size:50px;transition:all .2s;display:flex}.emoji-btn:hover{background:#fff3;transform:scale(1.05)}.emoji-picker{z-index:1000;background:#0009;justify-content:center;align-items:center;transition:all .3s;display:flex;position:fixed;inset:0}.emoji-picker.hidden{opacity:0;visibility:hidden}.emoji-options{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffff2;border-radius:20px;grid-template-columns:repeat(8,1fr);gap:8px;max-width:480px;max-height:400px;padding:24px;display:grid;overflow-y:auto;box-shadow:0 8px 32px #0003}.emoji-option{text-align:center;cursor:pointer;background:#ffffff80;border-radius:8px;justify-content:center;align-items:center;min-height:40px;padding:8px;font-size:1.5rem;transition:all .2s;display:flex}.emoji-option:hover{background:#ffffffe6;transform:scale(1.1)}.emoji-category-header{color:#000000b3;text-align:left;background:#0000000d;border-radius:6px;grid-column:1/-1;margin:8px 0 4px;padding:12px 8px 4px;font-size:.9rem;font-weight:600}.footer{color:#ffffffe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-sizing:border-box;z-index:100;background:#0009;border:1px solid #fff3;border-radius:12px;justify-content:center;align-items:center;gap:12px;width:240px;padding:8px 16px;font-size:11px;display:flex;position:fixed;bottom:16px;left:50%;transform:translate(-50%)}.ui-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:6px;transition:color .2s;display:flex}.ui-toggle:hover{color:#fff}.ui-toggle input[type=checkbox]{accent-color:#ffffffb3;width:12px;height:12px}.credit a{color:#fffc;text-decoration:none;transition:color .2s}.credit a:hover{color:#fff}@media (width<=768px){.controls{gap:16px;padding:16px}.color-control{gap:8px}.emoji-grid{gap:12px;width:140px;height:140px}.emoji-btn{width:60px;height:60px;font-size:2rem}.footer{gap:16px;padding:6px 12px;font-size:11px;bottom:12px}.emoji-options{grid-template-columns:repeat(6,1fr);max-width:360px;max-height:300px}.emoji-option{min-height:32px;padding:6px;font-size:1.2rem}}@media (width<=480px){.controls{gap:12px;padding:12px}.emoji-grid{gap:8px;width:120px;height:120px}.emoji-btn{width:50px;height:50px;font-size:1.8rem}.footer{flex-direction:column;align-items:center;gap:12px;padding:6px 10px;font-size:10px;bottom:8px}.emoji-options{grid-template-columns:repeat(5,1fr);max-width:300px;max-height:250px}}