#walkScene { position:fixed;inset:0;z-index:40;overflow:hidden;background:#d5e2c7;color:#344e3c; }
:root { --garden-safe-top:env(safe-area-inset-top,0px);--garden-safe-right:env(safe-area-inset-right,0px);--garden-safe-bottom:env(safe-area-inset-bottom,0px);--garden-safe-left:env(safe-area-inset-left,0px); }
.garden-build { position:fixed;right:calc(var(--garden-safe-right) + 8px);bottom:calc(var(--garden-safe-bottom) + 2px);z-index:41;padding:0 3px;border-radius:3px;background:#f8faecc9;color:#60745c;font-size:8px;line-height:10px;pointer-events:none; }
.touch-control-label,.walk-touch-instructions,.walk-control-caption { display:none; }
.walk-control-group { display:contents; }
.walk-controls [data-walk=left] { grid-area:1/1; }
.walk-controls [data-walk=forward] { grid-area:1/2; }
.walk-controls [data-walk=right] { grid-area:1/3; }
.walk-controls [data-walk=turnLeft] { grid-area:2/1; }
.walk-controls [data-walk=back] { grid-area:2/2; }
.walk-controls [data-walk=turnRight] { grid-area:2/3; }
.walk-controls [data-walk=lookUp] { grid-area:3/1; }
.walk-controls #resetWalkLook { grid-area:3/2; }
.walk-controls [data-walk=lookDown] { grid-area:3/3; }
#walkCanvas { width:100%;height:100%;display:block;touch-action:none;outline-offset:-5px; }
.walk-heading { position:absolute;top:25px;left:30px;right:30px;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;pointer-events:none; }
.walk-heading button { pointer-events:auto; }
.walk-heading .eyebrow { margin-bottom:8px; }
.walk-heading h1 { font-size:31px; }
#walkScene[data-region=pond] .walk-heading h1,#walkScene[data-region=pond] .walk-heading .eyebrow { color:#f8f2da;text-shadow:0 1px 3px #203b50; }
#walkScene[data-region=pond] .walk-control-caption { color:#f8f2da;text-shadow:0 1px 2px #203b50; }
#walkGateLook { margin-top:8px;padding:6px 10px;background:#f8faecc9;min-height:44px; }
.walk-guidance { position:absolute;bottom:24px;left:28px;max-width:430px;background:#f8faecb8;backdrop-filter:blur(8px);padding:12px 16px;border-radius:16px;pointer-events:none; }
.walk-guidance p { font-size:11px;line-height:1.7;margin:0;color:#516b4c; }
.walk-guidance p+p { margin-top:5px;color:#708568; }
.walk-care-row { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;padding-top:8px;border-top:1px solid #c2d1b688; }
.walk-care-row #walkCareStatus { color:#456950; }
.walk-care-row button { pointer-events:auto;touch-action:manipulation;white-space:nowrap;min-height:44px;min-width:96px;padding:8px 12px;font-size:11px; }
#walkReticle { position:absolute;left:50%;top:40%;width:13px;height:13px;transform:translate(-50%,-50%);border:2px solid #fafceec9;border-radius:50%;box-shadow:0 0 0 1px #486b5677;pointer-events:none; }
#walkReticle[data-target=true] { border-color:#73bfd0;background:#b0e2e94d; }
.walk-controls { position:absolute;right:25px;bottom:25px;display:grid;grid-template-columns:repeat(3,76px);gap:5px;padding:8px;background:#f6f9e8bd;backdrop-filter:blur(8px);border:1px solid #c4d3b5;border-radius:19px; }
.walk-controls button { min-height:48px;min-width:44px;border-radius:12px;background:#e6edda9c;font-size:20px;touch-action:none;user-select:none; }
.walk-controls button span { display:block;font-size:9px;margin-top:2px; }
.walk-controls button:hover,.walk-controls button[aria-pressed=true] { background:#cdddbe; }
.screen-reader-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0; }
body[data-walking=true] { overflow:hidden; }
body[data-walking=true] .topbar,body[data-walking=true] main { visibility:hidden; }
body[data-region=home] #enterWalk { color:#f9faef;background:#486f55; }
.walk-audio { position:absolute;top:85px;right:30px;display:flex;align-items:center;gap:8px;padding:4px 8px;background:#f8faece6;border:1px solid #c4d3b5;border-radius:14px;max-width:calc(100% - var(--garden-safe-left) - var(--garden-safe-right) - 24px); }
.walk-audio button { min-width:84px;min-height:44px;padding:6px 9px;border-radius:10px;background:#e6edda;font-size:11px;touch-action:manipulation; }
.walk-audio button[aria-pressed=true] { background:#486f55;color:#f8faec; }
.walk-audio label { display:flex;align-items:center;gap:5px;font-size:10px; }
.walk-audio input { width:96px;min-width:72px;height:44px;margin:0;accent-color:#486f55;touch-action:pan-x; }
.walk-audio output { min-width:29px;text-align:right;font-size:10px; }
@media(max-width:760px), (max-width:1000px) and (max-height:500px), (pointer:coarse) {
  #walkScene { --walk-key-size:clamp(44px,calc((100vw - var(--garden-safe-left) - var(--garden-safe-right) - 56px)/6),54px);height:100dvh;touch-action:none;overscroll-behavior:none; }
  .desktop-control-label,#walkInstructions { display:none; }
  .touch-control-label,.walk-touch-instructions { display:block; }
  .walk-heading { top:calc(var(--garden-safe-top) + 12px);left:calc(var(--garden-safe-left) + 12px);right:calc(var(--garden-safe-right) + 12px);gap:8px; }
  .walk-heading>div { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 6px;flex:1;min-width:0; }
  .walk-heading h1 { font-size:16px;line-height:1.4;margin:0;grid-column:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
  .walk-heading .eyebrow { font-size:8px;line-height:1.4;margin:2px 0 3px;grid-column:1;white-space:nowrap; }
  .walk-heading button { font-size:10px;min-height:44px;padding:6px 8px; }
  #walkGateLook { grid-column:2;grid-row:1/3;margin:0;min-width:66px; }
  #leaveWalk { min-width:72px;flex-shrink:0; }
  .walk-audio { top:calc(var(--garden-safe-top) + 66px);right:calc(var(--garden-safe-right) + 12px);padding:0 6px;gap:6px; }
  .walk-audio button { min-width:80px;font-size:10px; }
  .walk-audio input { width:clamp(72px,25vw,96px); }
  .walk-controls { bottom:calc(var(--garden-safe-bottom) + 12px);left:calc(var(--garden-safe-left) + 12px);right:calc(var(--garden-safe-right) + 12px);display:flex;justify-content:space-between;gap:8px;padding:0;transform:none;background:none;border:0;backdrop-filter:none;pointer-events:none; }
  .walk-control-group { display:grid;grid-template-columns:repeat(3,var(--walk-key-size));grid-template-rows:repeat(2,var(--walk-key-size));gap:4px;position:relative;padding-top:16px; }
  .walk-control-caption { display:block;position:absolute;top:0;left:0;right:0;font-size:9px;line-height:12px;text-align:center;color:#486b51;text-shadow:0 1px #f6f9e8; }
  .walk-controls button { width:var(--walk-key-size);height:var(--walk-key-size);min-height:44px;min-width:44px;padding:3px;line-height:1;font-size:21px;background:#f6f9e8e6;box-shadow:0 1px 5px #344e3c18;pointer-events:auto; }
  .walk-controls button span { font-size:8px;line-height:1.1;margin-top:3px; }
  .walk-look-controls [data-walk=turnLeft] { grid-area:1/1; }
  .walk-look-controls [data-walk=lookUp] { grid-area:1/2; }
  .walk-look-controls [data-walk=turnRight] { grid-area:1/3; }
  .walk-look-controls #resetWalkLook { grid-area:2/1; }
  .walk-look-controls [data-walk=lookDown] { grid-area:2/2; }
  .walk-guidance { bottom:calc(var(--garden-safe-bottom) + var(--walk-key-size)*2 + 40px);left:calc(var(--garden-safe-left) + 12px);right:calc(var(--garden-safe-right) + 12px);max-width:none;padding:7px 10px; }
  .walk-guidance p { font-size:10px;line-height:1.4; }
  .walk-guidance .walk-touch-instructions { font-size:9px; }
  #walkStatus { margin-top:3px; }
  .walk-care-row { margin-top:5px;padding-top:5px;gap:8px; }
  .walk-care-row #walkCareStatus { font-size:10px; }
  .walk-care-row button { min-width:86px;padding:6px 8px;font-size:10px; }
  body[data-region=home] .scene-actions { bottom:calc(var(--garden-safe-bottom) + 101px);gap:4px; }
  body[data-region=home] .scene-actions .new-button { padding-inline:6px;font-size:8px;min-width:44px; }
  body[data-region=home] .scene-actions #enterWalk { position:fixed;top:calc(var(--garden-safe-top) + 174px);right:calc(var(--garden-safe-right) + 14px);bottom:auto;min-width:88px; }
}
@media(orientation:landscape) and (max-width:1000px) and (max-height:500px) {
  .walk-guidance { bottom:calc(var(--garden-safe-bottom) + 12px);left:50%;right:auto;transform:translateX(-50%);width:min(260px,calc(100% - var(--garden-safe-left) - var(--garden-safe-right) - var(--walk-key-size)*6 - 56px));padding:6px 8px; }
  .walk-guidance .walk-touch-instructions { display:none; }
  .walk-guidance #walkStatus { font-size:9px;margin-top:0; }
  .walk-care-row { flex-direction:column;gap:4px;margin-top:4px;padding-top:4px; }
  .walk-care-row #walkCareStatus { font-size:9px;text-align:center; }
  .walk-care-row button { width:100%; }
}

#walkPondLook { margin-top:8px;margin-left:6px;padding:6px 10px;background:#f8faecc9;min-height:44px; }
@media(max-width:760px),(max-width:1000px) and (max-height:500px),(pointer:coarse) { #walkPondLook { position:absolute;left:0;top:54px;width:56px;min-width:56px;margin:0;padding:6px 4px;font-size:9px; } }

.experiment-hud { position:absolute;left:28px;top:150px;width:340px;max-width:calc(100% - 56px);padding:7px 10px;background:#f6f8e7e8;border:1px solid #c1cfb4;border-radius:13px;color:#476148; }
.experiment-bar { display:flex;gap:4px;align-items:center; }
.experiment-hud button,.experiment-hud select { min-height:44px;min-width:44px;border-radius:10px;padding:6px 9px;background:#e5edda;color:#426246;font-size:11px;touch-action:manipulation; }
.experiment-bar #experimentFuture { background:#4b7257;color:#fff9e7;flex:1; }
.experiment-hud p { font-size:11px;line-height:1.5;margin:5px 0 0; }
#experimentControls { max-height:260px;overflow-y:auto; }
.experiment-roles,.experiment-edit { display:flex;gap:4px;flex-wrap:wrap;margin-top:7px; }
.experiment-roles button { flex:1; }
.experiment-roles button[aria-pressed=true] { background:#4b7257;color:#fff9e7; }
.experiment-selection { display:flex;gap:8px;align-items:center;font-size:11px;margin-top:7px; }
.experiment-selection select { flex:1;min-width:0;border:1px solid #c1cfb4; }
.experiment-edit button { flex:1; }
.experiment-hud .experiment-note,#experimentStorage { color:#708267;font-size:9px; }
.experiment-hud[data-mode=future] { background:#e5eee7ec; }
.experiment-hud[data-success=true] #experimentResult { color:#35674c; }
@media(max-width:760px),(max-width:1000px) and (max-height:500px),(pointer:coarse) {
  .experiment-hud { top:calc(var(--garden-safe-top) + 120px);left:calc(var(--garden-safe-left) + 12px);max-width:calc(100% - var(--garden-safe-left) - var(--garden-safe-right) - 24px);width:340px;padding:5px 7px; }
  .experiment-hud button,.experiment-hud select { font-size:10px;padding:5px 7px; }
  .experiment-hud p { font-size:10px; }
  #experimentControls { max-height:145px; }
}
@media(orientation:landscape) and (max-width:1000px) and (max-height:500px) {
  .experiment-hud { top:calc(var(--garden-safe-top) + 118px);left:calc(var(--garden-safe-left) + 12px);transform:none;width:min(270px,calc(100% - var(--garden-safe-left) - var(--garden-safe-right) - var(--walk-key-size)*6 - 56px));max-height:calc(100dvh - var(--garden-safe-top) - var(--garden-safe-bottom) - 250px);overflow-y:auto; }
  #experimentControls { max-height:none; }
}

#walkCanvas,.walk-controls,.walk-controls * { -webkit-user-select:none;user-select:none;-webkit-touch-callout:none; }

.life-local { color:#708267;font-size:9px!important;margin:0 0 4px!important; }
.life-bar { display:grid;grid-template-columns:1fr 1.4fr 44px;gap:4px; }
.life-bar button { min-width:0;white-space:normal;line-height:1.3; }
.life-bar #lifeAction { background:#4b7257;color:#fff9e7; }
.life-bar #lifeAction:disabled { background:#dce5d4;color:#6e8065; }
#lifeDetails summary { min-height:44px;display:flex;align-items:center;font-size:10px;cursor:pointer;touch-action:manipulation; }
#lifeDetails p { font-size:10px; }
#lifeInventory { color:#607458; }
@media(max-width:760px),(max-width:1000px) and (max-height:500px),(pointer:coarse) {
  .life-bar button { font-size:10px;padding:5px 4px; }
  .life-hud { max-height:calc(100dvh - var(--garden-safe-top) - var(--garden-safe-bottom) - 300px);overflow-y:auto; }
}
@media(orientation:landscape) and (max-width:1000px) and (max-height:500px) {
  .life-hud { max-height:calc(100dvh - var(--garden-safe-top) - var(--garden-safe-bottom) - 250px); }
  .life-local { display:none; }
}
.coop-bar{display:grid;grid-template-columns:1fr 1.5fr 44px;gap:4px}.coop-bar button{min-width:0;min-height:44px;padding:6px;font-size:12px}.coop-label{font-size:11px;margin:0 0 5px}.coop-hud details summary{min-height:44px;display:flex;align-items:center;cursor:pointer}.coop-hud{max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 300px);overflow:auto}
@media(max-height:500px) and (orientation:landscape){.coop-hud{max-height:calc(100dvh - 250px)}.coop-label{display:none}.coop-hud p{font-size:10px}}

body[data-region=home] #openCoop{position:fixed;top:164px;right:28px;min-height:44px;z-index:4;padding:8px 12px;font-size:11px}
body[data-region=home] #coopStatus{position:fixed;top:212px;right:28px;max-width:240px;z-index:3;font-size:10px;pointer-events:none}
@media(max-width:760px),(max-width:1000px) and (max-height:500px){body[data-region=home] #openCoop{top:calc(var(--garden-safe-top) + 226px);right:14px}body[data-region=home] #coopStatus{top:calc(var(--garden-safe-top) + 270px);right:14px;max-width:170px}}
body[data-walking=true] #openCoop,body[data-walking=true] #coopStatus{visibility:hidden}