:root{font-family:'Segoe UI',Arial,sans-serif;color:#342c25;background:#f4f0e7;color-scheme:light;font-synthesis:none;--ink:#342c25;--rust:#a74726;--rule:#d8cdbd;--paper:#faf7f0}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0}main{max-width:1560px;margin:auto;padding:0 48px}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;background:none;color:inherit}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #a74726;outline-offset:5px}a{color:inherit}p{line-height:1.7}h1,h2,h3,p{margin-top:0}[hidden]{display:none!important}
.masthead{height:104px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{font-family:'Segoe UI',Arial,sans-serif;font-style:normal;display:flex;align-items:baseline;gap:18px;font-weight:700;font-size:29px;letter-spacing:-1px;text-decoration:none}.brand span{font-size:12px;letter-spacing:0;font-weight:400;border-right:1px solid #ab9c88;padding-right:18px}.masthead nav{display:flex;gap:30px;font-size:14px}.masthead nav a{text-decoration:none;border-bottom:1px solid transparent;padding:7px 0}.masthead nav a:hover{border-color:var(--rust)}.masthead-note{font-family:'Segoe UI',Arial,sans-serif;font-size:18px;color:#705c49}
.studio{position:relative;isolation:isolate;min-height:790px;overflow:hidden;background:#d6c8b7}.studio-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:55% center;z-index:-2}.studio:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(248,244,233,.91) 0%,rgba(248,244,233,.86) 24%,rgba(248,244,233,.25) 42%,transparent 58%);pointer-events:none}.studio-layout{direction:ltr;display:flex;align-items:center;min-height:790px;padding:40px 5.1%}.game{direction:rtl;text-align:right;width:330px;max-width:100%}.eyebrow{font-size:12px;font-weight:600;color:#725641;letter-spacing:.6px;margin-bottom:22px}.eyebrow:before{content:'';display:inline-block;vertical-align:middle;width:26px;height:1px;background:#985432;margin-left:12px}h1{font-family:'Segoe UI',Arial,sans-serif;font-size:64px;font-weight:600;line-height:1.02;letter-spacing:-2px;margin:0 0 20px}.intro{font-size:14px;color:#695747;margin-bottom:22px;max-width:290px}.counter-line{display:flex;align-items:center;gap:20px;border-top:1px solid #b7a895;padding-top:14px}.counter-line>span{font-family:'Segoe UI',Arial,sans-serif;font-size:98px;line-height:1.15;color:var(--rust);font-variant-numeric:tabular-nums;letter-spacing:-4px}.counter-caption{font-size:15px;line-height:1.6;color:#604b3b}.day-total{font-size:12px;color:#725c49;margin:6px 0 22px}.primary{display:block;width:100%;background:var(--rust);color:#fff9ec;min-height:58px;font-size:18px;font-weight:650;text-align:right;padding:15px 22px;border-radius:2px;transition:background .2s}.primary:after{content:'←';float:left;font-size:24px;line-height:1}.primary:hover{background:#873719}.primary:active{transform:translateY(1px)}.status{font-size:14px;min-height:22px;color:#64503e;margin:14px 0 9px}.small-actions{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:28px}.sound-toggle,.quiet{padding:3px 0;font-size:12px;color:#715c4a;border-bottom:1px solid #bbaa98}.sound-toggle:before{content:'';display:inline-block;width:6px;height:6px;background:#8b4a2c;border-radius:50%;margin-left:7px;vertical-align:middle}.sound-toggle[aria-pressed=true]:before{background:#9e958c}.day-end{border-top:1px solid #b7a895;margin-top:23px;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:16px}.finish{font-size:14px;font-weight:700;padding:10px 18px;border:1px solid #79634d;color:#4e3a29;border-radius:2px;background:rgba(250,247,240,.55)}.finish:hover:not(:disabled){background:#f8efdf}.day-end span{font-size:11px;line-height:1.6;color:#715c4a}.photo-caption{position:absolute;right:42px;bottom:40px;color:#fffdf4;text-shadow:0 1px 10px #362110}.photo-caption span{display:block;font-size:11px;letter-spacing:1px;margin-bottom:9px}.photo-caption p{font-family:'Segoe UI',Arial,sans-serif;font-size:32px;line-height:1.15;margin:0}
.application-note{display:grid;grid-template-columns:1fr 1.3fr 1.3fr;gap:44px;padding:40px 0 34px;border-bottom:1px solid var(--rule);align-items:start}.section-index{display:block;color:#8b705b;font-size:11px;letter-spacing:.6px;margin-bottom:10px}h2{font-family:'Segoe UI',Arial,sans-serif;font-size:31px;font-weight:500;line-height:1.15;margin-bottom:12px}.note-heading p{font-size:13px;color:#7b6959;margin:0}label{display:block;font-size:13px;font-weight:600;margin:5px 0 12px}input{width:100%;padding:13px 0;border:0;border-bottom:1px solid #a89988;border-radius:0;background:transparent;color:#3c3026;font-size:15px}input::placeholder{font-size:13px;color:#8c7b6a}.note{font-size:11px;color:#8a7765;margin:10px 0 0;overflow-wrap:anywhere}
.journal{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:0 64px;align-items:start;margin-top:50px}.card{min-width:0}.calendar{grid-column:1;grid-row:1 / span 2}.history{grid-column:2;grid-row:1;border-right:1px solid var(--rule);padding-right:36px}.row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.history-title{width:100%}.secondary{font-size:11px;padding:7px 0;color:#785c46;border-bottom:1px solid #bca68c}.history #reset{color:#927d6a}.calendar-help{font-size:12px;line-height:1.7;color:#7b6959;margin:15px 0 22px}.month-nav{display:flex;align-items:center;gap:7px}.month-nav button{font-size:14px;padding:7px}.month-nav strong{font-size:13px;font-weight:600}.month-nav #todayMonth{font-size:11px;text-decoration:underline}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;border-bottom:1px solid var(--rule)}.weekday{text-align:center;font-size:11px;color:#8a7662;padding:9px 0}.calendar-day{min-height:68px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-top:1px solid var(--rule);font-size:17px;font-family:'Segoe UI',Arial,sans-serif}.calendar-day small{font-family:'Segoe UI',Arial,sans-serif;font-size:10px;color:#826a55}.calendar-day.has-entries{background:#ead4b9;color:#743814}.calendar-day.selected{box-shadow:inset 0 -3px var(--rust)}.calendar-day.today>span{border-bottom:1px solid #98502e}.calendar-day:hover{background:#eee4d5}.calendar-detail{padding-top:25px}.calendar-detail h3{font-size:17px;font-weight:600;margin:0 0 9px}.calendar-detail>p{font-size:12px;color:#796653}.downloads{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.downloads button{font-size:12px;padding:9px 12px;border:1px solid #c7b59e;border-radius:2px;background:#f9f4e9}.downloads button:hover:not(:disabled){background:#eadcc8}.day-entries{max-height:250px;overflow:auto}.entry{padding:15px 0;border-bottom:1px solid #ddd1c0;display:flex;justify-content:space-between;align-items:start;gap:16px;font-size:13px}.entry>div{min-width:0;overflow-wrap:anywhere}.entry>span:first-child{overflow-wrap:anywhere}.meta{font-size:11px;color:#897360;line-height:1.6;margin-top:5px}.badge{display:inline-block;font-size:10px;padding:3px 7px;margin-top:7px;background:#e8ddcb;color:#785537;overflow-wrap:anywhere}.history #list{max-height:600px;overflow:auto;margin-top:15px;padding-left:8px}.empty{font-size:13px;padding:25px 0;color:#8d7964}.export-status{grid-column:2;grid-row:2;font-size:12px;color:#8a4b29;min-height:20px}.footer{font-size:11px;text-align:center;color:#94806b;border-top:1px solid var(--rule);margin-top:44px;padding:24px 0;line-height:1.8}
.day-summary{background:#ede0cc;border-top:3px solid var(--rust);padding:36px;margin-top:32px;text-align:center}.day-summary .downloads{justify-content:center}.day-summary p{font-size:14px;color:#77614b}.day-summary h2{font-size:32px}.summary-icons{font-size:28px;letter-spacing:12px;margin-bottom:16px}.archive-note{font-size:11px!important;margin:12px 0 0}.milestone{position:fixed;z-index:11;bottom:24px;left:50%;transform:translateX(-50%);width:min(440px,calc(100% - 32px));padding:22px 44px 22px 24px;background:#f8efde;border-top:3px solid var(--rust);text-align:center;pointer-events:none;box-shadow:0 8px 28px #3d2a1826}.milestone strong{display:block;font-size:21px;color:#9c4323;margin-bottom:8px}.milestone p{font-size:14px;margin:0}.milestone button{position:absolute;top:5px;right:5px;pointer-events:auto;padding:8px}

@media(min-width:1350px){.studio-layout{padding-left:7%}.game{width:350px}.studio,.studio-layout{min-height:800px}}
@media(max-width:1050px){main{padding:0 24px}.masthead-note{display:none}.studio-layout{padding-left:30px}.studio:after{background:linear-gradient(90deg,rgba(248,244,233,.96),rgba(248,244,233,.9) 31%,rgba(248,244,233,.25) 58%,transparent 75%)}.photo-caption{right:24px}.application-note{gap:25px}.journal{gap:0 30px}.history{padding-right:24px}}
@media(max-width:700px){main{padding:0 18px}.masthead{height:88px;gap:12px}.brand{font-size:25px;display:block}.brand span{display:block;border:0;padding:0;font-size:10px;margin-top:4px}.masthead nav{gap:14px;font-size:11px}.studio{margin:0 -18px;min-height:0;padding-top:245px;overflow:visible;background:var(--paper)}.studio-photo{height:275px;object-position:80% center}.studio:after{inset:215px 0 auto;height:60px;background:linear-gradient(0deg,var(--paper),transparent)}.studio-layout{min-height:0;padding:24px 28px 30px;display:block}.game{width:auto;max-width:none}h1{font-size:48px;line-height:1.03}.eyebrow{margin-bottom:14px}.intro{max-width:none;margin-bottom:12px}.counter-line{padding-top:8px}.counter-line>span{font-size:80px}.day-total{margin-bottom:16px}.photo-caption{top:155px;bottom:auto;right:24px}.photo-caption p{font-size:24px}.photo-caption span{display:none}.day-end{margin-top:18px;padding-top:16px}.application-note{grid-template-columns:1fr;gap:17px;padding:30px 0}.note-heading p br{display:none}.note-heading h2{font-size:29px}.field label{margin-bottom:4px}.journal{display:block;margin-top:30px}.history{border:0;border-top:1px solid var(--rule);padding:30px 0 0;margin-top:28px}.calendar-day{min-height:61px}.calendar-help{margin:12px 0}.day-summary{padding:25px 18px}.day-summary h2{font-size:26px}.footer{margin-top:24px}.milestone{bottom:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

/* Keep mixed Hebrew/English fields right-aligned regardless of first character. */
.field input,.field input::placeholder,.field .note,.entry{direction:rtl;text-align:right}


/* One typeface, shared with the end-of-day control. */
h1{font-weight:700;line-height:1.12;letter-spacing:-1.2px}
h2{font-weight:650;letter-spacing:-.5px}
.counter-line>span{font-weight:600;letter-spacing:-3px}
/* Text-first actions: reserve the border space so hover never moves the layout. */
button:is(.primary,.finish,.secondary,.sound-toggle,.quiet),.downloads button,.month-nav button{
  background:transparent;border:1px solid var(--rust);border-radius:999px;
  box-shadow:none;text-decoration:none;color:var(--rust);
  transition:background-color .18s ease,border-color .18s ease,color .18s ease;
}
button.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;width:auto;max-width:100%;min-height:52px;padding:10px 20px;font-weight:700;font-size:20px;text-align:right}
button.primary:after{float:none;display:inline-block;line-height:1;font-size:24px}
button:is(.finish,.secondary,.sound-toggle,.quiet){padding:9px 14px}
button:is(.primary,.finish,.secondary,.sound-toggle,.quiet):hover:not(:disabled),
button:is(.primary,.finish,.secondary,.sound-toggle,.quiet):focus-visible,
.downloads button:hover:not(:disabled),.downloads button:focus-visible,
.month-nav button:hover:not(:disabled),.month-nav button:focus-visible{
  background:var(--rust);border-color:var(--rust);color:#fff9ec;box-shadow:none;
}
button.sound-toggle:hover:not(:disabled):before,button.sound-toggle:focus-visible:before{background:#fff9ec}
button:is(.primary,.finish,.secondary,.sound-toggle,.quiet):active:not(:disabled),.downloads button:active:not(:disabled),.month-nav button:active:not(:disabled){background:#843719;border-color:#843719;color:#fff9ec}
.history button#reset:hover:not(:disabled),.history button#reset:focus-visible{color:#fff9ec}
.small-actions{flex-wrap:wrap;gap:4px}
@media(prefers-reduced-motion:reduce){button{transition:none!important}}

/* Edge-to-edge room: preserve image proportions and place both controls on the wall. */
body{background:#e8dfd2 url('background_4.png') center center / cover fixed no-repeat}
main{max-width:none;padding:0}
.masthead{position:absolute;inset:0 0 auto;z-index:3;height:94px;padding:0 4vw;background:transparent}
.studio{min-height:100svh;background:transparent;margin:0;padding:0}
.studio-photo{object-fit:cover;object-position:center;width:100%;height:100%}
.studio:after{inset:0;height:auto;background:linear-gradient(90deg,rgba(250,247,240,.5),rgba(250,247,240,.24) 48%,transparent 66%)}
.studio-layout{margin-left:0;margin-right:auto;min-height:100svh;width:60%;padding:125px 3vw 55px 4vw;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:3vw;align-items:center;direction:ltr}
.game{width:100%;min-width:0;direction:rtl}
.studio .application-note{direction:rtl;display:flex;flex-direction:column;gap:22px;padding:100px 0 0;margin:0;border:0;min-width:0;align-self:center}
.studio .application-note .field{width:100%;min-width:0}
.studio .note-heading h2{font-size:27px}.studio .note-heading p{font-size:12px}
.studio input{font-size:14px;background:rgba(250,247,240,.2)}
.studio input::placeholder{font-size:12px}
.studio h1{font-size:clamp(40px,4.1vw,66px)}
.photo-caption{right:4vw;bottom:35px}
.journal{margin:0;padding:48px 4vw;background:rgba(250,247,240,.94)}
.day-summary{margin:0;padding:38px 4vw;background:rgba(237,224,204,.96)}
.footer{margin:0;padding:24px 4vw;background:rgba(250,247,240,.94)}
@media(max-width:1050px) and (min-width:701px){
.studio-layout{width:68%;gap:24px;padding-left:25px;padding-right:25px}
.studio:after{background:linear-gradient(90deg,rgba(250,247,240,.8),rgba(250,247,240,.55) 55%,transparent 85%)}
.masthead{padding:0 25px}.studio h1{font-size:42px}
}
@media(max-width:700px){
body{background-attachment:scroll}.masthead{position:relative;height:85px;padding:0 20px;background:rgba(250,247,240,.75)}
.studio{margin-top:-85px;padding-top:85px;min-height:100svh}.studio-photo{height:100%;object-position:35% center}
.studio:after{inset:0;height:auto;background:rgba(250,247,240,.83)}
.studio-layout{width:100%;min-height:calc(100svh - 85px);padding:28px 24px 40px;grid-template-columns:1fr;gap:30px}
.game{grid-row:1}.studio .application-note{grid-row:2;padding:26px 0 0;border-top:1px solid var(--rule);gap:18px}
.studio h1{font-size:46px}.photo-caption{display:none}
.journal{padding:30px 24px}.day-summary{padding:30px 24px}.footer{padding:22px 24px}
}

/* Readable controls over photography; keep the room clear on the right. */
@media(min-width:1051px){
  .studio-layout{width:52%;padding-left:3vw;padding-right:2vw;gap:2.5vw}
  .studio:after{background:linear-gradient(90deg,rgba(250,247,240,.95) 0%,rgba(250,247,240,.93) 46%,rgba(250,247,240,.55) 55%,transparent 68%)}
}
@media(min-width:701px) and (max-width:1050px){
  .studio-layout{width:64%;gap:20px;padding-left:22px;padding-right:22px}
  .studio:after{background:linear-gradient(90deg,rgba(250,247,240,.96),rgba(250,247,240,.93) 59%,transparent 83%)}
}
.studio .status,.studio .day-total,.studio .day-end span,.studio .note,
.studio .intro,.studio .counter-caption,.studio .eyebrow,
.studio .note-heading p,.studio .section-index{color:#513c2d}
.studio .status{font-size:15px;font-weight:500}
.studio .note,.studio .day-end span{font-size:12px;line-height:1.7}
.studio input{background:rgba(255,253,247,.65);border-bottom-color:#80634d;padding-left:8px;padding-right:8px}
.studio input::placeholder{color:#66513f;opacity:1}
.studio button:is(.primary,.finish,.sound-toggle,.quiet){color:#57341f;border-color:#795035}
.studio button:is(.primary,.finish,.sound-toggle,.quiet):hover:not(:disabled),
.studio button:is(.primary,.finish,.sound-toggle,.quiet):focus-visible{color:#fff9ec;background:var(--rust);border-color:var(--rust)}
.studio button:disabled{opacity:1;color:#796a5c;border-color:#a89988;border-style:dashed}
@media(max-width:700px){.studio:after{background:rgba(250,247,240,.95)}}
/* Text-only labels over the photograph; halos follow the letter shapes. */
.masthead .brand{background:transparent;color:#342c25;padding:11px 16px;border-radius:0}
.masthead .brand span{color:#493727;border-right-color:#80634d;font-size:13px}
.photo-caption{background:transparent;color:#342c25;padding:16px 20px;border-radius:0;bottom:42px}
.photo-caption span{color:#634b37;font-size:12px}.photo-caption p{color:#493727;font-size:25px}
.studio-layout{padding-bottom:135px}
.scroll-cue{position:absolute;bottom:20px;left:46%;transform:translateX(-50%);display:flex;align-items:center;gap:13px;padding:10px 20px;border:1px solid #957457;border-radius:38px;background:#faf7f0;color:#493727;text-decoration:none;text-align:right;font-size:14px;z-index:2}
.scroll-cue small{display:block;font-size:11px;line-height:1.6;color:#634b37}.scroll-arrow{font-size:30px;line-height:1.2}.scroll-cue:hover,.scroll-cue:focus-visible{background:#a74726;color:#fffaf1;border-color:#a74726}.scroll-cue:hover small,.scroll-cue:focus-visible small{color:#fffaf1}
@media(max-width:1050px){.masthead nav{gap:18px}.masthead .brand{gap:10px}.photo-caption{right:20px;bottom:105px}.scroll-cue{left:40%}}
@media(max-width:700px){.masthead{height:auto;min-height:112px;padding:10px 18px;flex-wrap:wrap;gap:8px}.masthead .brand{padding:6px 10px;display:flex;align-items:center;font-size:23px}.masthead .brand span{border:0;font-size:11px;padding:0}.masthead nav{width:100%;justify-content:space-between;gap:12px;font-size:12px}.studio{margin-top:-112px;padding-top:112px}.studio-layout{padding-bottom:25px;min-height:calc(100svh - 112px)}.scroll-cue{position:relative;bottom:auto;left:auto;transform:none;width:fit-content;max-width:calc(100% - 36px);margin:0 auto 24px}.photo-caption{display:none}}

.masthead .brand,.masthead .brand span,.photo-caption span,.photo-caption p{
  color:#342c25;
  text-shadow:0 0 2px #fffdf6,1px 0 2px #fffdf6,-1px 0 2px #fffdf6,0 1px 2px #fffdf6,0 -1px 2px #fffdf6,0 0 7px rgba(255,253,246,.95),0 0 14px rgba(255,253,246,.8),0 2px 3px rgba(40,26,16,.18);
}
.photo-caption span{font-weight:600}

/* Milestone moments: restrained copper artwork, never a full-screen interruption. */
.milestone{width:min(420px,calc(100% - 32px));padding:20px 28px 26px;background:linear-gradient(135deg,#fff8ed,#f5e2ca);border:1px solid #c87943;border-top:3px solid #b85225;border-radius:4px;box-shadow:0 12px 40px #60321530;color:#51331f;pointer-events:auto;max-height:calc(100dvh - 32px);overflow:auto}
.milestone[hidden]{display:none}
.milestone-art{width:170px;height:77px;margin:0 auto 4px;color:#be5b28}
.milestone-art svg{width:100%;height:100%;overflow:visible}
.milestone-label{display:block;color:#92502a;font-size:11px;margin-bottom:10px;letter-spacing:.3px}
.milestone strong{font-size:22px;color:#a74726;margin-bottom:10px}
.milestone p{font-size:15px;line-height:1.7;color:#51331f;text-wrap:pretty}
.milestone button{color:#713d25;border:1px solid transparent;border-radius:50%;width:34px;height:34px;padding:0;line-height:1;font-size:22px}
.milestone button:hover,.milestone button:focus-visible{background:#b85225;color:#fff8ed;border-color:#b85225}
.milestone-art .draw{stroke-dasharray:500;stroke-dashoffset:0;animation:copper-draw 2.6s ease both}
.milestone-art .spark,.milestone-art .rays{animation:copper-light 1.4s ease both}
.milestone-art .stamp{transform-origin:100px 45px;animation:copper-stamp .8s ease both}
.milestone-art .rise{animation:copper-rise 1.8s ease both}
.milestone-art .door,.milestone-art .page{transform-origin:75px 45px;animation:copper-open 2s ease both}
.milestone-art .envelope{animation:copper-send 2.8s ease both}
.milestone-art .needle{transform-origin:100px 45px;animation:copper-compass 2.5s ease both}
@keyframes copper-draw{from{stroke-dashoffset:500;opacity:.2}to{stroke-dashoffset:0;opacity:1}}
@keyframes copper-light{from{opacity:0}to{opacity:1}}
@keyframes copper-stamp{0%{transform:scale(1.25) rotate(-9deg);opacity:0}65%{transform:scale(.96) rotate(-4deg);opacity:1}100%{transform:scale(1) rotate(-4deg)}}
@keyframes copper-rise{from{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes copper-open{from{transform:scaleX(.3);opacity:.2}to{transform:scaleX(1);opacity:1}}
@keyframes copper-send{0%{transform:translateX(-18px);opacity:0}35%,65%{transform:translateX(0);opacity:1}100%{transform:translateX(22px);opacity:1}}
@keyframes copper-compass{0%{transform:rotate(-65deg)}65%{transform:rotate(12deg)}100%{transform:rotate(0)}}
@media(prefers-reduced-motion:reduce){.milestone-art *{animation:none!important}}
@media(max-width:450px){.milestone{padding:14px 24px 20px}.milestone-art{height:60px}.milestone strong{font-size:20px}}

/* Activated only after the authenticated server controller is mounted. */
.save-status { color: #452e23; text-align: right; margin-block: 1rem; font: inherit; }
.save-status[hidden] { display: none; }
.save-status p { margin-block: 0 .6rem; line-height: 1.6; text-shadow: 0 1px 5px #fff8ed; }
.save-status-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.save-status-actions[hidden] { display: none; }
.save-status button { font: inherit; color: #783b20; background: transparent; border: 1px solid #934725; border-radius: 2rem; padding: .45rem 1rem; cursor: pointer; }
.save-status button:hover:not(:disabled) { background: #a94e26; color: #fffaf2; }
.save-status button:focus-visible { outline: 3px solid #77381e; outline-offset: 3px; }
.save-status button:disabled { cursor: default; opacity: .65; }

/* Account controls belong to the content, never above the full-bleed photograph. */
.account-bar{position:relative;margin:0 0 24px;padding:0 0 16px;display:flex;gap:10px 14px;align-items:center;flex-wrap:wrap;background:transparent;color:#452e23;border-bottom:1px solid #b7a895}
.account-bar p{flex-basis:100%;margin:0;font-size:13px;line-height:1.6;text-shadow:0 1px 4px #fffaf1}
.account-bar button{font:inherit;font-size:13px;border:1px solid #934725;border-radius:2rem;background:transparent;color:#783b20;padding:.6rem 1rem;cursor:pointer}
.account-bar button:hover{background:#a94e26;color:white}
.account-bar [hidden]{display:none}
#sessionChoices:empty{display:none}
#sessionChoices{width:100%;display:flex;gap:8px;flex-wrap:wrap}
.cloud-history-note{margin:0;padding:1rem 4vw;color:#452e23;background:#faf5ed}
@media(max-width:700px){.masthead{background:transparent}.account-bar{margin-bottom:22px}}

.account-identity{margin-right:auto;max-width:27vw;display:flex;flex-direction:column;gap:3px;text-align:left;color:#781d37;font-size:13px;font-weight:600;overflow-wrap:anywhere;text-shadow:0 0 2px #fffaf5,0 0 7px #fffaf5,0 0 13px rgba(255,247,239,.95)}
.account-identity bdi{font-size:12px;font-weight:400;direction:ltr}
.account-identity span:empty,.account-identity bdi:empty{display:none}
@media(max-width:1050px){.masthead{gap:12px}.account-identity{max-width:24vw;font-size:12px}}
@media(max-width:700px){.masthead{display:grid;grid-template-columns:1fr auto;min-height:112px}.masthead nav{grid-column:1 / -1;grid-row:2}.masthead .brand{display:block;font-size:21px;padding:0}.masthead .brand span{display:block;font-size:10px}.account-identity{max-width:45vw;font-size:11px}.account-identity bdi{font-size:10px}}