O design

O formulário de contato em um design responsivo possui campos de entrada com uma sombra inserida e sombra externa regular. Veja a imagem abaixo.

O código

input {
    background:#fff;
    height:auto;
    padding:8px 8px 7px;
    width:100%;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    border:#fff solid 3px;
    border-radius:4px;
    box-shadow:0px 0px 5px rgba(0, 0, 0, .25), inset 2px 2px 3px rgba(0, 0, 0, .2);
}

O problema

O iOS v4 + não exibe a caixa-sombra corretamente. Veja a imagem abaixo.

Testado

Eu tentei usar o -webkit-box-shadow.

-webkit-box-shadow:0px 0px 5px rgba(0, 0, 0, .25),
                   inset 2px 2px 3px rgba(0, 0, 0, .2);

Eu apliqueidisplay:block; para o elemento de entrada.

Solução atual

Eu preferiria não ter que fazer isso, mas esta é a única maneira de obter o efeito desejado.

HTML

<p><input /></p>

CSS

p {
   width:50%;
   box-sizing:border-box;
   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box;
   box-shadow:0px 0px 5px rgba(0, 0, 0, .35);
   border-radius:4px;
}

    input {
        background:#fff;
        height:auto;
        padding:8px 8px 7px;
        width:100%;
        box-sizing:border-box;
        -moz-box-sizing:border-box;
        -webkit-box-sizing:border-box;
        border:#fff solid 3px;
        border-radius:4px;
        box-shadow:inset 2px 2px 3px rgba(0, 0, 0, .2);
    }

Mesmo com essa solução, a sombra inserida no iOS não é renderizada corretamente; mas está perto o suficiente.

Minha pergunta

É possível ter várias instâncias de box-shadow em um único elemento renderizado corretamente em dispositivos iOS? Se não, o que dizer da sombra embutida? Ou estou usando essa propriedade e seus valores incorretamente?

Desde já, obrigado!