:root{--touch-top:106px;--touch-bottom:74px;--touch-display:56px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
.touch-layout body,.touch-layout #app{height:100dvh;overscroll-behavior:none}
.touch-layout #unity-canvas{position:absolute;left:0;top:calc(var(--touch-top) + var(--safe-top) + var(--touch-display));width:100%;height:calc(100% - var(--touch-top) - var(--touch-display) - var(--touch-bottom) - var(--safe-top) - var(--safe-bottom));touch-action:none}
.touch-layout #fullscreen{display:none!important}
.touch-layout #diagnostics{bottom:calc(var(--touch-bottom) + var(--safe-bottom) + 5px);right:8px;font-size:10px}
#mobile-ui{position:absolute;inset:0;pointer-events:none;color:#193045;z-index:2;font-family:system-ui,-apple-system,"Malgun Gothic",sans-serif;font-size:14px;line-height:1.45}
#mobile-ui button,#mobile-ui input,#mobile-ui select{pointer-events:auto;touch-action:manipulation;font:inherit}
#mobile-ui button{min-height:44px;border:0;border-radius:10px;padding:9px 12px;font-weight:600}
#mobile-ui button:focus-visible,#mobile-sheet button:focus-visible{outline:3px solid #149ca5;outline-offset:2px}
.touch-heading{height:calc(58px + var(--safe-top));padding:calc(10px + var(--safe-top)) 16px 10px;background:#193045;display:flex;align-items:center;gap:10px;color:white}
.touch-brand{font-weight:750;font-size:18px;letter-spacing:-.5px;flex:1}
.touch-brand small{display:block;font-size:9px;color:#adc3d0;letter-spacing:1.2px;font-weight:500}
#mobile-ui .source-pill{font-size:11px;padding:6px 10px;min-height:36px;border-radius:20px;background:#f8edce;color:#865400;white-space:nowrap}
#mobile-ui .expand-button{background:#ffffff16;color:white;width:40px;min-height:40px;padding:5px;font-size:22px}
.touch-tabs{height:48px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;background:#fff;padding:2px 8px;border-bottom:1px solid #d7e4ea}
#mobile-ui .touch-tabs button{border-radius:0;font-size:13px;background:transparent;color:#687e8c;border-bottom:3px solid transparent}
#mobile-ui .touch-tabs button[aria-current="page"]{border-color:#119797;color:#087b7c;background:#f0f9f9}
.touch-summary{position:absolute;top:calc(var(--touch-top) + var(--safe-top) + var(--touch-display) + 12px);left:12px;right:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-width:820px;margin:auto;transition:opacity .15s}
.touch-display{position:absolute;top:calc(var(--touch-top) + var(--safe-top));left:0;right:0;height:var(--touch-display);display:flex;align-items:center;justify-content:flex-end;gap:6px;padding:6px 12px;background:#e6f0f4;pointer-events:auto}
#mobile-ui .touch-display button{min-height:44px;padding:8px 10px;border-radius:6px;background:#fff;color:#193045;font-size:12px;white-space:nowrap}
#mobile-ui .touch-display button.active{background:#dceff5;color:#087b7c;box-shadow:inset 3px 0 #119797}
.touch-display button span{margin-left:5px;font-size:11px;font-weight:750}
@media(max-width:369px){.touch-display{gap:4px;padding-left:8px;padding-right:8px}#mobile-ui .touch-display button{padding:8px;font-size:11px}}
#mobile-ui .summary-card{border:1px solid #d7e3e9;border-left:3px solid #119797;border-radius:10px;background:#fffffff2;box-shadow:0 3px 12px #19304509;padding:10px 12px;text-align:left;min-width:0;color:#193045;font-weight:400}
.summary-card .eyebrow{display:block;font-size:11px;color:#58717f;margin-bottom:4px}
.summary-card strong{display:block;font-size:16px;font-weight:700;white-space:nowrap}
.summary-card small{display:block;font-size:10px;color:#607985;margin-top:4px;line-height:1.4}
.summary-card em{font-style:normal;font-size:10px;margin-left:3px;font-weight:400}
#mobile-ui .summary-card.alarm{border-left-color:#ce4938}.summary-card.alarm strong{color:#b23929}
#mobile-ui .summary-card.warning{border-left-color:#cc891b}.summary-card.warning strong{color:#a16c14}
#mobile-ui .summary-card.waiting{border-left-color:#8496a1}.summary-card.waiting strong{color:#687e8c}
.touch-summary .equipment-card{grid-column:1/-1;max-width:620px;width:100%;justify-self:center}
.equipment-card header{display:flex;justify-content:space-between;gap:8px;align-items:center}.equipment-card header strong{font-size:13px}.equipment-card header small{margin:0}
.touch-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin-top:8px}.touch-metrics span{min-width:0;border-left:1px solid #e2ebef;padding-left:8px}.touch-metrics span:first-child{padding-left:0;border:0}.touch-metrics label{display:block;font-size:9px;color:#607985}.touch-metrics b{font-size:15px;font-variant-numeric:tabular-nums}.touch-metrics i{font-style:normal;font-size:9px;color:#607985;margin-left:2px}
.touch-toolbar{position:absolute;bottom:0;left:0;right:0;height:calc(var(--touch-bottom) + var(--safe-bottom));padding:9px 10px calc(9px + var(--safe-bottom));display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;background:#fff;border-top:1px solid #d7e4ea;pointer-events:auto}
#mobile-ui .touch-toolbar button{font-size:12px;padding:6px;background:#f3f7f9;color:#193045}.touch-toolbar button span{font-size:17px;display:block;line-height:1.2;margin-bottom:3px}
#mobile-ui .touch-toolbar .primary{background:#e6f4f4;color:#087b7c}
.gesture-tip{position:absolute;bottom:calc(var(--touch-bottom) + var(--safe-bottom) + 9px);left:12px;color:#e9f4f7;background:#193045bd;border-radius:20px;font-size:10px;padding:5px 10px;pointer-events:none;max-width:calc(100% - 24px)}
.touch-layout #loading,.touch-layout #error{padding:24px;z-index:10}.touch-layout #load-label{text-align:center;line-height:1.6}
#mobile-sheet{position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:none;max-height:78dvh;border:0;border-radius:20px 20px 0 0;padding:0 0 var(--safe-bottom);color:#193045;background:#f4f8fa;box-shadow:0 -8px 40px #15314430;font:14px/1.5 system-ui,-apple-system,"Malgun Gothic",sans-serif;overscroll-behavior:contain}
#mobile-sheet::backdrop{background:#102b4145}
.sheet-heading{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #dbe6eb;padding:13px 18px;z-index:1}.sheet-heading h2{font-size:18px;margin:0;font-weight:750}.sheet-heading button{border:0;background:#edf3f6;border-radius:22px;min-width:44px;min-height:44px;padding:8px;color:#365566;font-size:13px}
.sheet-content{padding:16px 18px 24px}.sheet-content p{margin:0 0 14px}.sheet-note{font-size:12px;color:#677e8b;line-height:1.6}.sheet-note.demo{padding:11px;background:#fff6df;border-radius:10px;color:#8c691e}.sheet-card{padding:16px;background:#fff;border:1px solid #dce7ed;border-radius:12px;margin-bottom:12px}.sheet-card h3{font-size:14px;margin:0 0 12px}.sheet-card label{display:block;margin-bottom:7px;font-size:12px;color:#607985}
#mobile-sheet button{min-height:44px;touch-action:manipulation;font:inherit;font-weight:600;cursor:pointer}.sheet-actions{display:flex;gap:8px;flex-wrap:wrap}.sheet-actions button{flex:1;border-radius:9px;border:1px solid #d4e1e7;background:#fff;color:#193045;white-space:nowrap;padding:9px 12px}.sheet-actions button.active,.sheet-actions .primary{background:#e4f3f3;border-color:#8fcac9;color:#087b7c}.sheet-actions .primary.solid{background:#117f85;color:#fff;border-color:#117f85}
.sheet-content input[type="range"]{display:block;width:100%;min-height:44px;margin:0;accent-color:#0d9396;touch-action:pan-x}.sheet-content input[type="url"]{width:100%;font:16px system-ui;padding:12px;border:1px solid #c8dbe4;border-radius:8px;color:#193045;background:#fff}.sheet-content select{min-height:44px;width:100%;background:white;border:1px solid #c8dbe4;border-radius:8px;padding:9px;font:14px system-ui;color:#193045}
.split-label{display:flex;justify-content:space-between;gap:10px;margin:8px 0;color:#476675}.split-label b{font-variant-numeric:tabular-nums;color:#193045}.repeat-pill{display:inline-block;background:#e4f3f3;color:#087b7c;border-radius:20px;padding:4px 9px;font-size:11px}
.equipment-list{display:grid;gap:7px}.equipment-list button{display:flex;align-items:center;justify-content:space-between;text-align:left;gap:10px;width:100%;background:#fff;border:1px solid #dce7ed;border-radius:10px;padding:13px}.equipment-list button.selected{border-color:#128e93;background:#edf8f8}.equipment-list small{font-size:11px;font-weight:400;color:#6c818c}.condition-dot{color:#697e8b;font-size:11px;white-space:nowrap}.condition-dot[data-priority="2"]{color:#b33d2b}.condition-dot[data-priority="1"]{color:#ad7216}
.motion-list{display:grid;gap:10px}.motion-card{background:#fff;border:1px solid #dce7ed;border-top:3px solid #0a8a8e;border-radius:10px;padding:13px}.motion-card header{display:flex;align-items:center;justify-content:space-between;gap:5px}.motion-card h3{margin:0;font-size:14px}.motion-card button{background:#f1f6f8;border:0;border-radius:8px;color:#355a70;padding:5px 10px;font-size:12px!important}.motion-numbers{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}.motion-numbers label{display:block;color:#6d8391;font-size:11px}.motion-numbers b{font-size:21px}.motion-numbers em{font-style:normal;font-size:10px;margin-left:4px;color:#6d8391}.axis-grid{display:grid;grid-template-columns:repeat(3,1fr);font-size:11px;gap:4px;color:#718490}.axis-grid b{display:block;color:#193045;font-size:13px}.chart-grid{display:grid;gap:12px}.raw-chart{padding:12px;background:#fff;border:1px solid #dce7ed;border-radius:10px}.raw-chart header{display:flex;justify-content:space-between;font-size:12px;margin-bottom:8px}.raw-chart svg{display:block;width:100%;height:65px;background:#f4f8fa}.chart-range{display:flex;justify-content:space-between;font-size:10px;color:#748894;margin-top:5px}
.connection-state{padding:12px;border-radius:9px;background:#edf3f6;font-size:12px;overflow-wrap:anywhere}.sheet-content .full-width{width:100%}
.motion-trends{padding:14px;background:#fff;border:1px solid #dce7ed;border-radius:12px;margin-bottom:14px}.motion-trends>header{display:flex;align-items:center;justify-content:space-between;gap:6px}.motion-trends h3{font-size:13px;margin:5px 0 0}.motion-trends small{font-size:9px;color:#677e8b}.motion-trends>header button{padding:5px 8px;font-size:11px!important;border:0;background:#edf5f7;color:#193045;border-radius:8px;white-space:nowrap}.motion-legend{display:flex;gap:20px;font-size:11px;margin:12px 0}.motion-trend-plots{display:grid;gap:12px}.motion-trend-chart{padding:8px}.motion-trend-chart header{font-size:11px}.motion-trend-chart .sheet-note{margin:6px 0 0;font-size:10px}
@media(min-width:768px){:root{--touch-top:118px;--touch-bottom:78px}.touch-heading{height:calc(66px + var(--safe-top));padding-left:24px;padding-right:24px}.touch-brand{font-size:21px}.touch-tabs{height:52px;padding-left:18px;padding-right:18px}#mobile-ui .touch-tabs button{font-size:15px}.touch-summary{top:calc(var(--touch-top) + var(--safe-top) + 18px);gap:14px;left:24px;right:24px}#mobile-ui .summary-card{padding:15px 18px}.summary-card strong{font-size:21px}.summary-card .eyebrow{font-size:13px}.summary-card small{font-size:12px}.touch-toolbar{justify-content:center;grid-template-columns:repeat(4,minmax(100px,170px));padding-left:24px;padding-right:24px}#mobile-ui .touch-toolbar button{font-size:13px}.equipment-card header strong{font-size:16px}.touch-metrics b{font-size:21px}.touch-metrics label,.touch-metrics i{font-size:11px}.gesture-tip{left:24px;bottom:calc(var(--touch-bottom) + 18px);font-size:11px}#mobile-sheet{inset:calc(var(--touch-top) + var(--safe-top) + 12px) 16px 16px auto;width:420px;max-height:none;border-radius:16px;padding-bottom:0}.chart-grid{grid-template-columns:1fr 1fr}}
@media(max-height:500px) and (orientation:landscape){:root{--touch-top:88px;--touch-bottom:54px}.touch-heading{height:calc(44px + var(--safe-top));padding-top:5px;padding-bottom:5px}.touch-brand{font-size:15px}.touch-brand small{display:none}.touch-tabs{height:44px}.touch-toolbar{padding-top:5px;padding-bottom:5px}#mobile-ui .touch-toolbar button{font-size:11px;min-height:42px}.touch-toolbar button span{display:inline;font-size:14px;margin:0 5px 0 0}.touch-summary{top:calc(var(--touch-top) + var(--safe-top) + 7px);max-width:600px}#mobile-ui .summary-card{padding:5px 10px}.summary-card .eyebrow{font-size:10px;margin:0}.summary-card strong{font-size:14px}.summary-card small{display:none}.equipment-card header{display:none}.touch-metrics{margin:0}.gesture-tip{display:none}#mobile-sheet{inset:0 0 0 auto;width:min(440px,80vw);max-height:100dvh;border-radius:14px 0 0 14px}.sheet-heading{padding:8px 16px}}
.expanded-view.touch-layout{--touch-top:48px}.expanded-view .touch-heading{display:none}.expanded-view .touch-summary{display:none}
#mobile-ui .source-pill,#mobile-ui .expand-button{min-height:44px}#mobile-ui .expand-button{width:44px}
#mobile-ui .focus-exit{display:none;position:absolute;right:12px;bottom:calc(var(--touch-bottom) + var(--safe-bottom) + 10px);background:#193045eb;color:#fff;font-size:12px;box-shadow:0 2px 8px #19304522}
.expanded-view #mobile-ui .focus-exit{display:block}
.summary-card .equipment-counts{display:flex;flex-wrap:wrap;column-gap:9px;row-gap:1px}.equipment-counts span{white-space:nowrap}
@media(max-width:767px){.equipment-counts span{width:calc(50% - 5px)}}
@media(max-height:500px) and (orientation:landscape){.summary-card .equipment-counts{display:none}}
@media(max-height:500px) and (orientation:landscape){.touch-heading{padding-top:0;padding-bottom:0;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}.touch-tabs,.touch-toolbar{padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right))}}

#mobile-ui .vessel-button{background:#ffffff16;color:white;min-width:44px;min-height:44px;padding:4px;font-size:11px;line-height:1.25}
@media(max-width:600px){.touch-heading{gap:6px;padding-left:12px;padding-right:12px}.touch-brand{min-width:0;font-size:17px}.touch-brand small{font-size:8px;letter-spacing:.5px}#mobile-ui .source-pill{padding-left:7px;padding-right:7px;font-size:10px}}
.touch-brand{display:flex;align-items:center;gap:8px;white-space:nowrap}.touch-brand .aioha-mark{width:36px}.touch-heading>button{flex-shrink:0}
@media(min-width:768px){.touch-brand .aioha-mark{width:48px}.touch-toolbar{grid-template-columns:repeat(3,minmax(100px,170px))}.touch-display{padding-right:24px}.touch-summary{top:calc(var(--touch-top) + var(--safe-top) + var(--touch-display) + 18px)}}
@media(max-width:600px){.touch-brand{gap:6px;font-size:16px}.touch-brand .aioha-mark{width:30px}.touch-brand small{font-size:7px;letter-spacing:.2px}}
@media(max-width:369px){.touch-heading{padding-left:8px;padding-right:8px;gap:5px}.touch-brand{font-size:14px;gap:5px}.touch-brand .aioha-mark{width:26px}.touch-brand small{font-size:6px}#mobile-ui .touch-tabs button{font-size:11px;padding-left:4px;padding-right:4px;white-space:nowrap}}
@media(max-height:500px) and (orientation:landscape){.touch-summary{top:calc(var(--touch-top) + var(--safe-top) + var(--touch-display) + 7px)}}