/* KitKat extras (see kk-extra-apps.js): Holo action bars (48 dp, the 18 sp title), dp x 0.906. */
.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:43.49px;padding:0 3.62px 0 0;background:#f2f2f2;color:#333;border-bottom:1.81px solid #33b5e5}
.kkx-bar.dark{background:#000;color:#fff;border-bottom:0}
.kkx-home{display:flex;align-items:center;height:100%;padding:0 7.25px 0 0;border:0;background:none;color:inherit;cursor:pointer}
.kkx-drawer{width:10.87px;height:100%;display:grid;place-items:center;opacity:.7}
.kkx-drawer svg{width:10.87px;height:10.87px}
.kkx-home img{width:28.99px;height:28.99px;margin-left:1.81px}
.kkx-bar h2{flex:1;min-width:0;margin:0;font:400 16.31px Roboto,RobotoICS,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kkx-btn{width:43.49px;height:43.49px;border:0;background:none;color:inherit;display:grid;place-items:center;cursor:pointer}
.kkx-btn svg{width:21.74px;height:21.74px}
.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 14.5px;scrollbar-width:none}
.kkx-list::-webkit-scrollbar{display:none}
.kkx-section{margin:14.5px 14.5px 0;padding:0 0 3.62px;border-bottom:1.81px solid #33b5e5;font:700 12.68px Roboto,RobotoICS,sans-serif;color:#33b5e5;text-transform:uppercase}
.kkx-file{display:flex;align-items:center;gap:14.5px;width:100%;min-height:57.98px;padding:0 14.5px;border:0;border-bottom:.906px solid #dadada;background:none;color:inherit;text-align:left;cursor:pointer}
.kkx-file-icon{flex:none;width:28.99px;height:28.99px;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 16.31px Roboto,RobotoICS,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kkx-file-copy small{font:400 12.68px 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:7.25px}
.kkx-story{margin:0 0 7.25px;background:#fff;box-shadow:0 .906px 1.81px #0000002e}
.kkx-story-art{height:144.96px;display:flex;align-items:flex-end;padding:10.87px;color:#fff}
.kkx-story-art b{font:300 21.74px/1.2 Roboto,RobotoICS,sans-serif}
.kkx-story-copy{padding:7.25px 10.87px}
.kkx-story-copy small{font:400 12.68px 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:7.25px;margin:10.87px 14.5px 0}
.kkx-tile{flex:1;display:flex;flex-direction:column;align-items:center;gap:5.44px;padding:10.87px 3.62px;border:.906px solid #dadada;background:#fafafa;color:#222;font:400 12.68px Roboto,RobotoICS,sans-serif;cursor:pointer}
.kkx-tile span{width:28.99px;height:28.99px;color:#33b5e5}
.kkx-tile svg{width:100%;height:100%}
.kkx-page{flex:1;min-height:0;overflow:auto;background:#d9d9d9;padding:10.87px}
.kkx-paper{background:#fff;padding:21.74px 18.12px;box-shadow:0 .906px 2.72px #00000040;font:400 13.59px/1.5 Roboto,RobotoICS,sans-serif}
.kkx-paper p{margin:0 0 7.25px}
/* Wallet: the balance tile in the Holo blue. */
.kkx-balance{margin:14.5px 14.5px 0;padding:14.5px;background:#fff;border-left:5.44px solid #33b5e5;box-shadow:0 .906px 1.81px #0000002e;display:flex;flex-direction:column;gap:3.62px}
.kkx-balance small{font:400 12.68px Roboto,RobotoICS,sans-serif;color:#777}
.kkx-wallet .kkx-file-copy strong{white-space:normal}
.kkx-balance b{font:300 28.99px Roboto,RobotoICS,sans-serif;color:#222}

/* Audit step 4: Newsstand's NavDrawerFragment (nav_drawer_entry: 64 dp, #333333 on #fafafa) and Wallet 2.0's dark
   nav_drawer (#333333, #666666 separators); both open under the action bar. */
.kkx-app{position:relative}
.kkx-img{width:28.99px;height:28.99px}
.screen .kkx-scrim{position:absolute;inset:43.49px 0 0;z-index:3;border:0;background:#0009}
.ns-drawer,.wal-drawer{position:absolute;top:43.49px;bottom:0;left:0;z-index:4;width:min(289.92px,calc(100% - 57.98px));overflow-y:auto;box-shadow:1.81px 0 5.44px #0004}
.ns-drawer{background:#fafafa}
.screen .ns-drawer button{display:flex;align-items:center;width:100%;height:57.98px;padding:0 14.5px;border:0;background:none;text-align:left;font:300 19.03px 'Roboto Light',Roboto,sans-serif;color:#333}
.screen .ns-drawer button.on{background:#e5e5e5}
.wal-drawer{background:#333}
.screen .wal-drawer button{display:flex;align-items:center;width:100%;height:43.49px;padding:0 14.5px;border:0;border-bottom:.91px solid #666;background:none;text-align:left;font:400 14.5px Roboto,sans-serif;color:#fff}
.screen .wal-drawer button.on{background:#444}
/* Quickoffice's new file: a blank page ("Not saved yet") until Save; the sheet shows its grid, the presentation its 4:3
   slide; Save is a text action in the bar. The Rename file field. */
.kkx-paper.qo-blank{min-height:60%;color:#999}
.kkx-paper.qo-blank small{font-size:12.68px}
.kkx-paper.qo-blank.sheet{background:linear-gradient(#e0e0e0 1px,transparent 1px) 0 0/100% 21.74px,linear-gradient(90deg,#e0e0e0 1px,transparent 1px) 0 0/72.48px 100%,#fff}
.kkx-paper.qo-blank.slides{min-height:0;aspect-ratio:4/3}
.screen .kkx-quickoffice .kkx-btn{width:auto;padding:0 10.87px;color:inherit;font:500 12.68px Roboto,sans-serif;text-transform:uppercase}
.qo-name{display:block;width:calc(100% - 32px);margin:4px 16px 12px;padding:6px 0;border:0;border-bottom:2px solid #33b5e5;background:none;color:inherit;font:400 16px Roboto,sans-serif;outline:0}