@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Nunito:wght@500;700;800;900&display=swap";:root{color:#17213f;font-synthesis:none;--blue:#245edb;--navy:#152c79;--cream:#fffdf4;--pink:#f44f76;--lime:#b8ed42;background:#d8def0;font-family:Nunito,sans-serif}.titlebar{-webkit-app-region:drag}.titlebar button,.titlebar a{-webkit-app-region:no-drag}.desktop-shell.minimized{width:auto;height:34px;position:fixed;top:20px;left:20px;right:20px;box-shadow:4px 5px #68728d}.builtins button.selected,.saved-stickers button.selected{outline-offset:2px;outline:3px solid #245edb;transform:translateY(-2px)}.received-sticker{background:var(--sticker);border:5px solid #182653;border-radius:50%;place-items:center;width:180px;height:180px;margin:auto;font:900 50px/1 DM Mono,monospace;display:grid;transform:rotate(-4deg);box-shadow:inset 0 0 0 6px #ffffff8c,6px 6px #5f6880}.buddy-directory{background:linear-gradient(135deg,#fffdf4,#f3efff);height:100%;padding:42px clamp(22px,6vw,80px);overflow:auto}.buddy-directory h1{color:#182653;margin:5px 0;font-size:36px}.buddy-directory>p{color:#68718b;margin:0 0 25px;font-size:13px}.buddy-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;display:grid}.buddy-grid>button{text-align:left;cursor:pointer;background:#fff;border:1px solid #aab6d5;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;padding:12px;display:grid;box-shadow:2px 2px #a5aec5}.buddy-grid>button:hover{background:#fffbd8;transform:translateY(-1px)}.buddy-grid span{flex-direction:column;min-width:0;display:flex}.buddy-grid small{color:#777f96;font-size:9px}.invite-button{color:#fff;background:linear-gradient(#6494ed,#285dce);border:1px solid #204da9;align-items:center;gap:8px;margin-top:22px;padding:10px 14px;font-weight:900;display:flex;box-shadow:2px 2px #7e879d}.buddy-help{text-align:center;background:#fffdf0;border:2px solid #6476a7;width:min(430px,100%);padding:38px 34px;position:relative;box-shadow:inset 0 0 0 4px #fff,7px 7px #5d657a}.buddy-help h2{color:#182653;margin:7px 0;font-size:28px}.buddy-help p{color:#626c85;font-size:12px;line-height:1.55}.admin-link{color:#2456bd;margin-top:17px;font-size:11px;font-weight:900;display:block}.closed-window{text-align:center;color:#182653;background:linear-gradient(135deg,#c9d8f4,#eadff5);place-content:center;justify-items:center;min-height:100dvh;display:grid}.closed-window img{width:160px;image-rendering:pixelated}.closed-window h1{margin:8px 0}.closed-window p{color:#606a83;margin:0 0 20px}.closed-window button,.no-buddies button{color:#fff;background:linear-gradient(#5b8cea,#2458c7);border:1px solid #1c449e;padding:9px 14px;font-weight:900;box-shadow:2px 2px #8790a5}.sticker-drawer{min-height:0;overflow:auto}.pin-state{align-items:center;gap:3px;display:flex}.sr-only{clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}.sequence-notice{color:#a33b57!important}@media (width<=720px){.sticker-drawer{min-height:0;max-height:180px;overflow:auto}.tool-row{flex-wrap:wrap;align-content:center;min-height:78px;height:auto!important}.swatches{flex:1 0 100%;justify-content:space-between}.swatches button{width:32px!important;height:32px!important}.brush-size{flex:1;margin-left:0!important}.canvas-actions button{justify-content:center;min-width:40px;min-height:40px}.clear-btn,.account-action,.me-card button,.section-label button,.buddy-ad button{min-width:40px;min-height:40px}}*{box-sizing:border-box}body{background:radial-gradient(circle at 20% 10%,#f5f0ff 0,#0000 30%),linear-gradient(135deg,#cbdaf5,#e8e1f3);min-width:320px;min-height:100vh;margin:0;overflow:hidden}button{font:inherit;color:inherit}button:focus-visible{outline-offset:2px;outline:3px solid #92b4ff}.desktop-shell{background:var(--cream);grid-template-rows:34px 1fr;width:100vw;height:100dvh;display:grid;position:relative;overflow:hidden}.titlebar{color:#fff;-webkit-user-select:none;user-select:none;background:linear-gradient(#438bf2 0%,#2869dc 45%,#1452c6 52%,#2466dd 100%);border-bottom:2px solid #0f3a9b;justify-content:space-between;align-items:center;height:34px;padding-left:8px;display:flex;box-shadow:inset 0 1px #fffc}.title-brand{text-shadow:1px 1px #113b93;letter-spacing:.1px;align-items:center;gap:7px;font-size:13px;display:flex}.tiny-logo{color:#254191;background:#ffdb39;border:2px solid #fff;border-radius:50% 52% 45% 55%;place-items:center;width:22px;height:22px;font:900 10px/1 Nunito;display:grid;transform:rotate(-5deg);box-shadow:1px 1px #162e7a}.window-actions{gap:2px;margin-right:3px;display:flex}.window-actions button{color:#fff;background:linear-gradient(#80aaf3,#356fd7);border:1px solid #fff;border-radius:3px;place-items:center;min-width:27px;height:25px;display:grid;box-shadow:inset 0 0 0 1px #2860c2}.window-actions button:hover,.window-actions button.active{color:#173a90;background:linear-gradient(#ffe16a,#d99600)}.window-actions .close{background:linear-gradient(#f09271,#d64320)}.app-body{grid-template-columns:290px 1fr;min-height:0;display:grid}.inbox-panel{background:linear-gradient(#f7f5ff,#e9e9fa);border-right:1px solid #aab3d1;flex-direction:column;min-height:0;display:flex}.me-card{background:linear-gradient(#fff,#eef1ff);border-bottom:1px solid #bdc5dd;align-items:center;gap:8px;padding:15px 13px 12px;display:flex}.me-card>div:nth-child(2){flex-direction:column;flex:1;min-width:0;display:flex}.me-card strong{white-space:nowrap;text-overflow:ellipsis;font-size:14px;overflow:hidden}.me-card small{color:#67708a;white-space:nowrap;font-size:10px}.me-card small i{background:#49c65b;border-radius:50%;width:6px;height:6px;margin-right:4px;display:inline-block}.account-action{color:#60709a;background:0 0;border:0;place-items:center;padding:5px;display:grid}.account-action:hover{color:#244da5}.me-card button,.section-label button{color:#60709a;background:0 0;border:0;margin-left:auto;padding:6px}.section-label{letter-spacing:1.2px;color:#6f7690;align-items:center;height:34px;padding:0 12px;font:800 10px DM Mono;display:flex}.section-label b{background:var(--pink);color:#fff;border-radius:7px;padding:1px 5px}.contact-list{flex-direction:column;gap:3px;padding:0 7px;display:flex}.contact{text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:4px;grid-template-columns:40px 1fr auto;align-items:center;gap:9px;padding:8px 7px;display:grid}.contact:hover,.contact.selected{background:#fff;border-color:#aebbe0;box-shadow:inset 0 0 0 1px #e9edff,1px 1px #bac2dc}.contact-copy{flex-direction:column;min-width:0;display:flex}.contact-copy b{white-space:nowrap;font-size:13px}.contact-copy small{color:#848aa0;white-space:nowrap;font-size:10px}.contact-copy small.unopened{color:#264a9b;font-weight:800}.contact-copy small i{background:var(--pink);border-radius:50%;width:7px;height:7px;margin-right:5px;display:inline-block;box-shadow:0 0 0 2px #ffd9e1}.contact time{color:#8a91a8;align-self:start;font:9px DM Mono}.avatar{background:linear-gradient(135deg,var(--avatar),#fff);border:1px solid #7f8bab;border-radius:4px;place-items:center;width:40px;height:40px;display:grid;position:relative;box-shadow:inset 0 0 0 2px #ffffffa6}.avatar-xs{width:27px;height:27px}.avatar-lg{border-radius:8px;width:72px;height:72px}.presence{background:#aeb2be;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;bottom:-2px;right:-2px}.presence.online{background:#42c859}.presence.away{background:#f2c52e}.pixel-face{background:#f7d7a7;border:2px solid #152142;border-radius:45% 45% 48% 48%;width:25px;height:22px;position:relative}.avatar-xs .pixel-face{transform:scale(.7)}.avatar-lg .pixel-face{transform:scale(1.6)}.pixel-face:before,.pixel-face:after{content:"";background:#182040;width:4px;height:5px;position:absolute;top:5px}.pixel-face:before{left:5px}.pixel-face:after{right:5px}.pixel-face i{border-bottom:2px solid #182040;border-radius:50%;width:8px;height:3px;position:absolute;bottom:3px;left:7px}.pixel-face b{background:#6841a7;width:6px;height:4px;position:absolute;top:-5px;left:7px;transform:skew(-25deg)}.pixel-face.dad b{background:#694224;width:23px;left:-1px}.pixel-face.worm{background:#c7e866;border-radius:50%}.pixel-face.worm b{width:5px;height:8px;transform:none}.pixel-face.angel b{background:0 0;border:2px solid #f9dc4c;border-radius:50%;width:25px;height:3px;top:-7px;left:-2px}.pixel-face.you b{background:#31a5c7;width:17px}.buddy-ad{background:#faffdd;border:1px solid #7786b7;align-items:center;min-height:105px;margin:auto 12px 12px;padding:7px 8px 7px 2px;display:flex;position:relative;box-shadow:inset 0 0 0 2px #fff,2px 2px #aeb6d1}.buddy-ad img{object-fit:contain;width:76px;height:94px;image-rendering:pixelated;filter:drop-shadow(2px 2px #8fa6dd);align-self:flex-end}.buddy-ad div{min-width:0}.buddy-ad strong{color:#5c2e99;font:800 9px DM Mono}.buddy-ad p{color:#424b64;margin:4px 0 7px;font-size:10px;line-height:1.25}.buddy-ad button{text-transform:uppercase;background:linear-gradient(#fff,#d9e2ff);border:1px solid #7786b7;padding:4px 6px;font:800 8px DM Mono;box-shadow:1px 1px #8e96ae}.privacy-note{color:#45609d;background:#dbe4fd;border-top:1px solid #a8b7de;align-items:center;gap:9px;height:48px;padding:8px 12px;display:flex}.privacy-note span{flex-direction:column;display:flex}.privacy-note b{font-size:10px}.privacy-note small{font-size:9px}.content-area{background:#fffdf7;flex-direction:column;min-width:0;min-height:0;display:flex}.status-ribbon{color:#52617e;background:#e9ecf6;border-bottom:1px solid #c7cddd;flex:none;align-items:center;gap:6px;height:31px;padding:0 14px;font:500 9px DM Mono;display:flex}.status-ribbon i{background:#b7bfd1;width:1px;height:13px;margin:0 7px}.status-ribbon .pin-state{color:#52617e;margin-left:auto}.composer{flex-direction:column;flex:1;width:100%;max-width:1040px;min-height:0;margin:0 auto;padding:clamp(19px,3vw,34px) clamp(20px,4vw,55px) 24px;display:flex}.composer-heading{justify-content:space-between;align-items:center;margin-bottom:17px;display:flex}.eyebrow{letter-spacing:1.6px;text-transform:uppercase;color:#f04b72;font:800 9px DM Mono}.composer-heading h1{letter-spacing:-1.8px;color:#182653;margin:4px 0;font-size:clamp(28px,4vw,42px);line-height:.95}.composer-heading p{color:#75809a;margin:8px 0 0;font-size:12px}.recipient{background:linear-gradient(#fff,#e8ecfa);border:1px solid #9aa7cd;align-items:center;gap:7px;padding:6px 9px 6px 6px;font-size:11px;display:flex;box-shadow:inset 0 0 0 1px #fff,2px 2px #bdc3d6}.recipient b{color:#294a9b}.mode-tabs{border-bottom:1px solid #aab5d1;gap:4px;padding-left:5px;display:flex}.mode-tabs button{color:#7a8296;cursor:pointer;background:0 0;border:1px solid #0000;border-bottom:0;align-items:center;gap:7px;padding:8px 13px;font-size:11px;font-weight:800;display:flex;position:relative;top:1px}.mode-tabs button.active{color:#254a9e;background:#f2f4fd;border-color:#aab5d1}.mode-tabs button span{color:#fff;background:#6477a5;border-radius:7px;padding:1px 4px;font:8px DM Mono}.tool-row{align-items:center;gap:14px;height:48px;padding:7px 4px;display:flex}.swatches{gap:6px;display:flex}.swatches button{background:var(--swatch);cursor:pointer;border:2px solid #fff;border-radius:50%;width:19px;height:19px;padding:0;box-shadow:0 0 0 1px #a5aec6}.swatches button.selected{transform:scale(1.12);box-shadow:0 0 0 2px #4868b5}.brush-size{color:#64708b;align-items:center;gap:6px;font:9px DM Mono;display:flex}.brush-size input{accent-color:#325dcc;width:78px}.clear-btn{color:#777f93;cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;margin-left:auto;font-size:10px;display:flex}.canvas-wrap{touch-action:none;background-color:#fffdf3;background-image:linear-gradient(#e5e8dc 1px,#0000 1px),linear-gradient(90deg,#e5e8dc 1px,#0000 1px);background-size:19px 19px;border:1px solid #7e8eb6;flex:1;min-height:220px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 3px #fff,3px 3px #ccd1df}.canvas-wrap canvas{z-index:2;cursor:crosshair;touch-action:none;width:100%;height:100%;position:absolute;inset:0}.canvas-hint{color:#b0b5bd;pointer-events:none;justify-content:center;align-items:center;gap:8px;font:10px DM Mono;display:flex;position:absolute;inset:0}.canvas-actions{z-index:3;gap:4px;display:flex;position:absolute;bottom:8px;right:8px}.canvas-actions button{cursor:pointer;background:linear-gradient(#fff,#e1e5ef);border:1px solid #8996b4;align-items:center;gap:5px;height:29px;padding:0 8px;font:800 9px Nunito;display:flex;box-shadow:1px 1px #9da5b7}.send-strip{justify-content:space-between;align-items:flex-end;height:66px;display:flex}.privacy-pill{color:#53617f;align-items:center;gap:8px;display:flex}.privacy-pill>span{flex-direction:column;display:flex}.privacy-pill b{font-size:10px}.privacy-pill small{font-size:9px}.send-button{color:#fff;text-shadow:1px 1px #173b97;cursor:pointer;background:linear-gradient(#5b8cea,#2458c7 52%,#184bb8);border:1px solid #173b97;border-radius:3px;justify-content:center;align-items:center;gap:8px;min-width:156px;padding:11px 17px;font-weight:900;display:flex;box-shadow:inset 0 0 0 1px #83a9f0,2px 2px #9fa8bd}.send-button:hover{filter:brightness(1.08)}.piano-card{background:radial-gradient(circle at 80% 10%,#eee4ff 0,#0000 30%),#fbf8ec;border:1px solid #8996b4;flex-direction:column;flex:1;min-height:300px;padding:22px;display:flex;box-shadow:inset 0 0 0 3px #fff,3px 3px #ccd1df}.sequence{background:#fff;border:1px inset #bbc1ce;align-items:center;gap:7px;height:72px;margin:20px 0;padding:14px;display:flex;overflow:hidden}.sequence i{color:#284899;background:#dce6ff;border:1px solid #9cafdc;padding:6px 7px;font:800 9px DM Mono}.sequence em{color:#a3a9b6;font:10px DM Mono}.sequence button{color:#e25170;background:0 0;border:0;margin-left:auto;font-size:9px}.piano{justify-content:center;width:100%;max-width:650px;height:170px;margin:auto auto 0;display:flex}.piano button{cursor:pointer;background:linear-gradient(90deg,#f5f5ec,#fff 25% 70%,#dbdcd5);border:1px solid #6d7487;border-radius:0 0 5px 5px;flex:1;max-width:76px;position:relative;box-shadow:inset 0 -7px #ecece3,2px 3px #7a8090}.piano button:active{transform:translateY(3px);box-shadow:inset 0 -4px #e6e6dd}.piano span{color:#65708c;font:10px DM Mono;position:absolute;bottom:13px;left:0;right:0}.sticker-drawer{background:#f7f4e9;border:1px solid #8996b4;flex:1;padding:18px}.builtins,.saved-stickers{flex-wrap:wrap;gap:13px;display:flex}.builtins button{background:var(--sticker);border:2px solid #1c2850;border-radius:43% 47% 45% 48%;width:72px;height:72px;font:900 19px DM Mono;transform:rotate(-3deg);box-shadow:3px 3px #8c94aa}.builtins button:nth-child(2n){transform:rotate(4deg)}.saved-stickers{border-top:1px dashed #aeb5c4;margin-top:18px;padding-top:18px}.saved-stickers button{background:#fff;border:1px solid #a5aec0;width:80px;height:80px}.saved-stickers img{object-fit:contain;width:100%;height:100%}.empty-stickers{text-align:center;color:#7d8495;place-content:center;height:180px;display:grid}.empty-stickers svg{margin:auto}.empty-stickers p{font-size:11px}.toast,.sent-toast{z-index:30;color:#fff;background:#172658;border:2px solid #fff;align-items:center;gap:8px;display:flex;position:fixed;box-shadow:0 0 0 2px #172658,4px 4px #0003}.toast{padding:9px 13px;font-size:10px;bottom:85px;left:50%;transform:translate(-50%)}.sent-toast{padding:12px 16px;bottom:25px;right:25px}.sent-toast div{flex-direction:column;display:flex}.sent-toast b{font-size:12px}.sent-toast small{color:#cbd7ff;font-size:9px}.mobile-nav,.mobile-inbox{display:none}.reveal-overlay{z-index:50;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0d1330d1;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.sealed-card{text-align:center;background:#fffdf0;border:2px solid #7886ac;width:min(380px,100%);padding:35px;position:relative;box-shadow:inset 0 0 0 4px #fff,7px 7px #111832}.sealed-card .avatar{margin:0 auto 13px}.sealed-card h2{color:#182653;margin:4px 0 19px;font-size:28px}.sealed-card p{color:#68718b;font-size:11px;line-height:1.5}.overlay-close{background:#e7eaf3;border:1px solid #9aa5bd;place-items:center;width:27px;height:27px;display:grid;position:absolute;top:8px;right:8px}.sealed-icon{color:#244ea8;background:#dce6ff;border:2px solid #213d82;border-radius:50%;place-items:center;width:65px;height:65px;margin:auto;display:grid}.hold-button{color:#fff;background:linear-gradient(#5b8cea,#2458c7);border:1px solid #173b97;align-items:center;gap:8px;margin-top:10px;padding:11px 20px;font-weight:900;display:inline-flex;box-shadow:2px 2px #8792aa}.viewing-card{background:#13152d;border:2px solid #fff;flex-direction:column;width:min(520px,100%);height:min(640px,82vh);padding:14px;display:flex;position:relative;box-shadow:0 0 0 3px #1c2857,8px 8px #080b19}.timer{color:#fff;align-items:center;gap:9px;height:23px;font:10px DM Mono;display:flex}.timer>span{background:linear-gradient(90deg,#ff5278 var(--progress),#4f5369 var(--progress));flex:1;height:5px;transition:all .3s}.received-doodle{text-align:center;color:#315ab4;background-color:#fff8c9;background-image:linear-gradient(#e4ddb0 1px,#0000 1px),linear-gradient(90deg,#e4ddb0 1px,#0000 1px);background-position:0 0;background-repeat:repeat;background-size:20px 20px;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;flex:1;place-content:center;display:grid;position:relative;overflow:hidden}.received-doodle strong{font:900 clamp(30px,7vw,52px)/.9 Nunito;transform:rotate(-5deg)}.received-doodle .sun{color:#f3a816;font-size:65px;position:absolute;top:12%;left:12%}.received-doodle .tree{color:#57a44f;font-size:160px;position:absolute;bottom:3%;right:8%;transform:scaleX(.75)}.received-doodle i{color:#f25074;font:50px cursive;position:absolute;top:17%;right:20%}.view-footer{color:#fff;align-items:center;gap:8px;height:47px;font-size:10px;display:flex}.view-footer b{color:#ff7794;margin-left:auto}.release-zone{opacity:0;position:absolute;inset:0}.mobile-inbox>.inbox-panel{display:flex}.sent-toast{animation:.25s ease-out slidein}.auth-loading,.login-page{place-items:center;width:100vw;height:100dvh;display:grid}.auth-loading{color:#223f8d;align-content:center;gap:12px;font:800 11px DM Mono}.auth-loading .tiny-logo{width:48px;height:48px;font-size:17px}.auth-loading i{background:repeating-linear-gradient(90deg,#3c70dc 0 15px,#dce5fb 15px 22px);border:1px solid #6679aa;width:170px;height:8px;animation:.7s steps(4,end) infinite dial}.login-page{background:radial-gradient(circle at 50% 10%,#fff 0,#0000 35%),linear-gradient(135deg,#c7d7f6,#eadff5);padding:20px}.login-window{text-align:center;background:#fffdf0;border:2px solid #7586b5;width:min(430px,100%);padding:55px 38px 33px;position:relative;box-shadow:inset 0 0 0 4px #fff,7px 7px #697493}.login-title{color:#fff;text-align:left;text-shadow:1px 1px #174090;background:linear-gradient(#438bf2,#1655ca);align-items:center;gap:8px;height:34px;padding:0 7px;font-size:12px;display:flex;position:absolute;top:0;left:0;right:0}.login-window>img{object-fit:contain;width:155px;height:155px;image-rendering:pixelated}.login-window h1{letter-spacing:-1.5px;color:#182653;margin:5px 0;font-size:34px}.login-window p{color:#65708b;max-width:330px;margin:0 auto 20px;font-size:12px;line-height:1.5}.sso-button{color:#fff;background:linear-gradient(#5b8cea,#2458c7);border:1px solid #173b97;justify-content:center;align-items:center;gap:8px;padding:12px 16px;font-weight:900;text-decoration:none;display:flex;box-shadow:inset 0 0 0 1px #83a9f0,2px 2px #8e97ac}.login-window>small{color:#81889b;margin-top:15px;font:9px DM Mono;display:block}@keyframes slidein{0%{opacity:0;transform:translateY(20px)}}@keyframes dial{to{background-position:22px 0}}@media (width<=720px){body{overflow:hidden}.desktop-shell{grid-template-rows:1fr 65px}.titlebar{display:none}.app-body{min-height:0;display:block}.app-body>.inbox-panel{display:none}.content-area{height:100%}.status-ribbon{height:28px;padding:0 10px}.status-ribbon span:nth-of-type(2),.status-ribbon svg:nth-of-type(2),.status-ribbon i{display:none}.status-ribbon .pin-state{font-size:8px}.composer{height:100%;padding:14px 12px 8px}.composer-heading{margin-bottom:12px}.composer-heading h1{font-size:28px}.composer-heading p{display:none}.recipient{padding-right:6px}.recipient span{font-size:0}.recipient span b{font-size:10px}.mode-tabs{padding-left:0}.mode-tabs button{flex:1;justify-content:center;padding:8px 10px;font-size:10px}.mode-tabs button span{display:none}.tool-row{gap:8px}.swatches{gap:4px}.swatches button{width:18px;height:18px}.brush-size{margin-left:auto}.brush-size input{width:50px}.brush-size span{display:none}.clear-btn{margin-left:0;font-size:0}.canvas-wrap{min-height:250px}.canvas-hint span{text-align:center;max-width:150px;line-height:1.4}.send-strip{height:61px}.privacy-pill small{display:none}.send-button{min-width:145px;padding:10px}.mobile-nav{height:65px;padding-bottom:env(safe-area-inset-bottom);z-index:20;background:#e4e8f4;border-top:1px solid #919dbc;grid-template-columns:1fr 86px 1fr;align-items:center;display:grid;box-shadow:0 -1px #fff}.mobile-nav button{color:#6d7690;background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;gap:1px;height:52px;font-size:9px;font-weight:800;display:flex;position:relative}.mobile-nav button.active{color:#244da5}.mobile-nav button b{color:#fff;background:#f44f76;border-radius:50%;place-items:center;width:15px;height:15px;margin-left:24px;font:8px DM Mono;display:grid;position:absolute;top:5px}.mobile-nav .make-nav{color:#fff;background:linear-gradient(#5b8cea,#2458c7);border:2px solid #fff;border-radius:50%;justify-self:center;width:56px;height:56px;transform:translateY(-12px);box-shadow:0 0 0 2px #1c449e,2px 3px #8e98b0}.mobile-inbox{height:100%;display:block}.mobile-inbox .inbox-panel{border-right:0;height:100%}.mobile-inbox .buddy-ad{margin-top:auto}.piano-card{min-height:290px;padding:13px}.piano{height:150px}.sticker-drawer{padding:12px}.builtins button{width:58px;height:58px}.sent-toast{bottom:80px;left:14px;right:14px}.viewing-card{height:75vh}.reveal-overlay{padding:14px}.sealed-card{padding:30px 20px}.toast{white-space:nowrap;bottom:82px}}@media (width>=721px) and (height<=650px){.composer{padding-top:16px}.composer-heading{margin-bottom:10px}.composer-heading p{display:none}.canvas-wrap{min-height:180px}.buddy-ad{display:none}}.piano-mode{flex:1;min-height:0;display:flex}.piano-mode[hidden]{display:none}.piano-card{gap:12px;min-height:0;padding:16px 18px 12px;overflow:auto}.piano-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.piano-copy span{align-items:center;gap:8px;font-size:17px;font-weight:900;display:flex}.piano-copy small{color:#7a8194;margin-top:3px;font:9px DM Mono;display:block}.piano-transport,.sample-controls{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.piano-transport button,.sample-controls button{cursor:pointer;background:linear-gradient(#fff,#dce3f5);border:1px solid #7f8caf;justify-content:center;align-items:center;gap:5px;min-height:30px;padding:5px 9px;font:800 9px DM Mono;display:flex;box-shadow:1px 1px #8e96aa}.piano-transport button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.piano-timeline{background:#fff;border:1px inset #aeb7cb;padding:7px 8px 8px}.timeline-ruler{color:#7d8598;justify-content:space-between;align-items:flex-start;height:15px;font:8px DM Mono;display:flex}.timeline-ruler b{color:#53658f;text-transform:uppercase;letter-spacing:.7px}.timeline-track{background-color:#f8f7ee;background-image:linear-gradient(90deg,#5b6f9e2b 1px,#0000 1px),linear-gradient(#5b6f9e17 1px,#0000 1px);background-size:25% 100%,100% 12px;border:1px solid #c3c8d5;height:48px;position:relative;overflow:hidden}.timeline-track em{color:#a0a6b4;place-items:center;font:9px DM Mono;display:grid;position:absolute;inset:0}.timeline-track i{top:calc(3px + var(--note-row) * 2px);color:#163978;white-space:nowrap;z-index:1;background:linear-gradient(#a9c7ff,#729eea);border:1px solid #315cb8;border-radius:2px;min-width:5px;height:17px;padding:0 3px;font:800 7px/15px DM Mono;position:absolute;overflow:hidden}.timeline-playhead{z-index:2;pointer-events:none;background:#f24f76;width:2px;position:absolute;top:0;bottom:0;transform:translate(-1px);box-shadow:1px 0 #fff}.timeline-playhead.moving:before{content:"";border-top:6px solid #f24f76;border-left:4px solid #0000;border-right:4px solid #0000;position:absolute;top:0;left:-3px}.sample-lab{background:linear-gradient(105deg,#eee3ff,#fff9d7);border:1px solid #9a8ab6;grid-template-columns:minmax(210px,1fr) auto;align-items:center;gap:5px 14px;padding:8px 10px;display:grid;box-shadow:inset 0 0 0 2px #ffffffb3}.sample-lab-copy{color:#4e3d7d;align-items:center;gap:8px;display:flex}.sample-lab-copy>span{flex-direction:column;display:flex}.sample-lab-copy b{font-size:10px}.sample-lab-copy small{color:#77738a;font:8px/1.35 DM Mono}.sample-controls button.recording{color:#fff;background:linear-gradient(#ff9daf,#ee4d6e);border-color:#a72f4a;animation:.8s steps(2,end) infinite piano-pulse}.sample-controls button.selected{color:#234d1c;background:linear-gradient(#c3f288,#82cb41);border-color:#4c8b25}.sample-controls .sample-discard{color:#a83e58;padding:5px 7px}.sample-status{color:#6d7181;grid-column:1/-1;margin:0;font:8px/1.35 DM Mono}.sample-status b{color:#603597}.sample-status.listening{color:#c33556}.sample-status.listening i{background:#ef4269;border-radius:50%;width:7px;height:7px;margin-right:5px;display:inline-block}.sample-status.success{color:#42752d}.sample-status.error{color:#9a3c50}.shortcut-strip{color:#69738d;justify-content:center;align-items:center;gap:5px;min-height:25px;font:8px DM Mono;display:flex}.shortcut-strip span{margin-right:2px}.shortcut-strip button{background:linear-gradient(#fff,#e3e7f1);border:1px solid #99a3b9;padding:3px 6px;font:800 8px DM Mono;box-shadow:1px 1px #a8aec0}.shortcut-strip button.selected{color:#24488f;background:linear-gradient(#dce8ff,#b8cdf5);border-color:#4f6fae}.shortcut-strip small{color:#747d93;margin-left:3px;font:7px DM Mono}.piano-key kbd{color:#5e6880;white-space:nowrap;background:#f5f6fa;border:1px solid #99a3b9;border-bottom-width:2px;border-radius:2px;padding:1px 2px;font:700 7px DM Mono;box-shadow:0 1px #fff}.piano-card .piano{touch-action:none;-webkit-user-select:none;user-select:none;flex:0 0 145px;width:100%;max-width:none;height:145px;margin:0 auto;padding:0;display:flex;position:relative}.piano-card .piano-key{touch-action:none;-webkit-user-select:none;user-select:none}.piano-card .white-key{flex:0 0 var(--white-key-width);z-index:1;background:linear-gradient(90deg,#e9eadf,#fff 18% 72%,#d6d8d0);border:1px solid #687188;border-radius:0 0 3px 3px;min-width:0;max-width:none;height:139px;position:relative;box-shadow:inset 0 -7px #e7e8df,1px 3px #73798a}.piano-card .black-key{left:var(--black-key-left);width:var(--black-key-width);z-index:3;color:#fff;background:linear-gradient(90deg,#101426,#414a67 60%,#101322);border:1px solid #050817;border-radius:0 0 3px 3px;height:88px;position:absolute;top:0;box-shadow:inset 0 -6px #0a0d19,1px 3px #858a99}.piano-card .shortcut-key{background-color:#eef4ff}.piano-card .white-key.shortcut-key{background:linear-gradient(90deg,#dce7ff,#fff 22% 72%,#ccd9ef)}.piano-card .piano-key.pressed{filter:brightness(.9);transform:translateY(3px);box-shadow:inset 0 -3px #00000038}.piano-card .piano-key>span{color:#56617c;font:800 9px DM Mono;position:absolute;bottom:22px;left:0;right:0}.piano-card .black-key>span{color:#dce2f6;font-size:7px;bottom:19px}.piano-card .piano-key>kbd{position:absolute;bottom:5px;left:50%;transform:translate(-50%)}.piano-card .black-key>kbd{color:#eef1ff;background:#303952;border-color:#66708c}@keyframes piano-pulse{50%{filter:brightness(1.2)}}@media (width<=720px){.piano-card{gap:8px;padding:10px;overflow:auto}.piano-header{align-items:flex-start}.piano-copy span{font-size:14px}.piano-transport button span{display:none}.piano-transport button{width:31px;padding:4px}.piano-timeline{padding:5px}.timeline-track{height:42px}.timeline-track i{top:calc(2px + var(--note-row) * 1.7px);height:15px;line-height:13px}.sample-lab{grid-template-columns:1fr;gap:6px;padding:7px}.sample-controls{justify-content:flex-start}.sample-lab-copy small{font-size:7px}.shortcut-strip{display:none}.piano-card .piano{flex-basis:124px;height:124px}.piano-card .piano-key.desktop-key{display:none}.piano-card .white-key{flex-basis:12.5%;height:118px}.piano-card .black-key{left:var(--mobile-key-left);width:8.5%;height:74px}}@media (width>=721px) and (height<=760px){.piano-card{gap:7px;padding:10px 14px}.piano-card .piano{flex-basis:112px;height:112px}.piano-card .white-key{height:107px}.piano-card .black-key{height:68px}.sample-lab{padding:6px 9px}.piano-timeline{padding-block:4px}.timeline-track{height:36px}.shortcut-strip{height:16px}}.send-button:disabled{filter:grayscale(.5);cursor:not-allowed;opacity:.6}.send-button[aria-label^=Sending\ to]{cursor:wait;opacity:.75}.sent-toast.error{background:#681f3a;box-shadow:0 0 0 2px #681f3a,4px 4px #0003}.recipient-picker{position:relative}.recipient:disabled{opacity:.65}.recipient-menu{z-index:12;background:#eef1fb;border:1px solid #7f8db5;width:230px;padding:5px;position:absolute;top:calc(100% + 5px);right:0;box-shadow:inset 0 0 0 2px #fff,3px 3px #8f98ae}.recipient-menu>button{text-align:left;background:0 0;border:1px solid #0000;align-items:center;gap:8px;width:100%;padding:6px;display:flex}.recipient-menu>button:hover{background:#fff;border-color:#9cadd4}.recipient-menu>button>span{flex-direction:column;min-width:0;display:flex}.recipient-menu b,.recipient-menu small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.recipient-menu b{font-size:10px}.recipient-menu small{color:#747d94;font-size:8px}.no-buddies{color:#7c8498;text-align:center;border:1px dashed #a8b1ca;justify-items:center;gap:4px;margin:18px 8px;padding:18px 12px;display:grid}.no-buddies b{font-size:11px}.no-buddies span{font-size:9px;line-height:1.4}.received-image,.received-piano{background:#fff9d2;flex:1;place-items:center;min-height:0;display:grid;overflow:hidden}.received-image img{object-fit:contain;image-rendering:auto;width:100%;height:100%}.received-image.sticker img{width:70%;height:70%}.received-piano{color:#273f8d;text-align:center;background:radial-gradient(circle at 50% 20%,#f1e4ff,#fff9d2);align-content:center;gap:9px;padding:24px}.received-piano h3{margin:0;font-size:25px}.received-piano p{color:#69718a;margin:0;font:9px DM Mono}.received-note-row{flex-wrap:wrap;justify-content:center;gap:5px;max-width:100%;display:flex}.received-note-row i{background:#dce7ff;border:1px solid #829bd2;padding:4px 6px;font:8px DM Mono}.received-piano button{color:#fff;background:linear-gradient(#5b8cea,#2458c7);border:1px solid #173b97;align-items:center;gap:7px;padding:9px 18px;font-weight:900;display:flex;box-shadow:2px 2px #8792aa}@media (width<=720px) and (height<=650px){.canvas-wrap{min-height:155px}.send-strip{flex:0 0 61px}.composer-heading{margin-bottom:7px}}.favorite-colors{position:relative}.favorite-colors .swatches button{touch-action:manipulation;-webkit-user-select:none;user-select:none}.color-picker-popover{z-index:15;background:#fffdf0;border:1px solid #6f7da5;grid-template-columns:32px minmax(90px,1fr) auto auto;align-items:center;gap:6px;width:max-content;max-width:min(330px,100vw - 28px);padding:7px;display:grid;position:absolute;top:calc(100% + 8px);left:0;box-shadow:inset 0 0 0 2px #fff,3px 3px #8f98ae}.color-picker-popover:before{content:"";background:#fffdf0;border-top:1px solid #6f7da5;border-left:1px solid #6f7da5;width:11px;height:11px;position:absolute;top:-7px;left:14px;transform:rotate(45deg)}.color-picker-popover label{color:#606b86;flex-direction:column;gap:2px;font:8px DM Mono;display:flex}.color-picker-popover input[type=color]{background:#fff;border:1px solid #8b96b2;width:64px;height:25px;padding:1px}.picker-preview{background:var(--swatch);border:2px solid #fff;border-radius:50%;width:29px;height:29px;box-shadow:0 0 0 1px #7d88a3}.color-picker-popover button{background:linear-gradient(#fff,#dce3f5);border:1px solid #8190b3;height:27px;padding:4px 7px;font:800 8px DM Mono}@media (width<=720px){.favorite-colors{flex:1 0 100%}.favorite-colors .swatches{width:100%}.color-picker-popover{grid-template-columns:34px 1fr auto auto;width:auto;max-width:none;padding:10px;position:fixed;inset:auto 12px 78px}.color-picker-popover:before{display:none}.color-picker-popover input[type=color]{width:80px;height:32px}.color-picker-popover button{min-height:38px;padding-inline:10px}}.recipient.self{background:linear-gradient(#fff6cf,#f2d798);border-color:#c37737}.recipient-menu>button.selected{background:#fff;border-color:#5478c8}.send-button span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.send-button.send-self{text-shadow:1px 1px #743014;background:linear-gradient(#ef9f3e,#c55a24 52%,#9f3e1c);border-color:#8d4817;box-shadow:inset 0 0 0 1px #ffd38e,2px 2px #9fa8bd}@media (width<=720px){.send-button{max-width:58vw}}.doodle-mode{flex-direction:column;flex:1;min-height:0;display:flex}.doodle-mode[hidden],.drum-mode[hidden],.sticker-drawer[hidden],.composer[hidden],.app-body[hidden],.mobile-nav[hidden],.buddy-directory-page[hidden],.mobile-inbox[hidden],.desktop-shell[hidden]{display:none!important}.buddy-directory-page{height:100%;min-height:0}.contact-list{min-height:0;overflow-y:auto}.canvas-actions button:disabled,.clear-btn:disabled{opacity:.42;cursor:not-allowed}.notify-action:disabled{opacity:.55;cursor:wait}@media (width<=720px){.content-area{padding-top:env(safe-area-inset-top)}.mode-tabs button,.recipient,.sample-controls button{min-height:44px}.favorite-colors .swatches button{width:36px!important;height:36px!important}.piano-card .piano{order:1}.piano-timeline{order:2}.sample-lab{order:3}.shortcut-strip{order:4}.piano-transport button{min-height:40px;min-width:40px!important}.overlay-close{width:44px;height:44px}.color-picker-popover button{min-height:44px}}.piano-transport button.selected{color:#234d1c;background:linear-gradient(#c3f288,#82cb41);border-color:#4c8b25}.timeline-ruler{gap:6px}.timeline-ruler b{margin-left:auto}.timeline-ruler button{color:#315cb8;cursor:pointer;background:0 0;border:0;padding:0;font:800 7px DM Mono;text-decoration:underline}.timeline-track{touch-action:none;cursor:ew-resize}.timeline-track i{pointer-events:none;transition:opacity .12s,filter .12s}.timeline-track i.trimmed-out{opacity:.28;filter:grayscale(.85)}.timeline-track i.selected{opacity:1}.timeline-selection{z-index:0;pointer-events:none;background:#4b77da29;border-left:3px solid #315cb8;border-right:3px solid #315cb8;min-width:5px;position:absolute;top:0;bottom:0;box-shadow:inset 0 0 0 1px #fffc}.timeline-selection:before,.timeline-selection:after{content:"";background:#fff;border:1px solid #315cb8;width:7px;height:20px;position:absolute;top:50%;transform:translateY(-50%);box-shadow:1px 1px #8f98ae}.timeline-selection:before{left:-5px}.timeline-selection:after{right:-5px}.timeline-help{color:#69738d;margin:4px 0 -2px;font:7px/1.3 DM Mono}.piano-card .piano-key{overscroll-behavior:none}.buddy-ad{min-height:118px}.buddy-ad p{min-height:30px}.peep-actions{flex-wrap:wrap;gap:4px;display:flex}.buddy-ad .peep-actions button{white-space:nowrap;padding:4px 5px}@media (width<=720px){.timeline-help{font-size:6px}.buddy-ad .peep-actions{flex-wrap:nowrap}.buddy-ad .peep-actions button{flex:1;min-width:0;min-height:40px}}.doodle-mode,.doodle-mode *,.piano-mode,.piano-mode *,.drum-mode,.drum-mode *{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.canvas-wrap,.canvas-wrap canvas,.piano-card,.piano-card .piano-key,.drum-card,.drum-pad{-webkit-tap-highlight-color:transparent}.piano-card .piano{cursor:crosshair}.eraser-btn{background:linear-gradient(#fff,#e1e5ef);border:1px solid #8996b4;align-items:center;gap:4px;padding:5px 7px;font:800 9px Nunito;display:flex;box-shadow:1px 1px #9da5b7}.eraser-btn.selected{color:#6f1830;background:linear-gradient(#ffd6df,#f58ba3);border-color:#af4761}.canvas-wrap canvas{cursor:crosshair}.doodle-mode:has(.eraser-btn.selected) .canvas-wrap canvas{cursor:cell}@media (width<=720px){.eraser-btn{justify-content:center;min-width:44px;min-height:44px;font-size:0}}.drum-mode{flex:1;min-height:0;display:flex}.drum-card{background:linear-gradient(145deg,#e8e2fa,#fff9d7);border:1px solid #727d9c;flex-direction:column;flex:1;gap:8px;min-height:0;padding:12px 14px 10px;display:flex;overflow:auto;box-shadow:inset 0 0 0 3px #fff,3px 3px #ccd1df}.drum-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.drum-copy span{color:#182653;align-items:center;gap:8px;font-size:17px;font-weight:950;display:flex}.drum-copy small{color:#747d93;margin-top:2px;font:8px DM Mono;display:block}.drum-timeline{flex:none}.drum-track{height:35px}.drum-track>i{background:linear-gradient(#ffdb64,#ef764e);border-color:#9c442c;border-radius:50% 50% 3px 3px;width:7px;min-width:7px;height:15px;padding:0}.drum-kit{touch-action:none;background-color:#171a20;background-image:repeating-linear-gradient(135deg,#ffffff09 0 2px,#0000 2px 7px),radial-gradient(circle at 50% 95%,#343943,#101217 68%);border:2px solid #111829;flex:1;min-height:220px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 3px #535968,3px 3px #8991a4}.drum-pad{left:var(--x);top:var(--y);width:var(--w);height:var(--h);z-index:var(--z);touch-action:none;cursor:crosshair;color:#06142b;text-shadow:1px 1px #ffffff61;padding:0;transition:filter 50ms,transform 50ms;position:absolute;overflow:hidden}.drum-pad span{letter-spacing:-.5px;font:950 clamp(7px,1.1vw,13px)/1 DM Mono;position:absolute;bottom:18%;left:5%;right:5%;transform:rotate(-7deg)}.drum-pad kbd{background:#ffffffb3;border:1px solid #101b2d8c;min-width:18px;padding:2px 3px;font:900 7px DM Mono;position:absolute;top:12%;right:9%;box-shadow:1px 1px #00000059}.drum-pad.cymbal,.drum-pad.hat{background:radial-gradient(circle at 51% 48%,#3a2b22 0 3%,#edd591 4% 7%,#b46b31 8% 9%,#f8d697 10% 21%,#b7652d 22% 23%,#ffc78a 24% 43%,#bb6939 44% 46%,#f4b56f 47% 65%,#9d5229 66% 68%,#edb066 69% 100%);border:2px solid #7a4721;border-radius:50%;box-shadow:inset 0 0 14px #fff7b9cc,3px 5px 2px #000000a6}.drum-pad.hat{background:radial-gradient(circle at 52% 49%,#372419 0 4%,#f9cf7e 5% 11%,#ae5d2d 12% 15%,#edac61 16% 45%,#93471f 46% 49%,#efae64 50%);border-color:#68371f}.drum-pad.drum{color:#c5fbff;text-shadow:1px 1px #043f48;background:radial-gradient(at 45% 35%,#68645b,#3a3935 68%,#202228 71%);border:7px solid #0094a5;border-radius:50%;box-shadow:0 0 0 3px #adb4bc,0 0 0 6px #282d34,4px 7px 3px #000000b8}.drum-pad.snare{color:#006d7a;background:radial-gradient(at 48% 42%,#e5e3d8,#aaa9a3 69%,#696d73 71%)}.drum-pad.kick{color:#007c8b;z-index:2;background:radial-gradient(circle,#ecebe4 0 48%,#aeb5b7 49% 55%,#2e333a 56%);border-color:#d9dedf}.drum-pad.kick span{font-size:clamp(10px,1.7vw,18px)}.drum-pad.hit{filter:brightness(1.35)saturate(1.25);transform:scale(.96);box-shadow:0 0 0 3px #fff36a,0 0 18px #fff36a}.drum-pad:focus-visible{outline-offset:-4px;outline:4px solid #fff36a}.received-drums{color:#d9faff;text-align:center;background:repeating-linear-gradient(135deg,#ffffff09 0 2px,#0000 2px 7px),radial-gradient(circle at 50% 22%,#126d79,#15192b 66%);flex:1;place-content:center;justify-items:center;gap:9px;min-height:0;padding:24px;display:grid}.received-drums h3{margin:0;font-size:25px}.received-drums p{color:#c0cad8;margin:0;font:9px DM Mono}.received-drum-row{flex-wrap:wrap;justify-content:center;gap:4px;max-width:100%;display:flex}.received-drum-row i{color:#3b271d;background:#f4bb65;border:1px solid #7d4827;padding:4px 5px;font:7px DM Mono;transform:rotate(-2deg)}.received-drum-row i:nth-child(2n){background:#61c6cd;transform:rotate(2deg)}.received-drums button{color:#20150f;background:linear-gradient(#ffd878,#cf6d31);border:1px solid #603613;align-items:center;gap:7px;padding:9px 18px;font-weight:950;display:flex;box-shadow:2px 2px #070a12}.drum-copy .drum-notice{color:#ad3456;font-weight:800}@media (width<=720px){.mode-tabs button{gap:4px;padding-inline:4px}.drum-card{gap:6px;padding:8px}.drum-header{align-items:flex-start}.drum-copy span{font-size:14px}.drum-copy small{max-width:180px;font-size:7px}.drum-kit{min-height:245px}.drum-pad span{font-size:6px}.drum-pad kbd{display:none}.drum-pad.drum{border-width:5px}.drum-timeline .timeline-help{margin-top:2px}}@media (width>=721px) and (height<=760px){.drum-card{gap:6px;padding:8px 11px}.drum-kit{min-height:190px}.drum-track{height:29px}.drum-copy small{display:none}}@media (width<=720px) and (height<=650px){.drum-card{gap:4px}.drum-header{align-items:center}.drum-copy{flex:0 0 78px}.drum-copy span{font-size:11px}.drum-copy small{display:none}.drum-header .piano-transport{flex-wrap:nowrap;gap:3px}.drum-header .piano-transport button{height:44px;width:44px!important;min-width:44px!important}.drum-kit{min-height:145px}.drum-pad{min-width:44px;min-height:44px}.drum-track{height:28px}.drum-timeline .timeline-help{display:none}}.music-mode{flex:1;min-height:0;display:flex}.music-mode[hidden]{display:none!important}.studio-card{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;background:linear-gradient(145deg,#e9e3fa,#fff9d7);border:1px solid #727d9c;flex-direction:column;flex:1;gap:7px;min-height:0;padding:10px 12px 8px;display:flex;position:relative;overflow:auto;box-shadow:inset 0 0 0 3px #fff,3px 3px #ccd1df}.studio-master{justify-content:space-between;align-items:center;gap:10px;display:flex}.studio-master>div:first-child>span{color:#182653;align-items:center;gap:7px;font-size:17px;font-weight:950;display:flex}.studio-master>div:first-child>small{color:#727a91;margin-top:2px;font:8px DM Mono;display:block}.studio-master-actions{align-items:center;gap:5px;display:flex}.studio-master-actions button,.studio-master-actions label{background:linear-gradient(#fff,#dce3f5);border:1px solid #7f8caf;justify-content:center;align-items:center;gap:5px;min-height:34px;padding:5px 8px;font:800 8px DM Mono;display:flex;box-shadow:1px 1px #8e96aa}.studio-master-actions button:disabled{opacity:.45}.studio-master-actions label input{background:#fff;border:1px inset #9ba6bc;width:35px;padding:3px;font:9px DM Mono}.studio-tracks{gap:3px;display:grid}.studio-track{background:#ffffff94;border:1px solid #aab2c5;grid-template-columns:130px 1fr 34px 34px;align-items:center;gap:4px;min-height:42px;padding:3px;display:grid}.studio-track.selected{background:#f5f8ff;border-color:#476cc1;box-shadow:inset 3px 0 #476cc1}.studio-track.muted{opacity:.55}.track-select{text-align:left;background:0 0;border:0;align-items:center;gap:7px;height:34px;display:flex}.track-select>span{flex-direction:column;display:flex}.track-select b{font-size:10px}.track-select small{color:#737b90;font:7px DM Mono}.track-lane{background-color:#fffdf4;background-image:linear-gradient(90deg,#4b619126 1px,#0000 1px);background-size:12.5% 100%;border:1px inset #b8c0d1;height:27px;position:relative;overflow:hidden}.track-lane i{background:#7da5ee;border:1px solid #3159a8;min-width:3px;height:13px;position:absolute;top:6px}.track-lane i.hit{background:#ef8e4e;border-color:#9b4529;border-radius:50%;width:6px}.track-lane i.clip{background:#b76ed3;border-color:#703b8d}.track-lane em{z-index:4;background:#ef4c73;width:2px;position:absolute;top:0;bottom:0}.track-icon{background:linear-gradient(#fff,#dde3f0);border:1px solid #8c98b4;place-items:center;width:34px;height:34px;display:grid}.track-icon.armed{color:#fff;background:#f16a82;border-color:#a93652}.studio-surface{background:#161923;border:2px solid #1c2745;flex:1;min-height:155px;position:relative;overflow:hidden}.sound-catalogue{background:#e5e9f5;border-bottom:1px solid #7986a8;align-items:center;gap:4px;min-height:37px;padding:4px 6px;display:flex;overflow-x:auto}.sound-catalogue button{background:linear-gradient(#fff,#dce2f1);border:1px solid #8a96b4;flex:none;align-items:center;gap:4px;min-height:28px;padding:4px 7px;font:800 8px DM Mono;display:flex}.sound-catalogue button.selected{background:linear-gradient(#c7f09c,#82ca4d);border-color:#4c8a2a}.sound-catalogue button.recording,.vocal-surface button.recording{color:#fff;background:#ed5575}.studio-piano{touch-action:none;background:#202432;height:calc(100% - 37px);min-height:145px;display:flex;position:relative}.studio-piano-key{touch-action:none;padding:0;position:relative}.studio-piano-key.white{flex:0 0 var(--white-width);z-index:1;background:linear-gradient(90deg,#e7e8df,#fff 20% 72%,#d5d7cf);border:1px solid #697187;height:100%;box-shadow:inset 0 -7px #e4e6dd}.studio-piano-key.black{left:var(--black-left);width:var(--black-width);z-index:3;color:#fff;background:linear-gradient(90deg,#0f1325,#3f4865 60%,#0d1120);border:1px solid #050817;height:63%;position:absolute;top:0}.studio-piano-key.pressed{filter:brightness(.75);transform:translateY(3px)}.studio-piano-key span{font:800 7px DM Mono;position:absolute;bottom:21px;left:0;right:0}.studio-piano-key kbd{background:#f5f6fa;border:1px solid #919ab0;padding:1px 2px;font:700 6px DM Mono;position:absolute;bottom:5px;left:50%;transform:translate(-50%)}.studio-piano-key.black kbd{color:#fff;background:#303952;border-color:#68718b}.studio-drum-kit{touch-action:none;background-color:#171a20;background-image:repeating-linear-gradient(135deg,#ffffff09 0 2px,#0000 2px 7px),radial-gradient(circle at 50% 95%,#343943,#101217 68%);position:absolute;inset:0;overflow:hidden}.vocal-surface{color:#fff;background:radial-gradient(circle at 25% 45%,#653a84,#17192b 58%);justify-content:center;align-items:center;gap:25px;height:100%;padding:20px;display:flex}.vocal-orb{background:radial-gradient(circle,#f39aba,#a53f75 55%,#422855 57%);border-radius:50%;flex:none;place-items:center;width:105px;height:105px;display:grid;position:relative;box-shadow:0 0 0 4px #d1b3e6,0 0 25px #c65c9c}.vocal-orb i{border:1px solid #ffffff80;border-radius:50%;position:absolute;inset:13px}.vocal-orb i:nth-of-type(2){inset:24px}.vocal-orb i:nth-of-type(3){inset:35px}.vocal-orb.recording{animation:.7s steps(2,end) infinite piano-pulse}.vocal-surface h3{margin:0;font-size:20px}.vocal-surface p{color:#d4c9df;max-width:430px;font-size:10px;line-height:1.4}.vocal-surface button{color:#fff;background:linear-gradient(#ff9db2,#e45174);border:1px solid #71304d;align-items:center;gap:6px;padding:9px 14px;font-weight:900;display:flex}.studio-library{z-index:12;background:#fffdf0;border:1px solid #69789e;width:min(360px,100% - 24px);max-height:70%;padding:9px;position:absolute;top:53px;right:12px;overflow:auto;box-shadow:inset 0 0 0 3px #fff,4px 4px #737d96}.studio-library>div{justify-content:space-between;align-items:center;padding:4px;display:flex}.studio-library>div b{font-size:11px}.studio-library>div small{color:#717a91;font:7px DM Mono}.studio-library>button{text-align:left;background:#f4f6fc;border:1px solid #abb4ca;align-items:center;gap:7px;width:100%;margin-top:4px;padding:7px;display:flex}.studio-library>button span{flex-direction:column;display:flex}.studio-library>button b{font-size:9px}.studio-library>button small{color:#777f93;font:7px DM Mono}.studio-library p{color:#777f93;font:9px DM Mono}.studio-status{color:#69738a;align-items:center;gap:9px;min-height:21px;font:8px DM Mono;display:flex}.studio-status span{color:#fff;background:#263c78;padding:3px 6px}.studio-status b{font-weight:500}.studio-card button{cursor:pointer}@media (width<=720px){.studio-card{gap:5px;padding:7px}.studio-master>div:first-child>small{display:none}.studio-master>div:first-child>span{font-size:13px}.studio-master-actions{gap:3px}.studio-master-actions button{min-width:44px;min-height:44px;padding:4px}.studio-master-actions button span{display:none}.studio-master-actions label{min-height:44px;padding:4px}.studio-track{grid-template-columns:92px 1fr 44px 44px;gap:2px;min-height:48px;padding:2px}.track-select,.track-icon{height:44px;min-height:44px}.track-icon{width:44px}.studio-surface{min-height:155px}.sound-catalogue button{min-height:40px}.studio-piano{min-height:150px}.studio-piano-key.desktop-key{display:none}.studio-piano-key.white{flex-basis:12.5%}.studio-piano-key.black{left:var(--mobile-left);width:8.5%}.studio-drum-kit .drum-pad{min-width:44px;min-height:44px}.studio-drum-kit .drum-pad kbd{display:none}.vocal-surface{gap:13px;padding:12px}.vocal-orb{width:80px;height:80px}.vocal-surface h3{font-size:16px}.vocal-surface p{font-size:8px}.vocal-surface button{min-height:44px}.studio-status b{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.studio-library{width:auto;max-height:60vh;position:fixed;inset:auto 12px 76px}.music-mode{min-height:0}}@media (width<=720px) and (height<=650px){.studio-master>div:first-child{display:none}.studio-tracks{grid-template-columns:repeat(3,1fr)}.studio-track{grid-template-columns:1fr 34px 34px;min-height:40px}.studio-track .track-lane{display:none}.studio-track .track-select{height:38px;min-height:38px}.studio-track .track-icon{width:34px;height:38px;min-height:38px}.studio-surface{min-height:145px}.studio-status,.vocal-surface p{display:none}}.received-studio{text-align:center;color:#172038;background:linear-gradient(135deg,#f8f0ff,#d9f5ee);border:3px outset #d8d8d8;align-content:center;place-items:center;gap:12px;width:min(540px,82vw);min-height:320px;padding:28px 24px;display:grid;box-shadow:inset 0 0 0 2px #fff8}.received-studio>svg{color:#7542aa;filter:drop-shadow(2px 2px #fff)}.received-studio h3{margin:0;font-family:Pixelify Sans,system-ui;font-size:1.55rem}.received-studio>p{color:#5a5570;margin:0;font-size:.82rem}.received-track-summary{grid-template-columns:repeat(3,1fr);gap:6px;width:100%;display:grid}.received-track-summary span{background:#fffbd8;border:2px outset #eee;justify-content:center;align-items:center;gap:5px;min-height:44px;padding:7px;font:700 .71rem Verdana,sans-serif;display:flex}.received-track-summary span.quiet{opacity:.42;filter:grayscale()}.received-studio-actions{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.received-studio-actions button{color:#fff;background:#7456c8;border:2px outset #eee;justify-content:center;align-items:center;gap:7px;min-height:46px;padding:0 16px;font-weight:800;display:inline-flex}.received-studio-actions button.save-received{background:#267a62}.received-studio-actions button:disabled{opacity:.62}.received-studio>small[role=alert]{color:#a21e3c;font-weight:700}@media (width<=720px){.received-studio{width:min(92vw,540px);padding:22px 14px}.received-track-summary{grid-template-columns:1fr}}@media (width<=420px){.composer,.music-mode,.studio-card,.studio-master,.studio-tracks,.studio-surface{min-width:0}.composer{padding-left:8px;padding-right:8px}.studio-master{flex-wrap:wrap}.studio-master-actions{justify-content:space-between;width:100%}.studio-track{grid-template-columns:minmax(0,92px) minmax(0,1fr) 44px 44px!important;min-height:48px!important}.studio-track .track-lane{display:block!important}.studio-track .track-select,.studio-track .track-icon{height:44px!important;min-height:44px!important}.studio-track .track-icon{width:44px!important}.studio-tracks{grid-template-columns:1fr!important}.mode-tabs{padding-left:0}.mode-tabs button{min-width:0;font-size:9px}.recipient{max-width:138px}.recipient span{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.send-button{max-width:62vw}.vocal-surface{text-align:center;flex-direction:column;overflow:auto}.vocal-surface p{display:block!important}.received-studio{max-height:85vh;overflow:auto}}.track-lane{touch-action:none;cursor:crosshair}.sound-slots{overflow:visible}.sound-slots>.default-sound{height:34px}.sound-slot{background:linear-gradient(#fff,#dce2f1);border:1px solid #8a96b4;flex:72px;min-width:62px;height:34px;position:relative;box-shadow:1px 1px #8e96aa}.sound-slot.selected{background:linear-gradient(#c7f09c,#82ca4d);border-color:#4c8a2a}.sound-slot>button:first-child{text-align:left;grid-template-rows:1fr 1fr;grid-template-columns:13px 1fr;width:100%;height:100%;min-height:0!important;box-shadow:none!important;background:0 0!important;border:0!important;gap:0 3px!important;padding:2px 20px 2px 5px!important;display:grid!important}.sound-slot>button:first-child svg{grid-row:1/3;align-self:center}.sound-slot>button:first-child span{font:900 9px DM Mono}.sound-slot>button:first-child small{color:#67728e;font:6px DM Mono}.sound-slot .clear-sound-slot{color:#b13b57;background:0 0;border:0;place-items:center;width:20px;height:28px;min-height:0;padding:0;display:grid;position:absolute;top:2px;right:2px}.sound-editor-overlay{z-index:80;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);-webkit-user-select:none;user-select:none;background:#0c112bc7;place-items:center;padding:12px;display:grid;position:fixed;inset:0}.sound-editor{color:#182653;background:#f4f1ff;border:2px solid #6e7da7;width:min(760px,100%);max-height:min(760px,96dvh);overflow:auto;box-shadow:inset 0 0 0 3px #fff,8px 8px #11172d}.sound-editor>header{color:#fff;text-shadow:1px 1px #173b91;background:linear-gradient(#4e8ced,#2058c7);justify-content:space-between;align-items:center;height:39px;padding:0 7px 0 12px;display:flex}.sound-editor>header>div{flex-direction:column;display:flex}.sound-editor>header b{font:900 11px DM Mono}.sound-editor>header small{color:#dbe7ff;font:7px DM Mono}.sound-editor>header button{color:#fff;background:#d84e35;border:1px solid #fff;place-items:center;width:28px;height:28px;display:grid}.sound-editor-body{gap:10px;padding:14px;display:grid}.record-orb{color:#fff;background:radial-gradient(circle,#f7b1c4,#d04f7a 57%,#6d315a 59%);border-radius:50%;align-content:center;place-items:center;gap:3px;width:78px;height:78px;margin:auto;display:grid;box-shadow:0 0 0 4px #e1c7ee,0 0 22px #c65c9c}.record-orb span{font:700 6px DM Mono}.record-orb.recording{background:radial-gradient(circle,#ffd461,#ee4a68 58%,#70263c 60%);animation:.7s steps(2,end) infinite piano-pulse}.record-sound-button{color:#fff;background:linear-gradient(#ff9db4,#e45174);border:1px solid #97344f;justify-self:center;align-items:center;gap:6px;min-height:40px;padding:7px 13px;font-weight:900;display:flex}.waveform-pair{grid-template-columns:1fr 1fr;gap:10px;display:grid}.waveform-pair>div{gap:4px;display:grid}.waveform-pair button{background:linear-gradient(#fff,#dce3f4);border:1px solid #7d8bad;justify-self:start;align-items:center;gap:5px;padding:5px 8px;font:800 7px DM Mono;display:flex}.waveform-pair button:disabled{opacity:.45}.sound-wave{background:#111728;border:1px inset #8e9ab5;padding-top:18px;position:relative;overflow:hidden}.sound-wave>span{color:#cbd9ff;z-index:2;font:700 7px DM Mono;position:absolute;top:5px;left:6px}.sound-wave svg{background-image:linear-gradient(90deg,#ffffff14 1px,#0000 1px),linear-gradient(#ffffff0f 1px,#0000 1px);background-size:25% 100%,100% 25%;width:100%;height:84px;display:block}.sound-wave svg g{stroke:#f487a8;stroke-width:1px}.sound-wave.processed svg g{stroke:#75e0c3}.sound-wave .wave-playhead{stroke:#fff33f;stroke-width:1.5px;filter:drop-shadow(1px 0 #111)}.sound-wave>small{color:#9facd0;background:#242d4c;padding:3px 6px;font:6px DM Mono;display:block}.sound-processing{background:#fffdf3;border:1px solid #9ca8c5;flex-wrap:wrap;gap:8px 16px;padding:7px 9px;display:flex}.sound-processing legend{color:#5b6e9c;font:900 7px DM Mono}.sound-processing label{align-items:center;gap:5px;font:800 8px DM Mono;display:flex}.sound-analysis{grid-template-columns:repeat(3,1fr);gap:5px;display:grid}.sound-analysis span{text-align:center;background:#dfe6f7;border:1px solid #abb5cf;padding:6px;font:7px DM Mono}.root-correction{justify-content:center;align-items:center;gap:4px;font:800 7px DM Mono;display:flex}.root-correction span{margin-right:4px}.root-correction button{background:#eef1fa;border:1px solid #8491b0;padding:5px 9px}.root-correction button.selected{color:#183f1c;background:#84cd54;border-color:#4d8d2a}.sound-editor-error{color:#b22c4d;text-align:center;margin:0;font:800 8px DM Mono}.sound-editor>footer{background:#e1e5f1;border-top:1px solid #aeb7cc;justify-content:flex-end;gap:6px;min-height:46px;padding:7px 10px;display:flex}.sound-editor>footer button{background:linear-gradient(#fff,#d8ddec);border:1px solid #8491ad;align-items:center;gap:5px;min-height:32px;padding:5px 10px;font:800 8px DM Mono;display:flex}.sound-editor>footer .confirm-sound{color:#fff;background:linear-gradient(#77d26a,#3aa34a);border-color:#26743b}.sound-editor>footer button:disabled{opacity:.45}@media (width<=720px){.sound-catalogue.sound-slots{gap:3px;min-height:49px;padding:4px}.sound-slots>.default-sound{width:42px;min-height:42px;font-size:0}.sound-slots>.default-sound:after{content:"SYNTH";font:700 6px DM Mono}.sound-slot{min-width:48px;height:42px}.sound-slot>button:first-child{padding-right:17px!important}.sound-slot .clear-sound-slot{width:17px;height:36px}.sound-editor{max-height:94dvh}.waveform-pair{grid-template-columns:1fr}.sound-wave svg{height:63px}.sound-editor-body{gap:7px;padding:9px}.record-orb{width:62px;height:62px}.sound-editor>footer{position:sticky;bottom:0}.sound-editor>footer button{min-height:44px}.sound-processing label{min-height:32px}.root-correction button{min-height:38px}}.sound-analysis{grid-template-columns:repeat(4,1fr)}@media (width<=480px){.sound-analysis{grid-template-columns:repeat(2,1fr)}}.sound-preview-actions{flex-wrap:wrap;gap:4px;display:flex}.waveform-pair .sound-preview-actions button{margin:0}.waveform-pair button.holding{color:#fff;background:linear-gradient(#ff9db4,#e45174);border-color:#97344f;box-shadow:inset 0 0 0 2px #ffc5d4}.sound-wave .wave-loop-region{fill:#75e0c314}.sound-wave .wave-loop-marker{stroke:#75e0c3;stroke-width:.7px;stroke-dasharray:2 1;opacity:.9}