/* 1.3.1: one shared gutter for mobile water details; no outer frame. */
@media(max-width:700px){
 dialog.water-dialog{inset:0 0 66px;margin:0;width:100%;max-width:100%;height:auto;max-height:calc(100dvh - 66px);border:0;border-radius:0;padding:0;scrollbar-gutter:auto;box-shadow:none}
 dialog.water-dialog[data-panel=expanded]{max-height:calc(100dvh - 66px)}
 .water-dialog .water-dialog-top,.water-dialog .water-hero{padding-inline:12px}
 .water-dialog .water-overview{padding:0;gap:12px}
 .water-dialog .water-overview>div,.water-dialog .water-overview>aside{min-width:0;width:100%;padding:0;margin-inline:0}
 .water-dialog .water-section,.water-dialog .water-note,.water-dialog .night-fishing-notice{box-sizing:border-box;width:100%;margin-inline:0;padding-inline:12px}
 .water-dialog .night-fishing-notice{margin-block:12px}
 .water-dialog .water-section,.water-dialog .water-note{margin-block:0 12px}
}

.settings-section131{box-sizing:border-box;width:100%;min-width:0;margin:0 0 16px;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--surface,transparent);display:flex;flex-direction:column;gap:12px}
.settings-section131 h3{font-family:inherit;font-size:1.15rem;font-weight:650;line-height:1.35;margin:0 0 4px}
#view-settings h2,#view-account-settings h2{font-size:1.6rem;line-height:1.25}
#view-settings p,#view-account-settings p,.settings-section131 p{font-family:inherit;font-size:.95rem;font-weight:400;line-height:1.6;margin:0}
#view-settings,#view-account-settings,#view-journal,#view-public{min-width:0;word-break:normal;overflow-wrap:normal;hyphens:none}
#view-settings button,#view-account-settings button,.settings-section131 button{word-break:normal;overflow-wrap:normal;white-space:normal}
.settings-section131 input,.settings-section131 select,.settings-section131 textarea{box-sizing:border-box;min-width:0;max-width:100%}
.settings-section131 .journal-filters{margin:0;width:100%}
#export1222{display:flex;flex-direction:row;flex-wrap:wrap}#export1222 h3{flex-basis:100%}
#view-account-settings{display:flex;flex-direction:column;gap:12px}#view-account-settings[hidden]{display:none}
#view-account-settings>h2{order:-3}#view-account-settings>p{order:-2}
#view-settings .settings-grid{display:block}#settings-form{display:block}
#statistics1222,#view-journal>.toolbar{border:1px solid var(--line);border-radius:16px;padding:20px;margin-block:0 16px}
@media(max-width:700px){
 .settings-section131{padding:16px}
 .top-actions #mobile-account{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .sidebar nav .nav{flex:1 1 0;width:0;min-width:0;word-break:normal;overflow-wrap:normal}
 #logout-top{display:none}
}

[data-theme=dark] .water-dialog,[data-theme=dark] .water-dialog :is(.water-dialog-top,.water-hero,.water-section,.water-note,.water-empty,.water-revir,.water-catch){background:var(--paper);color:var(--ink);border-color:var(--line)}
[data-theme=dark] .water-dialog .weather-grid>div{background:#19251c;color:var(--ink)}
[data-theme=dark] .night-fishing-notice{background:#20251b;color:var(--ink);border-color:var(--line)}
[data-theme=dark] .night-fishing-forbidden{background:#302817;color:#e8d6ad}
[data-theme=dark] .water-hero{background:linear-gradient(125deg,#1d2818,#202020)}

.settings-section131>h3{order:-1}
.settings-section131 summary,#statistics1222 summary{font-size:1.05rem;font-weight:600;line-height:1.4;cursor:pointer}
.settings-section131 details[open]>summary{margin-bottom:16px}
[data-theme=dark] :is(.water-list,.water-row,.map-layout,.catalog-card,.catch-card,.stat-card,.water-section,.admin-user){background:var(--paper);color:var(--ink);border-color:var(--line)}
[data-theme=dark] .catch-placeholder{background:#29372a;color:#a3b59a}
.top-actions #logout-top{display:none}
.top-actions #mobile-account{justify-content:flex-start;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav svg,.icon-button svg{width:18px;height:18px;display:inline-block;flex:none;vertical-align:middle}

.sidebar>.account{display:none}

#view-settings .form-note,#view-account-settings .form-note{font-size:.9rem!important;line-height:1.6}
.top-actions #mobile-account{display:block!important}

/* Owner's mobile text scale: section headings match the heading beside the date. */
@media(max-width:700px){
 .heading h1,.view h2,.view h3,#view-settings h2,#view-account-settings h2,dialog h2,dialog.water-dialog .water-hero h2,dialog.water-dialog .water-section h3{font-size:1.25rem;line-height:1.3}
 .heading p{font-size:.6875rem;line-height:1.5}
 .view,.view p,.view label,.view .info,.view .notice,.view .catch-card .info span,.water-dialog p,.water-dialog dt,.water-dialog dd,dialog label,dialog p{font-size:.75rem;line-height:1.5}
 .view .form-note,#view-settings .form-note,#view-account-settings .form-note,dialog .form-note{font-size:.75rem!important;line-height:1.5}
 .view .catch-card h3,.view .catalog-card h3,.settings-section131 h3,.settings-section131 summary,#statistics1222 summary,.water-dialog .water-note h3{font-size:1rem;line-height:1.35}
 .view .button,.view .text-button,.view input,.view select,.view textarea,.settings-section131 button{font-size:.75rem}
 .view .summary-grid b{font-size:1.125rem}
 .latest-catch span{font-size:.625rem}
}

/* Account settings have their own section navigation, separate from the app menu. */
#account-sections131{display:none}
.account-mode131 .sidebar,.account-mode131 .topbar,.account-mode131 .heading,.account-mode131 main>footer{display:none!important}
.account-mode131 .workspace{margin-left:0}
.account-mode131 #account-sections131{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:1000;gap:6px;padding:8px;background:var(--paper);border-top:1px solid var(--line);overflow-x:auto}
#account-sections131 button{flex:1 0 90px;white-space:normal;font-size:12px}
#account-sections131 .active{background:var(--green);color:var(--paper)}
#account-back131{order:-5;align-self:flex-start}
#view-account-settings>.settings-section131[hidden]{display:none}
.account-mode131 main{padding-bottom:100px}

#account-sections131 button{flex:1 0 80px;padding:8px 4px;min-height:54px;word-break:normal;overflow-wrap:normal;line-height:1.3}
#account-sections131 .active{background:#174d35;color:#f1f4ec;border-color:#94b99b}
@media(max-width:700px){#view-account-settings p{font-size:.75rem;line-height:1.5}}

.account-actions131{display:flex;flex-direction:column;gap:12px}
.account-actions131>.button{width:100%;min-height:44px}
/* Preserve separation for stacked and wrapped actions throughout every view/dialog. */
:is(.toolbar,.actions,.form,.journal-actions,.journal-filters,.settings-section131,.dialog-actions,.water-actions,.account-actions131){row-gap:12px}
.account-actions131>button+button{margin-block-start:0}


/* 1.3.2: the complete footer stays centered on desktop and mobile. */
main>footer{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px}
main>footer>div{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 22px;margin-top:0}

/* 1.3.4: shared edges and compact journal controls, preserving the palette. */
.view{min-width:0;max-width:100%;box-sizing:border-box}
.view>:is(.surface,.settings-section131,.toolbar,.summary-grid){box-sizing:border-box;max-width:100%;margin-inline:0}
.view :is(.toolbar,.actions,.dialog-actions){flex-wrap:wrap;min-width:0}
.view :is(input,select,textarea){box-sizing:border-box;max-width:100%;min-width:0}
.view :is(button,label,p,h2,h3){overflow-wrap:break-word}
.image-dialog{box-sizing:border-box;max-width:min(1100px,96vw);max-height:94dvh;overflow:auto}
.image-dialog>img{display:block;max-width:100%;max-height:72dvh;object-fit:contain;margin:auto}
.photo-actions134{display:flex;justify-content:flex-end;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.water-label-action{font:inherit;color:inherit;padding:2px 4px;border:0;background:transparent;cursor:pointer;white-space:normal}
.water-label-action:focus-visible{outline:2px solid var(--green);outline-offset:2px}
#view-journal{font-size:max(12px,.75rem)}
#view-journal :is(p,label,input,select,textarea,.button,.text-button,.info,.form-note){font-size:max(12px,.75rem);line-height:1.5}
#view-journal :is(h3,summary){font-size:max(13px,.85rem)}
#view-journal :is(input,select,textarea){border:1px solid var(--line);border-radius:12px;padding:8px 10px;color:inherit;background:var(--paper,#f8faf5)}
#view-journal :is(input,select){min-height:36px}
#view-journal :is(input,select,textarea):focus-visible{outline:2px solid var(--green);outline-offset:2px}
#view-journal .journal-filters{gap:9px;grid-template-columns:repeat(auto-fit,minmax(min(135px,100%),1fr))}
#view-journal .settings-section131{padding:15px;gap:9px}
#view-journal .toolbar{padding:15px;gap:9px}
#view-journal .search-box{min-width:0;flex:1 1 180px;padding:8px 12px}
#view-journal .search-box input{border:0;min-height:20px;padding:0;background:transparent}
#view-journal .trip-controls134{margin-bottom:12px}
html[data-theme="dark"] #view-journal :is(input,select,textarea){background:#19251c}
@media(pointer:coarse){#view-journal :is(button,input,select){min-height:44px}}

.journal-calendar134{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin-block:10px}.journal-calendar134 button{padding:6px 2px;min-width:0;font-size:12px}

.journal134-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-block:8px}.journal134-form :is(input,select,textarea){border-radius:12px;max-width:100%;box-sizing:border-box}.journal134-form :is(input,select){min-height:44px}.journal134-form :is(label,p,input,select,textarea,button){font-size:max(12px,.75rem)}
.photo-comparison134{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.photo-comparison134 figure{margin:0;min-width:0}.photo-comparison134 img{width:100%;height:auto;max-height:60vh;object-fit:contain}.photo-comparison-toggle134{display:none}@media(max-width:600px){.photo-comparison134{display:block}.photo-comparison134[data-show="0"] figure:nth-child(2),.photo-comparison134[data-show="1"] figure:nth-child(1){display:none}.photo-comparison-toggle134{display:inline-flex}}

/* Primary journal actions stay paired, in the same order on narrow screens. */
.journal-primary-actions134{display:flex;align-items:stretch;gap:8px;min-width:0}.journal-primary-actions134>.button{min-height:44px;white-space:normal;text-align:center;flex:1;min-width:0}@media(max-width:600px){.journal-primary-actions134{flex:1 1 100%;width:100%}}
@media(min-width:601px){.journal-primary-actions134>.button{white-space:nowrap}}

/* 1.3.4 spacing: action groups keep a gap both across and between wrapped lines. */
:root{--control-gap134:12px}
:is(.actions,.dialog-actions,.journal-actions,.export-tools,.water-actions){display:flex;flex-wrap:wrap;align-items:center;gap:var(--control-gap134)}
:is(.session-card,.admin-user):has(>button){display:flex;flex-wrap:wrap;align-items:center;gap:var(--control-gap134)}
:is(.session-card,.admin-user)>:is(h2,h3,p,details,form,div){flex-basis:100%;min-width:0;margin-block:0}
.notice:has(>button){display:flex;flex-wrap:wrap;align-items:center;gap:var(--control-gap134)}
:is(.view,dialog)>button+:is(section,article,details,form){margin-block-start:var(--control-gap134)}
:is(.view,dialog)>.journal-primary-actions134+:is(section,article,details,form){margin-block-start:var(--control-gap134)}
.journal-period134{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;grid-column:1/-1;min-width:0}.journal-period134 label{display:grid;gap:7px;min-width:0}.journal-period134 select{width:100%;min-height:44px}
.map-toolbar{column-gap:8px}

/* Owner layout addition: journal tools open from one accessible icon row. */
.journal-action-nav134{display:flex;justify-content:flex-end;align-items:center;gap:12px;margin-block:12px}
.journal-action-nav134 .journal-icon134{display:inline-flex;align-items:center;justify-content:center;min-width:44px;width:44px;min-height:44px;padding:10px;border-radius:12px}
.journal-icon134 svg{width:24px;height:24px;flex-shrink:0}.journal-icon134.active{background:var(--lime);color:var(--green-dark)}
#view-journal #journal-navigation134+div{margin-top:12px}
.public-water-search134{display:flex;width:100%;margin-block:18px;min-height:52px;border-radius:14px;gap:12px;padding:12px 18px;box-sizing:border-box}
.public-water-search134 input{width:100%;min-width:0;flex:1;border:0;background:transparent;color:inherit;outline-offset:3px}
#view-statistics .settings-section131{margin-block:12px}#view-statistics .summary-grid{margin-bottom:16px}
@media(max-width:600px){.sidebar nav>.nav{flex:1;min-width:0;padding-inline:3px;white-space:normal;overflow-wrap:anywhere;min-height:56px}.sidebar nav{gap:2px}.journal-action-nav134{justify-content:center}.public-water-search134{padding:12px;gap:8px}}

/* Owner typography correction: supporting titles shrink, main mobile title grows. */
#view-public .latest-section h2{font-size:1rem;line-height:1.3}
#view-public .settings-section131>details>summary,#view-public details>summary{font-size:.8rem;line-height:1.4}
@media(max-width:600px){.heading #page-title{font-size:1.7rem;line-height:1.2}.heading #page-title em{font-size:inherit}.heading>div:first-child{min-width:0}.heading p{font-size:.75rem;line-height:1.45}.heading{gap:14px}}

@media(max-width:600px){.sidebar{height:auto;min-height:67px}.workspace{margin-bottom:84px}}

.field-undo134{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;margin-top:8px;font-size:20px;align-self:flex-start}

/* Photo editor: keep close action at the top right and all actions separated. */
.photo-editor134{position:relative;width:min(680px,94vw);max-height:90dvh;overflow:auto}
.photo-editor134>.dialog-close{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;background:var(--paper);font-size:24px}
.photo-editor134>h2{padding-right:48px}
.photo-editor134 .journal134-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-block:12px}
.photo-editor134 input[type=range]{min-height:44px}

#view-catalog .search-box{position:relative;overflow:visible}

.map-search-popup134{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:1500;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px #0004;overflow:hidden}
.map-search-popup134 .map-search-results13{position:static;max-height:220px;box-shadow:none;border:0;border-radius:0}
.map-search-popup134>.text-button{display:block;min-height:44px;padding:12px;width:100%;text-align:left;border-top:1px solid var(--line)}

/* Water description warnings remain readable with long translated words. */
[data-water-information134]{min-width:0;overflow-wrap:anywhere}

.share-card134{width:min(580px,calc(100vw - 24px));max-width:100%;max-height:92dvh;overflow:auto;overflow-wrap:anywhere}.share-card134 fieldset{min-width:0;margin:12px 0;padding:10px}.share-card134 .journal134-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.share-card134 img{display:block}.share-card134 img[hidden]{display:none}

[aria-invalid="true"],.invalid-field134{outline:2px solid #b42318;outline-offset:2px} :focus-visible{outline:3px solid #b98621;outline-offset:3px} @media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Owner 3 November: one persistent add menu and compact shared journal navigation. */
.topbar{position:sticky;top:0;z-index:1600}
.top-actions{position:relative}
.top-actions #add-catch{display:inline-flex!important;align-items:center;justify-content:center;width:44px;min-width:44px;min-height:44px;padding:0;font-size:28px!important;line-height:1;background:var(--green-dark)!important;color:#fff!important;border:1px solid var(--line)!important;border-radius:8px}
.top-actions #add-catch::before,.top-actions #add-catch::after{display:none!important;content:none!important}
#quick-menu134{position:absolute;left:0;top:calc(100% + 6px);z-index:1700;min-width:190px;max-width:min(300px,90vw);padding:6px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px #0006}
#quick-menu134 button{display:block;text-align:left;min-height:48px;width:100%;padding:12px;border-radius:8px;background:transparent;color:inherit}
#quick-menu134 button:hover,#quick-menu134 button:focus-visible{background:var(--line)}
#locate{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;min-width:44px;min-height:44px;padding:10px}
#locate svg{width:24px;height:24px;flex:none}
#personal-navigation134{display:flex;align-items:center;gap:8px;margin:0 0 16px;min-width:0}
#personal-tabs{display:flex;flex:1;gap:6px;min-width:0;margin:0}
#personal-tabs .button{flex:1;min-width:0;min-height:48px;padding:8px;white-space:normal;text-align:center;font-size:12px}
#journal-navigation134{flex:none;min-width:0}
#journal-navigation134 .journal-action-nav134{gap:4px;margin:0;justify-content:flex-end}
.heading>div:first-child{min-width:0}
@media(max-width:700px){
 .top-actions{grid-template-columns:44px 40px minmax(90px,1.25fr) minmax(75px,1fr)}
 .heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(110px,.58fr);gap:12px;align-items:stretch}
 .heading #page-title{font-size:clamp(1.125rem,5vw,1.375rem);line-height:1.18;max-width:none;letter-spacing:-.5px;text-wrap:balance}
 .heading #page-title em{font-size:inherit}
 .heading .daylight-strip{width:auto;min-width:0;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;padding-top:24px;gap:10px}
 .heading .date-stamp{font-size:9px;white-space:normal;text-align:right}
 .heading #solar-times{max-width:100%;font-size:8px}
 #personal-tabs .button{padding:6px 3px;font-size:11px}
}

/* Fullscreen map shares the persistent add bar and keeps its close control below it. */
.map-fullscreen{top:var(--quick-header-height134,56px)!important;height:calc(100dvh - var(--quick-header-height134,56px))!important}
.map-fullscreen .map-stage,.map-fullscreen #map{height:100%!important;min-height:0!important}
.close-fullscreen{top:calc(var(--quick-header-height134,56px) + 12px)!important;z-index:1800!important}
/* Modeless water details sit between the persistent header and primary navigation. */
@media(max-width:700px){
 dialog.water-dialog,dialog.water-dialog[data-panel=expanded]{top:var(--quick-header-height134,56px);bottom:var(--quick-nav-height134,67px);height:auto;max-height:calc(100dvh - var(--quick-header-height134,56px) - var(--quick-nav-height134,67px))}
}

/* Keep the existing green/gray palette readable in the light appearance. */
:root:not([data-theme=dark]){--muted:#58685a;--focus134:#145a3d}
:root[data-theme=dark]{--focus134:#c6d6cf}
:root:not([data-theme=dark]) :is(.eyebrow,.small-label,.modal-eyebrow,.form-note,.date-stamp,.sidebar-credit,.panel-footer,.panel-footer small,.water-row small,.water-row .chevron,.water-symbol,.pill,.search-box>span,footer){color:#58685a}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--focus134,#145a3d);outline-offset:3px}
:root[data-theme=dark] :is(.eyebrow,.small-label,.modal-eyebrow){color:#c4c5a2}
:root[data-theme=dark] :is(.text-button:not(.danger),.search-box>span){color:var(--ink)}
:root[data-theme=dark] :is(.pill,.water-symbol){background:#30312e;color:#c6d6cf;border-color:var(--line)}

.field-error134{display:block;color:var(--ink);font-size:.875em;line-height:1.4;margin-top:6px}
/* At browser zoom the effective viewport can be narrower than an ordinary phone. */
@media(max-width:300px){
 .top-actions{grid-template-columns:44px 40px minmax(0,1fr);grid-template-areas:"add account language" "apk apk apk"}
 .top-actions #add-catch{grid-area:add}.top-actions #mobile-account{grid-area:account}
 .top-actions .global-language{grid-area:language;min-width:0}.top-actions .language-picker,.top-actions .language-picker select{min-width:0;max-width:100%;width:100%}
 .top-actions #nav-apk{grid-area:apk;justify-content:center;white-space:normal}
 #toast{min-width:0;max-width:calc(100vw - 24px);overflow-wrap:anywhere}
}
dialog .form{min-width:0;grid-template-columns:minmax(0,1fr)}
dialog .form>*,dialog .form label{min-width:0}
dialog .form :is(.button,.text-button){white-space:normal;overflow-wrap:anywhere}
.form-row{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:300px){.form-row{grid-template-columns:minmax(0,1fr)}}
@media(max-width:300px){
 .bottom-cards,.summary-grid{grid-template-columns:minmax(0,1fr)}
 .stat-card,.stat-card>div{min-width:0;overflow-wrap:anywhere}
}
/* Keep the photo close action in the top right even on narrow screens. */
.photo-actions134{flex-wrap:nowrap;align-items:flex-start}
.photo-actions134>.button{min-width:0;min-height:44px;white-space:normal;overflow-wrap:anywhere}

/* Caption contrast remains readable independently of the photograph beneath it. */
.latest-catch span{background:rgba(0,0,0,.9)}
