/* The same habitat and settings, arranged as a phone game rather than a long page. */
#phoneControls,.phone-sheet-heading,#phoneSheetShade,.phone-utility-row{display:none}
html.touch-layout{--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--safe-t:env(safe-area-inset-top,0px);height:100%;overflow:hidden}
.touch-layout body{height:100%;overflow:hidden;overscroll-behavior:none}
.touch-layout .topbar{height:calc(48px + var(--safe-t));padding:var(--safe-t) max(14px,var(--safe-r)) 0 max(14px,var(--safe-l));gap:12px}
.touch-layout .brand{font-size:29px}.touch-layout .brand svg{width:25px;height:25px}.touch-layout .tagline{font-size:10px;padding:0;border:0}.touch-layout .local-badge{display:none}.touch-layout .icon-button{height:40px;width:40px}.touch-layout .top-actions{gap:5px}
.touch-layout .app{display:block;height:calc(100dvh - 48px - var(--safe-t));min-height:0;padding:0}
.touch-layout .habitat{height:100%;min-height:0;border:0;border-radius:0;width:100%}
.touch-layout #viewport{inset:0}.touch-layout #scene{touch-action:none}
.touch-layout #phoneControls{display:block;position:absolute;inset:0;pointer-events:none;z-index:6}
.touch-layout #phoneControls button,.touch-layout .thumbstick{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
.touch-layout .phone-top{position:absolute;top:10px;left:max(12px,var(--safe-l));right:max(12px,var(--safe-r));display:flex;gap:8px;align-items:center}
.phone-actors{display:flex;flex:1;max-width:390px;padding:4px;border:1px solid #fff9;background:#f7f7eddf;backdrop-filter:blur(14px);border-radius:10px;box-shadow:0 3px 12px #26392b12}
.phone-actors button{border:0;flex:1;min-height:44px;padding:6px 10px;font-size:12px;border-radius:7px;background:transparent;color:#677d5d}
.phone-actors button[aria-pressed=true]{background:#41634e;color:white;box-shadow:0 1px 4px #29433020}
.phone-settings{height:48px;width:48px;font-size:26px;line-height:1;color:#45623e;background:#f7f7eddf;border:1px solid #fff9;border-radius:10px;backdrop-filter:blur(12px);margin-left:auto}
.touch-layout .scene-top{top:70px;left:max(15px,var(--safe-l));right:max(12px,var(--safe-r));z-index:5}
.touch-layout .habitat-label{max-width:55%}.touch-layout .habitat-label h1,.touch-layout .habitat-label>span:last-child{display:none}.touch-layout .eyebrow{font-size:8px}.touch-layout .scene-tools .glass-button{height:42px;min-width:44px;font-size:12px;padding:0 10px}
.phone-status{position:absolute;top:94px;left:max(15px,var(--safe-l));font-size:11px;color:#405b3b;background:#f8f7e8bf;padding:5px 8px;border-radius:5px;max-width:calc(100% - 165px);text-shadow:0 1px 6px #fff8}
.touch-layout .scene-footer,.touch-layout .orbit-hint,.touch-layout .manual-hud{display:none!important}
.touch-layout .scene-bottom{bottom:calc(62px + var(--safe-b));left:max(12px,var(--safe-l));right:max(12px,var(--safe-r));gap:8px;z-index:7;justify-content:center}
.touch-layout .camera-controls{max-width:calc(100% - 50px);padding:3px;flex:1;max-width:330px;justify-content:space-between}.touch-layout .camera-controls button{min-height:44px;font-size:11px;padding:5px 8px;flex:1}
.touch-layout #fullscreenButton{width:44px;height:44px;flex:none}
.phone-pad{position:absolute;bottom:calc(118px + var(--safe-b));left:max(12px,var(--safe-l));right:max(12px,var(--safe-r));display:flex;align-items:flex-end;justify-content:space-between;gap:12px;pointer-events:none}
.stick-group{display:flex;flex-direction:column;align-items:center;gap:7px;width:112px;flex:none}
.thumbstick{width:108px;height:108px;position:relative;border-radius:50%;background:radial-gradient(circle,#f7f8eb50,#f7f8ebba);border:2px solid #ffffffe0;box-shadow:inset 0 0 0 12px #eef1df38,0 4px 17px #30402c20;backdrop-filter:blur(5px)}
.stick-axis{position:absolute;background:#637c5833;border-radius:2px;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}.axis-v{width:2px;height:74px}.axis-h{width:74px;height:2px}
.stick-knob{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);height:44px;width:44px;border-radius:50%;background:linear-gradient(145deg,#7c9772,#456447);border:2px solid #cbd9bc;box-shadow:0 3px 7px #29452f55;pointer-events:none}.engaged{border-color:#cadcb8}
.stick-caption{font-size:10px;letter-spacing:.3px;color:#3b5534;background:#f4f6e8d9;padding:4px 9px;border-radius:20px}
.phone-run{min-height:36px;width:112px;font-size:10px;background:#f4f6e8ed;border:1px solid #fff;border-radius:6px}.phone-run[aria-pressed=true]{background:#42654c;color:#fff}
.quick-group{display:flex;flex-direction:column;gap:6px;max-width:190px}.quick-actions{display:grid;grid-template-columns:repeat(3,minmax(44px,1fr));gap:6px}
.quick-actions button{border:1px solid #fff9;background:#f4f6e9ed;backdrop-filter:blur(8px);box-shadow:0 2px 8px #32422a16;border-radius:8px;min-width:46px;min-height:48px;padding:5px 6px;font-size:11px;color:#3e5b36;font-weight:500;line-height:1.25}
.quick-actions .hold-button{background:#42674fee;color:white;border-color:#a9bda4}.quick-actions .pressed,.quick-actions button[aria-pressed=true]{background:#72965c;color:white;border-color:#e5edd9}.quick-actions button:disabled{opacity:.45;cursor:default}
.quick-more{min-height:36px;border:1px solid #fff8;border-radius:7px;background:#f8f8e8e6;font-size:11px;color:#44653a}
.phone-nav{position:absolute;bottom:0;left:0;right:0;display:flex;padding:4px max(8px,var(--safe-r)) calc(4px + var(--safe-b)) max(8px,var(--safe-l));height:calc(52px + var(--safe-b));background:#f5f6ecef;border-top:1px solid #fff9;backdrop-filter:blur(14px)}
.phone-nav button{flex:1;border:0;border-radius:6px;background:transparent;color:#839179;font-size:15px;display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px}.phone-nav span{font-size:11px}.phone-nav button.active{background:#dce6d3;color:#3b5a31}
.phone-observe-hint{position:absolute;bottom:calc(132px + var(--safe-b));left:50%;transform:translateX(-50%);color:#48603e;background:#f8f7e8db;border:1px solid #fff8;border-radius:8px;padding:10px 16px;text-align:center;white-space:nowrap;font-size:11px;line-height:1.7}
#phoneControls[data-actor=auto] .phone-pad,#phoneControls:not([data-actor=auto]) .phone-observe-hint{display:none}
.touch-layout .toast{top:29%;z-index:9;font-size:12px;max-width:calc(100% - 32px);width:max-content;line-height:1.6;padding:10px 14px}
.touch-layout .bird-marker{font-size:11px}.touch-layout .bird-marker small{font-size:10px}
.touch-layout #phoneSheetShade:not([hidden]){display:block;position:fixed;inset:0;background:#23392e66;backdrop-filter:blur(3px);z-index:30;touch-action:none}
.touch-layout .sidebar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:31;height:min(84dvh,780px);max-height:calc(100dvh - 16px - var(--safe-t));background:#f8f8f1;border:1px solid #dce3d2;border-radius:18px 18px 0 0;padding:0 max(18px,var(--safe-r)) var(--safe-b) max(18px,var(--safe-l));box-shadow:0 -15px 70px #22372e38;overflow:hidden}
.touch-layout.phone-sheet-open .sidebar{display:flex}
.touch-layout .phone-sheet-heading{display:flex;align-items:center;justify-content:space-between;flex:none;min-height:62px;gap:12px;padding:8px 0}.phone-sheet-heading h2{font:22px Georgia,serif;margin:0}.phone-sheet-heading button{height:44px;min-width:70px;border:1px solid #d5dfca;border-radius:7px;background:#e8eedf;color:#46603a;font-size:12px}
.touch-layout .sidebar>.mode-switch{flex:none;margin-bottom:6px}.touch-layout .sidebar>.mode-switch button{min-height:44px;font-size:12px}
.touch-layout .tabs{justify-content:space-between;gap:8px}.touch-layout .tabs button{min-height:44px;font-size:12px;padding:10px 3px}.touch-layout .panel-scroll{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;flex:1;min-height:0;padding-bottom:24px;padding-right:3px}
.touch-layout .tab-panel{padding-top:16px}.touch-layout .sidebar-footer{display:none}.touch-layout .resident{padding-top:12px}.touch-layout .behavior{padding-top:6px}.touch-layout .needs{margin-bottom:12px}.touch-layout .phone-resident-info{border-bottom:1px solid #dce3d2;margin-bottom:20px}
.touch-layout .wide-select{min-height:46px;font-size:14px}.touch-layout .slider-label,.touch-layout .toggle-row strong,.touch-layout .field-label{font-size:13px}.touch-layout input[type=range]{height:6px;margin:18px 0;touch-action:pan-x}.touch-layout input[type=range]::-webkit-slider-thumb{width:24px;height:24px}.touch-layout input[type=range]::-moz-range-thumb{width:20px;height:20px}.touch-layout .toggle{height:30px;width:48px;padding:4px}.touch-layout .toggle i{height:22px;width:22px}.touch-layout .toggle[aria-checked=true] i{transform:translateX(18px)}
.touch-layout .action-grid button{min-height:48px;font-size:12px}.touch-layout .play-actions kbd{display:none}.touch-layout .play-actions{gap:8px}.touch-layout .weather-switch button{min-height:46px}.touch-layout .reset-button{min-height:46px}.touch-layout .facts p,.touch-layout .facts b{font-size:12px}.touch-layout .insight p,.touch-layout .journal p,.touch-layout .journal-description{font-size:11px}.touch-layout .journal strong{font-size:12px}.touch-layout .section-title>span{font-size:8px}
.touch-layout dialog{max-height:85dvh;overflow:auto;padding:25px}.touch-layout .help-grid{grid-template-columns:1fr}.touch-layout .phone-help{display:block!important}
@media(max-height:500px) and (orientation:landscape){
  .touch-layout .topbar{display:none}.touch-layout .app{height:100dvh}.touch-layout .phone-top{top:max(8px,var(--safe-t));right:auto;width:320px}.touch-layout .phone-actors{min-width:240px}.touch-layout .phone-settings{margin:0}.touch-layout .scene-top{top:max(10px,var(--safe-t));left:auto}.touch-layout .habitat-label{display:none}.touch-layout .phone-status{top:68px;max-width:240px}.touch-layout .phone-pad{bottom:calc(57px + var(--safe-b));align-items:flex-end}.touch-layout .thumbstick{width:98px;height:98px}.touch-layout .stick-group{gap:4px}.touch-layout .stick-caption{display:none}.touch-layout .quick-actions button{min-height:44px}.touch-layout .quick-more{min-height:32px}.touch-layout .scene-bottom{bottom:calc(59px + var(--safe-b));left:50%;right:auto;transform:translateX(-50%);width:234px}.touch-layout .camera-controls{max-width:182px}.touch-layout .camera-controls button{font-size:10px;padding:5px}.touch-layout .sidebar{left:auto;width:min(440px,80vw);height:100dvh;max-height:100dvh;border-radius:16px 0 0 16px}.touch-layout .phone-observe-hint{bottom:calc(125px + var(--safe-b))}.touch-layout .toast{top:30%;max-width:55%}
}
@media(max-width:350px){.touch-layout .tagline{display:none}.touch-layout .phone-pad{gap:7px;left:8px;right:8px}.touch-layout .stick-group{width:104px}.touch-layout .thumbstick{width:100px;height:100px}.touch-layout .quick-actions{gap:4px}.touch-layout .quick-actions button{font-size:10px;padding:5px 4px}.touch-layout .phone-actors button{padding:5px 8px}.touch-layout .camera-controls button{font-size:10px;padding:5px}.touch-layout .phone-run{width:104px}}

.touch-layout .phone-utility-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.phone-utility-row button{min-height:44px;border:1px solid #dce3d2;border-radius:7px;background:#edf1e5;font-size:12px;color:#4c6842}

.phone-feedback{display:none}.touch-layout .phone-feedback:not([hidden]){display:block;flex:none;border:1px solid #cbdabf;background:#e6eedb;color:#416037;font-size:12px;line-height:1.5;padding:9px 11px;border-radius:7px;margin:0 0 8px}