/* Mobile reading and interaction rules. Sources and decisions: docs/referentiel-ux-mobile.md. */
html{font-size:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.nagori-product #app{
    --text-meta:.75rem;
    --text-small:.875rem;
    --text-body:1rem;
    --text-title:1.25rem;
    --text-page:1.75rem;
    --content-gutter:20px;
    --control-gap:12px;
    --field-space:24px;
    --section-space:32px;
    --focus-ring:#88ccd5;
    font-size:var(--text-body);
}
/* Reading roles, distinct from compact metadata and numeric displays. */
.nagori-product #app :is(p,li,blockquote,.post-text,.discussion-text,.bubble,.club-description,.club-rules){font-size:var(--text-body);line-height:1.8;overflow-wrap:anywhere}
.nagori-product #app :is(h1,h2,h3){font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.nagori-product #app h1{font-size:var(--text-page)}
.nagori-product #app h2{font-size:var(--text-title)}
.nagori-product #app h3{font-size:var(--text-body)}
.nagori-product #app :is(.bar-title,.person-name,.compose-author h2,.post-work h3,.library-row h3,.search-result h3,.inbox-row h3){font-size:var(--text-body);line-height:1.5}
.nagori-product #app :is(.small,.form-label,.field-note,.info-box,.privacy-note,.compose-intro,.social-feed-note,.connection-status,.form-between,.import-check,.report-target-label,.club-closure-confirm){font-size:var(--text-small);line-height:1.7}
.nagori-product #app :is(.info-box,.privacy-note,.attach-work .privacy-note) p{font-size:var(--text-small);line-height:1.7}
.nagori-product #app :is(.field-note,.small,.privacy-note,.info-box) :is(small,span:not(.icon)){font-size:inherit}
.nagori-product #app :is(.person-handle,.person-context,.post-meta,.post-kind,.post-audience,.rating-small,.image-tag,.next-progress,.cinema-private-note,.story-name,.badge,.profile-cover-credit,.profile-stats,.message-sent-at,.journal-session-label,.journal-entry-row time,.notification-row time,.notification-unread,.report-history-row time,.moderation-report-copy>time,.asset-credit,.tiny,.step-count,.onboarding-progress){font-size:var(--text-meta);line-height:1.65}
.nagori-product #app :is(.post-meta,.post-audience,.profile-stats,.cinema-private-note) :is(span:not(.icon),a,small){font-size:inherit}
.nagori-product #app :is(.person-button,.club-owner .person-button,.club-owner .person-button>span:last-child){font-size:var(--text-small);line-height:1.65}
.nagori-product #app :is(.poster-card,.profile-favorite-card) h3{font-size:var(--text-small);line-height:1.5}
.nagori-product #app :is(.poster-card,.post-work,.search-result,.inbox-row) p{font-size:var(--text-meta);line-height:1.65}
.nagori-product #app :is(.post-head,.compose-author) .person-handle{font-size:var(--text-meta)}
.nagori-product #app :is(.profile-handle,.account-rating,.profile-bio,.profile-summary,.journal-review>p,.journal-archived-review){font-size:var(--text-small);line-height:1.8}
.nagori-product #app :is(.star-help,.progress-window-note,.share-help,.share-copy,.share-format-note,.account-import-row-title>.small,.account-import-row-title>.field-note,.account-import-row-error,.account-import-row>.field-note){font-size:var(--text-meta);line-height:1.7}
.nagori-product #app :is(.account-import-footnote,.account-file-picker>small,.account-file-picker>span:not(.icon),.journal-result-summary,.report-history-row p,.club-closure-effects p){font-size:var(--text-small);line-height:1.7}
.nagori-product #app .shared-line>.muted{font-size:var(--text-meta);line-height:1.65}
.nagori-product #app .detail-actions .note-share-entry small{font-size:var(--text-meta);line-height:1.65}
.nagori-product #app .detail-actions .note-share-copy{font-size:var(--text-small);line-height:1.5}
.nagori-product #app .cinema-title{font-size:2rem;line-height:1.3}
/* Keep the expressly approved lightweight story overflow counter. */
.nagori-product #app .story-more{font-size:11px;font-weight:400}

/* A readable field and its label stay together; separate groups keep 24px. */
.nagori-product #app .form-label{margin-bottom:8px}
.nagori-product #app :is(.input,.select,.searchbox input,.review-textarea,.compose-text,.discussion-composer textarea,.message-input input,.message-input textarea){font-size:var(--text-body);line-height:1.65;min-width:0;max-width:100%;caret-color:var(--accent)}
.nagori-product #app :is(.input,.select){min-height:48px;height:auto;padding-block:12px}
.nagori-product #app .select{padding-right:44px;background-position:right 16px center}
.nagori-product #app :is(textarea.input,.review-textarea,.compose-text){min-height:9rem;resize:vertical}
.nagori-product #app .compose-writing .compose-text{min-height:11rem;font-size:var(--text-body);line-height:1.85}
.nagori-product #app .compose-writing .form-label{font-size:var(--text-small)}
.nagori-product #app :is(.input,.select,.review-textarea,.compose-writing .compose-text){border-color:#747580;background-color:#13151c}
.nagori-product #app :is(.input,.review-textarea,.compose-text)::placeholder{color:var(--muted);opacity:1}
.nagori-product #app :is(.input,.select,.review-textarea,.compose-text)[aria-invalid=true]{border-color:#efaaa5}
.nagori-product #app :is(.field-note,.social-image-limit){margin-top:8px}
.nagori-product #app .compose-writing{margin-block:var(--field-space)}
.nagori-product #app .compose-tools.compose-media-actions{margin-top:var(--field-space);margin-bottom:8px}
.nagori-product #app .social-image-limit{margin-bottom:var(--section-space);font-size:var(--text-meta)}
.nagori-product #app .attach-work .field{margin-bottom:var(--field-space)}
.nagori-product #app :is(.toggle-line,.import-check,.auth-remember,.social-remove-image){min-height:44px}
.nagori-product #app .toggle-line{gap:12px}
.nagori-product #app .toggle-line :is(.switch,input){flex-shrink:0}

/* Comfortable hit regions; icon drawings and the compact dock keep their scale. */
.nagori-product #app :is(.primary-btn,.secondary-btn,.glass-button,.text-btn,.source-btn,.chip,.tabs>a,.account-tab,.publish-launcher-actions>a,.social-post-options a,.social-post-options button,.work-options-menu a,.work-options-menu button,.message-options-menu .secondary-btn){font-size:var(--text-small);line-height:1.5;min-height:44px;white-space:normal}
.nagori-product #app :is(.primary-btn,.secondary-btn){min-height:48px;padding-block:12px}
.nagori-product #app :is(.icon-btn,.post-head .icon-btn,.save-image,.poster-card .save-image,.poster-rail .save-image,.cinema-visual .save-image,.episode-check,.story-close,.story-reader-close){min-width:44px;min-height:44px;width:44px;height:44px;flex-shrink:0}
.nagori-product #app :is(.post-actions>a,.post-actions>form>button){min-width:44px;min-height:44px;padding-inline:8px;font-size:var(--text-small)}
.nagori-product #app .post-actions{gap:8px}
.nagori-product #app .publish-launcher-actions>a{min-height:44px}
.nagori-product #app .publish-launcher-copy small{font-size:var(--text-meta);line-height:1.65}
.nagori-product #app .publish-launcher-copy strong{font-size:var(--text-body);line-height:1.5}
.nagori-product #app .profile-stats a{min-height:44px;display:inline-flex;align-items:center;gap:4px;padding:8px 10px;font-size:var(--text-meta)}
.nagori-product #app .profile-stats{flex-wrap:wrap;gap:8px}
.nagori-product #app .episode>.text-btn{min-width:44px}
.nagori-product #app :is(.social-feed-tools .text-btn,.journal-result-summary .text-btn,.home-calendar-link>a,.unit-clear-form .text-btn,.scope-fallback,.message-report){font-size:var(--text-small);min-height:44px}
.nagori-product #app .home-calendar-link>a{display:inline-flex;align-items:center}
.nagori-product #app .compose-draft-save{font-size:var(--text-small)}
.nagori-product #app :is(.account-help-disclosure,.account-profile-fields)>summary{font-size:var(--text-small);line-height:1.6;min-height:48px}

/* Flexible content, not clipping, resolves long names, translations and larger text. */
.nagori-product #app .backbar{min-height:80px;height:auto;gap:12px;align-items:center}
.nagori-product #app .backbar>:is(.icon-btn,.spacer){flex:0 0 44px;width:44px}
.nagori-product #app .backbar .bar-title{min-width:0;overflow-wrap:anywhere;white-space:normal;line-height:1.5}
.nagori-product #app .section-title{align-items:baseline;flex-wrap:wrap;row-gap:8px}
.nagori-product #app .section-title h2{flex:1 1 12rem;min-width:0}
.nagori-product #app .section-title>:is(a,button,span){flex:0 0 auto}
.nagori-product #app :is(.cinema-footer,.club-card .card-footer,.post-head,.discussion-comment-head){flex-wrap:wrap;row-gap:8px}
.nagori-product #app .post-head>.person-button{flex:1 1 9rem;min-width:0}
.nagori-product #app .work-identity h1{overflow-wrap:anywhere;white-space:normal}
.nagori-product #app .work-meta{flex-wrap:wrap;gap:8px}
.nagori-product #app .tabs{scroll-padding-inline:var(--content-gutter);gap:8px}
.nagori-product #app .tabs>a{flex:0 0 auto;max-width:none}
.nagori-product #app .button-row{flex-wrap:wrap;row-gap:12px}
.nagori-product #app .button-row>*{flex:1 1 8rem;min-width:0}
.nagori-product #app .detail-actions .note-share-entry{grid-template-columns:20px minmax(0,1fr) 17px;min-height:64px}
.nagori-product #app .form-stack,.nagori-product #app .pad{min-width:0}
.nagori-product #app .shared-line{gap:12px;flex-wrap:wrap}
.nagori-product #app .shared-line>.muted{max-width:100%}

/* Keep the last item and keyboard focus clear of floating navigation and fixed actions. */
.nagori-product #app .app-main{scroll-padding-block:20px calc(100px + env(safe-area-inset-bottom,0px));overscroll-behavior-y:contain}
.nagori-product #app .space-bottom{height:calc(112px + env(safe-area-inset-bottom,0px));flex:0 0 auto}
.nagori-product #app :is(.sticky-action,.message-input,.discussion-composer){flex-shrink:0;padding-bottom:max(16px,env(safe-area-inset-bottom,0px))}
.nagori-product #app .bottom-nav{bottom:max(16px,env(safe-area-inset-bottom,0px))}
.nagori-product #app :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px;scroll-margin-block:24px}
.nagori-product #app .story-reader{touch-action:pinch-zoom}
.nagori-product #app .premium-stars{touch-action:pan-y pinch-zoom}
.nagori-product #app :is(.progress-picker,.episode-picker,.episode-strip,.progress-track){touch-action:pan-x pinch-zoom}
.nagori-product #app :is(.image-tag,.cinema-private-note){background-color:#0b0e16c9;color:#f4f2f0}
.nagori-product #app .asset-credit a{text-decoration:underline;text-underline-offset:.2em}
@media(max-width:360px){
    .nagori-product #app :is(.journal-filter-grid,.release-filters){grid-template-columns:minmax(0,1fr)}
    .nagori-product #app .social-feed-tools{flex-wrap:wrap}
    .nagori-product #app .screen-heading h1{font-size:var(--text-page)}
}
@media(prefers-reduced-transparency:reduce){
    .nagori-product #app :is(.input,.select,.review-textarea,.compose-text,.post,.cinema-card,.library-row){background:#17181d;backdrop-filter:none;-webkit-backdrop-filter:none}
}
/* Reading paragraphs take precedence over old compact utility classes. */
.nagori-product #app :is(.club-description,.club-rules,.profile-bio,.post-text,.discussion-text,.own-private-review .post-text,.screen-heading p,.onboarding-copy p,.report-title p,.message-request p){font-size:var(--text-body);line-height:1.8}
.nagori-product #app .space-bottom{height:24px}
.nagori-product #app:has(>.bottom-nav) .space-bottom{height:calc(112px + env(safe-area-inset-bottom,0px))}
.nagori-product #app :is(.home-calendar-link>span,.cinema-title>span,.result-summary>span,.profile-links,.profile-links>span,.section-title>span,.work-identity>div>span,.scrubber-ends,.scrubber-ends>span,.discussion-comment-heading time,.import-counts span,.release-results>span,.note-share-copy small,.message-inbox-row>time,.share-format-options button small,.share-identity-choice small){font-size:var(--text-meta);line-height:1.65}
.nagori-product #app .share-format-options button>span{font-size:var(--text-small);line-height:1.5}
.nagori-product #app .add-review-toggle small{font-size:var(--text-meta);line-height:1.65}
.nagori-product #app :is(.clear-stars,.rating-privacy summary,.discussion-reply,.discussion-thread-link,.discussion-delete){font-size:var(--text-small);line-height:1.5;min-width:44px;min-height:44px;padding-block:10px}
.nagori-product #app .discussion-reply{padding-inline:8px}
.nagori-product #app .progress-picker>button{touch-action:pan-x pinch-zoom}
.nagori-product #app .progress-scrubber input{touch-action:pan-y pinch-zoom}
.nagori-product #app .shared-line>span{font-size:var(--text-meta);line-height:1.65}
.nagori-product #app :is(.primary-btn,.secondary-btn,.glass-button,.text-btn,.source-btn,.chip,.tabs>a,.account-tab){height:auto}

.nagori-product #app .progress-scrubber input{min-height:44px}
.nagori-product #app .result-summary>a{width:44px;height:44px;min-width:44px;min-height:44px}
.nagori-product #app .app-main{padding-top:env(safe-area-inset-top,0px)}
.nagori-product #app :is(.sticky-action,.message-input,.discussion-composer){padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
/* Win over the grouped control selectors while keeping sign-in actions generous. */
.nagori-product #app[data-scene] :is(.primary-btn,.secondary-btn){min-height:48px}
.nagori-product #app[data-scene=auth] .primary-btn{min-height:52px}

/* Compact selects reserve space for both their label and the legacy dropdown arrow. */
.nagori-product #app[data-scene=auth] #auth-locale{width:5.5rem;min-width:5.5rem;max-width:100%;padding:10px 32px 10px 14px!important;font-size:var(--text-small);line-height:1.5;min-height:48px;background-position:right 12px center}
.nagori-product #app .auth-masthead{flex-wrap:wrap;row-gap:12px}
.nagori-product #app .home-calendar-link{align-items:last baseline;gap:12px}
.nagori-product #app .home-calendar-link>span{flex:1;min-width:0;font-size:var(--text-small);line-height:1.5}
.nagori-product #app .home-calendar-link>a{display:inline-flex;align-items:baseline;justify-content:flex-end;gap:6px;padding-block:12px;flex:0 0 auto;line-height:1.5}
.nagori-product #app .home-calendar-label{font-size:inherit;line-height:inherit}
.nagori-product #app .home-calendar-link>a>.icon{align-self:center;width:16px;height:16px}
.nagori-product #app .next-release-note{align-items:center;gap:12px;padding-block:8px}
.nagori-product #app .next-release-note>.icon{width:20px;height:20px;flex:0 0 20px;margin:0}
.nagori-product #app .next-release-note>p{margin:0;min-width:0;flex:1;line-height:1.8}
.nagori-product #app .compose-author{flex-wrap:wrap;align-items:center;gap:12px}
.nagori-product #app .compose-author>.compose-author-identity{flex:1 1 5.5rem;min-width:0}
.nagori-product #app .compose-author .person-handle{margin:4px 0 0}
.nagori-product #app .compose-author>.avatar{margin:0}
.nagori-product #app .compose-author>.compose-audience{flex:0 0 auto;max-width:100%;margin:0 0 0 auto;align-self:center}
.nagori-product #app .compose-audience>.select{width:7.5rem;min-width:7.5rem;max-width:100%;min-height:44px;padding:10px 32px 10px 12px!important;background-position:right 12px center;font-size:var(--text-small);line-height:1.5;border-radius:18px}
.nagori-product #app[data-scene=home] .home-calendar-link>span{font-size:var(--text-small);line-height:1.5}
.nagori-product #app .next-release-note{align-items:flex-start;font-size:var(--text-body)}
.nagori-product #app .next-release-note>.icon{margin-top:calc((1.8em - 20px)/2)}
.nagori-product #app[data-scene=home] .home-calendar-link>:is(span,a){font-size:var(--text-body);line-height:1.5}
.nagori-product #app .home-calendar-link{flex-wrap:wrap;row-gap:8px}
.nagori-product #app .home-calendar-link>span{flex-basis:6rem;overflow-wrap:anywhere}
.nagori-product #app .home-calendar-link>a{margin-left:auto}

.nagori-product #app .backbar{flex-wrap:wrap}
.nagori-product #app .backbar .bar-title{min-width:min(100%,9ch)}
.nagori-product #app .compose-draft-save{margin-left:auto}
.nagori-product #app .section-title{align-items:last baseline}
.nagori-product #app .journal-result-summary{align-items:last baseline}
