:root{--primary:#811429;--on-primary:#fff;--cream:#f4ecd0;--surface:#fff8f7;--surface-container-low:#fff0ef;--surface-container-high:#f7e4e2;--on-surface:#231918;--on-surface-variant:#534341;--outline:#857371;--grey-300:#e0e0e0;--grey-500:#9e9e9e;--grey-600:#757575;--error:#ba1a1a;--snackbar-red:#f44336;--inverse-surface:#392e2d;--inverse-on-surface:#ffedeb;--field-height:44px;--field-pad-y:10px;--field-pad-x:12px;--gap:12px;--button-height:36px;--dialog-radius:16px;--dialog-pad:20px;color:var(--on-surface);background:var(--surface);-webkit-font-smoothing:antialiased;font-family:Roboto,system-ui,-apple-system,Segoe UI,sans-serif}*,:before,:after{box-sizing:border-box}body{background:var(--surface);margin:0}button{font:inherit}.icon{flex:none;display:block}.icon--inline{vertical-align:-3px;margin-right:2px;display:inline-block}.icon--muted{color:var(--grey-500)}.app-bar{z-index:10;background:var(--primary);align-items:center;gap:8px;height:56px;padding:0 16px;display:flex;position:sticky;top:0}.app-bar__logo{width:32px;height:32px}.app-bar__title{color:#fff;margin:0;font-size:22px;font-weight:400}.page{flex-direction:column;align-items:center;gap:24px;padding:12px 16px;display:flex}.pane{width:100%;max-width:550px}.quiz-form{gap:var(--gap);flex-direction:column;display:flex}.quiz-form__row{gap:var(--gap);grid-template-columns:minmax(0,1fr) 180px;align-items:start;display:grid}@media (width<=479px){.quiz-form__row{grid-template-columns:minmax(0,1fr)}}@media (width>=1000px){.page{grid-template-columns:minmax(0,1fr) minmax(380px,460px);align-items:stretch;gap:20px;max-width:1400px;height:calc(100dvh - 56px);margin:0 auto;padding:12px 24px;display:grid}.pane{max-width:none;min-height:0;overflow:auto}.pane--editor{padding-top:8px;display:flex}.pane--editor .quiz-form{flex:1}.pane--help{--help-bg:var(--surface-container-low);background:var(--help-bg);border-radius:12px;padding:0 16px 16px}.field--multiline{flex-direction:column;flex:1;min-height:240px;display:flex}.field--multiline .field__box{flex:1;display:flex}.field.field--multiline textarea{flex:1;height:auto}}.field__box{position:relative}.field input,.field textarea{width:100%;padding:var(--field-pad-y) var(--field-pad-x);font:inherit;color:var(--on-surface);border:1px solid var(--outline);background:0 0;border-radius:4px;outline:none;margin:0;font-size:16px;line-height:24px;display:block}.field input{height:var(--field-height)}.field textarea{resize:none;height:500px}.field input:hover,.field textarea:hover{border-color:var(--on-surface)}.field input:focus,.field textarea:focus{border:2px solid var(--primary);padding:calc(var(--field-pad-y) - 1px) calc(var(--field-pad-x) - 1px)}.field__label{left:calc(var(--field-pad-x) - 4px);top:var(--field-pad-y);color:var(--on-surface-variant);background:var(--surface);pointer-events:none;transform-origin:0 0;padding:0 4px;font-size:16px;line-height:24px;transition:transform .15s,color .15s;position:absolute}.field input:focus+.field__label,.field textarea:focus+.field__label,.field input:not(:placeholder-shown)+.field__label,.field textarea:not(:placeholder-shown)+.field__label{transform:translateY(calc(-1 * var(--field-pad-y) - 11px)) scale(.75)}.field input:focus+.field__label,.field textarea:focus+.field__label{color:var(--primary)}.field--error input,.field--error textarea,.field--error input:hover,.field--error textarea:hover,.field--error input:focus,.field--error textarea:focus{border-color:var(--error)}.field--error .field__label,.field--error input:focus+.field__label,.field--error textarea:focus+.field__label,.field__required{color:var(--error)}.field__error{padding:4px var(--field-pad-x) 0;color:var(--error);font-size:12px;line-height:16px}.field__error:empty{display:none}.text-button{height:var(--button-height);color:var(--primary);border-radius:calc(var(--button-height) / 2);cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;padding:0 14px 0 10px;font-size:14px;font-weight:500;display:inline-flex}.text-button:hover{background:color-mix(in srgb, var(--primary) 8%, transparent)}.filled-button{height:var(--button-height);color:var(--on-primary);background:var(--primary);border-radius:calc(var(--button-height) / 2);cursor:pointer;border:none;justify-content:center;align-items:center;padding:0 20px;font-size:14px;font-weight:500;display:flex}.filled-button:hover:not(:disabled){background:color-mix(in srgb, var(--primary) 92%, white);box-shadow:0 1px 2px #0000004d}.filled-button:disabled{cursor:default;color:color-mix(in srgb, var(--on-surface) 38%, transparent);background:color-mix(in srgb, var(--on-surface) 12%, transparent)}.icon-button{width:40px;height:40px;color:var(--on-surface-variant);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;display:inline-flex}.icon-button:hover{background:color-mix(in srgb, var(--on-surface-variant) 8%, transparent)}.icon-button--compact{width:32px;height:32px}.spinner{border:2px solid #fff;border-right-color:#0000;border-radius:50%;width:20px;height:20px;animation:.8s linear infinite spin;display:block}.filled-button:disabled .spinner{border-color:var(--primary);border-right-color:#0000}@keyframes spin{to{transform:rotate(360deg)}}.image-chips{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.image-chips[hidden]{display:none}.image-chip{border:1px solid var(--outline);border-radius:8px;align-items:center;gap:6px;max-width:100%;height:32px;padding:0 4px 0 10px;font-size:14px;display:inline-flex}.image-chip__name{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.image-chip__remove{width:24px;height:24px;color:var(--on-surface-variant);cursor:pointer;background:0 0;border:none;border-radius:50%;flex:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.image-chip__remove:hover{background:color-mix(in srgb, var(--on-surface-variant) 12%, transparent)}.quiz-form__actions{align-items:center;gap:var(--gap);display:flex}.quiz-form__actions .filled-button{flex:1}.dialog{border-radius:var(--dialog-radius);background:var(--surface-container-high);color:var(--on-surface);border:none;max-width:calc(100vw - 80px);padding:0;box-shadow:0 8px 24px #0003}.dialog::backdrop{background:#0000008a}.dialog__surface{padding:var(--dialog-pad)}.dialog__title{margin:0 0 12px;font-size:20px;font-weight:500;line-height:28px}.dialog__content{color:var(--on-surface-variant);font-size:14px;line-height:20px}.dialog__content p{margin:0 0 8px}.dialog__content--error{width:min(450px,80vw)}.dialog__list{margin:0;padding:0;list-style:none}.dialog__heading{color:var(--on-surface);overflow-wrap:anywhere;font-weight:700}.dialog__note{color:var(--grey-600);font-size:13px}.dialog__actions{justify-content:flex-end;gap:8px;margin-top:16px;display:flex}.details summary{min-height:40px;color:var(--on-surface);cursor:pointer;justify-content:space-between;align-items:center;font-size:16px;list-style:none;display:flex}.details summary::-webkit-details-marker{display:none}.details__chevron{transition:transform .2s}.details[open] .details__chevron{transform:rotate(180deg)}.details__body{white-space:pre-wrap;overflow-wrap:anywhere;height:200px;color:var(--on-surface-variant);margin:4px 0 0;font-family:inherit;font-size:14px;overflow:auto}.snackbar{z-index:20;color:var(--inverse-on-surface);background:var(--inverse-surface);padding:14px 16px;font-size:14px;line-height:20px;animation:.25s ease-out snackbar-in;position:fixed;bottom:0;left:0;right:0}.snackbar--floating{border-radius:4px;bottom:16px;left:16px;right:16px;box-shadow:0 3px 6px #0003}.snackbar--error{color:#fff;background:var(--snackbar-red)}@keyframes snackbar-in{0%{opacity:0;transform:translateY(100%)}}.examples__header{z-index:1;background:var(--help-bg,var(--surface));flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 0 8px;display:flex;position:sticky;top:0}.examples__title{margin:0;font-size:20px;font-weight:700}.video-button{color:#000000de;background:#d5dfe7;border-radius:16px;align-items:center;gap:6px;height:32px;padding:0 14px 0 10px;font-size:14px;font-weight:500;text-decoration:none;display:inline-flex}.video-button:hover{background:#c8d4de}.video-button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.accordion{border-top:1px solid var(--grey-300)}.help-group+.help-group{margin-top:16px}.help-group__title{letter-spacing:.06em;text-transform:uppercase;color:var(--on-surface-variant);margin:0 0 4px;font-size:12px;font-weight:500}.accordion__item{border-bottom:1px solid var(--grey-300)}.accordion__heading{font:inherit;margin:0}.accordion__header{text-align:left;width:100%;color:var(--on-surface);cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;gap:8px;padding:8px 4px;font-size:16px;font-weight:700;display:flex}.accordion__header:hover{background:color-mix(in srgb, var(--primary) 6%, transparent)}.accordion__header:focus-visible{outline:2px solid var(--primary);outline-offset:-2px}.accordion__item--open .accordion__title{color:var(--primary)}.accordion__chevron{color:var(--on-surface-variant);transition:transform .2s}.accordion__item--open .accordion__chevron{transform:rotate(180deg)}.accordion__panel{padding:0 4px 12px}.example__description{color:var(--grey-600);white-space:pre-line;margin:0 0 8px;font-size:14px}.steps__intro,.steps__note{margin:0 0 8px;font-size:14px;line-height:20px}.steps__note{color:var(--grey-600)}.steps__list{margin:0 0 12px;padding-left:22px;font-size:14px;line-height:20px}.steps__list li+li{margin-top:6px}.code-box{background:var(--cream);border:1px solid var(--outline);border-radius:8px;padding:12px;position:relative}.code-box__text{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;padding-right:36px;font-family:Roboto Mono,ui-monospace,monospace;font-size:13px;line-height:1.4}.code-box__copy{position:absolute;top:12px;right:12px}.help-footer{color:var(--grey-600);margin:16px 0 0;font-size:12px}.help-footer a{color:inherit}.help-footer a:hover{color:var(--primary)}