html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog{width:min(600px,calc(100vw - 32px))!important;max-width:600px!important;border:0!important;border-radius:20px!important;background:#fffef8!important;color:#39392f!important;max-height:calc(100dvh - 24px)!important;overflow:auto!important;padding:0!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarForm{padding:28px 30px 0!important;background:#fffef8!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .dialog-head{border-bottom:1px solid #e9e6da!important;padding:0 0 18px!important;margin-bottom:18px!important;align-items:flex-start!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .eyebrow{font:700 11px system-ui!important;letter-spacing:1.8px!important;color:#a72b32!important;margin:0 0 5px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog h2{font:700 32px/1.1 Georgia!important;color:#39392f!important;margin:0!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog button.icon{width:42px!important;height:42px!important;border:1px solid #dedbd0!important;border-radius:11px!important;background:white!important;font:24px system-ui!important;color:#77786d!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-name-field{font:700 14px system-ui!important;margin:0 0 20px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #newCalendarName{box-sizing:border-box!important;height:48px!important;background:white!important;border:1px solid #d9d6ca!important;border-radius:10px!important;margin-top:8px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .calendar-colors{display:grid!important;grid-template-columns:repeat(7,38px)!important;gap:9px!important;justify-content:start!important;border:0!important;border-bottom:1px solid #e9e6da!important;padding:0 0 22px!important;margin:0 0 22px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .calendar-colors legend{font:700 14px system-ui!important;margin-bottom:12px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .calendar-colors label,html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .calendar-colors i{width:36px!important;height:36px!important;border-radius:50%!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-standard-summary{border:1px solid #dedbd0!important;border-radius:16px!important;background:white!important;padding:20px!important;margin:0 0 20px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-standard-summary h3{font:700 19px system-ui!important;margin:0 0 12px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-standard-checklist{display:grid!important;gap:10px!important;padding:0!important;margin:0!important;list-style:none!important;font:14px/1.5 system-ui!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-standard-checklist li{display:flex!important;gap:10px!important;align-items:center!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-check{background:#edf6ef!important;color:#438265!important;width:23px!important;height:23px!important;border-radius:50%!important;display:grid!important;place-items:center!important;flex:none!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-standard-summary small{display:block!important;border-top:1px solid #ece9df!important;padding-top:13px!important;margin-top:15px!important;font:13px/1.5 system-ui!important;color:#77796e!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings{border-top:1px solid #e9e6da!important;padding:17px 0!important;margin:0!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings>summary{font:700 14px system-ui!important;color:#a72b32!important;list-style:none!important;cursor:pointer!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings>summary:after{content:'›';float:right;font-size:23px;line-height:18px}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .dialog-actions{position:sticky!important;bottom:0!important;background:#fbf9f1!important;border-top:1px solid #e5e2d6!important;padding:17px 30px!important;margin:0 -30px!important;display:flex!important;justify-content:flex-end!important;gap:10px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .dialog-actions button{border-radius:10px!important;padding:13px 20px!important;font:700 14px system-ui!important;background:white!important;border:1px solid #d8d5c8!important;color:#39392f!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .dialog-actions button.primary{background:#a72b32!important;border-color:#a72b32!important;color:white!important}
@media(max-width:680px){html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog{width:calc(100vw - 16px)!important;max-height:calc(100dvh - 12px)!important;border-radius:22px 22px 0 0!important;margin:auto 8px 0!important}html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarForm{padding:25px 19px 0!important}html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog h2{font-size:30px!important}html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .dialog-actions{padding:13px 19px!important;margin:0 -19px!important}html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .dialog-actions .primary{flex:1!important}}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .dialog-head{background:transparent!important;box-shadow:none!important;position:relative!important;padding-top:0!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-name-field{display:block!important;padding:0!important;width:100%!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .calendar-colors label{padding:0!important;margin:0!important;display:block!important;border:0!important;box-shadow:none!important;position:relative!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .calendar-colors i{display:block!important;background:var(--swatch)!important;border:0!important;box-shadow:none!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .calendar-colors input:checked+i{outline:2px solid #4579c4!important;outline-offset:4px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .calendar-colors input:checked+i:after{content:'✓';color:white;display:grid;place-items:center;height:100%;font:23px system-ui}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .yomi-guide-group{position:static!important;display:flex!important;margin-top:9px!important;gap:15px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .yomi-guide-group button{padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#a72b32!important;font:14px system-ui!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-reference-guides{display:flex!important;gap:14px!important;margin-top:8px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .create-reference-guides button{border:0!important;background:transparent!important;padding:0!important;border-radius:0!important;font:14px system-ui!important;color:#a72b32!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .create-group-title{font:700 11px system-ui!important;letter-spacing:1.7px!important;color:#a72b32!important;text-transform:uppercase!important;margin:22px 0 12px!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .calendar-settings-card{background:#fff!important;border:1px solid #dedbd0!important;border-radius:13px!important;padding:17px!important;margin:0 0 12px!important;box-shadow:none!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .setting-label{font:700 13px system-ui!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .setting-description{font:13px/1.45 system-ui!important;color:#75776b!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .calendar-setting-row{padding:10px 0!important;gap:7px!important;border-color:#eeece3!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .switch-ui{background:#cecebf!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .setting-switch input:checked+.switch-ui{background:#398165!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .access-choice{background:#eeeade!important;border-radius:8px!important;padding:4px!important;box-shadow:none!important;border:0!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .access-choice input:checked+span{background:white!important;color:#a72b32!important;border:0!important;box-shadow:0 1px 5px #d5d1c3!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .access-choice span{font:13px system-ui!important;border:0!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createSmsInlineConsent{background:#fffdf6!important;border:1px solid #e4dcc7!important;border-radius:10px!important;padding:13px!important;margin:12px 0!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarForm:has(#createAdvancedSettings[open])>.create-name-field,html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarForm:has(#createAdvancedSettings[open])>.calendar-colors,html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarForm:has(#createAdvancedSettings[open])>.create-standard-summary{display:none!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings>summary{padding:0!important;border:0!important;background:transparent!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings[open]>summary:after{content:'⌄'}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .dialog-head{position:sticky!important;top:-28px!important;background:#fffef8!important;z-index:5!important;padding-top:10px!important}
@media(max-width:680px){html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createCalendarDialog .dialog-head{top:-25px!important}}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .calendar-access-box>.calendar-setting-row,html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .calendar-invite-box>.calendar-setting-row{display:flex!important;flex-direction:column!important;align-items:stretch!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .access-choice{display:flex!important;width:100%!important;box-sizing:border-box!important}
html body#referenceDesign#referenceDesign#referenceDesign#referenceDesign#referenceDesign #createAdvancedSettings .access-choice label{flex:1!important}
