body:has(dialog[open]){overflow:hidden}
dialog.record-popup{width:100%;max-width:1200px;max-height:100svh;height:100svh;margin:auto;padding:0;border-radius:0;background:transparent;overflow:auto;overscroll-behavior:contain;color:white}
dialog.record-popup::backdrop{background:rgba(66,72,255,.8);backdrop-filter:none}
.record-popup>.close{position:fixed;right:20px;top:15px;color:white;width:44px;height:44px;z-index:10;font:300 36px/1 sans-serif}
.record-popup>#panel-title{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.record-scene{position:relative;width:706px;height:706px;margin:84px auto;isolation:isolate}
.record-disc{position:absolute;inset:0;border-radius:50%;background:repeating-radial-gradient(circle at center,#191919 0px,#191919 3px,#202020 4px,#161616 5px,#191919 7px);box-shadow:inset 0 0 0 2px #161616;z-index:-1}
.record-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:326px;height:326px;border:8px solid #ffdaab;border-radius:50%;background:#ee764b;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 35px;color:white}
.record-center h3{font:600 20px/1 Oswald,sans-serif;text-transform:uppercase;text-align:center;max-width:190px;margin:0 0 20px}.record-center .event-details{width:100%;gap:8px}.record-center .event-details>div{gap:8px}.record-center .event-details dt{color:#fffc;font-size:12px;gap:6px}.record-center .event-details dt::after{border-color:#ffffff40}.record-center .event-details dd{color:white;font-size:14px;line-height:1.4;gap:6px;white-space:normal;text-align:right}.record-center .day-badge{font-size:10px;background:#ffdaab;color:#f58059;border-color:#ffb283;padding:3px 6px}
.record-note{position:absolute;z-index:2;margin:0!important;padding:10px;border-radius:10px;background:#ebebeb;color:var(--ink);font:400 14px/1.4 'Inter Tight',sans-serif!important;width:150px;transform:rotate(var(--tilt,0deg))}
.note-top{top:-15px;left:50%;transform:translateX(-50%);width:max-content;max-width:220px}.note-left{left:-32px;top:114px;width:218px;--tilt:2.2deg}.note-bottom-left{left:-72px;top:385px;width:218px;--tilt:-3.8deg}.note-right{right:-33px;top:255px;width:135px;--tilt:-1.76deg}.note-top-right{right:38px;top:59px;width:144px;--tilt:4.13deg}.note-bottom-right{right:-4px;top:485px;width:165px;--tilt:2.58deg}
.record-action{position:absolute;left:50%;transform:translateX(-50%);border:0;border-radius:100px;height:38px;width:170px;font:500 12px/1.4 Oswald,sans-serif;color:#eee;background:var(--blue)}.record-action.calendar{top:114px;color:var(--orange);background:#201e1e;border:1px solid var(--orange)}.record-action.primary{bottom:112px}.record-status{position:absolute;left:50%;bottom:36px;transform:translateX(-50%);width:320px;margin:0!important;text-align:center;font:400 13px/1.4 'Inter Tight',sans-serif!important;color:white}
.product-record .record-center{padding:0;overflow:hidden;width:314px;height:314px;border-width:5px}.record-product-image{width:100%;height:100%;object-fit:cover}.record-product-title{position:absolute;left:50%;top:100px;transform:translateX(-50%);margin:0;padding:2px 8px;border-radius:6px;background:#f2f2f0;color:#151414;white-space:nowrap;font:600 20px/1.4 Oswald,sans-serif;text-transform:uppercase}
.product-record .note-top{top:-4px;width:220px;transform:translateX(-50%) rotate(1.87deg)}.product-record .note-left{left:-16px;top:199px;width:151px}.product-record .note-top-right{right:12px;top:189px;width:77px;--tilt:-6deg}.product-record .note-bottom-left{left:-50px;top:451px;width:146px}.product-record .note-bottom-right{right:-30px;top:452px;width:95px;--tilt:6deg}.product-record .primary{width:234px;bottom:82px}
.record-options{position:absolute;display:flex;flex-direction:column;gap:0;right:155px;top:380px;z-index:3}.record-options button{width:44px;height:44px;border:0;border-radius:50%;background:#f9f9f9;color:#151414;font:500 12px Oswald,sans-serif}.record-options button:nth-child(2){margin-left:-13px}.record-options button:nth-child(3){margin-left:-36px}.record-options button[aria-pressed=true]{background:var(--orange);color:#fff}.record-colors{left:165px;right:auto;top:430px;gap:3px}.record-colors button{width:30px;height:30px;border:3px solid transparent;background:var(--swatch)!important}.record-colors button:nth-child(2){margin-left:15px}.record-colors button:nth-child(3){margin-left:30px}.record-colors button[aria-pressed=true]{border-color:var(--orange);outline:3px solid white}
@media(max-width:900px){.record-scene{margin:70px auto;width:600px;height:600px}.record-center{width:310px;height:310px}.note-left{left:0;top:65px;width:170px}.note-bottom-left{left:0;top:410px;width:180px}.note-right{right:0;top:230px;width:115px}.note-top-right{right:0;top:55px;width:130px}.note-bottom-right{right:0;top:425px;width:140px}.record-action.calendar{top:70px}.record-action.primary{bottom:65px}.record-status{bottom:10px;width:270px;font-size:12px!important}.record-options{right:95px;top:310px}.record-colors{left:110px;right:auto;top:360px}.record-product-title{top:90px;font-size:18px}.product-record .note-left{left:0;top:160px;width:130px}.product-record .note-bottom-left{left:0;top:420px}.product-record .note-bottom-right{right:0;top:420px}.product-record .note-top-right{right:0;top:160px}.product-record .primary{bottom:65px}}
@media(max-width:650px){
 dialog.record-popup{padding:65px 12px 25px}.record-popup>.close{right:10px;top:10px;background:#4248ff80;border-radius:50%}
 .record-scene{width:100%;height:auto;min-height:0;margin:0;display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 0 15px}.record-disc{position:relative;inset:auto;width:min(100%,410px);aspect-ratio:1;flex:none;order:0}.record-center{top:min(45vw,193px);width:270px;height:270px;padding:25px;transform:translate(-50%,-50%);border-width:6px}.record-center h3{font-size:18px;margin-bottom:15px}.record-center .event-details{gap:7px}.record-center .event-details dd{font-size:12px}.record-center .event-details dt{font-size:10px}.record-note{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;width:100%!important;max-width:410px!important;font-size:13px!important;order:4}.note-top{order:-1;align-self:center;width:auto!important}.record-action{position:relative;left:auto;top:auto!important;bottom:auto!important;transform:none;flex:none;width:min(100%,300px);height:44px;order:2;font-size:14px}.record-action.calendar{order:3}.record-status{position:static;transform:none;order:3;width:100%;max-width:350px;min-height:0}.record-status:empty{display:none}
 .event-record .record-center{top:calc(52px + min(45vw,193px))}.product-record .record-center{top:calc(64px + min(45vw,193px));width:240px;height:240px}.product-record .note-top{order:4}.record-product-title{position:relative;left:auto;top:auto;transform:none;order:-1;white-space:normal;text-align:center;max-width:100%;font-size:18px}.record-options{position:relative;right:auto;left:auto;top:auto;order:1;flex-direction:row;gap:10px}.record-options button:nth-child(n){margin:0}.record-colors{order:1}.product-record .primary{width:min(100%,300px)}
}
@media(prefers-reduced-motion:reduce){dialog[open]{animation:none}}
@media(max-width:650px){
 .event-record .record-center{top:calc(53.2px + min((100vw - 24px)/2,205px))}
 .product-record .record-center{top:calc(42px + min((100vw - 24px)/2,205px))}
}
