.pmd{position:relative;width:100%;max-width:440px;margin-inline:auto;aspect-ratio:440/340;isolation:isolate}
.pmd-inner{position:absolute;left:50%;top:50%;transform-origin:50% 50%;will-change:transform}
.pmd-inner>*{position:absolute;left:0;top:0}
.pmd-glow{border-radius:50%;background:radial-gradient(closest-side,var(--pmd-glow-1,rgba(0,140,255,.42)),var(--pmd-glow-2,rgba(0,110,255,.14)) 55%,transparent 78%);opacity:0;pointer-events:none;filter:blur(2px)}
.pmd-icon{opacity:0;will-change:transform,opacity;border-radius:22.4%}
.pmd-scene{transform-style:preserve-3d;perspective:1100px;perspective-origin:50% 34%;will-change:transform}
.pmd-board{border-radius:14px;background:radial-gradient(118% 96% at 22% 8%,#3c4757 0%,#222b39 34%,#141b26 62%,#0a111c 100%);box-shadow:inset 0 1px 0 rgba(215,232,255,.30),inset 0 0 0 1px rgba(10,16,26,.85),inset -2px -3px 10px rgba(120,170,220,.16),0 26px 48px -18px rgba(4,10,20,.66),0 10px 20px -10px rgba(4,10,20,.5);transform-origin:50% 50%;will-change:transform}
.pmd-board::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(133deg,rgba(255,255,255,.14),rgba(255,255,255,0) 26%,rgba(255,255,255,0) 74%,rgba(150,200,255,.20));pointer-events:none}
.pmd-stack{transform-style:preserve-3d;transform-origin:0 0;will-change:transform}
.pmd-sheet{transform-style:preserve-3d;transform-origin:50% 0;will-change:transform}
.pmd-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:var(--pr);overflow:hidden;transform:skewX(-5.4deg)}
.pmd-paper{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(142deg,#ffffff 0%,#f4f8fd 26%,#dde8f5 62%,#eef7fd 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(28,44,68,.10),inset 0 0 0 1px rgba(28,44,68,.055)}
.pmd-grain{position:absolute;inset:0;border-radius:inherit;opacity:.055;mix-blend-mode:multiply;background-repeat:repeat;background-size:128px 128px}
.pmd-shade{position:absolute;inset:0;border-radius:inherit;opacity:0;background:linear-gradient(180deg,rgba(255,255,255,.62) 0%,rgba(255,255,255,0) 22%,rgba(18,30,48,.10) 58%,rgba(18,30,48,.34) 100%);pointer-events:none}
.pmd-tint{position:absolute;inset:0;border-radius:inherit;opacity:0;background:linear-gradient(128deg,#4abcff 0%,#0d7bf5 42%,#0038bd 100%);box-shadow:inset 0 0 0 1px rgba(140,215,255,.85),inset -2px -2px 14px rgba(160,225,255,.55);pointer-events:none}
.pmd-ink{position:absolute;inset:0;border-radius:inherit}
.pmd-pill{position:absolute;border-radius:999px}
.pmd-pill.k-blue{background:linear-gradient(103deg,#00c8ff 0%,#0090ff 46%,#0050fb 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.42),0 1px 2px rgba(0,60,150,.28)}
.pmd-pill.k-grey{background:linear-gradient(103deg,#bcc6d4 0%,#9aabbe 48%,#7d95ad 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.pmd-pill.k-cyan{background:linear-gradient(103deg,#5bd6ff 0%,#12a4f7 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
.pmd-thumb{position:absolute;border-radius:10px;background:linear-gradient(150deg,#b9d6ef 0%,#8fb6dc 44%,#6f9cc9 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 0 0 1px rgba(28,60,100,.14)}
.pmd-thumb::before{content:"";position:absolute;left:14%;bottom:12%;width:44%;height:46%;border-radius:4px 40% 0 0;background:rgba(255,255,255,.42)}
.pmd-thumb::after{content:"";position:absolute;right:18%;top:16%;width:16%;aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.72)}
.pmd-clip{transform-origin:0 0;will-change:transform}
.pmd-clip svg{display:block;overflow:visible}
@media (prefers-reduced-motion:reduce){.pmd-inner *{transition:none!important;animation:none!important}}
.pmd-grain{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='128' height='128' filter='url(%23n)'/%3E%3C/svg%3E")}
.pmd-sheet[data-lift="0"] .pmd-paper{box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(28,44,68,.10),inset 0 0 0 1px rgba(28,44,68,.055),0 1px 2px rgba(10,20,40,.24)}
.pmd-sheet[data-lift="1"] .pmd-paper{box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(28,44,68,.10),inset 0 0 0 1px rgba(28,44,68,.055),0 7px 11px rgba(10,20,40,.26)}
.pmd-sheet[data-lift="2"] .pmd-paper{box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(28,44,68,.10),inset 0 0 0 1px rgba(28,44,68,.055),0 18px 24px rgba(10,20,40,.30)}
.pmd-mark{position:absolute;overflow:hidden;box-shadow:0 18px 40px -14px rgba(20,22,50,.55)}
.pmd-mark svg{filter:drop-shadow(0 1px 2px rgba(0,0,0,.20))}
