:root{--host-font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--host-field-radius:22px;--host-panel-radius:24px;--host-focus:#b6dd90;--host-error:#ff9b9b;--host-danger-fill:#a72d3c;--host-danger-ink:#fff;--host-status-success:#acdba0;--host-ui-muted:var(--host-control-muted);--host-ui-focus:var(--host-focus);--host-ui-error:var(--host-error)}:root[data-theme=light]{--host-focus:#506938;--host-error:#ad2424;--host-status-success:#315734}.host-ui{font-family:var(--host-font);color:var(--host-control-ink);font-synthesis:none}.host-ui:not(.host-media-dialog){line-height:1.5}.host-ui.host-page{padding-bottom:calc(32px + env(safe-area-inset-bottom));overflow-wrap:anywhere}.host-ui.host-not-found{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;min-height:100svh;padding:24px max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:var(--background)}.host-not-found h1{margin:0;font-size:24px;line-height:32px;font-weight:600}.comment-controls .icon-button{min-width:44px;width:44px;height:44px}.comment-controls .text-button{min-height:44px}#prototype .host-panel,.host-ui .host-panel,.host-ui.host-panel{border-color:var(--host-control-edge);border-radius:var(--host-panel-radius);background:var(--host-control-opaque);color:var(--host-control-ink);font-family:var(--host-font);box-shadow:var(--host-floating-shadow);backdrop-filter:none;-webkit-backdrop-filter:none}.host-ui.host-confirm :is([data-slot=alert-dialog-action],[data-slot=alert-dialog-cancel]),.host-ui:not(.host-media-dialog) :is(.primary-button,.secondary-button),:is(.host-ui,#prototype) .host-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:9px 16px;border:1px solid var(--host-control-edge);border-radius:var(--host-field-radius);background:var(--host-control-surface);color:var(--host-control-ink);box-shadow:none;font-family:var(--host-font);font-size:16px;line-height:24px;font-weight:500;text-decoration:none;white-space:normal;text-align:center;cursor:pointer}.host-ui:not(.host-media-dialog) .text-button,:is(.host-ui,#prototype) .host-button-quiet{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 12px;border:1px solid transparent;border-radius:var(--host-field-radius);background:transparent;color:var(--host-control-ink);box-shadow:none;font-family:var(--host-font);font-size:14px;line-height:24px;font-weight:400;text-decoration:none;cursor:pointer}:is(.host-ui,#prototype) .host-icon-button{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:1px solid var(--host-control-edge);border-radius:50%;background:var(--host-control-surface);color:var(--host-control-ink);box-shadow:none;cursor:pointer}.host-ui.host-page a.host-icon-button{text-decoration:none}:is(.host-ui,#prototype) .host-icon-button>svg{width:22px;height:22px;stroke-width:1.8;flex:none}.host-ui:not(.host-media-dialog) .field :is(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),textarea,select,[data-slot=select-trigger]),:is(.host-ui,#prototype) :is(input.host-field,textarea.host-field,select.host-field,button.host-field){box-sizing:border-box;width:100%;min-width:0;min-height:44px;padding:9px 16px;border:1px solid var(--host-control-edge);border-radius:var(--host-field-radius);background-color:var(--host-control-surface);color:var(--host-control-ink);box-shadow:none;font-family:var(--host-font);font-size:16px;line-height:24px;font-weight:400}.host-ui:not(.host-media-dialog) .field [data-slot=select-trigger]{display:flex;height:44px;gap:9px;justify-content:space-between}.host-ui textarea.host-field,.host-ui:not(.host-media-dialog) .field textarea{min-height:96px;resize:vertical}.host-ui .host-field::placeholder,.host-ui:not(.host-media-dialog) .field :is(input,textarea)::placeholder{color:var(--host-control-muted);opacity:1}.host-ui:not(.host-media-dialog) .field .username-input input{padding-left:34px!important}.host-ui:not(.host-media-dialog) .field .username-input>span{left:16px;color:var(--host-control-muted)}.host-ui select.host-field,.host-ui:not(.host-media-dialog) .field select{appearance:none;-webkit-appearance:none;padding-right:40px;background-image:linear-gradient(45deg,transparent 50%,var(--host-control-muted) 50%),linear-gradient(135deg,var(--host-control-muted) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat}.host-ui select option{background:var(--host-control-opaque);color:var(--host-control-ink)}.host-ui:not(.host-media-dialog) :is(.field,.check-row,.terms-consent) input:is([type=checkbox],[type=radio]){accent-color:var(--host-focus)}:is(.host-ui,#prototype) :is(.host-button,.host-icon-button):is([aria-pressed=true],[aria-current=page],[data-state=on]){background:var(--host-selected-surface);color:var(--host-control-ink);border-color:var(--host-control-muted)}.host-ui.host-confirm,.host-ui.host-dialog{width:min(480px,calc(100vw - 32px));max-width:calc(100vw - 32px)!important;top:calc(var(--visual-top,0px) + (var(--visual-height,100dvh) + env(safe-area-inset-top) - env(safe-area-inset-bottom))/2);max-height:calc(var(--visual-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);padding:24px!important;border:1px solid var(--host-control-edge)!important;border-radius:var(--host-panel-radius)!important;background:var(--host-control-opaque);color:var(--host-control-ink);box-shadow:var(--host-floating-shadow);backdrop-filter:none;-webkit-backdrop-filter:none;overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:16px;gap:16px}.host-ui.host-confirm,.host-ui.host-dialog.collections-panel,.host-ui.host-dialog.settings-panel{width:min(420px,calc(100vw - 32px))}.host-ui.host-dialog.login-dialog{width:min(360px,calc(100vw - 32px))}.host-ui.host-confirm [data-slot=alert-dialog-title],.host-ui.host-dialog :is([data-slot=dialog-title],[data-slot=alert-dialog-title]){font-size:20px;line-height:28px;font-weight:600;letter-spacing:-.3px;overflow-wrap:anywhere}.host-ui.host-dialog>[data-slot=dialog-header]{padding-right:40px;text-align:left}.host-ui.host-dialog:not(.login-dialog){padding:20px!important}.host-ui.host-dialog>[data-slot=dialog-header]:has(>[data-slot=dialog-title]:not(.sr-only):only-child){display:flex;align-items:flex-start;justify-content:center;min-height:44px;margin-top:-8px;padding-right:48px}.host-ui.host-confirm [data-slot=alert-dialog-description],.host-ui.host-dialog :is([data-slot=dialog-description],.muted){font-size:14px;line-height:22px;color:var(--host-control-muted)}.host-ui.host-dialog>[data-slot=dialog-close]{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:1px solid var(--host-control-edge);border-radius:50%;background:var(--host-control-surface);color:var(--host-control-ink);opacity:1;box-shadow:none}.host-ui.host-dialog>[data-slot=dialog-close]>svg{width:22px;height:22px;stroke-width:1.8}.host-ui.host-media-dialog>[data-slot=dialog-close]{min-width:48px;min-height:48px;display:grid;place-items:center}.host-ui.host-dialog.settings-panel,.host-ui.host-dialog:has(>.host-dialog-body){display:flex;flex-direction:column;gap:0;padding:0!important;overflow:hidden}.host-dialog-header,.host-ui.host-dialog .settings-panel-header{display:flex;align-items:center;gap:8px;flex:none;min-height:68px;padding:12px 72px 12px 20px;border-bottom:1px solid var(--host-control-edge);text-align:left}.host-dialog-header [data-slot=dialog-title]{margin:0}.host-dialog-body,.host-ui.host-dialog .settings-panel-body{min-height:0;padding:16px 20px 20px;overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:16px;scrollbar-gutter:stable}.host-ui.host-dialog .settings-panel-header [data-slot=dialog-title]{font-weight:600}.host-ui.host-dialog .host-form-body{display:flex;flex-direction:column;gap:16px}.host-ui.host-dialog .host-form-body>*{flex-shrink:0}.host-ui.host-dialog .host-form-body>.form-stack:first-child{margin-top:0}.host-ui.host-dialog :is(.settings-action,.media-settings label){border-radius:22px;color:var(--host-control-ink);min-height:44px}.host-ui.host-dialog :is(.settings-action>svg,.settings-section>h3,.media-settings legend){color:var(--host-control-muted)}.host-ui.host-dialog .settings-action[aria-pressed=true]{background:var(--host-selected-surface)}.host-ui.host-dialog .settings-action>svg,.host-ui.host-dialog .settings-logout>svg{width:22px;height:22px;stroke-width:1.8}.host-ui.host-dialog .settings-action>.settings-chevron{width:18px;height:18px}.host-ui.host-dialog .settings-logout>svg{top:11px}.host-ui.host-dialog .media-settings label:focus-within{outline:none}:root:not([data-pointer-focus]) .host-ui.host-dialog .media-settings label:has(input:focus-visible){outline:2px solid var(--host-focus);outline-offset:-2px}.host-ui.host-dialog .settings-back{border:1px solid var(--host-control-edge);background:var(--host-control-surface);color:var(--host-control-ink)}.host-ui.host-dialog .settings-destructive,.host-ui.host-dialog .settings-destructive>svg{color:var(--host-error)}.host-ui.host-dialog .photo-drop{border:1px solid var(--host-control-edge);border-radius:22px;padding:12px;background:transparent}.host-ui.host-dialog .profile-photo-editor{gap:12px}.host-ui.host-dialog .photo-picker>.avatar.large{width:56px;height:56px;font-size:22px}.host-ui.host-dialog .photo-picker>svg{stroke-width:1.8}.host-ui.host-dialog .file-field{padding:0;border:0;border-radius:22px;background:transparent;gap:8px}.host-ui.host-dialog button.file-choice{display:flex;flex-wrap:nowrap;justify-content:flex-start;width:100%;min-width:0;gap:9px;text-align:left}.host-ui.host-dialog .file-choice-action{flex:none}.host-ui.host-dialog .file-choice .file-name{flex:1;min-width:0;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--host-control-muted);font-size:14px;font-weight:400}.host-ui.host-dialog .file-choice .file-name:empty{display:none}.host-ui.host-dialog .file-field:has(input[aria-invalid=true]) .file-choice{border-color:var(--host-error)}.host-ui.host-dialog .file-field .form-error{padding:0;border:0;border-radius:0;background:transparent}.host-ui.host-dialog :is(.file-field,.photo-drop).is-dragging{outline:2px solid var(--host-focus);outline-offset:3px;background:transparent}.host-ui.host-dialog .field{font-weight:500}.host-ui.host-dialog :is(.primary-button,.secondary-button,.host-button)>svg{width:20px;height:20px;stroke-width:1.8;flex:none}.host-ui.host-dialog .avatar-list>button>svg{width:20px;height:20px;stroke-width:1.8;flex:none}.host-ui.host-dialog .avatar-list>button{border-radius:22px}.host-ui.host-dialog .avatar-list>button.active{border-color:var(--host-control-edge);background:var(--host-selected-surface)}.host-ui.host-menu{padding:6px;border:1px solid var(--host-control-edge);border-radius:20px;background:var(--host-control-opaque);color:var(--host-control-ink);box-shadow:var(--host-floating-shadow);backdrop-filter:none;-webkit-backdrop-filter:none}.host-ui.host-menu :is([data-slot=select-item],[data-slot=dropdown-menu-item],[data-slot=dropdown-menu-checkbox-item],[data-slot=dropdown-menu-radio-item],[data-slot=dropdown-menu-sub-trigger]){min-height:44px;border-radius:14px;font-family:var(--host-font);font-size:14px;line-height:22px}.host-ui.host-menu :is([data-highlighted],[data-state=open]){background:var(--host-selected-surface);color:var(--host-control-ink)}.host-ui.host-menu [data-variant=destructive]{color:var(--host-error)}.host-ui.host-menu :is([data-slot=select-label],[data-slot=dropdown-menu-label]){color:var(--host-control-muted)}.host-ui:not(.host-media-dialog) :is(.primary-button,.secondary-button,.text-button,.field input,.field textarea,.field select,.field [data-slot=select-trigger]):is(:disabled,[aria-disabled=true],[data-disabled]),:is(.host-ui,#prototype) :is(.host-button,.host-button-quiet,.host-icon-button,.host-field):is(:disabled,[aria-disabled=true],[data-disabled]){opacity:.55;cursor:default}.host-ui:not(.host-media-dialog) :is(.field input,.field textarea,.field select,.field [data-slot=select-trigger])[aria-invalid=true],:is(.host-ui,#prototype) .host-field[aria-invalid=true]{border-color:var(--host-error)}.host-ui .file-field:has(input[aria-invalid=true]){border-color:var(--host-error)}.host-ui:not(.host-media-dialog) :is(.form-error,.host-status,.notice){margin:0;padding:12px 16px;border:1px solid var(--host-control-edge);border-radius:18px;background:var(--host-control-surface);font-size:14px;line-height:22px;overflow-wrap:anywhere}.host-ui:not(.host-media-dialog) :is(.form-error,.host-status-error){color:var(--host-error)}.host-ui .host-status-success{color:var(--host-status-success)}.host-ui.host-confirm :is(.collection-delete-confirm,[data-variant=destructive]),.host-ui:not(.host-media-dialog) .delete-account-button,:is(.host-ui,#prototype) .host-button.host-button-danger{background:var(--host-danger-fill);border-color:transparent;color:var(--host-danger-ink)}:root:not([data-pointer-focus]) #prototype :is(.host-button,.host-icon-button,.host-field):focus-visible,:root:not([data-pointer-focus]) .host-ui:not(.host-media-dialog) :is(button,a,input,textarea,select,summary,[tabindex]):focus-visible{outline:2px solid var(--host-focus);outline-offset:2px;box-shadow:none}:root:not([data-pointer-focus]) .host-ui.host-menu [data-highlighted]{outline:2px solid var(--host-focus);outline-offset:-2px}@media(hover:hover){.host-ui:not(.host-media-dialog) :is(.primary-button,.secondary-button,.text-button):not(:disabled):not([aria-disabled=true]):hover,:is(.host-ui,#prototype) :is(.host-button,.host-icon-button,.host-button-quiet):not(:disabled):not([aria-disabled=true]):hover{background:var(--host-selected-surface);opacity:1}.host-ui.host-dialog :is(.settings-action,.media-settings label):hover{background:var(--host-selected-surface)}.host-ui.host-dialog>:is([data-slot=dialog-close],.settings-back):hover{background:var(--host-selected-surface)}.host-ui:not(.host-media-dialog) .delete-account-button:not(:disabled):hover,:is(.host-ui,#prototype) .host-button.host-button-danger:not(:disabled):hover{background:var(--host-danger-fill);filter:brightness(1.1)}}.host-ui.host-toaster [data-sonner-toast]{font-family:var(--host-font);background:var(--host-control-opaque);color:var(--host-control-ink);border:1px solid var(--host-control-edge);border-radius:20px;box-shadow:var(--host-floating-shadow)}.host-ui.host-toaster [data-description]{color:var(--host-control-muted)}.host-ui.host-toaster [data-type=error] [data-icon]{color:var(--host-error)}.host-ui.host-toaster [data-type=success] [data-icon]{color:var(--host-status-success)}@media(max-height:480px){.host-ui.host-confirm,.host-ui.host-dialog{max-height:calc(var(--visual-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 16px)}}@media(forced-colors:active){.host-ui :is(.host-button,.host-icon-button,.host-field),.host-ui:not(.host-media-dialog) .field :is(input,textarea,select,[data-slot=select-trigger]){border-color:ButtonText}.host-ui .field select,.host-ui select.host-field{appearance:auto;background-image:none}}