/* Memmoth UI kit: HTML recreation of the iOS app (values from the SwiftUI code). */
.mk{--bg0:#9FB0E6;--bg1:#AFB8EA;--bg2:#C8B8EE;--bg3:#E3C9EE;--bw:rgba(255,255,255,.45);--bp:rgba(247,198,228,.75);
 --ink:#1C1A33;--ink2:#4F4C6B;--ink3:#85829C;--surf:#fff;--pale:#EEF2FB;--th:#3F67A8;--dusty:#3C5A9E;--hl:.38;--fr:rgba(255,255,255,.55);--frb:rgba(255,255,255,.75);
 --sf:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue",system-ui,sans-serif;--serif:"New York",ui-serif,Georgia,serif;--mono:ui-monospace,"SF Mono",Menlo,monospace;
 font-family:var(--sf);color:var(--ink);-webkit-font-smoothing:antialiased;letter-spacing:0}
.mkp-mint{--t:#BFE3CF;--b:#9FD3B9;--i:#223F34;--i2:#2F5446}.mkp-butter{--t:#F5F2D0;--b:#EEE7B6;--i:#8E7330;--i2:#6B5720}
.mkp-rose{--t:#F6D2E2;--b:#EEBBD3;--i:#924381;--i2:#753366}.mkp-lav{--t:#E3DAF8;--b:#D0C3F1;--i:#5D4AA0;--i2:#4A3B86}
.mkp-peri{--t:#C2C1F5;--b:#B1B0EF;--i:#2E2D72;--i2:#3B3A86}.mkp-gift{--t:#F6D6E8;--b:#DCCEF4;--i:#8A4A86;--i2:#6E3A6C}
.mkp-peach{--t:#FBDCC8;--b:#F6C4A8;--i:#8A4A2B;--i2:#6E3A21}
.mkt-mint{--f:#BFE3D2;--i:#1D5A3E;--i2:#2F6B50}.mkt-butter{--f:#F2ECB4;--i:#5A470A;--i2:#6A5718}.mkt-lilac{--f:#D3D3F6;--i:#3E3488;--i2:#504596}
.mkt-peach{--f:#F4C9BC;--i:#7A3818;--i2:#7A3818}.mkt-rose{--f:#F1D2E4;--i:#7C2B4C;--i2:#7C2B4C}.mkt-sky{--f:#CFE0F5;--i:#22497D;--i2:#22497D}
.mkt-mist{--f:#EEF2FB;--i:#3C5A9E;--i2:#4F4C6B}

.mk svg{width:1em;height:1em;flex:none}

/* phone frame: the screen is laid out at 390x844 and scaled by --s */
.mkphone{--s:.8;position:relative;align-self:center;width:calc(390px*var(--s) + 20px*var(--s));height:calc(844px*var(--s) + 20px*var(--s));border-radius:calc(64px*var(--s));
 background:#0E0D16;padding:calc(10px*var(--s));box-shadow:0 0 0 1.5px #2C2A38 inset,0 40px 80px -30px rgba(30,24,80,.55),0 18px 36px -18px rgba(0,0,0,.35);flex:none}
.mkphone .mkscr{width:390px;height:844px;transform:scale(var(--s));transform-origin:0 0;border-radius:54px;overflow:hidden;position:relative}
.mkphone .di{position:absolute;z-index:30;top:calc(21px*var(--s));left:50%;width:calc(124px*var(--s));height:calc(36px*var(--s));margin-left:calc(-62px*var(--s));background:#000;border-radius:99px} .mk .mkscr.bare{border-radius:0;width:390px;height:844px;position:relative;overflow:hidden} .mk .mkscr{background:linear-gradient(180deg,var(--bg0),var(--bg1) 30%,var(--bg2) 62%,var(--bg3))} .mk .bd{position:absolute;inset:0;overflow:hidden;pointer-events:none} .mk .bd i{position:absolute;border-radius:50%} .mk .bd .b1{width:370px;height:331px;left:-99px;top:-30px;background:var(--bw);filter:blur(70px)} .mk .bd .b2{width:429px;height:390px;left:117px;top:463px;background:var(--bp);filter:blur(90px)} .mk .bd .b3{width:273px;height:234px;left:-20px;top:347px;background:var(--bw);filter:blur(80px);opacity:.6} .mk .sb{position:absolute;z-index:20;top:0;left:0;right:0;height:54px;display:flex;align-items:center;justify-content:space-between;padding:6px 34px 0 46px;font:600 17px/1 var(--sf);color:#fff} .mk .sb .ic{display:flex;gap:6px;align-items:center} .mk .sb .ic b{display:block;width:25px;height:12px;border:1.5px solid rgba(255,255,255,.6);border-radius:4px;position:relative} .mk .sb .ic b::after{content:"";position:absolute;inset:1.5px;right:5px;background:#fff;border-radius:1.5px} .mk .sb .sig{display:flex;gap:2px;align-items:flex-end} .mk .sb .sig i{width:3px;background:#fff;border-radius:1px} .mk .dark-ink .sb{color:var(--ink)} .mk .dark-ink .sb .ic b{border-color:var(--ink3)} .mk .dark-ink .sb .ic b::after, .mk .dark-ink .sb .sig i{background:var(--ink)} .mk .in{position:absolute;inset:0;padding:54px 20px 0}

/* home */ .mk .hd{display:flex;align-items:center;justify-content:space-between;min-height:60px;padding-top:6px}
.mk .wm{height:30px;width:130px;fill:#fff;filter:drop-shadow(0 2px 8px rgba(64,77,153,.16))} .mk .fic{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.3);border:1px solid rgba(255,255,255,.65);display:grid;place-items:center;color:#fff;font-size:20px}
 .mk .gr{padding-top:14px} .mk .gr small{display:block;font:600 17px/1.2 var(--sf);color:rgba(255,255,255,.9)} .mk .dt{margin:2px 0 0;font:600 44px/1.08 var(--sf);letter-spacing:-.8px;color:#fff;-webkit-mask-image:linear-gradient(#000,rgba(0,0,0,.88));mask-image:linear-gradient(#000,rgba(0,0,0,.88));
 text-shadow:0 1px 1.5px rgba(51,56,115,.22),0 4px 10px rgba(51,56,115,.1)} .mk .qc{padding-top:12px} .mk .qc>span{display:block;font:500 15px/1.2 var(--sf);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.12);margin-bottom:8px} .mk .brow{margin:0 -20px;overflow:hidden;padding:0 20px} .mk .btrack{display:flex;gap:10px;width:max-content} .mk .bub{width:112px;min-height:122px;padding:12px;border-radius:24px;display:flex;flex-direction:column;box-sizing:border-box} .mk .bub .bi{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.62);display:grid;place-items:center;font-size:21px;color:var(--i)} .mk .bub b{margin-top:auto;padding-top:8px;font:700 15px/1.18 var(--sf);color:var(--i)} .mk .bub em{font:400 11px/1.25 var(--sf);font-style:normal;color:var(--i2);padding-top:2px} .mk .rc{background:radial-gradient(220px at 0 0,rgba(255,255,255,var(--hl)),transparent),linear-gradient(var(--t),var(--b));box-shadow:inset 0 0 0 .5px rgba(255,255,255,.4)} .mk .fr{background:var(--fr);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:inset 0 0 0 1px var(--frb);--i:var(--th);--i2:var(--ink2)} .mk .tc{background:radial-gradient(240px at 0 0,rgba(255,255,255,var(--hl)),transparent),linear-gradient(135deg,transparent 50%,rgba(28,26,51,.06)),var(--f);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.35)} .mk .pills{display:flex;gap:8px;padding-top:16px;margin:0 -20px;padding-left:20px;overflow:hidden} .mk .pill{flex:none;min-height:44px;padding:0 20px;border-radius:99px;display:flex;align-items:center;font:400 16px/1 var(--sf);color:var(--ink);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)} .mk .pill.on{background:#F6F3A0;color:#1C1A33;font-weight:600;box-shadow:none} .mk .grid{display:flex;gap:13px;padding-top:14px} .mk .grid>div{flex:1;display:flex;flex-direction:column;gap:13px;min-width:0} .mk .card{border-radius:26px;position:relative;overflow:hidden;box-sizing:border-box}
/* checklist */ .mk .ck{padding:16px 12px 14px;color:var(--i)} .mk .ck h4{margin:0;height:74px;display:grid;place-items:center;text-align:center;font:500 24px/1.05 var(--mono);letter-spacing:.6px} .mk .ckr{display:flex;flex-direction:column;gap:7px;margin-top:12px} .mk .row{height:40px;border-radius:99px;display:flex;align-items:center;gap:9px;padding:0 9px;font:400 15px/1 var(--sf);background:rgba(255,255,255,.38);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);transition:background .35s,color .35s} .mk .row i{width:22px;height:22px;border-radius:50%;box-shadow:inset 0 0 0 1.5px currentColor;display:grid;place-items:center;font-size:11px;color:transparent;flex:none;transition:all .35s cubic-bezier(.3,1.4,.5,1)} .mk .row.on{background:rgba(31,41,38,.58);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);color:#fff;font-weight:600} .mk .row.on i{background:#fff;color:#21332B;box-shadow:none;transform:scale(1)}

/* today */ .mk .td{height:206px;padding:16px;color:var(--i)} .mk .td .k{display:flex;gap:6px;align-items:center;font:600 15px/1 var(--sf);color:var(--i2)} .mk .av{border-radius:50%;display:grid;place-items:center;font-weight:600;position:relative;flex:none} .mk .ring{position:absolute;inset:-4px;transform:rotate(-90deg)} .mk .ring circle{fill:none;stroke-width:2;stroke:currentColor} .mk .ring .tr{opacity:.16} .mk .ring .ar{stroke-linecap:round;transition:stroke-dashoffset 1.4s cubic-bezier(.2,.8,.2,1)} .mk .td .nm{font:600 24px/1.1 var(--sf);letter-spacing:-.4px;margin-top:8px} .mk .td p{margin:3px 0 0;font:500 15px/1.3 var(--sf)}
/* voice */ .mk .vc{height:112px;padding:10px 12px;color:var(--i);display:flex;flex-direction:column;justify-content:center} .mk .vc .r{display:flex;align-items:center;gap:4px} .mk .vc .pl{width:44px;height:44px;display:grid;place-items:center;color:#fff;font-size:22px;filter:drop-shadow(0 1px 3px rgba(28,26,51,.18))} .mk .wave{flex:1;height:46px;display:flex;align-items:center;justify-content:space-between} .mk .wave i{display:block;width:3px;border-radius:2px;background:rgba(255,255,255,.95);height:calc(var(--h)*1%);min-height:8%;transform-origin:center} .mk .play .wave i{animation:mkwv 1.1s ease-in-out infinite alternate;animation-delay:calc(var(--d)*-90ms)}
@keyframes mkwv{0%{transform:scaleY(.35)}100%{transform:scaleY(1)}} .mk .vc small{font:600 13px/1 var(--sf);padding-left:6px;margin-top:6px}
/* text note */ .mk .tn{padding:16px;color:var(--th);min-height:184px;display:flex;flex-direction:column} .mk .tn h4{margin:0;font:700 30px/1.02 var(--sf);letter-spacing:-.6px} .mk .tn p{margin:8px 0 0;font:400 15px/1.3 var(--sf);color:var(--ink)} .mk .tn .ft{margin-top:auto;display:flex;justify-content:space-between;align-items:center;font:400 13px/1 var(--sf);color:var(--ink2)} .mk .ctag{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 7px;border-radius:99px;background:rgba(63,103,168,.1);font:600 11px/1 var(--sf);color:var(--th)}
/* bottom bar */ .mk .bfade{position:absolute;left:0;right:0;bottom:0;height:110px;background:linear-gradient(transparent,var(--bg3) 85%);pointer-events:none} .mk .mkcbar{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:7px;border-radius:99px;width:188px;height:72px;box-sizing:border-box;
 background:rgba(41,38,61,.55);-webkit-backdrop-filter:blur(24px) saturate(1.4);backdrop-filter:blur(24px) saturate(1.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 8px 18px rgba(0,0,0,.22);
 transition:width .55s cubic-bezier(.32,1.18,.5,1);overflow:hidden;z-index:10} .mk .mkcbar .plus{width:58px;height:58px;border-radius:50%;background:#fff;color:#000;display:grid;place-items:center;font-size:24px;flex:none;transition:transform .3s,opacity .25s} .mk .mkcbar .c{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.18);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.22);display:grid;place-items:center;color:#fff;font-size:19px;flex:none;transition:opacity .25s} .mk .mkcbar .q{position:absolute;inset:7px 7px 7px 14px;display:flex;align-items:center;gap:10px;opacity:0;transition:opacity .3s .15s;color:#fff;font:400 17px/1 var(--sf)} .mk .mkcbar .q svg{font-size:17px;opacity:.85} .mk .mkcbar .q span{flex:1;white-space:nowrap} .mk .mkcbar .q span:empty::before{content:attr(data-ph);opacity:.6} .mk .mkcbar .q .x{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:16px} .mk .mkcbar.open{width:358px} .mk .mkcbar.open .plus, .mk .mkcbar.open .c{opacity:0} .mk .mkcbar.open .q{opacity:1} .mk .caret::after{content:"";display:inline-block;width:2px;height:20px;background:#fff;margin-left:2px;vertical-align:-3px;animation:mkblink 1s steps(1) infinite}
@keyframes mkblink{50%{opacity:0}} .mk .noticed{position:absolute;left:16px;right:16px;bottom:112px;border-radius:24px;padding:12px;z-index:9;background:var(--fr);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:inset 0 0 0 1px var(--frb),0 10px 30px -12px rgba(30,24,80,.35);
 transform:translateY(24px) scale(.96);opacity:0;transition:all .5s cubic-bezier(.3,1.25,.5,1)} .mk .noticed.show{transform:none;opacity:1} .mk .noticed .h{display:flex;gap:6px;align-items:center;font:600 13px/1 var(--sf);color:var(--ink2)} .mk .noticed .h svg{color:var(--dusty)} .mk .nrow{display:flex;align-items:center;gap:10px;margin-top:9px;min-height:50px;border-radius:16px;padding:0 10px;background:color-mix(in srgb,var(--surf) 45%,transparent)} .mk .nrow .ni{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--f);color:var(--i);font-size:17px} .mk .nrow b{display:block;font:600 15px/1.2 var(--sf)} .mk .nrow em{font-style:normal;font:400 13px/1.2 var(--sf);color:var(--ink2)} .mk .nrow .pa{margin-left:auto;color:var(--dusty);font-size:22px}

/* sheet: new note */ .mk .mksheet{background:linear-gradient(180deg,var(--bg0),var(--bg1) 30%,var(--bg2) 62%,var(--bg3));position:absolute;left:0;right:0;bottom:0;top:120px;border-radius:34px 34px 0 0;padding:26px 20px;overflow:hidden;box-shadow:0 -10px 40px rgba(20,16,60,.25)} .mk .mksheet .mkgrab{position:absolute;top:8px;left:50%;width:36px;height:5px;margin-left:-18px;border-radius:9px;background:rgba(255,255,255,.55)} .mk .mksheet h3{margin:0;font:600 23px/1.2 var(--sf);color:var(--ink);position:relative} .mk .mksheet>p{margin:4px 0 0;font:400 13px/1.3 var(--sf);color:var(--ink2);position:relative} .mk .cv{margin-top:18px;min-height:96px;border-radius:26px;padding:16px;display:flex;align-items:center;gap:14px;color:var(--i);position:relative} .mk .cv .ci{width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.7);display:grid;place-items:center;font-size:22px} .mk .cv b{display:block;font:600 20px/1.2 var(--sf)} .mk .cv em{font-style:normal;font:400 13px/1.3 var(--sf);color:var(--i2)} .mk .cv .ch{margin-left:auto;opacity:.6} .mk .g2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;position:relative} .mk .gt{min-height:138px;border-radius:26px;padding:16px;display:flex;flex-direction:column;color:var(--i);position:relative} .mk .gt .gi{width:50px;height:50px;border-radius:50%;background:color-mix(in srgb,var(--surf) 70%,transparent);display:grid;place-items:center;font-size:22px} .mk .gt b{margin-top:auto;font:600 20px/1.2 var(--sf)} .mk .gt em{font-style:normal;font:400 13px/1.3 var(--sf);color:var(--i2)} .mk .gt .gx{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;background:color-mix(in srgb,var(--surf) 60%,transparent);display:grid;place-items:center;font-size:17px} .mk .addp{margin-top:12px;min-height:54px;border-radius:18px;display:flex;align-items:center;gap:10px;padding:0 16px;background:color-mix(in srgb,var(--surf) 70%,transparent);color:var(--dusty);font:600 17px/1 var(--sf);position:relative}

/* voice recorder */ .mk .ttl{display:flex;align-items:center;justify-content:space-between;padding-top:10px} .mk .ttl .bt{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.3);box-shadow:inset 0 0 0 1px rgba(255,255,255,.6);display:grid;place-items:center;color:#fff;font-size:18px}
 .mk .ttl b{font:600 17px/1 var(--sf);color:#fff} .mk .big{font:700 34px/1.1 var(--sf);letter-spacing:-.6px;color:#fff;margin:22px 0 0} .mk .rec{margin-top:22px;border-radius:28px;padding:20px;display:flex;flex-direction:column;align-items:center;gap:18px;color:var(--i)} .mk .rec .clk{font:600 34px/1 var(--sf);font-variant-numeric:tabular-nums} .mk .rec .wave{width:100%;height:84px;flex:none} .mk .rec .wave i{width:4px;background:var(--i);opacity:.85} .mk .rbtn{width:80px;height:80px;border-radius:50%;background:#fff;box-shadow:0 5px 10px rgba(0,0,0,.12);display:grid;place-items:center} .mk .rbtn i{display:block;width:28px;height:28px;border-radius:8px;background:#E85C66;animation:mkpulse 1.6s ease-in-out infinite}
@keyframes mkpulse{50%{transform:scale(.86)}} .mk .trn{margin-top:16px;border-radius:24px;padding:16px;background:var(--fr);box-shadow:inset 0 0 0 1px var(--frb);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)} .mk .trn .h{display:flex;gap:6px;align-items:center;font:600 13px/1 var(--sf);color:var(--ink2)} .mk .trn p{margin:10px 0 0;font:600 19px/1.35 var(--sf);color:var(--th);min-height:78px} .mk .trn .mkchips2{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px} .mk .mchip{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 11px;border-radius:99px;font:600 13px/1 var(--sf);background:var(--f);color:var(--i)}

/* person page */ .mk .pp-top{display:flex;align-items:center;gap:14px;margin-top:16px} .mk .pp-top .nm{font:400 40px/1 var(--serif);letter-spacing:-.8px;color:#fff} .mk .pp-top em{display:block;font-style:normal;font:500 15px/1.3 var(--sf);color:rgba(255,255,255,.85);margin-top:4px} .mk .prow{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap} .mk .prow .mchip{height:32px;font-size:14px} .mk .nstack{position:relative;margin-top:22px;padding-top:72px} .mk .peek{position:absolute;left:0;right:0;height:96px;border-radius:28px;padding:5px 22px 0;box-sizing:border-box;font:600 13px/2 var(--sf);color:var(--ink);transform-origin:50% 0;
 box-shadow:0 2px 8px rgba(51,51,115,.06);transition:all .6s cubic-bezier(.3,1.1,.4,1)} .mk .peek.o{background:#F8F4CF} .mk .peek.e{background:#fff}
 .mk .front{position:relative;border-radius:28px;background:var(--surf);padding:20px;box-shadow:0 6px 16px rgba(51,51,115,.1);transition:transform .6s cubic-bezier(.3,1.1,.4,1),opacity .4s} .mk .front .fh{display:flex;align-items:center;justify-content:space-between} .mk .front .fh b{display:block;font:700 15px/1.2 var(--sf)} .mk .front .fh em{font-style:normal;font:400 13px/1.3 var(--sf);color:var(--ink2)} .mk .front .pen{width:38px;height:38px;border-radius:50%;background:var(--pale);display:grid;place-items:center;color:var(--dusty);font-size:17px} .mk .front h5{margin:14px 0 0;font:600 24px/1.18 var(--sf);letter-spacing:-.3px;color:var(--th)} .mk .front p{margin:8px 0 0;font:400 17px/1.35 var(--sf)} .mk .front .imgs{display:flex;gap:8px;margin-top:14px} .mk .front .imgs i{flex:1;height:112px;border-radius:20px}

/* composer */ .mk .cmp .tb{display:flex;justify-content:space-between;padding-top:10px} .mk .cmp .tb span{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:20px;background:rgba(255,255,255,.55);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)} .mk .cmp .tb span.ok{background:#1C1A33;color:#fff;box-shadow:none}
 .mk .cmp h3{margin:20px 0 0;font:400 52px/1.05 var(--sf);letter-spacing:-1.2px;color:var(--ink)} .mk .cmp .who{display:flex;align-items:center;gap:10px;margin-top:14px;font:400 17px/1 var(--sf);color:var(--ink2)} .mk .cmp .kinds{display:flex;gap:8px;margin-top:16px} .mk .cmp .kinds span{height:40px;padding:0 15px;border-radius:99px;display:flex;align-items:center;font:400 16px/1 var(--sf);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);background:rgba(255,255,255,.3);white-space:nowrap} .mk .cmp .kinds span.on{background:#F6F3A0;color:#1C1A33;box-shadow:none;font-weight:600}
 .mk .cmp .txt{margin-top:20px;font:500 26px/1.28 var(--sf);letter-spacing:-.4px;color:var(--th);min-height:190px} .mk .cmp .txt mark{background:none;color:inherit;font-weight:700;transition:background .4s;border-radius:6px} .mk .cmp .txt mark.h{background:rgba(63,103,168,.14)} .mk .cmp .panel{position:absolute;left:12px;right:12px;bottom:14px;border-radius:30px;background:var(--surf);padding:18px;box-shadow:0 -6px 30px rgba(30,24,80,.12)} .mk .cmp .panel .h{font:600 15px/1 var(--sf);color:var(--ink2)} .mk .cmp .mkchips2{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;min-height:116px;align-content:flex-start} .mk .cmp .mkchips2 .mchip{height:34px;font-size:15px;transform:scale(.6);opacity:0;transition:all .45s cubic-bezier(.3,1.5,.5,1)} .mk .cmp .mkchips2 .mchip.pop{transform:none;opacity:1} .mk .cmp .save{margin-top:14px;height:56px;border-radius:99px;background:var(--ink);color:var(--surf);display:grid;place-items:center;font:600 18px/1 var(--sf)} .mk .cmp .priv{display:flex;justify-content:center;gap:6px;align-items:center;margin-top:10px;font:400 13px/1 var(--sf);color:var(--ink2)}

/* lock screen */ .mkphone.lock .mkscr, .mk .mkscr.lock{background:linear-gradient(180deg,#3A3F8F,#6B5BB8 45%,#C98FC0)} .mk .lk{position:absolute;inset:0;text-align:center;color:#fff} .mk .lk .dt2{margin-top:76px;font:600 20px/1 var(--sf);opacity:.9} .mk .lk .tm{font:700 108px/1 var(--sf);letter-spacing:-3px;margin-top:6px;font-feature-settings:"tnum"} .mk .lk .wdg{display:flex;justify-content:center;gap:12px;margin-top:14px} .mk .lk .wdg div{width:158px;height:70px;border-radius:22px;background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);text-align:left;padding:11px 13px;box-sizing:border-box;font:600 13px/1.25 var(--sf)} .mk .lk .wdg em{display:block;font-style:normal;font-weight:400;opacity:.8} .mk .ntf{position:absolute;left:12px;right:12px;bottom:118px;border-radius:26px;padding:14px;text-align:left;color:#1C1A33;background:rgba(245,244,252,.78);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);
 display:flex;gap:12px;transform:translateY(30px);opacity:0;transition:all .7s cubic-bezier(.3,1.25,.5,1)} .mk .ntf.show{transform:none;opacity:1} .mk .ntf img, .mk .ntf .ap{width:38px;height:38px;border-radius:10px;flex:none} .mk .ntf .tx{flex:1;font:400 15px/1.3 var(--sf)} .mk .ntf .tx b{display:flex;justify-content:space-between;font:600 15px/1.3 var(--sf)} .mk .ntf .tx b span{font-weight:400;color:#6F6C86;font-size:13px} .mk .lk .bt2{position:absolute;bottom:40px;left:46px;right:46px;display:flex;justify-content:space-between} .mk .lk .bt2 span{width:50px;height:50px;border-radius:50%;background:rgba(0,0,0,.25);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:grid;place-items:center;font-size:21px} .mk .lk .home{position:absolute;bottom:9px;left:50%;width:140px;height:5px;margin-left:-70px;border-radius:9px;background:#fff}

@media (prefers-reduced-motion:reduce){.mk *,.mk *::before,.mk *::after{animation:none!important;transition:none!important}}


.mk .mkmq{animation:mkmarq 38s linear infinite}@keyframes mkmarq{to{transform:translateX(calc(-50% - 5px))}}
.mklive{position:relative;display:flex;justify-content:center;align-items:flex-end;gap:clamp(14px,3vw,40px);margin:clamp(26px,4vw,48px) 0 clamp(30px,4vw,56px);padding:clamp(28px,4vw,56px) 0 0;border-radius:36px;
 background:radial-gradient(60% 80% at 20% 0,rgba(255,255,255,.7),transparent),radial-gradient(50% 70% at 90% 100%,rgba(247,198,228,.6),transparent),linear-gradient(180deg,#B9C3EE,#D9C6EE);overflow:hidden}
.mklive .mkphone{margin-bottom:-90px}.mklive .mkphone.home{margin-bottom:-40px}
.mkfl{position:absolute;z-index:4;display:inline-flex;align-items:center;gap:7px;padding:10px 14px;border-radius:99px;font:600 14px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;
 background:var(--f);color:var(--i);box-shadow:0 14px 30px -14px rgba(40,30,120,.45);animation:mkfl 6s ease-in-out infinite alternate}
.mkfl svg{width:15px;height:15px}.mkfl.b{animation-duration:7s;animation-delay:-2s}.mkfl.c{animation-duration:8s;animation-delay:-4s}
@keyframes mkfl{to{transform:translateY(-12px)}}
.nt.mm .nt-title{font-size:clamp(46px,6.6vw,104px);white-space:nowrap}
.nt.mm .nt-head>div:first-child{min-width:0}
@media (max-width:760px){.mklive{gap:10px}.mklive .mkphone:not(.home){display:none}.mklive .mkphone.home{--s:.74;margin-bottom:-70px}.mkfl{display:none}}

.mklive[hidden]{display:none!important}