:root{--ink:#102137;--ink2:#19314d;--gold:#c5a263;--paper:#f4f3ef;--card:#fff;--line:#ddd9d0;--muted:#727d88;--green:#217557;--greenbg:#e5f2ec;--red:#b94343;--redbg:#fae8e8;--amber:#9a6719;--amberbg:#fbf0d8}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#e8ecef;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.shell{width:100%;min-height:100dvh;margin:auto;background:var(--paper);overflow:hidden}
.view{min-height:100dvh}
.login-view{display:flex;flex-direction:column;background:var(--ink);color:#fff;padding:calc(44px + env(safe-area-inset-top)) 27px calc(24px + env(safe-area-inset-bottom))}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--gold);color:var(--gold);font:20px Georgia,serif}
.brand b{display:block;font:16px Georgia,serif}
.brand small{display:block;color:#aeb8c2;font-size:9px;letter-spacing:.14em;margin-top:3px}
.login-copy{margin-top:clamp(55px,12vh,115px)}
.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:800;color:var(--gold)}
.login-copy h1,.verify-copy h1{font:400 clamp(36px,10vw,46px)/1.05 Georgia,serif;margin:10px 0 15px}
.login-copy>p:last-child,.verify-copy>p:last-child{color:#bdc5ce;line-height:1.55}
.login-form{margin-top:38px}
.login-form label{display:block;font-size:10px;letter-spacing:.13em;font-weight:800;color:#d6dbe0}
.dni-box{display:flex;align-items:center;margin-top:8px;border:1px solid #536174;border-radius:13px;background:#162b44;overflow:hidden}
.dni-box span{padding:0 13px;color:#8d99a6}
.dni-box input,.code-box{width:100%;border:0;outline:0;padding:16px;background:transparent;color:#fff;font-size:18px;letter-spacing:.08em}
.code-box{margin-top:8px;border:1px solid #536174;border-radius:13px;background:#162b44;text-align:center;font-size:28px;letter-spacing:.28em}
.primary{width:100%;border:0;border-radius:13px;margin-top:15px;padding:16px;background:var(--gold);color:var(--ink);font-weight:900;font-size:14px}
.primary:disabled{opacity:.55}
.security-note{display:flex;gap:8px;color:#a3afbb;font-size:11px;line-height:1.45}
.security-note b{color:#79b89c}
.error{padding:11px 12px;border-radius:10px;background:#502c35;color:#ffd8dc;font-size:12px}
.login-view footer{margin-top:auto;border-top:1px solid #2c4056;padding-top:16px;color:#82909e;font-size:10px}
.back-link{align-self:flex-start;border:0;background:transparent;color:#d9bd87;padding:0;font-weight:800}
.verify-copy{margin-top:70px}
.app-view{display:flex;flex-direction:column;min-height:100dvh}
.app-head{display:flex;align-items:center;padding:calc(20px + env(safe-area-inset-top)) 17px 16px;background:var(--ink);color:#fff}
.brand-mark.small{width:36px;height:36px;font-size:16px}
.head-copy{margin-left:10px}
.head-copy small{display:block;color:#9eacba;font-size:8px;letter-spacing:.12em}
.head-copy b{display:block;font:15px Georgia,serif;margin-top:2px}
.icon-btn{position:relative;margin-left:auto;width:40px;height:40px;border-radius:12px;border:1px solid #40516a;background:var(--ink2);color:#fff}
.badge{position:absolute;right:-4px;top:-5px;min-width:19px;height:19px;border-radius:99px;background:#cf4b4b;color:#fff;font-size:9px;line-height:19px}
.page{flex:1;overflow:auto;padding:18px 16px calc(91px + env(safe-area-inset-bottom))}
.readonly{display:inline-flex;align-items:center;gap:6px;border-radius:999px;background:var(--greenbg);color:var(--green);font-size:10px;font-weight:800;padding:6px 9px}
.sync{float:right;font-size:10px;color:var(--muted);padding-top:6px}
.page h1{font:400 28px Georgia,serif;margin:13px 0 4px}
.sub{color:var(--muted);font-size:11px;margin:0 0 16px}
.summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:17px 0}
.metric{border:1px solid var(--line);background:#fff;border-radius:16px;padding:14px}
.metric.gold{background:#f4ecdc;border-color:#e4d1aa}
.metric.red b{color:var(--red)}
.metric b{display:block;font:29px Georgia,serif}
.metric span{font-size:11px;color:var(--muted)}
.section-title{display:flex;justify-content:space-between;align-items:center;margin:20px 2px 10px}
.section-title h2{font-size:13px;margin:0}
.link-btn{border:0;background:transparent;color:#896b32;font-size:11px;font-weight:800}
.list{display:grid;gap:10px}
.card{width:100%;text-align:left;border:1px solid var(--line);background:#fff;border-radius:16px;padding:14px;color:var(--ink)}
button.card{cursor:pointer}
.card small{color:#8b6c35;font-size:9px;font-weight:900;letter-spacing:.06em}
.card h3{font-size:12px;line-height:1.4;margin:5px 0 7px}
.card p{font-size:11px;line-height:1.4;color:#65717c;margin:0}
.card time{display:block;margin-top:8px;color:#89939c;font-size:9px}
.deadline{display:grid;grid-template-columns:1fr 56px;gap:12px}
.date-box{text-align:center;border-radius:12px;background:var(--redbg);color:var(--red);padding:7px}
.date-box b{display:block;font-size:19px}
.date-box span{font-size:9px;font-weight:900}
.risk{display:inline-block;margin-top:9px;padding:5px 8px;border-radius:99px;background:var(--amberbg);color:var(--amber);font-size:9px;font-weight:900}
.search{width:100%;border:1px solid var(--line);background:#fff;border-radius:13px;padding:12px;margin:13px 0;outline:0}
.case-meta{display:flex;justify-content:space-between;border-top:1px solid #eeeae2;padding-top:9px;color:var(--muted);font-size:9px}
.empty,.loading{text-align:center;color:var(--muted);font-size:12px;padding:45px 20px}
.back{border:0;background:transparent;color:var(--ink);font-weight:800;padding:0 0 12px}
.detail-hero{border:1px solid var(--line);border-radius:18px;background:#fff;padding:16px}
.detail-hero h2{font:400 20px/1.28 Georgia,serif}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.detail-grid div{background:#f5f4f0;border-radius:11px;padding:10px}
.detail-grid span{display:block;color:var(--muted);font-size:8px;text-transform:uppercase}
.detail-grid b{font-size:10px}
.timeline{border-left:2px solid #ded8ca;margin:16px 0 0 7px;padding-left:17px}
.timeline article{position:relative;margin-bottom:17px}
.timeline article:before{content:"";position:absolute;left:-23px;top:3px;width:10px;height:10px;border-radius:50%;background:var(--gold);border:2px solid var(--paper)}
.timeline small{font-size:9px;color:var(--muted)}
.timeline h3{font-size:11px;margin:3px 0}
.timeline p{font-size:10px;color:#65717c}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);height:calc(72px + env(safe-area-inset-bottom));padding:8px 6px env(safe-area-inset-bottom);background:rgba(255,255,255,.97);border-top:1px solid var(--line);backdrop-filter:blur(12px)}
.bottom-nav button{border:0;background:transparent;color:#84909b;font-size:9px}
.bottom-nav span{display:block;font-size:20px;margin-bottom:2px}
.bottom-nav button.active{color:var(--ink);font-weight:900}
.toast{position:fixed;z-index:50;left:16px;right:16px;top:calc(16px + env(safe-area-inset-top));padding:14px;border-radius:14px;background:#fff;color:var(--ink);box-shadow:0 12px 34px #0004;font-size:12px}
.install-card{background:var(--ink);color:#fff}
.install-card p{color:#bdc5ce}
.install-card button{margin-top:12px;background:var(--gold);color:var(--ink);border:0;border-radius:10px;padding:10px 12px;font-weight:900}
.novelty-group h3{margin-bottom:13px}
.novelty-group strong{display:block;font-size:12px;line-height:1.4;margin:4px 0 5px}
.latest-label{display:block;color:var(--muted);font-size:8px;font-weight:900;letter-spacing:.1em}
.group-link{display:block;border-top:1px solid #eeeae2;margin-top:11px;padding-top:10px;color:#896b32;font-size:10px;font-weight:900}
.movement-pill{display:inline-block;border-radius:999px;background:var(--greenbg);color:var(--green);font-size:10px;font-weight:900;padding:7px 10px}
.novelty-detail-hero h2{margin-bottom:14px}
.novelty-timeline article:first-child:before{background:var(--green)}
.portfolio-selector{position:relative;margin:0 0 16px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 5px 16px #1021370d}
.portfolio-label{display:flex;align-items:center;justify-content:space-between;padding:11px 13px 0;color:#8b6c35;font-size:9px;font-weight:900;letter-spacing:.09em}
.portfolio-label b{border-radius:999px;background:#f1e7d3;padding:4px 7px;font-size:8px}
.portfolio-current{display:grid;grid-template-columns:34px 1fr 22px;align-items:center;gap:9px;width:100%;border:0;background:transparent;color:var(--ink);padding:9px 13px 13px;text-align:left}
.portfolio-current strong,.portfolio-current small{display:block}.portfolio-current strong{font:16px Georgia,serif}.portfolio-current small{margin-top:2px;color:var(--muted);font-size:10px}
.portfolio-current i{font-style:normal;font-size:18px;text-align:center}.portfolio-avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#f2f3f4;color:var(--ink)}
.portfolio-menu{position:absolute;z-index:20;left:-1px;right:-1px;top:calc(100% + 5px);border:1px solid var(--line);border-radius:16px;background:#fff;padding:12px;box-shadow:0 14px 34px #1021372b}
.portfolio-menu h2{font:18px Georgia,serif;margin:1px 4px 9px}.portfolio-menu p{border-top:1px solid #eeeae2;margin:8px 2px 0;padding:10px 2px 2px;color:var(--muted);font-size:9px;line-height:1.4}
.portfolio-option{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:9px;background:transparent;color:var(--ink);padding:10px;text-align:left;font-size:11px}.portfolio-option span,.portfolio-option strong,.portfolio-option small{display:block}.portfolio-option small{margin-top:2px;color:var(--muted);font-size:9px;font-weight:600}.portfolio-option.selected{background:#edf3fb}.portfolio-option.selected strong{font-weight:900}.portfolio-option b{color:#2670c8;font-size:14px}
@media(min-width:700px){body{padding:25px}
.shell{width:390px;min-height:820px;border:10px solid #172232;border-radius:42px;box-shadow:0 25px 65px #10213733}
.view{min-height:800px}
.bottom-nav{position:absolute;width:370px;left:50%;transform:translateX(-50%);bottom:35px;border-radius:0 0 32px 32px}
.app-view{position:relative;min-height:800px;max-height:800px}
.page{max-height:700px}
.login-view{min-height:800px;border-radius:32px}
}