.phone-comp{--pc-bezel:#1b1a18;--pc-bezel-edge:#393836;--pc-screen:var(--paper);--pc-screen-subtle:var(--paper-subtle);--pc-shadow:0 30px 70px -28px #00000047, 0 8px 20px -12px #0000001f;width:100%;container-type:inline-size}@supports (color:lab(0% 0 0)){.phone-comp{--pc-bezel:lab(9.30313% .133514 1.53087);--pc-bezel-edge:lab(23.4556% .125825 1.5256);--pc-shadow:0 30px 70px -28px lab(0% 0 0/.28), 0 8px 20px -12px lab(0% 0 0/.12)}}.dark .phone-comp{--pc-bezel:#2c2b29;--pc-bezel-edge:#494745;--pc-screen:#161616;--pc-screen-subtle:#232323;--pc-shadow:0 30px 70px -28px #000000b3, 0 8px 20px -12px #00000080}@supports (color:lab(0% 0 0)){.dark .phone-comp{--pc-bezel:lab(17.6554% .128195 1.5272);--pc-bezel-edge:lab(30.4157% .123769 1.52423);--pc-screen:lab(7.22637% -.0000149012 0);--pc-screen-subtle:lab(13.58% 0 0);--pc-shadow:0 30px 70px -28px lab(0% 0 0/.7), 0 8px 20px -12px lab(0% 0 0/.5)}}.pc-phone{--u:calc(100cqw / 300);aspect-ratio:300/620;border-radius:calc(46 * var(--u));background:var(--pc-bezel);width:100%;box-shadow:var(--pc-shadow), inset 0 0 0 calc(1.5 * var(--u)) var(--pc-bezel-edge);color:var(--paper-foreground);-webkit-user-select:none;user-select:none;position:relative}.pc-island{top:calc(19 * var(--u));z-index:2;width:calc(92 * var(--u));height:calc(26 * var(--u));border-radius:calc(14 * var(--u));background:#000;background:lab(0% 0 0);position:absolute;left:50%;translate:-50%}.pc-screen{inset:calc(10 * var(--u));border-radius:calc(37 * var(--u));background:var(--pc-screen);font-size:calc(13 * var(--u));flex-direction:column;line-height:1.4;display:flex;position:absolute;overflow:hidden}.pc-screen b{font-weight:650}.pc-status{height:calc(44 * var(--u));padding:calc(13 * var(--u)) calc(26 * var(--u)) 0;font-size:calc(13 * var(--u));font-variant-numeric:tabular-nums;flex:none;justify-content:space-between;align-items:center;font-weight:650;display:flex}.pc-status-icons{align-items:center;gap:calc(5 * var(--u));display:flex}.pc-status-icons i{height:calc(9 * var(--u));border-radius:calc(2 * var(--u));background:currentColor;display:block}.pc-bar-signal{width:calc(16 * var(--u))}.pc-bar-wifi{width:calc(13 * var(--u));border-radius:calc(3 * var(--u))!important}.pc-bar-battery{width:calc(22 * var(--u));height:calc(10 * var(--u))!important;border-radius:calc(3 * var(--u))!important}.pc-head{align-items:center;gap:calc(10 * var(--u));padding:calc(6 * var(--u)) calc(18 * var(--u)) calc(10 * var(--u));flex:none;display:flex}.pc-title{font-size:calc(22 * var(--u));letter-spacing:-.02em;font-weight:700;line-height:1.1;display:block}.pc-sub{color:var(--paper-muted);font-size:calc(12 * var(--u));display:block}.pc-chip{align-items:center;gap:calc(6 * var(--u));padding:calc(4 * var(--u)) calc(10 * var(--u)) calc(4 * var(--u)) calc(5 * var(--u));background:var(--pc-screen-subtle);font-size:calc(11.5 * var(--u));border-radius:999px;font-weight:600;display:inline-flex}.pc-chip-icon{width:calc(18 * var(--u));height:calc(18 * var(--u))}.pc-scroll{gap:calc(10 * var(--u));min-height:0;padding:0 calc(14 * var(--u));flex-direction:column;flex:1;display:flex;overflow:hidden}.pc-tabs{grid-template-columns:1fr 1fr calc(40 * var(--u)) 1fr 1fr;padding:calc(8 * var(--u)) calc(6 * var(--u)) calc(24 * var(--u));border-top:1px solid var(--paper-border);background:var(--pc-screen);flex:none;display:grid}.pc-tab{justify-items:center;gap:calc(3 * var(--u));min-width:0;color:var(--paper-muted);font-size:calc(9.5 * var(--u));letter-spacing:-.01em;white-space:nowrap;font-weight:600;display:grid;position:relative}.pc-tab-on{color:var(--mark-cyan)}.pc-tab-icon{width:calc(22 * var(--u));height:calc(22 * var(--u))}.pc-badge{top:calc(-3 * var(--u));left:calc(50% + 6 * var(--u));min-width:calc(16 * var(--u));height:calc(16 * var(--u));padding:0 calc(4 * var(--u));background:var(--mark-red);color:var(--mark-red-foreground);font-size:calc(9.5 * var(--u));border-radius:999px;place-items:center;font-weight:700;display:grid;position:absolute}.pc-mic{width:calc(38 * var(--u));height:calc(38 * var(--u));background:var(--paper-foreground);color:var(--pc-screen);border-radius:50%;flex:none;place-items:center;display:grid}.pc-mic svg{width:calc(18 * var(--u));height:calc(18 * var(--u))}.pc-mic-tab{width:calc(34 * var(--u));height:calc(34 * var(--u));margin-top:calc(-6 * var(--u))}.pc-face{width:calc(36 * var(--u));height:calc(36 * var(--u));flex:none;position:relative}.pc-face-sm{width:calc(26 * var(--u));height:calc(26 * var(--u))}.pc-face-crop{background:#f0e9e3;border-radius:50%;position:absolute;inset:0;overflow:hidden}.pc-face-img{width:110%;max-width:none;height:auto;position:absolute;top:-2%;left:-5%}.pc-presence{right:calc(-1 * var(--u));bottom:calc(-1 * var(--u));width:calc(11 * var(--u));height:calc(11 * var(--u));border:calc(2 * var(--u)) solid var(--pc-screen);background:var(--mark-teal);border-radius:50%;position:absolute}.pc-presence-working{background:var(--mark-mustard)}.pc-btns{gap:calc(6 * var(--u));display:flex}.pc-btn{justify-content:center;align-items:center;gap:calc(6 * var(--u));padding:calc(7 * var(--u)) calc(12 * var(--u));border:1px solid var(--paper-border);background:var(--pc-screen);font-size:calc(12 * var(--u));border-radius:999px;flex:1;font-weight:650;display:inline-flex}.pc-btn svg{width:calc(14 * var(--u));height:calc(14 * var(--u))}.pc-btn-primary{border-color:var(--paper-foreground);background:var(--paper-foreground);color:var(--pc-screen)}
