.inspector-id-shell{container-type:inline-size;width:100%;max-width:620px;margin:14px auto 22px}.inspector-id{box-sizing:border-box;position:relative;isolation:isolate;overflow:hidden;width:100%;aspect-ratio:1.586;display:grid;grid-template-rows:29% 60% 11%;padding:0;border:1px solid #cbbd9d;border-radius:clamp(12px,3cqw,20px);background:radial-gradient(ellipse at 0 0,#e6ede1,transparent 65%),linear-gradient(120deg,#fffefa,#f2efe5);color:#173f32;box-shadow:0 2px 2px #fff inset,0 -2px 3px #c5bda855 inset,0 10px 24px #173f3220;text-align:right;font-family:'Noto Sans Arabic',Tahoma,Arial,sans-serif}.inspector-id:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(125deg,transparent 0 22px,#a99a7009 23px 24px)}.inspector-id:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 38%,#ffffff50 49%,transparent 61%);opacity:.45}.inspector-id-head{display:flex;align-items:center;gap:3%;margin:0 5%;border-bottom:1px solid #c8b99180;padding:2% 0;min-height:0}.inspector-id-logo{width:21%;height:100%;object-fit:contain;mix-blend-mode:multiply;flex-shrink:0}.inspector-id-head>div{flex:1;min-width:0}.inspector-id h3{margin:1% 0;font-size:clamp(15px,4.6cqw,28px);font-weight:800;line-height:1.45;color:#173f32}.inspector-id-kicker{display:block;font-size:clamp(8px,2.2cqw,13px);line-height:1.6;color:#566b55}.inspector-id-en{display:block;font:600 clamp(7px,1.7cqw,10px) Arial,sans-serif;letter-spacing:.14em;color:#947544}.inspector-id-body{display:flex;align-items:center;justify-content:space-between;gap:5%;padding:3% 5%;min-height:0;box-sizing:border-box}.inspector-id-person{min-width:0;flex:1}.inspector-id-label{display:block;font-size:clamp(8px,2.15cqw,13px);line-height:1.5;color:#697461}.inspector-id-name{display:block;font-size:clamp(12px,3.7cqw,23px);font-weight:800;line-height:1.65;overflow-wrap:anywhere;color:#173f32}.inspector-id-role{display:block;font-size:clamp(8px,2.2cqw,13px);line-height:1.6;color:#8b7344}.inspector-id-fields{display:grid;grid-template-columns:1fr 1.25fr;column-gap:5%;margin:5% 0 0}.inspector-id-fields div{min-width:0}.inspector-id-fields dt{font-size:clamp(8px,2.1cqw,13px);line-height:1.6;color:#61745f}.inspector-id-fields dd{margin:2% 0 0;font:600 clamp(10px,2.85cqw,18px) Arial,sans-serif;color:#244b39;font-variant-numeric:tabular-nums;white-space:nowrap}.inspector-id-photo{position:relative;overflow:hidden;width:25%;height:100%;max-height:100%;flex-shrink:0;border:3px solid #fff;outline:1px solid #bca780;border-radius:7px;background:#741b38;box-shadow:0 3px 8px #143f3220;box-sizing:border-box}.inspector-id-avatar{position:absolute;display:block;width:100%;height:auto;max-width:none;top:-16%;left:0;border:0;border-radius:0}.inspector-id-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 5%;background:linear-gradient(100deg,#153e31,#285440);color:#f5f0dc;font-size:clamp(7px,1.9cqw,12px);border-top:2px solid #c2a260}.inspector-id-footer span:last-child{opacity:.65}.access-account-row:has(.inspector-id){display:block;padding:10px}.area-person .inspector-id-shell{margin-top:0}.inspector-id-shell .inspector-id bdi{color:inherit}@media(prefers-reduced-motion:no-preference){.inspector-id{transition:box-shadow .2s}.inspector-id:hover{box-shadow:0 2px 2px #fff inset,0 14px 30px #173f322a}}@media print{.inspector-id{box-shadow:none;break-inside:avoid}}

/* The physical card keeps its own readable palette inside both app themes. */
html .inspector-id-shell .inspector-id{color-scheme:light}
html .inspector-id-shell .inspector-id :is(h3,.inspector-id-name){color:#173f32!important}
html .inspector-id-shell .inspector-id :is(.inspector-id-fields dd,.inspector-id-fields bdi){color:#244b39!important}
html .inspector-id-shell .inspector-id :is(.inspector-id-kicker,.inspector-id-label,.inspector-id-fields dt){color:#485e47!important}
html .inspector-id-shell .inspector-id :is(.inspector-id-en,.inspector-id-role){color:#70582f!important}
html .inspector-id-shell .inspector-id .inspector-id-footer span{color:#f5f0dc!important;opacity:1}

html .inspector-id-shell .inspector-id :is(h3,.inspector-id-name,.inspector-id-fields dd,.inspector-id-fields bdi,.inspector-id-kicker,.inspector-id-label,.inspector-id-fields dt,.inspector-id-en,.inspector-id-role){color:#000!important}
