/* Reference-driven Folio interface. All assets work offline. */
:root{color-scheme:dark;--bg:#08090b;--surface:#111418;--text:#f7f7f8;--muted:#a1a6b2;--border:#22262d;--green:#38ef85;--red:#ff453f;--ios-blue:#389bff}
html,body{background:#08090b;color:var(--text)}
body{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;font-size:14px;font-weight:400;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #389bff;outline-offset:3px}button{touch-action:manipulation}h1,h2,h3,p{margin:0}button{border:0}svg{flex-shrink:0}
.portfolio-stage{display:flex;gap:40px;width:1536px;padding:6px 36px;min-height:1024px;align-items:flex-start;justify-content:center;zoom:min(1,calc(100vw / 1536px));background:radial-gradient(ellipse at 50% 48%,#15171c 0%,#090a0d 55%,#050608 100%)}
.device{width:462px;height:1012px;flex-shrink:0;position:relative;padding:16px;border:2px solid #a1a7b4;border-radius:85px;background:#010203;box-shadow:inset 0 0 0 3px #1b1f26,inset 0 0 0 5px #060709,0 0 0 1px #3c414a,0 12px 36px #0009}
.device:before{content:"";position:absolute;width:87px;height:3px;background:#202127;left:50%;top:4px;transform:translateX(-50%);border-radius:3px}
.device-screen{height:100%;border-radius:67px;background:radial-gradient(ellipse at 55% 37%,#0a0c0f,#08090b 80%);overflow:hidden;position:relative;display:flex;flex-direction:column}
.side-key{position:absolute;width:4px;background:linear-gradient(90deg,#272b34,#bbc1ce,#17191f);left:-6px;border-radius:3px;height:67px}.key-one{top:152px;height:36px}.key-two{top:222px}.key-three{top:301px}.device:after{content:"";position:absolute;right:-6px;top:268px;width:4px;height:101px;background:linear-gradient(90deg,#17191f,#bbc1ce,#272b34);border-radius:3px}
.status-bar{height:59px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 35px 0 50px;position:relative;font-size:17px;font-weight:600}.dynamic-island{width:145px;height:40px;border-radius:24px;position:absolute;top:10px;left:50%;transform:translateX(-50%);background:#000}.dynamic-island i{position:absolute;right:16px;top:16px;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 45% 30%,#14377b,#01050c 55%);box-shadow:0 0 0 4px #020308}.status-icons{display:flex;align-items:center;gap:7px}.status-icons>svg{width:20px;height:15px;fill:#f4f5f7}.status-icons .wifi{fill:none;stroke:#f4f5f7;stroke-width:2.3;stroke-linecap:round}.battery{display:block;width:25px;height:13px;border:1px solid #91949b;border-radius:3px;padding:1.5px;position:relative}.battery:after{content:"";position:absolute;right:-3px;top:3px;width:2px;height:5px;background:#858990;border-radius:0 2px 2px 0}.battery i{display:block;width:100%;height:100%;background:#f5f5f6;border-radius:1px}
.page-header{height:55px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.page-header h1{font-size:28px;font-weight:650;letter-spacing:-1px;line-height:1.2}.device-home .page-header h1{font-size:33px;font-weight:700;letter-spacing:-1px}.device-analytics .page-header h1{font-size:26px}.bare-button{background:none;padding:0;display:inline-flex;align-items:center;justify-content:center;color:#9299a6}.notification-button{margin-right:3px}.add-button{width:37px;height:37px;border-radius:50%;background:linear-gradient(#398fff,#0877ff);border:1px solid #62aaff;box-shadow:inset 0 1px 2px #ffffff20;display:grid;place-items:center}
.screen-content{padding:0 10px;overflow-y:auto;scrollbar-width:none;flex:1;min-height:0}.screen-content::-webkit-scrollbar{display:none}.device-accounts .screen-content{padding:0 14px}.device-analytics .screen-content{padding:0 10px}
.screen-tabs{height:39px;border-radius:22px;background:linear-gradient(100deg,#12151a,#0e1013);display:flex;align-items:stretch;margin:0 3px 11px}.screen-tabs button{background:none;color:#b4b8c3;flex:1;font-size:13px;white-space:nowrap;font-weight:400}.screen-tabs button.selected{background:linear-gradient(120deg,#30353e,#252a33);border-radius:22px;color:#fff;font-weight:500}.analytics-tabs{margin:0 1px 11px;height:41px}.analytics-tabs button{font-size:12px;flex:auto;padding:0 16px}.analytics-tabs button:first-child{padding:0 20px}.analytics-tabs button:last-child{padding:0 15px}
.balance-card,.small-card,.add-account-row,.detailed-accounts .portfolio-account{background:linear-gradient(118deg,#101215,#111419 68%,#101215);border:1px solid var(--border);border-radius:16px}.balance-card{position:relative;padding:18px 20px}.balance-label{display:flex;align-items:center;gap:9px;color:#a9aeb9;font-size:14px;line-height:19px}.balance-label svg{stroke-width:1.2}.balance-value{display:block;font-size:37px;line-height:1.2;letter-spacing:-1px;font-weight:650;margin-top:4px;white-space:nowrap}.balance-change{font-size:18px;font-weight:500;line-height:25px;color:var(--green);margin-top:2px;display:flex;gap:8px}.period-button{position:absolute;right:15px;top:15px;background:#0e1115;border:1px solid #292d35;border-radius:10px;min-width:64px;height:33px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:11px}
.overview-balance{height:316px;padding:18px 20px 10px}.portfolio-chart{margin-top:13px}.chart-grid{height:114px;position:relative;margin-right:28px}.chart-grid>svg{width:100%;height:100%;overflow:visible}.grid-lines line{stroke:#333b49;stroke-width:.7;opacity:.44}.chart-axis{position:absolute;left:calc(100% + 12px);top:-7px;bottom:-3px;display:flex;flex-direction:column;justify-content:space-between;color:#afb4bf;font-size:11px;white-space:nowrap}.chart-labels{display:flex;justify-content:space-between;margin:11px 28px 0 0;font-size:11px;color:#a4aab6}.chart-ranges{margin:15px 11px 0;display:flex;align-items:center;justify-content:space-between;gap:3px}.chart-ranges button{height:26px;background:none;font-size:11px;color:#a9afbc;min-width:34px}.chart-ranges button.selected{border-radius:15px;min-width:55px;background:linear-gradient(#2a2e36,#22262f);color:#fff;box-shadow:0 2px 10px #0006}
.overview-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:10px}.small-card{padding:14px 17px;min-width:0}.overview-metrics .small-card{padding:14px 16px 12px;min-height:95px;border-radius:13px}.small-card>span{display:flex;align-items:center;gap:7px;font-size:12px;color:#adb2be;white-space:nowrap;line-height:18px}.small-card>strong{display:block;font-size:17px;line-height:23px;font-weight:550;letter-spacing:-.3px;margin-top:2px;white-space:nowrap}.small-card small{display:block;font-size:16px;line-height:21px;margin-top:2px}.ink-green{color:var(--green)!important}.ink-red{color:var(--red)!important}.ink-blue{color:#389bff!important}.muted{color:#b1b7c5!important}
.section-title{display:flex;justify-content:space-between;align-items:center;padding:0 8px;margin-top:17px;margin-bottom:8px;min-height:23px}.section-title h2{font-size:19px;font-weight:600;letter-spacing:-.35px;display:flex;align-items:center;gap:9px}.section-title h2 svg{color:#a5abb6;stroke-width:1.3}.section-title>button{font-size:13px;color:#4db5ff;background:none;padding:3px 0}
.compact-accounts{border:1px solid #1c222c;border-radius:16px;background:linear-gradient(110deg,#101317,#101318);padding:0 11px}.portfolio-account{width:100%;display:flex;align-items:center;text-align:left;gap:13px;padding:12px;background:none;min-width:0}.portfolio-account.compact{gap:10px;padding:6px 3px;min-height:53px}.portfolio-account.compact:not(:last-child){border-bottom:1px solid #252a33}.account-logo{width:50px;height:50px;flex-shrink:0;border-radius:14px;display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 1px 2px #ffffff22,0 3px 8px #0003}.account-logo svg{height:31px;width:30px}.compact .account-logo{width:40px;height:40px;border-radius:11px}.compact .account-logo svg{width:25px;height:25px}.logo-tangem{background:linear-gradient(135deg,#fff,#d8dbe4);color:#343744}.logo-tangem svg{fill:currentColor}.compact .logo-tangem{background:linear-gradient(130deg,#36404e,#222a35);color:#f9faff}.logo-bybit{background:#0c0d16;box-shadow:none}.bybit-word{font-size:12px;font-weight:750;letter-spacing:-.4px}.bybit-word>span{color:#f4b135}.compact .bybit-word{font-size:10px}.logo-tinkoff{background:linear-gradient(120deg,#fff873,#f7d925)}.logo-alfa{background:linear-gradient(125deg,#ff5546,#ff1d19)}.alfa-word{font-size:30px;font-weight:750;position:relative;line-height:34px;padding-bottom:5px}.alfa-word i{position:absolute;bottom:2px;height:3px;background:#fff;width:18px;left:2px}.compact .alfa-word{font-size:26px;line-height:28px}.compact .alfa-word i{width:16px}.logo-cash{background:linear-gradient(120deg,#31d187,#21ac66);color:white}.cash-word{font-size:35px;font-weight:600}.compact .cash-word{font-size:29px}.logo-generic{background:#252d3c;color:#a5bfff}
.portfolio-account-name{min-width:0;flex:1}.portfolio-account-name strong{display:block;font-size:14px;font-weight:550;line-height:19px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.portfolio-account-name small{display:block;font-size:12px;color:#acb1bf;line-height:18px;white-space:nowrap}.portfolio-account-amount{text-align:right;flex-shrink:0}.portfolio-account-amount>strong{display:block;font-size:16px;font-weight:500;line-height:23px;letter-spacing:-.3px}.portfolio-account-amount>small{display:block;font-size:14px;font-weight:400;line-height:19px}.compact .portfolio-account-name strong{font-size:13px;line-height:18px}.compact .portfolio-account-name small{font-size:11px;line-height:18px}.compact .portfolio-account-amount>strong{font-size:14px;line-height:22px;letter-spacing:0}.compact .portfolio-account-amount>small{font-size:13px;line-height:19px}.account-chevron{color:#b7becb;margin-left:-4px;stroke-width:1.5}
.account-balance{height:118px;padding:16px 23px;margin:0 0 12px}.account-balance .balance-value{font-size:34px;margin-top:3px;line-height:39px}.account-balance .balance-change{font-size:17px;margin-top:0}.balance-eye{margin-left:auto}.detailed-accounts{display:flex;flex-direction:column;gap:0}.detailed-accounts .portfolio-account{height:74px;padding:12px;border-radius:16px}.add-account-row{display:flex;text-align:left;align-items:center;width:100%;height:78px;gap:18px;padding:13px 18px;margin-top:16px}.add-account-icon{width:40px;height:40px;background:linear-gradient(130deg,#f6f8ff,#c7ccd8);border-radius:50%;color:#0d1425;display:grid;place-items:center;flex-shrink:0}.add-account-row>span:nth-child(2){flex:1;min-width:0}.add-account-row strong{display:block;font-size:14px;font-weight:500;line-height:21px}.add-account-row small{display:block;font-size:13px;line-height:18px;color:#b2b8c5;white-space:nowrap}.add-account-row>svg{stroke-width:1.3;color:#afb5c3}.activity-title{margin-top:17px;padding:0 4px;margin-bottom:3px}.activity-list{padding:0 5px}.activity-row{display:flex;align-items:center;gap:16px;min-height:52px;border-bottom:1px solid #20252e;padding:7px 2px}.activity-symbol{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:26px;color:#fff;font-weight:600;box-shadow:inset 0 1px 3px #ffffff40}.activity-green{background:linear-gradient(130deg,#50d2a4,#108963)}.activity-yellow{background:linear-gradient(130deg,#ffed70,#e9cb1f);font-size:24px}.activity-description{flex:1;min-width:0}.activity-description strong{display:block;font-size:14px;line-height:19px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.activity-description small{display:block;font-size:11px;line-height:17px;color:#afb4c1}.activity-row>strong{font-size:16px;font-weight:500;white-space:nowrap}
.analytics-balance{height:357px;padding:18px 23px 11px}.analytics-balance .balance-value{font-size:36px;line-height:42px;margin-top:3px}.analytics-balance .balance-change{font-size:17px;gap:15px;margin-top:0}.analytics-balance .portfolio-chart{margin-top:21px}.analytics-balance .chart-labels{margin-top:9px}.value-summary{display:grid;grid-template-columns:1fr 1.08fr .9fr;background:linear-gradient(120deg,#161a20,#13171d);border:1px solid #1d222c;border-radius:14px;padding:11px 0;margin-top:14px}.value-summary>div{padding:0 12px}.value-summary>div+div{border-left:1px solid #232a35}.value-summary span{font-size:12px;color:#b0b6c4;display:block;line-height:18px;white-space:nowrap}.value-summary strong{font-size:16px;font-weight:500;line-height:22px;white-space:nowrap;display:block;letter-spacing:-.3px}.analytics-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:11px 3px 0}.analytics-metrics .small-card{min-height:80px;padding:13px 19px;border-radius:15px}.analytics-metrics .small-card>strong{font-size:23px;margin-top:6px;line-height:26px;font-weight:550}.analytics-metrics .small-card>span svg{stroke-width:1.2}.analytics-metrics .asset-performance{min-height:96px;padding-top:13px;padding-bottom:13px}.asset-performance>div{display:flex;align-items:center;gap:11px;margin-top:7px}.asset-performance>div>div>strong{font-size:14px;font-weight:400;line-height:19px;display:block}.asset-performance>div>div>small{font-size:16px;margin:0;line-height:21px}.coin{height:40px;width:40px;display:grid;place-items:center;flex-shrink:0;border-radius:50%;font-size:29px;box-shadow:inset 0 1px 2px #ffffff45}.bitcoin{background:linear-gradient(120deg,#ffad24,#ff9500);transform:rotate(12deg)}.ethereum{background:linear-gradient(120deg,#6484fa,#2443d3)}.ethereum svg{width:19px;height:29px}.allocation-title{padding:0 12px;margin-top:16px;margin-bottom:12px}.allocation-title h2{font-size:18px}.allocation-content{display:flex;align-items:center;gap:42px;padding:0 26px;min-height:148px}.allocation-donut{height:148px;width:148px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;transform:rotate(0)}.allocation-donut>div{height:100px;width:100px;border-radius:50%;background:#080a0d;display:flex;align-items:center;justify-content:center;flex-direction:column}.allocation-donut strong{font-size:19px;font-weight:550;letter-spacing:-.5px}.allocation-donut>div>span{font-size:12px;color:#b0b6c1;margin-top:4px}.allocation-legend{flex:1;min-width:0}.allocation-legend>div{display:flex;align-items:center;gap:8px;font-size:13px;height:27px;white-space:nowrap;color:#b8becb}.legend-dot{height:12px;width:12px;border-radius:50%;border:1px solid #ffffff20;flex-shrink:0}.allocation-legend>div>strong{margin-left:auto;font-size:13px;font-weight:400}.allocation-legend>div>span:nth-child(2){flex:1}
.folio-nav{flex-shrink:0;height:62px;border-top:1px solid #20232b;background:linear-gradient(#101217ee,#0b0d10f5);display:flex;justify-content:space-around;align-items:center;z-index:2;margin-top:auto;box-shadow:0 -5px 15px #08090b60;padding:0 3px}.folio-nav button{display:flex;flex-direction:column;align-items:center;gap:5px;flex:1;background:none;color:#737985;font-size:10px;padding:6px 0}.folio-nav button.active{color:#389bff}.folio-nav button>span{font-size:10px;color:#b5bbc7;font-weight:400;line-height:13px}.folio-nav button.active>span{color:#43b4ff}.folio-nav button svg{stroke-width:1.65}.folio-nav button:first-child svg,.folio-nav button:nth-child(2) svg{fill:currentColor;stroke:#0a0c10;stroke-width:1.1}.home-indicator{height:12px;flex-shrink:0;position:relative;background:#080a0d}.home-indicator:after{content:"";height:5px;background:#f5f5f6;border-radius:5px;width:151px;position:absolute;top:3px;left:50%;transform:translateX(-50%)}
.empty-portfolio{padding:24px 8px;color:#9ea7b7;text-align:center;font-size:13px}.empty-portfolio button{display:block;color:#389bff;background:none;margin:12px auto}.back-to-overview{position:fixed;right:28px;bottom:26px;background:#151b25;border:1px solid #303b4e;color:#aacaed;padding:12px 18px;border-radius:8px}.portfolio-stage.single-view{min-height:1024px}
/* Existing portfolio forms retain their storage and validation behavior. */
.modal-overlay{background:#000a;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.modal-sheet{background:#12161d;color:#f4f6fa;border:1px solid #2a303b;max-height:90svh;overflow:auto}.modal-header h2{color:#fff}.modal-handle{background:#4b5260}.icon-button{color:#b9c5d8;background:#1c2330;border-color:#2c3645}.field>span{color:#b9c4d5}.field input,.field select{background:#0c1016;border-color:#303b4d;color:#f1f5fa}.field small,.form-hint{color:#8795a8}.field input::placeholder{color:#5c6b7d}.primary-button,.round-add{background:#238bff;color:#fff;border-radius:10px}.secondary-button{background:#162435;color:#aed2ff;border-color:#294563}.segmented{background:#090e16}.segmented button{color:#8698b0}.segmented button.active{color:#fff;background:#293343}.confirm-line{background:#162032}.confirm-line span{color:#b1c3dd}.confirm-line input{accent-color:#238bff}.form-error{background:#3b2024;color:#ff9a9a}.settings-top{background:#142538}.settings-top strong{color:#cfdfef}.settings-top p{color:#90a8c4}.setting-shield{background:#1c3e5a;color:#7cb9ff}.setting-heading{color:#e1e9f6}.rate-grid label{background:#192331;border-color:#2c3a4c}.rate-grid span{color:#9bb7d6}.rate-grid input{color:#e8f3ff}.rate-note,.app-version{color:#8393a8}.setting-actions button{background:#1c2b3c;color:#c5e0ff;border-color:#31445b}.reset-link{color:#ff817b}.toast{background:#202c3d;color:white;border:1px solid #3a4c65;font-weight:500;border-radius:10px}.fine-print{color:#8393a8}.roi-confirmation{margin:16px 3px}.income-panel{padding:8px 4px}.income-panel .primary-button{margin-top:20px}.month-control{background:#141921;border-color:#263244}.month-control>span{color:#eaf1fa}.month-control button{background:#1c293c;color:#a6ceff}.card,.cashflow-box{background:#131820!important;border-color:#26303e!important;color:#fff}.cashflow-box span{color:#aebccc!important}.cashflow-box.income strong{color:#38ef85}.cashflow-box.expense strong{color:#ff453f}.quick-actions button{background:#1a283d!important;color:#98c8ff!important;border-color:#30496b!important}.transaction-body strong,.txn-amount strong{color:#f4f6fc}.transaction-body small{color:#97a6ba}.transaction-row:not(:last-child){border-color:#26303e}.empty-state{background:#121923;border-color:#2c394f}.empty-state p{color:#95a5b8}.empty-state strong{color:#eaf3ff}.section-sub{color:#92a6c4}.eyebrow{color:#54a7ff}.device-transactions .top-section{display:none}.device-transactions .screen-content{padding:0 16px}.device-transactions .section-bar h2{color:#f4f7fc}
@media(min-width:1050px){.device-accounts .page-header{padding-left:20px;padding-right:18px}.device-accounts .page-header{margin-bottom:0}.device-analytics .page-header{height:53px}}
@media(max-width:1049px){.portfolio-stage,.portfolio-stage.single-view{width:100%;zoom:1;padding:0;min-height:100svh;display:block;background:#08090b}.device{width:100%;max-width:460px;height:100svh;min-height:780px;margin:0 auto;border:0;border-radius:0;padding:0;box-shadow:none;background:#08090b}.device:before,.device:after,.side-key{display:none}.device-screen{border-radius:0}.status-bar{height:70px;padding-left:40px;padding-right:32px}.dynamic-island{top:15px}.page-header{padding:0 22px;height:58px}.screen-content,.device-analytics .screen-content{padding:0 14px}.device-accounts .screen-content{padding:0 18px}.folio-nav{height:64px}.home-indicator{height:calc(12px + env(safe-area-inset-bottom))}.back-to-overview{display:none}}
@media(max-width:390px){.balance-card{padding-left:16px;padding-right:16px}.balance-value{font-size:33px}.overview-metrics .small-card{padding-left:10px;padding-right:8px}.overview-metrics .small-card>strong{font-size:15px}.analytics-tabs button{padding:0 10px;font-size:11px}.analytics-tabs button:first-child{padding:0 14px}.analytics-tabs button:last-child{padding:0 10px}.analytics-metrics .small-card{padding-left:13px;padding-right:10px}.small-card>span{font-size:11px}.value-summary>div{padding:0 8px}.value-summary strong{font-size:14px}.value-summary span{font-size:11px}.allocation-content{padding:0 12px;gap:25px}.portfolio-account{gap:10px}.portfolio-account-name small{font-size:11px}.portfolio-account-amount>strong{font-size:14px}.add-account-row{gap:12px;padding-left:13px}.add-account-row small{font-size:11px}.activity-row{gap:10px}.activity-row>strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Final alignment at the reference's 1536 × 1024 viewport. */
.screen-content{overflow-anchor:none}.page-header h1,.page-header>.notification-button,.page-header>.add-button{transform:translateY(-7px)}
@media(min-width:1050px){.page-header{height:53px}.device-accounts .page-header{height:52px}.device-analytics .page-header{height:50px}}
.overview-balance{height:315px}.section-title{line-height:23px}.section-title h2{line-height:23px}.analytics-balance{height:356px}.analytics-metrics .asset-performance{min-height:95px}
.sample-notice{font-size:12px;line-height:1.6;color:#a5b6cb;background:#182334;padding:14px;border-radius:8px;margin:14px 0}.sample-notice button{display:block;margin-top:8px;background:none;color:#50aaff;padding:0}
