.ss-app-page{--ss-drawer-width:clamp(320px,33.333vw,560px);--ss-drawer-backdrop:rgba(7,22,17,.55)}
.ss-app-page .ss-drawer-backdrop:is(:not([hidden]),.is-closing){position:fixed;z-index:79;inset:0;display:block;width:100%;height:100%;padding:0;border:0;border-radius:0;background:var(--ss-drawer-backdrop);opacity:0;transition:opacity .36s cubic-bezier(.42,0,.58,1);cursor:default}
.ss-app-page .ss-drawer-backdrop.is-closing[hidden]{pointer-events:none}
.ss-app-page .ss-drawer-backdrop.is-open:not([hidden]){opacity:1}
.ss-app-page .ss-drawer{position:fixed;z-index:80;top:0;right:0;bottom:0;display:flex;flex-direction:column;width:var(--ss-drawer-width);min-width:0;max-width:100vw;margin:0;background:var(--ss-surface,#fff);color:var(--ss-text);box-shadow:-12px 0 32px #001e3426;transform:translateX(105%);visibility:hidden;transition:transform .36s cubic-bezier(.42,0,.58,1),visibility .36s ease}
.ss-app-page .ss-drawer[hidden]{display:none}
.ss-app-page .ss-drawer.is-closing[hidden]{display:flex;pointer-events:none}
.ss-app-page .ss-drawer.is-open{transform:translateX(0);visibility:visible}
.ss-app-page .ss-add-dropdown.ss-drawer{padding:0;border:0;border-radius:0;overflow:hidden}
.ss-app-page .ss-drawer-heading{position:relative;flex:none;padding:24px 62px 18px 22px;border-bottom:1px solid var(--ss-line,#d5dce3)}
.ss-app-page :is(.ss-drawer,.ss-template-dialog,.ss-voice-discard) .ss-drawer-close{position:absolute;z-index:2;top:18px;right:18px;display:grid;place-items:center;width:34px;height:34px;min-height:34px;padding:0;border:0;border-radius:var(--ss-radius-sm,8px);background:transparent;color:var(--ss-text-muted);font-size:25px;line-height:1;cursor:pointer;transition:background-color .16s ease,color .16s ease}
.ss-app-page :is(.ss-drawer,.ss-template-dialog,.ss-voice-discard) .ss-drawer-close:is(:hover,:focus-visible){background:var(--ss-bg-soft,#f7fafb);color:var(--ss-text)}
.ss-app-page :is(.ss-drawer,.ss-template-dialog,.ss-voice-discard) .ss-drawer-close:focus-visible{outline:2px solid var(--ss-primary);outline-offset:2px}
.ss-app-page .ss-drawer-heading h2{margin:0 0 8px;color:var(--ss-text);font-size:20px;line-height:1.3}
.ss-app-page .ss-drawer-heading p{margin:0;color:var(--ss-muted);font-size:13px;line-height:1.5}
.ss-app-page .ss-drawer-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:20px 22px}
.ss-app-page .ss-drawer-footer{position:relative;z-index:2;display:flex;gap:10px;flex:none;padding:16px 22px;border-top:1px solid var(--ss-line,#d5dce3);background:var(--ss-surface,#fff);box-shadow:0 -8px 18px rgba(5,43,73,.10)}
.ss-app-page .ss-drawer-footer button{flex:1;min-width:0;min-height:40px;padding-inline:8px;border-radius:var(--ss-radius-md,12px)}
.ss-app-page #ss-modal.ss-drawer-overlay:is(:not([hidden]),.is-closing){position:fixed;z-index:1000;inset:auto 0 0;top:var(--ss-modal-viewport-top,0px);display:block;width:100%;height:var(--ss-modal-viewport-height,100dvh);margin:0;padding:0;background:transparent;overflow:hidden}
.ss-app-page #ss-modal.ss-drawer-overlay.is-closing[hidden]{pointer-events:none}
.ss-app-page #ss-modal.ss-drawer-overlay:is(:not([hidden]),.is-closing)::before{content:'';position:absolute;inset:0;background:var(--ss-drawer-backdrop);opacity:0;transition:opacity .36s cubic-bezier(.42,0,.58,1)}
.ss-app-page #ss-modal.ss-drawer-overlay.is-open:not([hidden])::before{opacity:1}
.ss-app-page #ss-modal.ss-drawer-overlay .ss-modal-card.ss-drawer{position:absolute;z-index:1;top:0;right:0;bottom:0;display:flex;flex-direction:column;width:var(--ss-drawer-width);height:100%;min-height:0;max-width:100vw;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:var(--ss-surface,#fff);box-shadow:-12px 0 32px #001e3426;overflow:hidden;scrollbar-gutter:auto}
.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-title{flex:none;margin:0;padding:24px 62px 18px 22px;border-bottom:1px solid var(--ss-line,#d5dce3);font-size:20px;line-height:1.3}
.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:20px 22px calc(22px + env(safe-area-inset-bottom))}
.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-body > form.ss-form{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:15px;min-height:100%}
.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-body > form.ss-form > :not(.ss-form-actions){flex:none;min-height:0;max-width:100%}
.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-body > form.ss-form > .ss-field{align-content:start}
.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-body > form.ss-form :is(input,select,textarea){max-width:100%}
.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-body > form.ss-form > .ss-form-actions{position:sticky;z-index:2;bottom:calc(-22px - env(safe-area-inset-bottom));display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:10px;flex:none;margin:auto -22px calc(-22px - env(safe-area-inset-bottom));padding:14px 22px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--ss-line,#d5dce3);background:var(--ss-surface,#fff);box-shadow:0 -8px 18px rgba(5,43,73,.10)}
.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-body > form.ss-form > .ss-form-actions button{width:100%;min-width:0;min-height:44px;border-radius:var(--ss-radius-md,12px)}
.ss-app-page #ss-transaction-form .ss-transaction-template-link{align-self:flex-start;min-height:44px;margin-top:2px;padding:8px 0;color:var(--ss-link,var(--ss-primary));text-decoration:underline;text-underline-offset:3px;text-align:left}
.ss-app-page #ss-transaction-form .ss-transaction-template-link:hover{color:var(--ss-link-hover,var(--ss-primary-hover))}
.ss-app-page .ss-template-dialog{width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:24px;border:1px solid var(--ss-line,#d5dce3);border-radius:var(--ss-radius-md,12px);background:var(--ss-surface,#fff);color:var(--ss-text);box-shadow:0 16px 48px rgba(0,0,0,.2)}
.ss-app-page .ss-template-dialog::backdrop{background:var(--ss-drawer-backdrop)}
.ss-app-page .ss-template-dialog h2{margin:0 0 8px;padding-right:40px;font-size:20px;line-height:1.3}
.ss-app-page .ss-template-dialog p{margin:0 0 18px;color:var(--ss-muted);font-size:13px;line-height:1.5}
.ss-app-page .ss-template-dialog form{display:grid;gap:14px}
.ss-app-page .ss-template-dialog .ss-field{display:grid;gap:6px}
.ss-app-page .ss-template-dialog .ss-template-error{margin:0;color:var(--ss-danger);font-size:13px}
.ss-app-page .ss-template-dialog .ss-form-actions{display:flex;gap:10px;margin:0}
.ss-app-page .ss-template-dialog .ss-form-actions button{flex:1;min-width:0;min-height:44px;border-radius:var(--ss-radius-md,12px)}
.ss-app-page .ss-voice-discard{position:relative}
.ss-app-page .ss-voice-discard h2{padding-right:40px}
.ss-app-page .ss-template-list{gap:0;margin-bottom:18px}
.ss-app-page .ss-template-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:start;padding:14px 0;border-bottom:1px solid var(--ss-line,#d5dce3)}
.ss-app-page .ss-template-row:first-child{padding-top:0}
.ss-app-page .ss-template-row strong{min-width:0;overflow-wrap:anywhere;font-size:14px}
.ss-app-page .ss-template-row-detail{grid-column:1/-1;color:var(--ss-text-muted);font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.ss-app-page .ss-template-row .ss-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.ss-app-page .ss-template-row .ss-template-action{min-height:24px;padding:0;border:0;background:none;color:var(--ss-link);font-size:12px;text-decoration:underline;text-underline-offset:3px}
.ss-app-page .ss-template-row .ss-template-action:hover{color:var(--ss-link-hover)}
.ss-app-page .ss-template-row .ss-template-action.is-danger{color:var(--ss-danger)}
.ss-app-page .ss-template-name{order:-1}
@media(max-width:480px){.ss-app-page .ss-template-row{grid-template-columns:1fr}.ss-app-page .ss-template-row .ss-actions{justify-content:flex-start;grid-row:3}.ss-app-page .ss-template-row-detail{grid-row:2}}
@media(max-width:900px){.ss-app-page{--ss-drawer-width:min(100vw,400px)}}
@media(max-width:600px){.ss-app-page{--ss-drawer-width:100vw}.ss-app-page .ss-drawer-heading{padding:calc(20px + env(safe-area-inset-top)) 56px 16px 16px}.ss-app-page .ss-drawer .ss-drawer-close{top:calc(16px + env(safe-area-inset-top));right:12px}.ss-app-page .ss-drawer-body{padding:16px}.ss-app-page .ss-drawer-footer{padding:12px 16px calc(12px + env(safe-area-inset-bottom))}.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-title{padding:calc(20px + env(safe-area-inset-top)) 56px 16px 16px}.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-body{padding:16px 16px calc(16px + env(safe-area-inset-bottom))}.ss-app-page #ss-modal.ss-drawer-overlay #ss-modal-body > form.ss-form > .ss-form-actions{bottom:calc(-16px - env(safe-area-inset-bottom));margin:auto -16px calc(-16px - env(safe-area-inset-bottom));padding:12px 16px calc(12px + env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.ss-app-page .ss-drawer,.ss-app-page .ss-drawer-backdrop:is(:not([hidden]),.is-closing),.ss-app-page #ss-modal.ss-drawer-overlay:is(:not([hidden]),.is-closing)::before{transition:none}}
