/* Mobile app presentation v0.2.0. Business rules remain in core/API. */
:root{--bg:#f4f6fa;--ink:#152d38;--muted:#70808d;--accent:#117f73;--line:#e5eaf0;font-family:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;-webkit-tap-highlight-color:transparent}body{padding-bottom:calc(94px + env(safe-area-inset-bottom));overscroll-behavior-y:none}header{height:74px;padding:0 28px;gap:12px;border:0;box-shadow:0 1px 0 #17333d0a;background:#ffffffeb;backdrop-filter:blur(18px)}.brand{font-size:17px;letter-spacing:-.4px}.symbol{border-radius:13px;background:linear-gradient(140deg,#183843,#147f70);width:38px;height:38px;display:grid;place-items:center;padding:0;font-size:21px}.shell{display:block;max-width:1120px}aside{display:none!important}main{padding:26px 28px 28px}header #mode{margin-right:auto;font-size:10px;padding:5px 8px}header #notice,header #account{padding:10px 12px;font-size:12px;border-radius:30px;min-height:38px}.bottom{display:flex;position:fixed;bottom:14px;left:50%;right:auto;transform:translateX(-50%);width:min(680px,calc(100% - 32px));padding:9px 14px calc(9px + env(safe-area-inset-bottom));gap:6px;justify-content:space-around;background:#fff;border:1px solid #e9edf2;border-radius:25px;box-shadow:0 12px 45px #102e3b16;z-index:20}.bottom a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;flex:1;padding:9px 6px;border-radius:17px;color:#85939e;font-size:11px;font-weight:650;min-height:57px}.bottom a.active{background:#e8f5ef;color:#107b6d}.nav-icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}button,.button{border-radius:14px;padding:13px 17px;min-height:46px;font-size:13px;box-shadow:none;touch-action:manipulation}.secondary{background:#eef2f6;color:var(--ink)}.card{border:0;border-radius:22px;padding:24px;box-shadow:0 3px 18px #213e4e04;margin-bottom:18px}.hero{border-radius:26px;padding:34px;background:radial-gradient(ellipse at 100% 0,#3b9d8580,transparent 65%),linear-gradient(130deg,#173c48,#176451);box-shadow:0 12px 26px #12645614}.hero h1{font-size:clamp(28px,4vw,42px);letter-spacing:-1.1px}.hero .button{background:#fff;color:#185347}.hero .button.secondary{background:#ffffff20;color:#fff}h1{font-size:28px;letter-spacing:-.8px;margin:9px 0 22px}h2{font-size:19px;letter-spacing:-.4px}h3{font-size:16px}.eyebrow{font-size:10px;letter-spacing:1.6px}.badge{font-size:10px;padding:7px 10px}.muted{font-size:13px}.grid{gap:18px}label{font-size:12px}input,textarea,select{border-color:#e2e8ee;border-radius:13px;background:#f8fafc;padding:14px;font-size:14px}input:focus,textarea:focus,select:focus{background:#fff;outline:2px solid #b0dace;outline-offset:0}.list-item{background:#f8fafc;border:0;border-radius:15px;margin-bottom:10px;padding:16px}.list-item p{margin:8px 0 0}.list-item strong{font-size:14px}.stats{gap:12px}.stat{border:0;border-radius:20px;box-shadow:0 3px 18px #213e4e04;font-size:12px}.stat strong{font-size:25px}.alert{font-size:12px;border:0;border-radius:15px}.chat{background:#f0f4f8;border-radius:17px;padding:16px;height:480px;gap:14px}.bubble{border:0;border-radius:17px 17px 17px 5px;padding:13px 15px;box-shadow:0 2px 7px #1233;font-size:13px;line-height:1.65}.bubble.mine{border-radius:17px 17px 5px 17px;background:#ddf3e9;box-shadow:none}.bubble.system{background:transparent;box-shadow:none;font-size:11px;text-align:center;color:#7b8c98;padding:4px 8px}.bubble small{font-size:10px}.chat-compose{align-items:center;gap:9px}.chat-compose input{background:#f2f5f8;border:0;border-radius:30px;min-height:48px}.chat-compose button{border-radius:30px;min-width:70px}.room-grid{grid-template-columns:minmax(0,1.5fr) minmax(290px,1fr)}table{font-size:12px}td,th{padding:13px 4px}.provider-card h2{font-size:18px}.auth{max-width:470px;margin:30px auto}.auth h1{font-size:30px}.auth button{width:100%}.install{padding:24px}.install .card{border:1px solid var(--line)}dialog{border:0;border-radius:25px;box-shadow:0 25px 90px #15343f24;padding:27px}dialog::backdrop{background:#102c3c66;backdrop-filter:blur(7px)}dialog #close-dialog{margin-top:14px;width:100%}#toast{bottom:110px;border-radius:20px;font-size:13px}#room-back{display:none;color:var(--ink);align-items:center;gap:6px;font-size:12px}.room-screen #room-back{display:flex}.room-screen .brand{display:none}.room-tabs{display:none}.native-room-summary{display:none}a:focus-visible,button:focus-visible{outline:3px solid #89cabb;outline-offset:2px}
@media(max-width:700px){body{padding-bottom:calc(80px + env(safe-area-inset-bottom))}header{height:64px;padding:0 16px;gap:8px}.brand{font-size:15px}.symbol{width:34px;height:34px}header #notice,header #account{font-size:11px;padding:8px 10px}header #mode{font-size:9px;max-width:78px;text-align:center;padding:5px}main{padding:22px 16px 18px}.hero{padding:28px 23px;border-radius:24px}.hero h1{font-size:32px;line-height:1.15}.hero .actions{margin-bottom:0}.card{padding:20px;border-radius:21px}.grid{gap:0}.bottom{bottom:0;left:0;right:0;transform:none;width:100%;border-radius:22px 22px 0 0;border:0;padding:8px 8px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -4px 24px #17333d09}.bottom a{padding:7px 3px;min-height:52px;font-size:10px;gap:4px}.nav-icon{width:21px;height:21px}.bottom a.active{background:#e8f5ef}.row{align-items:center}h1{font-size:25px}h2{font-size:18px}input,textarea,select{font-size:16px}.stats{grid-template-columns:1fr}.stat{padding:18px}.stat strong{font-size:26px}.list-item{gap:10px}.list-item .badge{max-width:125px;text-align:center}.room-screen main{padding:18px 12px}.room-screen main> .row h1{font-size:21px;margin:7px 0 12px}.room-screen main> .row .badge{max-width:135px;text-align:center}.room-tabs{display:flex;background:#e7edf2;padding:4px;border-radius:13px;margin:10px 0 14px;gap:4px}.room-tabs button{flex:1;background:transparent;color:#74838f;border-radius:10px;min-height:39px;padding:8px;font-size:12px}.room-tabs button[aria-selected=true]{background:#fff;color:#183843;box-shadow:0 2px 7px #152d3810}.native-room-summary{display:flex;align-items:center;justify-content:space-between;background:#fff;border-radius:16px;padding:13px 16px;margin:13px 0;font-size:12px;color:#6e8190}.native-room-summary strong{color:#117f73;font-size:16px}.room-grid{display:block}.room-grid>div{display:none}.room-screen.room-details .room-grid>section{display:none}.room-screen.room-details .room-grid>div{display:block}.room-grid>.card{padding:15px}.chat{height:clamp(340px,48dvh,580px);padding:13px;border-radius:14px}.chat-compose{margin-top:13px}.room-grid>.card> .actions button{font-size:11px;min-height:39px;padding:10px 12px}.bubble{max-width:92%}.bubble small{font-size:11px}.room-grid h2{font-size:16px}dialog{margin:auto 0 0;max-width:none;width:100%;max-height:92dvh;border-radius:26px 26px 0 0;padding:25px 22px calc(25px + env(safe-area-inset-bottom))}dialog::before{content:'';display:block;width:36px;height:4px;background:#d6dfe6;border-radius:8px;margin:-10px auto 20px}#toast{bottom:90px;width:max-content;max-width:calc(100vw - 30px)}.auth{margin:10px auto}.install{margin:10px auto}.install .grid{gap:0}}

/* Device appearance and persistent notification centre */
header #notice{position:relative;display:grid;place-items:center;width:42px;height:42px;min-height:42px;padding:8px;border-radius:50%;background:#f0f4f8}.notification-count{position:absolute;right:-2px;top:-3px;background:#c94b56;color:#fff;border:2px solid #fff;border-radius:20px;padding:2px 4px;min-width:19px;font-size:9px}.notification-item{padding:18px 0;border-bottom:1px solid var(--line)}.notification-item:last-child{border:0}.notification-item.unread{padding:18px 14px;background:#eef7f3;border-radius:16px;margin-bottom:8px;border:0}.notification-item p{font-size:13px;line-height:1.7}.notification-item strong{font-size:14px}.notification-item small{font-size:10px}.integration-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.integration-card{border:1px solid var(--line);border-radius:16px;padding:16px;background:#fafcfd;margin:0 0 12px}.integration-card summary{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;line-height:1.6}.integration-card form{margin-top:18px}.integration-card input[readonly]{font-size:11px;color:#637482;background:#edf1f5}.theme-ios{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--bg:#f2f2f7}.theme-ios .bottom{border-top:1px solid #dcdde54d;background:#fffffff0;backdrop-filter:blur(20px);box-shadow:none}.theme-ios .bottom a.active{background:transparent;color:#087f72}.theme-ios .card{border-radius:18px}.theme-ios input,.theme-ios select,.theme-ios textarea{border-radius:11px;background:#f2f2f7}.theme-ios .room-tabs{background:#e7e7ed}.theme-ios button{font-weight:600}.theme-android .bottom a.active{background:#d7eee5}.theme-android .bottom{border-radius:28px 28px 0 0}.theme-android button{border-radius:22px}.theme-android .card{border-radius:24px}.theme-android .room-tabs button{border-radius:12px}body:has(dialog[open]){overflow:hidden}@media(max-width:700px){header{padding-top:env(safe-area-inset-top);min-height:calc(64px + env(safe-area-inset-top));height:auto}.integration-grid{grid-template-columns:1fr}.integration-card{padding:15px}.integration-card summary{font-size:12px}.notification-item .row{align-items:flex-start;gap:6px}.theme-ios .bottom{border-radius:0}.theme-ios .bottom a.active span{color:#087f72}.theme-ios dialog{border-radius:15px 15px 0 0}.theme-android dialog{border-radius:28px 28px 0 0}}
.admin-tabs{display:flex;gap:5px;background:#e7edf2;padding:5px;border-radius:15px;margin:0 0 20px}.admin-tabs button{flex:1;font-size:12px;min-height:40px;padding:10px 6px;background:transparent;color:#758591;border-radius:11px}.admin-tabs button[aria-pressed=true]{background:#fff;color:#143c46;box-shadow:0 2px 7px #152d3810}@media(max-width:700px){.admin-tabs{gap:3px;margin-bottom:18px}.admin-tabs button{font-size:11px}}
@media(prefers-color-scheme:dark){:root{--bg:#10222b;--ink:#e1edf0;--muted:#a6b8c2;--accent:#218f7c;--line:#2b414b}.theme-ios{--bg:#101c24}header{background:#142a33ed}.card,.stat,dialog,.bottom,.theme-ios .bottom{background:#1b3039;color:#e1edf0}.bottom a.active,.theme-android .bottom a.active{background:#274b42;color:#9fe4cd}.theme-ios .bottom a.active{background:transparent;color:#9fe4cd}.secondary,.list-item,.integration-card,.admin-tabs,.room-tabs,.theme-ios .room-tabs{background:#203741;color:#dce8ed}input,textarea,select,.theme-ios input,.theme-ios textarea,.theme-ios select{background:#152b35;color:#e1edf0;border-color:#34505c}input:focus,textarea:focus,select:focus{background:#1b3039}.chat{background:#132933}.bubble{background:#233c48;color:#e1edf0}.bubble.mine{background:#264f43}.bubble.system{background:transparent;color:#acbec8}.native-room-summary{background:#1b3039}.native-room-summary strong{color:#9fe4cd}.notification-item.unread{background:#23463e}.integration-card input[readonly]{background:#152b35;color:#a6b8c2}.room-tabs button[aria-selected=true],.admin-tabs button[aria-pressed=true]{background:#344c58;color:#e1edf0}header #notice{background:#233b47}.notification-count{border-color:#142a33}.alert{background:#49391f;color:#f0d49b}.check{color:#e1edf0}.badge{background:#25483e;color:#a4e3cb}}
/* Portrait app layout also remains compact on laptop screens. */
.shell{max-width:560px}header{max-width:560px;margin:0 auto}.shell .grid,.shell .stats{grid-template-columns:1fr}.bottom{width:min(544px,calc(100% - 32px))}.room-grid{display:block}.room-grid>div{display:none}.room-screen.room-details .room-grid>section{display:none}.room-screen.room-details .room-grid>div{display:block}.room-tabs{display:flex;background:#e7edf2;padding:4px;border-radius:13px;margin:10px 0 14px;gap:4px}.room-tabs button{flex:1;background:transparent;color:#74838f;border-radius:10px;min-height:39px;padding:8px;font-size:12px}.room-tabs button[aria-selected=true]{background:#fff;color:#183843;box-shadow:0 2px 7px #152d3810}.native-room-summary{display:flex;align-items:center;justify-content:space-between;background:#fff;border-radius:16px;padding:13px 16px;margin:13px 0;font-size:12px;color:#6e8190}.native-room-summary strong{color:#117f73;font-size:16px}.integration-grid{grid-template-columns:1fr}@media(max-width:700px){.bottom{width:100%}}@media(max-width:380px){header{padding-left:12px;padding-right:12px;gap:4px}.brand{font-size:14px;gap:7px}.brand #brand{max-width:105px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.symbol{width:28px;height:28px;font-size:18px}header #mode{max-width:54px;width:54px;font-size:8px;padding:4px;line-height:1.3}header #notice{width:36px;height:36px;min-height:36px;padding:7px}header #account{font-size:10px;padding:7px;min-height:36px}.room-screen #room-back{font-size:11px}.admin-tabs button{font-size:10px}}@media(prefers-color-scheme:dark){.native-room-summary{background:#1b3039;color:#a6b8c2}.native-room-summary strong{color:#9fe4cd}.room-tabs{background:#203741}.room-tabs button[aria-selected=true]{background:#344c58;color:#e1edf0}}

/* Motion polish: only transform/opacity, no perpetual page animations. */
html{scrollbar-gutter:stable}body.dialog-open{overflow:hidden}main{min-height:60dvh}.bottom a,.room-tabs button,.admin-tabs button,button,.button{transition:background-color 160ms ease,color 160ms ease,transform 120ms ease}button:active,.button:active{transform:scale(.98)}.bottom a:active{transform:scale(.96)}header::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--accent);opacity:0;transform:scaleX(.12);transform-origin:left;transition:opacity 120ms ease}.page-loading header::after{opacity:.7;animation:loading-slide 1s ease-in-out infinite}header{position:sticky}details[open]>:not(summary){animation:detail-enter 180ms ease-out}@keyframes detail-enter{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}@keyframes loading-slide{0%{transform:translateX(0) scaleX(.12)}100%{transform:translateX(100%) scaleX(.12)}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}button:active,.button:active,.bottom a:active{transform:none}}

.user-detail{display:grid;grid-template-columns:minmax(100px,.7fr) minmax(0,1fr);gap:10px 16px;font-size:13px}.user-detail dt{color:var(--muted)}.user-detail dd{margin:0;overflow-wrap:anywhere}.list-item>div{min-width:0;overflow-wrap:anywhere}dialog details{margin:15px 0}dialog summary{cursor:pointer;font-weight:650}.admin-tabs{overflow-x:auto;scrollbar-width:none}.admin-tabs button{flex-shrink:0}@media(max-width:400px){.user-detail{grid-template-columns:1fr;gap:5px}.user-detail dd{margin-bottom:9px}}