/* Nexus 4 extras (jb-extra-apps.js): the KitKat simulator's kk-extra-apps.css at 1 dp = 0.8516 px, plus tiles and tabs. */
.kkx-app{display:flex;flex-direction:column;background:#f2f2f2;color:#222;font-family:Roboto,RobotoICS,sans-serif}
.kkx-bar{flex:none;display:flex;align-items:center;height:40.88px;padding:0 3.4px 0 0;background:#f2f2f2;color:#333;border-bottom:1.7px solid #33b5e5}
.kkx-bar.dark{background:#000;color:#fff;border-bottom:0}
.kkx-home{display:flex;align-items:center;height:100%;padding:0 6.81px 0 0;border:0;background:none;color:inherit;cursor:pointer}
.kkx-drawer{width:10.22px;height:100%;display:grid;place-items:center;opacity:.7}
.kkx-drawer svg{width:10.22px;height:10.22px}
.kkx-home img{width:27.25px;height:27.25px;margin-left:1.7px}
.kkx-bar h2{flex:1;min-width:0;margin:0;font:400 15.33px Roboto,RobotoICS,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kkx-btn{width:40.88px;height:40.88px;border:0;background:none;color:inherit;display:grid;place-items:center;cursor:pointer}
.kkx-btn svg{width:20.43px;height:20.43px}
.kkx-btn:active,.kkx-home:active,.kkx-file:active,.kkx-tile:active{background:#33b5e566}
.kkx-list{flex:1;min-height:0;overflow-y:auto;padding:0 0 13.63px;scrollbar-width:none}
.kkx-list::-webkit-scrollbar{display:none}
.kkx-section{margin:13.63px 13.63px 0;padding:0 0 3.4px;border-bottom:1.7px solid #33b5e5;font:700 11.92px Roboto,RobotoICS,sans-serif;color:#33b5e5;text-transform:uppercase}
.kkx-file{display:flex;align-items:center;gap:13.63px;width:100%;min-height:54.5px;padding:0 13.63px;border:0;border-bottom:.85px solid #dadada;background:none;color:inherit;text-align:left;cursor:pointer}
.kkx-file-icon{flex:none;width:27.25px;height:27.25px;color:#777}
.kkx-file-icon svg{width:100%;height:100%}
.kkx-file-copy{min-width:0;display:flex;flex-direction:column}
.kkx-file-copy strong{font:400 15.33px Roboto,RobotoICS,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kkx-file-copy small{font:400 11.92px Roboto,RobotoICS,sans-serif;color:#777}
/* Newsstand: Read Now cards on the light shelf, the headline over the card colour. */
.kkx-newsstand{background:#e5e5e5}
.kkx-cards{padding:6.81px}
.kkx-story{margin:0 0 6.81px;background:#fff;box-shadow:0 .85px 1.7px #0000002e}
.kkx-story-art{height:136.26px;display:flex;align-items:flex-end;padding:10.22px;color:#fff}
.kkx-story-art b{font:300 20.43px/1.2 Roboto,RobotoICS,sans-serif}
.kkx-story-copy{padding:6.81px 10.22px}
.kkx-story-copy small{font:400 11.92px Roboto,RobotoICS,sans-serif;color:#333}
/* Quickoffice: the white home screen with its three source tiles. */
.kkx-quickoffice{background:#fff}
.kkx-tiles{display:flex;gap:6.81px;margin:10.22px 13.63px 0}
.kkx-tile{flex:1;display:flex;flex-direction:column;align-items:center;gap:5.11px;padding:10.22px 3.4px;border:.85px solid #dadada;background:#fafafa;color:#222;font:400 11.92px Roboto,RobotoICS,sans-serif;cursor:pointer}
.kkx-tile span{width:27.25px;height:27.25px;color:#33b5e5}
.kkx-tile svg{width:100%;height:100%}
.kkx-page{flex:1;min-height:0;overflow:auto;background:#d9d9d9;padding:10.22px}
.kkx-paper{background:#fff;padding:20.43px 17.03px;box-shadow:0 .85px 2.56px #00000040;font:400 12.77px/1.5 Roboto,RobotoICS,sans-serif}
.kkx-paper p{margin:0 0 6.81px}
/* Wallet: the balance tile in the Holo blue. */
.kkx-balance{margin:13.63px 13.63px 0;padding:13.63px;background:#fff;border-left:5.11px solid #33b5e5;box-shadow:0 .85px 1.7px #0000002e;display:flex;flex-direction:column;gap:3.4px}
.kkx-balance small{font:400 11.92px Roboto,RobotoICS,sans-serif;color:#777}
.kkx-wallet .kkx-file-copy strong{white-space:normal}
.kkx-balance b{font:300 27.25px Roboto,RobotoICS,sans-serif;color:#222}

.jbx-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px}
.jbx-tile{display:flex;flex-direction:column;align-items:stretch;padding:0 0 8px;border:0;background:#fff;box-shadow:0 1px 2px #0003;text-align:left;color:#222;font:400 13px Roboto,RobotoICS,sans-serif}
.jbx-tile-art{display:grid;place-items:center;height:96px;margin-bottom:6px;background:var(--tile,#33b5e5);color:#fff;font:300 40px Roboto,RobotoICS,sans-serif}
.jbx-tile-art svg{width:40px;height:40px}
.jbx-tile strong{padding:0 8px;font-weight:400;font-size:14px}
.jbx-tile small{padding:0 8px;color:#777}
.jbx-grid.dark .jbx-tile{background:#2b2b2b;color:#eee}
.jbx-currents .kkx-list,.jbx-studio .kkx-list{background:#111}
.jbx-new .jbx-tile-art{background:#333}
.jbx-tabs{flex:none;display:flex;background:#f2f2f2;border-bottom:1px solid #ccc}
.jbx-tabs button{flex:1;height:40px;border:0;background:none;color:#555;font:500 13px Roboto,RobotoICS,sans-serif;text-transform:uppercase}
.jbx-tabs button.on{color:#222;box-shadow:inset 0 -3px #33b5e5}

/* Navigation (Maps 6.14, audit step 4): Theme.Holo on black, the #222222 bar, the pager title strip, the tiles
   (da_action_button_normal at 320 dpi, x .4258). */
.nav614{background:#000;color:#fff;display:flex;flex-direction:column}
.nav-bar{flex:none;display:flex;align-items:center;height:40.88px;background:#222}
.nav-bar img{width:27.25px;height:27.25px;margin:0 6.81px 0 6.81px}
.nav-bar b{font:400 15.33px RobotoICS,Roboto,sans-serif;color:#fff}
.nav-strip{flex:none;position:relative;display:flex;align-items:center;justify-content:center;height:27.25px;background:linear-gradient(#2e2e2e,#3c3c3c 13%,#3c3c3c);font:400 10.22px RobotoICS,Roboto,sans-serif;color:#33b5e5}
.nav-strip span{position:absolute;right:1.7px;opacity:.6}
.nav-tiles{display:grid;grid-template-columns:1fr 1fr;gap:1.7px;padding:1.7px}
.screen .nav-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3.41px;height:85.16px;padding:0;border-style:solid;border-width:8.94px 8.52px 8.94px 9.37px;border-image:url('assets/nav-da_action_button_normal.png') 21 20 21 22 fill/8.94px 8.52px 8.94px 9.37px;background:none;font:400 11.07px RobotoICS,Roboto,sans-serif;color:#ccc}
.nav-tile img.da_picker_speak_destination,.nav-tile img.da_picker_type_destination{width:40.88px;height:40.88px}
.nav-tile img.da_picker_contacts,.nav-tile img.da_picker_starred_items{width:25.55px;height:25.55px}
.screen .nav-tile:active{filter:brightness(1.3)}

/* Local (Maps 6.14's Places, audit step 4): 240 dpi drawables x .5677, 320 dpi x .4258. */
.loc614{display:flex;flex-direction:column;background:#c7d5e6 url('assets/loc-places_categories_map.png') center bottom/100% auto no-repeat}
.loc-bar{flex:none;display:flex;align-items:center;height:38.32px;background:url('assets/loc-actionbar_background.png') 0 0/100% 100%}
.loc-switch{display:flex;align-items:center;padding:0 3.41px 0 3.41px}
.loc-switch img:first-child{width:36.19px;height:36.19px}
.loc-switch img+img{width:11.5px;height:6.81px}
.loc-bar i{flex:none;width:1.14px;height:100%;background:url('assets/loc-actionbar_seperator.png') 0 0/100% 100%}
.loc-bar b{flex:1;padding-left:4.26px;font:400 18.73px RobotoICS,Roboto,sans-serif;color:#000}
.screen .loc-bar button{width:37.47px;height:37.47px;padding:0;border:0;background:none}
.loc-bar button img{width:37.47px;height:37.47px}
.loc-where{flex:none;display:flex;align-items:center;gap:6.81px;height:40.88px;padding:0 8.52px;background:url('assets/loc-places_location_bar_bg.png') 0 0/100% 100%;font:400 13.63px RobotoICS,Roboto,sans-serif;color:#fff}
.loc-where img:first-child{width:9.08px;height:9.08px}
.loc-where span{flex:1}
.loc-where img:last-child{width:6.81px;height:6.81px}
.loc-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:0 6.81px;padding:56.2px 6.81px 11.92px}
.screen .loc-cats button{display:flex;flex-direction:column;align-items:center;gap:1.7px;margin-bottom:3.41px;padding:0;border:0;background:none;font:400 10.22px RobotoICS,Roboto,sans-serif;color:#000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.loc-cats img{width:45.99px;height:45.99px}
.loc-cats span{max-width:100%;overflow:hidden;text-overflow:ellipsis}

/* Messenger (Google+ 4.0, audit step 4): the host bar (stock-apps.css .sa-bar) and conversation_list_item_view on
   bg_tacos_body (6 dp sides) over #e5e5e5. */
.msg40{display:flex;flex-direction:column;background:#e5e5e5}
.screen .msg-act{flex:none;width:47.69px;height:100%;padding:0;border:0;background:none;display:grid;place-items:center}
.msg-act img{width:27.25px;height:27.25px}
.msg-list{flex:1;overflow-y:auto;padding:0 5.11px}
.screen .msg-row{position:relative;display:flex;align-items:flex-start;width:100%;min-height:54.5px;padding:0 1.7px;border:0;border-style:solid;border-width:0 3.41px;border-image:url('assets/msg-bg_tacos_body.png') 0 4 fill/0 3.41px;background:none;text-align:left}
.msg-row img{flex:none;width:54.5px;height:54.5px}
.msg-row span{flex:1;min-width:0;display:flex;flex-direction:column;padding:8.52px 47.69px 7.66px 6.81px}
.msg-row b{font:700 15.33px Roboto,sans-serif;color:#303030;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-row small{padding-top:1.7px;font:400 11.92px Roboto,sans-serif;color:#707070;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-row time{position:absolute;right:13.63px;top:12.77px;font:400 10.22px Roboto,sans-serif;color:#c0c0c0}

/* Currents 2.1 (audit step 4): the category menu under the sliding story panel. */
.cur21{position:relative;background:#555;overflow:hidden}
.cur-menu{position:absolute;inset:0 15% 0 0;overflow-y:auto;background:#555}
.screen .cur-cat{display:flex;align-items:center;width:100%;height:40.88px;padding:0 7.66px;border:0;background:none;text-align:left;font:400 15.33px Roboto,sans-serif;color:#b2b2b2}
.screen .cur-cat.on{background:#0099cb;color:#fff}
.screen .cur-app{display:flex;align-items:center;gap:5.11px;width:100%;height:40.88px;padding:0 7.66px;border:0;border-top:.85px solid #555;background:#4c4c4c;text-align:left;font:400 11.92px Roboto,sans-serif;color:#fff}
.cur-app i{flex:none;display:grid;place-items:center;width:27.25px;height:27.25px;font:700 13.63px Roboto,sans-serif;font-style:normal;color:#fff}
.screen .cur-customize{font-style:italic;color:#b2b2b2}
.cur-panel{position:absolute;inset:0;display:flex;flex-direction:column;background:#f1f1f1;box-shadow:-8.52px 0 8.52px -4.26px #0006;transition:transform .2s}
.cur21.menu-open .cur-panel{transform:translateX(85%)}
.cur-bar{flex:none;display:flex;align-items:center;height:40.88px;background:#f1f1f1;border-bottom:1.7px solid #d2d2d2}
.screen .cur-home{flex:none;width:40.88px;height:100%;padding:0;border:0;background:none;display:grid;place-items:center}
.cur-home img{width:27.25px;height:27.25px}
.cur-bar b{flex:1;padding-left:7.66px;font:400 15.33px Roboto,sans-serif;color:#707070}
.cur-stories{flex:1;overflow-y:auto;padding:6.81px}
.screen .cur-tile{display:flex;flex-direction:column;gap:3.41px;width:100%;margin-bottom:6.81px;padding:10.22px;border:0;background:#fff;text-align:left;box-shadow:0 .85px 1.7px #0002}
.cur-tile b{font:300 16.18px/1.25 'Roboto Light',Roboto,sans-serif;color:#000}
.cur-tile small{font:400 11.92px Roboto,sans-serif;color:#8d8d8d}
.cur-tile span{font:400 11.92px/1.4 Roboto,sans-serif;color:#777}

/* Play Magazines 2.0 (audit step 4): the purple bar, the TitleNextWidget grid (140 dp columns, 10 dp gaps), the drawer. */
.mag20{position:relative;display:flex;flex-direction:column;background:#e6e7e7}
.mag-bar{flex:none;display:flex;align-items:center;height:40.88px;background:#5161bc;border-bottom:1.7px solid #4653a1;z-index:2}
.screen .mag-home{flex:none;display:flex;align-items:center;height:100%;padding:0 5.11px 0 0;border:0;background:none}
.mag-home img:first-child{width:13.63px;height:13.63px}
.mag-home img+img{width:27.25px;height:27.25px;margin-left:2.55px}
.mag-bar b{flex:1;min-width:0;font:400 15.33px Roboto,sans-serif;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mag-grid{flex:1;overflow-y:auto;display:grid;align-content:start;align-items:start;grid-template-columns:repeat(auto-fill,minmax(119.22px,1fr));gap:0 8.52px;padding:5.11px}
.screen .mag-card{position:relative;display:flex;flex-direction:column;min-width:0;margin-bottom:5.11px;padding:0 0 10.22px;border-style:solid;border-width:5.11px;border-image:url('assets/bk28-card_bg_play.png') 12 fill/5.11px;background:none;text-align:left}
.mag-cover{display:grid;place-items:center;aspect-ratio:3/4;margin:-1.7px -1.7px 0;padding:8.52px;color:#fff;font:700 15.33px Georgia,serif;text-align:center}
.mag-more{position:absolute;right:-3.41px;bottom:13.63px;width:27.25px;height:27.25px}
.mag-card strong{padding:8.52px 23.85px 0 4.26px;font:700 11.92px Roboto,sans-serif;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mag-card small{padding:2.55px 5.11px 0 4.26px;font:400 11.07px Roboto,sans-serif;color:#aaa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.screen .mag-scrim{position:absolute;inset:42.58px 0 0;z-index:3;border:0;background:#0009}
.mag-drawer{position:absolute;top:42.58px;bottom:0;left:0;z-index:4;width:min(272.51px,calc(100% - 54.5px));background:#fff;box-shadow:1.7px 0 5.11px #0004}
.screen .mag-drawer button{display:flex;align-items:center;width:100%;height:54.5px;padding:0 13.63px;border:0;border-bottom:.85px solid #e1e1e1;background:none;text-align:left;font:300 17.88px 'Roboto Light',Roboto,sans-serif;color:#505050}
.screen .mag-drawer button.on{background:#e6e6e6}
.screen .mag-drawer button:active{background:#98a1d7}

/* Wallet 1.6 (audit step 4): dashboard_activity on #e5e5e5. */
.wal16{display:flex;flex-direction:column;background:#e5e5e5}
.wal-dash{flex:1;display:flex;flex-direction:column}
.wal-space{flex:1;display:block}.wal-space.wide{flex:4}
.wal-row{display:flex;padding:0 17.03px}
.screen .wal-btn{flex:1;display:flex;flex-direction:column;align-items:center;padding:0;border:0;background:none;font:400 15.33px Roboto,sans-serif;color:#333}
.wal-btn img{width:83.45px;height:70.96px}
.wal-btn span{margin-top:.85px}
.screen .wal-btn:active img{filter:brightness(.9)}

/* Movie Studio (AOSP VideoEditor, audit step 4): activity_background under the overlay action bar (logo only) and the
   project picker's new-project bitmap. */
.ms43{position:relative;background:#040505 url('assets/ms-activity_background.png') center/cover no-repeat}
.ms-bar{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;height:40.88px;padding-left:6.81px;background:#222;border-top:.85px solid #2d2d2d;z-index:2}
.ms-bar img{width:27.25px;height:27.25px}
.ms-grid{display:flex;flex-direction:column;align-items:center;padding-top:55.36px}
.screen .ms-item{display:block;padding:14.48px 7.66px;border:0;background:none}
.ms-thumb{position:relative;display:grid;place-items:center;width:255.48px;height:127.74px;background:#000}
.ms-thumb img{width:54.5px;height:54.5px}
.ms-thumb b{position:absolute;left:0;right:0;bottom:0;height:23.84px;padding:3.41px 0 0 17.03px;background:#00000080;text-align:left;font:400 11.92px Roboto,sans-serif;color:#fff}
.screen .ms-item:active .ms-thumb{outline:1.7px solid #33b5e5}
