
.preview-switch{position:sticky;top:0;z-index:50;display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;background:#fafafaf2;border-bottom:1px solid #ddd;padding:12px 18px;backdrop-filter:blur(12px);font-size:12px}.preview-switch>div:first-child{display:flex;flex-direction:column;gap:4px}.preview-switch strong{font-size:13px}.preview-switch span{font-size:11px;color:#777}.preview-switch [role=group]{display:flex;gap:5px}.preview-switch button{padding:9px 12px;border-radius:7px;background:#ededed;color:#555;font-size:12px}.preview-switch button[aria-pressed=true]{background:#222;color:#fff}.preview-switch #previewHome{background:transparent;border:1px solid #ccc}
.ceremony.cartoon-preview{--cart-line:#cacaca;--cart-radius:14px;--cart-shadow:none}.cartoon-preview .result-tools{align-items:center;gap:12px}.cartoon-preview .mask-control{position:relative;display:inline-flex;align-items:center;gap:8px;cursor:pointer;background:#fff;border:1px solid var(--cart-line);border-radius:var(--cart-radius);padding:9px 12px;font-size:12px;font-weight:600;color:#444;box-shadow:var(--cart-shadow);user-select:none}.mask-control #mask{position:absolute;opacity:0;width:1px;height:1px}.mask-indicator{width:19px;height:19px;display:grid;place-items:center;background:#f4f4f4;border:1.5px solid #777;border-radius:6px;transition:background .18s,transform .18s}.mask-control:has(input:checked) .mask-indicator{background:#222;border-color:#222}.mask-control:has(input:checked) .mask-indicator:after{content:'';width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translateY(-1px)}.mask-control:has(input:focus-visible){outline:3px solid #d4b900;outline-offset:3px}
.ceremony.cartoon-preview #statsOpen{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#f8f8f8;border:1px solid var(--cart-line);border-radius:var(--cart-radius);padding:14px 17px;margin:14px 0 18px;color:#333;box-shadow:var(--cart-shadow);font-weight:650}.cartoon-preview .stats-link-label{display:flex;align-items:center;gap:10px}.stats-link-label svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.8;stroke-linecap:round}.cartoon-preview .stats-link-arrow{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:#ededed;font-size:17px}.ceremony.cartoon-preview #statsOpen:hover{background:#fff;border-color:#777}.ceremony.cartoon-preview .stage-shell,.ceremony.cartoon-preview #analytics,.ceremony.cartoon-preview .result-menu-group{border-radius:var(--cart-radius);border-color:var(--cart-line);box-shadow:var(--cart-shadow)}.ceremony.cartoon-preview #reveal,.ceremony.cartoon-preview #next,.ceremony.cartoon-preview #upload,.ceremony.cartoon-preview #share{border-radius:10px}.ceremony.cartoon-preview #analytics .stat-tabs button{border-radius:9px}.ceremony.cartoon-preview #chooseAwards{border:1px solid var(--cart-line);background:#f8f8f8;border-radius:9px;text-decoration:none;margin-top:6px;padding:8px 12px}.cartoon-preview button:focus-visible{outline:3px solid #d4b900;outline-offset:3px}
.ceremony[data-cartoon="2"]{--cart-line:#444;--cart-radius:10px;--cart-shadow:2px 3px 0 #333}.ceremony[data-cartoon="2"] .stage-shell,.ceremony[data-cartoon="2"] #analytics,.ceremony[data-cartoon="2"] .result-menu-group{border-width:1.5px}.ceremony[data-cartoon="2"] #statsOpen,.ceremony[data-cartoon="2"] .mask-control{border-width:1.5px;background:#fff}.ceremony[data-cartoon="2"] .mask-indicator{border-color:#333;border-radius:4px}.ceremony[data-cartoon="2"] #reveal,.ceremony[data-cartoon="2"] #next,.ceremony[data-cartoon="2"] #share,.ceremony[data-cartoon="2"] #upload{box-shadow:2px 3px 0 #999;border:1.5px solid #111}.ceremony[data-cartoon="2"] #statsOpen:active,.ceremony[data-cartoon="2"] .mask-control:active{transform:translate(2px,2px);box-shadow:none}
.ceremony[data-cartoon="3"]{--cart-line:#c9c9c9;--cart-radius:18px;--cart-shadow:none}.ceremony[data-cartoon="3"] #statsOpen{border-radius:16px 16px 16px 5px;background:#fff}.ceremony[data-cartoon="3"] .stats-link-arrow{background:#fee96d;border-radius:50%}.ceremony[data-cartoon="3"] .mask-control{border-radius:18px 18px 5px 18px;background:#fff}.ceremony[data-cartoon="3"] .mask-indicator{width:30px;height:18px;border:0;border-radius:20px;background:#ddd;display:block;position:relative}.ceremony[data-cartoon="3"] .mask-indicator:after{content:'';position:absolute;top:3px;left:3px;width:12px;height:12px;background:#fff;border:0;border-radius:50%;transform:none;transition:transform .18s}.ceremony[data-cartoon="3"] .mask-control:has(input:checked) .mask-indicator{background:#fee15b}.ceremony[data-cartoon="3"] .mask-control:has(input:checked) .mask-indicator:after{background:#333;transform:translateX(12px)}.ceremony[data-cartoon="3"] #analytics .stat-tabs button[aria-pressed=true]{border-radius:10px 10px 10px 3px}.ceremony[data-cartoon="3"] #reveal,.ceremony[data-cartoon="3"] #next{border-radius:12px 12px 4px 12px}
@media(max-width:600px){.preview-switch{gap:8px;padding:9px}.preview-switch>div:first-child{width:100%;align-items:center}.preview-switch button{padding:8px;font-size:11px}.cartoon-preview .mask-control{padding:8px 10px}.ceremony.cartoon-preview #statsOpen{padding:12px}.preview-switch #themeNote{font-size:10px}}
@media(prefers-reduced-motion:reduce){.cartoon-preview *{transition:none!important}}
.ceremony.cartoon-preview .mask-indicator{flex-shrink:0;box-sizing:border-box}
.ceremony[data-cartoon="3"] .mask-control:has(input:checked) .mask-indicator:after{width:12px;height:12px;border:0;border-radius:50%;top:3px;left:3px;box-sizing:border-box;background:#333;transform:translateX(12px)}
