/* Touch targets, safe areas and the visual viewport on phones. */
.message.user{flex-direction:column;align-items:flex-end}.photo-message{max-width:100%}.message-body{overflow-wrap:anywhere;min-width:0}.message-body pre{overflow:auto;max-width:100%;overscroll-behavior-x:contain}.shoe-choice img{object-fit:contain;background:#e9e6e2}.shoe-choice .shoe-label{position:relative;display:block;inset:auto;background:#281e2e;padding:10px 12px;min-height:42px;font-size:12px;line-height:1.4;text-align:left}.shoe-choice{display:flex;flex-direction:column}.shoe-choice img{flex:1;min-height:0}.shoe-choice .shoe-label{width:100%}.shoe-check{z-index:1}
@media(max-width:800px){
 html,body{width:100%;height:var(--app-height,100dvh);min-height:0;overflow:hidden}body{position:relative}.main{width:100%;min-width:0;height:var(--app-height,100dvh);transition:none}.topbar{height:auto;min-height:calc(64px + env(safe-area-inset-top));padding:calc(8px + env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));gap:8px}.header-left{min-width:0;gap:8px}.header-title{font-size:15px;line-height:1.25}.header-title>span{font-size:8px;margin-top:4px;letter-spacing:.08em}.header-right{gap:5px}.icon-btn,#open-sidebar{width:44px;height:44px;min-width:44px}.avatar{width:38px;height:38px;min-width:38px;font-size:10px}.score-pill{height:42px;min-width:65px;padding:8px 10px;gap:5px}.score-pill svg{width:17px}.sidebar{inset:max(8px,env(safe-area-inset-top)) auto max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));width:min(300px,calc(100vw - 44px));padding:16px 12px;overscroll-behavior:contain}.sidebar .nav-action{min-height:46px;font-size:14px}.sidebar .search input{font-size:16px}.sidebar .chat-title{min-height:44px;font-size:13px}.sidebar .delete-chat{width:42px;height:42px}.sidebar-label{font-size:10px}.sidebar-bottom small{font-size:11px}.sidebar-bottom{min-height:65px}.scroll-area{overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;scroll-padding-bottom:12px}.conversation{width:100%;padding:0 16px;margin:6px auto 18px}.message{padding:13px 0}.message.user .message-body{max-width:92%;font-size:16px;line-height:1.5;padding:11px 15px}.message.assistant .message-body{font-size:17px;line-height:1.6}.speaker{font-size:12px;margin-bottom:6px}.message-actions{margin-top:6px;gap:3px;opacity:1}.message-actions .icon-btn{width:40px;height:40px;min-width:40px}.message-actions svg{width:17px;height:17px}.photo-message{max-width:90%}.photo-message img{width:auto;max-width:100%;max-height:300px}.photo-message small{font-size:11px}.composer-area{padding:6px max(10px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));background:linear-gradient(transparent,#19111d 30%)}.composer{padding:12px 10px 8px;border-radius:24px}.composer textarea{font-size:16px;line-height:1.45;max-height:120px;min-height:26px;scroll-padding:8px}.composer-bottom{margin-top:7px;gap:6px}.shoe-action{min-height:44px;padding:8px 10px;font-size:12px;gap:7px}.shoe-action svg{width:18px;height:18px}.send-btn{width:44px;height:44px;min-width:44px}.attach-btn{color:#c9b5c4}.footnote{font-size:9px;line-height:1.4;margin:7px 0 0;letter-spacing:0}.composer-hint{display:none}.welcome{margin:clamp(25px,10vh,90px) auto 28px;padding:0 20px}.welcome h1{font-size:29px}.welcome>p{font-size:13px;line-height:1.5;margin-bottom:24px}.welcome .suggestions{display:grid;grid-template-columns:1fr;max-width:340px;gap:9px}.welcome .suggestion{min-height:54px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px}.welcome .suggestion strong{font-size:12px}.welcome .suggestion small{font-size:10px;line-height:1.4;text-align:right}.quiz-card{padding:16px;border-radius:22px}.quiz-card h2{font-size:22px;line-height:1.2;margin-top:10px}.quiz-subtitle{font-size:12px;line-height:1.5;margin-bottom:16px}.quiz-kicker{font-size:10px;letter-spacing:.09em}.shoe-grid{gap:10px}.shoe-choice img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain}.shoe-choice .shoe-label{font-size:11px;padding:9px;min-height:45px}.shoe-choice:hover:not(:disabled),.shoe-choice:hover:not(:disabled) img{transform:none}.shoe-check{width:25px;height:25px;right:7px;top:7px}.quiz-footer{gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}.quiz-status,.quiz-result{font-size:11px;line-height:1.5}.next-round{min-height:44px;font-size:12px;padding:10px 13px}.quiz-footer .next-round{margin-left:auto}.stats-dialog{max-height:calc(var(--app-height,100dvh) - 28px);width:calc(100% - 24px);padding:22px 18px;border-radius:24px;overflow-y:auto;overscroll-behavior:contain}.dialog-head h2{font-size:28px}.dialog-note{font-size:11px;line-height:1.6}.stat-tile span,.rank-row{font-size:12px}.feedback-dialog label{font-size:14px}.feedback-dialog textarea,.feedback-dialog select{font-size:16px;min-height:44px}.feedback-dialog blockquote{font-size:15px}.solid-button{min-height:46px}.toast{font-size:13px;border-radius:18px;padding:12px 18px;bottom:calc(25px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px)}.error{font-size:13px}.ended-banner{font-size:13px;flex-wrap:wrap;padding:12px 15px}.ended-banner button{min-height:40px}.attachment-preview strong{font-size:13px;max-width:none}.attachment-preview small{font-size:10px}.attachment-preview img{width:48px;height:48px}.onboarding{height:var(--app-height,100dvh);width:100%;overflow-x:hidden}.intro-shell{padding:calc(20px + env(safe-area-inset-top)) 24px calc(18px + env(safe-area-inset-bottom))}.intro-next{min-height:48px}.intro-back{min-height:44px;padding:10px}.intro-copy>p{font-size:14px}.intro-copy .intro-detail{font-size:12px;line-height:1.55}.intro-footer>p{font-size:10px;line-height:1.5}.intro-buttons{gap:8px}.intro-footer{gap:16px}.intro-progress{gap:6px}.ambient span{animation:none;filter:blur(55px);opacity:.11;will-change:auto}.glass{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
 body.keyboard-open .topbar{min-height:52px;padding-top:4px;padding-bottom:4px}body.keyboard-open .header-title>span,body.keyboard-open .footnote{display:none}body.keyboard-open .composer-area{padding-bottom:7px}body.keyboard-open .welcome{margin-top:16px;margin-bottom:15px}body.keyboard-open .welcome-mark,body.keyboard-open .welcome .suggestions{display:none}body.keyboard-open .welcome>p{margin-bottom:0}.onboarding-active .sidebar,.onboarding-active .main{pointer-events:none}
}
@media(max-width:359px){.conversation{padding:0 12px}.quiz-card{padding:13px}.shoe-grid{gap:8px}.quiz-card h2{font-size:20px}.header-title{font-size:14px}.header-title>span{display:none}.welcome h1{font-size:26px}.shoe-action{padding:8px;font-size:11px}.composer-bottom{gap:3px}.intro-shell{padding-left:20px;padding-right:20px}.intro-next{min-width:0;font-size:12px;padding:13px 15px;gap:12px}.intro-progress span.active{width:20px}.intro-copy h1{font-size:35px}}
@media(max-height:740px) and (max-width:800px){.intro-art{height:155px;transform:scale(.58)}.intro-stage{padding-bottom:15px}.intro-shell{padding-top:calc(16px + env(safe-area-inset-top));padding-bottom:calc(14px + env(safe-area-inset-bottom))}.intro-copy h1{font-size:35px;margin-top:8px;margin-bottom:13px}.intro-copy>p{font-size:13px}.intro-copy .intro-detail{font-size:11px;margin-top:10px}.intro-footer>p{font-size:9px}.intro-footer{gap:12px}.welcome{margin-top:28px}}
@media(max-height:450px) and (max-width:800px){.intro-stage{grid-template-columns:.65fr 1fr;gap:20px;padding-top:15px;padding-bottom:15px}.intro-art{height:190px;transform:scale(.55);width:240px;max-width:100%;margin:auto}.intro-copy h1{font-size:27px;margin:6px 0 9px}.intro-copy>p{font-size:11px}.intro-copy .intro-detail{font-size:10px}.intro-shell{padding:14px 24px}.intro-footer>p{display:none}.intro-header{margin-bottom:0}.intro-next{min-height:42px;padding:10px 15px}.topbar{min-height:52px;padding-top:4px;padding-bottom:4px}.footnote,.header-title>span{display:none}.composer{padding-top:9px}.composer-area{padding-bottom:max(5px,env(safe-area-inset-bottom))}.welcome{margin-top:16px}.welcome-mark{display:none}}