/* Build 30 native preview. The website build does not import this presentation layer. */
.appVisual30 {
  --ui30-bg:#F2F3F5; --ui30-surface:#fff; --ui30-ink:#202226; --ui30-muted:#62666E;
  --ui30-line:#E2E4E8; --ui30-accent:#34373D;
  --bg:var(--ui30-bg); --ink:var(--ui30-ink); --muted:var(--ui30-muted); --line:var(--ui30-line);
  --mc-paper:var(--ui30-bg); --mc-ink:var(--ui30-ink); --mc-muted:var(--ui30-muted); --mc-line:var(--ui30-line); --mc-accent:var(--ui30-accent);
  --page26:var(--ui30-bg); --ink26:var(--ui30-ink); --muted26:var(--ui30-muted); --line26:var(--ui30-line);
  background:var(--ui30-bg); color:var(--ui30-ink);
}
.appVisual30 body { background:var(--ui30-bg); color:var(--ui30-ink); }
.appVisual30 .app { padding-left:20px; padding-right:20px; padding-bottom:calc(110px + env(safe-area-inset-bottom)); }
.appVisual30 button { -webkit-tap-highlight-color:transparent; }
.appVisual30 :is(button,a,input,select,textarea):focus-visible { outline:2px solid var(--ui30-accent); outline-offset:3px; }
.appVisual30 .btn { min-height:46px; border-radius:13px; font-size:calc(14px * var(--mc-text-scale,1)); background:var(--ui30-accent); font-weight:600; }
.appVisual30 .btn.ghost { background:var(--ui30-surface); color:var(--ui30-ink); border-color:var(--ui30-line); }
.appVisual30 .top { margin:4px 0 22px; gap:16px; }
.appVisual30 .top .brandWordmark { max-width:172px; }
.appVisual30 .top .sub { font-size:calc(11px * var(--mc-text-scale,1)); line-height:1.5; color:var(--ui30-muted); }
.appVisual30 body .nav { height:calc(74px + env(safe-area-inset-bottom))!important; padding:7px 16px calc(7px + env(safe-area-inset-bottom))!important; border-color:var(--ui30-line)!important; }
.appVisual30 .nav button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; background:transparent; border-radius:14px; min-width:0; }
.appVisual30 .nav button.on { background:#F2F3F5; }
.appVisual30 body .nav .add { flex:0 0 48px; margin:4px 12px; height:48px; border-radius:16px; background:var(--ui30-accent)!important; color:#fff; }
.appVisual30 .nav .navIcon { height:24px; line-height:1; }
.appVisual30 .nav .navBadge { right:calc(50% - 24px); top:0; }
.appVisual30 .collectionHeader h1 { font-size:calc(29px * var(--mc-text-scale,1)); letter-spacing:-.035em; line-height:1.25; }
.appVisual30 .collectionHeader { margin-bottom:22px; }
.appVisual30 .collectionEyebrow { color:var(--ui30-accent); letter-spacing:.16em; font-size:10px; }
.appVisual30 .collectionHeader p { font-size:calc(13px * var(--mc-text-scale,1)); }
.appVisual30 .collectionAdd { border-radius:50%; background:var(--ui30-accent); }
.appVisual30 .collectionSearch { border-radius:14px; background:#F2F3F5; min-height:50px; height:auto; padding:12px 14px; }
.appVisual30 .collectionSearch > span { width:22px; height:22px; transform:none; }
.appVisual30 .collectionSearch svg { width:22px; height:22px; display:block; }
.appVisual30 .collectionSearch input { font-size:calc(15px * var(--mc-text-scale,1)); }
.appVisual30 .collectionToolbar { margin:12px 0 20px; gap:7px; }
.appVisual30 .collectionToolbar button { font-size:calc(12px * var(--mc-text-scale,1)); min-height:44px; height:auto; padding:10px 5px; line-height:1.4; border-color:var(--ui30-line); background:#fff; }
.appVisual30 .collectionGrid { gap:18px 12px; align-items:start; }
.appVisual30 .collectionCardV3 { border-radius:18px; border:1px solid var(--ui30-line); box-shadow:none; }
.appVisual30 .collectionImageV3 { background:#F2F3F5; aspect-ratio:4/5; padding:18px 13px 38px; }
.appVisual30 .collectionImageV3 img { object-fit:contain; filter:drop-shadow(0 5px 5px #20222618); }
.appVisual30 .collectionImageV3 .cardState { top:auto; bottom:9px; left:10px; box-shadow:none; font-size:calc(10px * var(--mc-text-scale,1)); max-width:calc(100% - 20px); white-space:normal; text-align:left; line-height:1.2; }
.appVisual30 .cardState.collecting { background:#fff1c2!important; color:#80601b!important; }
.appVisual30 .cardState.selling { background:#dff1e4!important; color:#246342!important; }
.appVisual30 .cardState.consider { background:#fff1c2!important; color:#80601b!important; }
.appVisual30 .cardState.sold { background:#f9e4e2!important; color:#a53b38!important; }
.appVisual30 .collectionBodyV3 { padding:13px 12px 14px; }
.appVisual30 .collectionBodyV3 > b { font-size:calc(15px * var(--mc-text-scale,1)); line-height:1.4; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.appVisual30 .collectionBodyV3 > p { margin:5px 0; font-size:calc(11px * var(--mc-text-scale,1)); min-height:0; line-height:1.5; color:var(--ui30-muted); }
.appVisual30 .collectionBodyV3 > small { font-size:calc(11px * var(--mc-text-scale,1)); line-height:1.5; }
.appVisual30 .collectionPriceV3 { margin-top:10px; padding-top:10px; border-color:var(--ui30-line); gap:5px; }
.appVisual30 .collectionPriceV3 strong { font-size:calc(18px * var(--mc-text-scale,1)); overflow-wrap:anywhere; }
.appVisual30 .collectionPriceV3 span { font-size:calc(11px * var(--mc-text-scale,1)); line-height:1.5; }
.appVisual30 .collectionListV3 { border-color:var(--ui30-line); padding:14px 12px; }
.appVisual30 .listImageV3 { background:#F2F3F5; }
.appVisual30 .listImageV3 img { object-fit:contain; }
.appVisual30 .listMainV3 > b { font-size:calc(14px * var(--mc-text-scale,1)); }
.appVisual30 .listPriceV3 > b { font-size:calc(14px * var(--mc-text-scale,1)); }
.appVisual30 .assetHeaderRow { padding:5px 2px 25px; }
.appVisual30 .assetEyebrow { color:var(--ui30-muted); font-size:calc(14px * var(--mc-text-scale,1)); font-weight:500; }
.appVisual30 .assetMainValue { font-size:clamp(30px,9.7vw,48px); line-height:1.15; font-weight:650; letter-spacing:-.045em; overflow-wrap:anywhere; }
.appVisual30 .assetValueRow { align-items:center; }
.appVisual30 .privacyEye { width:44px; height:44px; flex:none; background:transparent; }
.appVisual30 .assetChangeLine { flex-wrap:wrap; font-size:calc(12px * var(--mc-text-scale,1)); line-height:1.5; gap:6px; }
.appVisual30 :is(.assetChartCard,.assetInfoCard,.assetKpi,.assetHoldingsSection .panel) { background:#fff; border:1px solid var(--ui30-line); box-shadow:none; border-radius:18px; }
.appVisual30 .assetChartCard { padding:18px 16px 12px; }
.appVisual30 .assetChartTitle { font-size:calc(16px * var(--mc-text-scale,1)); font-weight:600; }
.appVisual30 .assetChartCaption { font-size:calc(12px * var(--mc-text-scale,1)); line-height:1.5; margin-top:5px; }
.appVisual30 .costToggle { min-height:44px; height:auto; flex:none; border:0; font-size:calc(11px * var(--mc-text-scale,1)); padding:8px; background:#F2F3F5; border-radius:10px; }
.appVisual30 .assetValueLine { stroke:var(--ui30-accent); }
.appVisual30 .assetChartDot { fill:var(--ui30-accent); }
.appVisual30 .assetHistory { height:156px; }
.appVisual30 .chartAxis { font-size:11px; }
.appVisual30 .rangeTabs { background:#F2F3F5; border-radius:12px; margin-top:14px; }
.appVisual30 .rangeTabs button { min-height:44px; height:auto; font-size:calc(12px * var(--mc-text-scale,1)); }
.appVisual30 .rangeTabs button.on { color:var(--ui30-accent); box-shadow:none; }
.appVisual30 .assetKpiGrid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:14px; }
.appVisual30 .assetKpi { padding:17px 15px; }
.appVisual30 .assetKpi span { font-size:calc(12px * var(--mc-text-scale,1)); line-height:1.5; color:var(--ui30-muted); }
.appVisual30 .assetKpi strong { font-size:calc(21px * var(--mc-text-scale,1)); font-weight:650; margin-top:8px; white-space:normal; overflow-wrap:anywhere; }
.appVisual30 .assetKpi small { font-size:calc(11px * var(--mc-text-scale,1)); line-height:1.5; white-space:normal; }
.appVisual30 .assetSplitSection { margin-top:22px; gap:14px; }
.appVisual30 .assetInfoCard { padding:18px 15px 6px; }
.appVisual30 :is(.assetSectionHead,.assetHoldingsSection .sectionHead) h2 { font-size:calc(16px * var(--mc-text-scale,1)); font-weight:600; }
.appVisual30 .assetSectionHead { gap:10px; flex-wrap:wrap; }
.appVisual30 .assetSectionHead > span { font-size:calc(11px * var(--mc-text-scale,1)); }
.appVisual30 :is(.moverRow,.activityV3Row) { padding:15px 0; gap:10px; }
.appVisual30 :is(.moverMain b,.activityV3Row b) { font-size:calc(13px * var(--mc-text-scale,1)); }
.appVisual30 :is(.moverMain small,.activityV3Row small,.moverRow > strong,.activityV3Row time) { font-size:calc(11px * var(--mc-text-scale,1)); }
.appVisual30 .assetHoldingsSection { margin-top:22px; }
.appVisual30 .assetHoldingsSection .linkBtn { min-height:44px; font-size:13px; color:var(--ui30-accent); }
.appVisual30 .assetHoldingsSection .cardRow { padding:15px; }
.appVisual30 .assetHoldingsSection .name { font-size:14px; }
.appVisual30 .assetHoldingsSection :is(.meta,.pnl) { font-size:11px; }
.appVisual30 #editorBg .sheet { display:flex; flex-direction:column; height:min(96dvh,var(--editor30-height,96dvh)); max-height:min(96dvh,var(--editor30-height,96dvh)); padding:0; border-radius:26px 26px 0 0; overflow:hidden; background:var(--ui30-bg); }
.appVisual30 #editorBg .sheetTop { position:relative; top:auto; flex:0 0 auto; height:auto; min-height:66px; padding:10px 20px; border-bottom:1px solid var(--ui30-line); }
.appVisual30 #editorBg .sheetTop b { font-size:calc(18px * var(--mc-text-scale,1)); font-weight:650; }
.appVisual30 .editorScroll30 { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:0 20px 24px; scroll-padding:20px; }
.appVisual30 .editorIntro30 { font-size:calc(12px * var(--mc-text-scale,1)); color:var(--ui30-muted); line-height:1.6; margin:18px 2px 14px; }
.appVisual30 #editorBg .upload { margin:0 0 16px; padding:18px; display:grid; grid-template-columns:86px 1fr; background:#F2F3F5; border:1px solid var(--ui30-line); border-radius:18px; gap:8px 16px; }
.appVisual30 #editorBg .upload .thumb { grid-row:span 2; width:86px; height:114px; background:#EAECF0; border-radius:10px; font-size:13px; }
.appVisual30 #editorBg .upload > label { display:flex; align-items:center; justify-content:center; width:fit-content; min-width:110px; align-self:end; }
.appVisual30 #editorBg .upload .mini { margin:0; line-height:1.6; align-self:start; }
.appVisual30 #editorBg .editorScroll30 > .form { display:flex; flex-direction:column; gap:16px; }
.appVisual30 #editorBg .editorGroup30 { margin:0; border:1px solid var(--ui30-line); border-radius:18px; padding:18px 16px; background:#fff; }
.appVisual30 #editorBg .editorHeading30 { font-size:calc(16px * var(--mc-text-scale,1)); font-weight:650; line-height:1.4; margin:0 0 17px; }
.appVisual30 #editorBg .editorGroup30 > .form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 12px; }
.appVisual30 #editorBg .f.full { grid-column:1/-1; }
.appVisual30 #editorBg .f label { font-size:calc(12px * var(--mc-text-scale,1)); color:#62666E; font-weight:500; line-height:1.5; }
.appVisual30 #editorBg .f :is(input,select,textarea) { font-size:calc(16px * var(--mc-text-scale,1)); border:1px solid var(--ui30-line); background:#F8F9FA; min-height:50px; width:100%; line-height:1.35; }
.appVisual30 #editorBg .f input[type=checkbox] { min-height:0; width:22px; height:22px; }
.appVisual30 #editorBg .editorSection { padding-top:0; margin-top:16px; border-color:var(--ui30-line); }
.appVisual30 #editorBg .editorSection summary { list-style:none; display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:calc(14px * var(--mc-text-scale,1)); font-weight:500; color:var(--ui30-ink); min-height:48px; padding:12px 0; line-height:1.5; }
.appVisual30 #editorBg :is(.editorSection,.details) summary::-webkit-details-marker { display:none; }
.appVisual30 #editorBg .editorSection summary:after { content:'＋'; flex:none; color:var(--ui30-muted); font-size:18px; }
.appVisual30 #editorBg .editorSection[open] > summary:after { content:'−'; }
.appVisual30 #editorBg .editorSection.editorGroup30 { margin:0; padding:5px 16px; }
.appVisual30 #editorBg .editorSection.editorGroup30[open] { padding-bottom:18px; }
.appVisual30 #editorBg .editorSection.editorGroup30 > summary { font-size:calc(16px * var(--mc-text-scale,1)); font-weight:600; min-height:56px; }
.appVisual30 #editorBg .editorSection > .form { grid-template-columns:repeat(2,minmax(0,1fr)); }
.appVisual30 #editorBg .cardVisibility29 { border:0; background:#F2F3F5; margin:0 0 20px; padding:14px 12px; border-radius:12px; }
.appVisual30 #editorBg .cardVisibility29 label { min-width:0; }
.appVisual30 #editorBg .visibilityCopy29 strong { font-size:calc(14px * var(--mc-text-scale,1)); }
.appVisual30 #editorBg .visibilityCopy29 small { font-size:calc(11px * var(--mc-text-scale,1)); line-height:1.6; }
.appVisual30 #editorBg .visibilityIcon29 { display:none; }
.appVisual30 #editorBg .visibilityState29 { display:none; }
.appVisual30 #editorBg .actions { position:relative; bottom:auto; flex:0 0 auto; padding:12px 20px max(14px,env(safe-area-inset-bottom)); margin:0; background:#fff; border-top:1px solid var(--ui30-line); gap:10px; }
.appVisual30 #editorBg .actions .spacer { display:none; }
.appVisual30 #editorBg .actions button { min-height:48px; min-width:0; padding:12px 16px; font-size:calc(14px * var(--mc-text-scale,1)); }
.appVisual30 #editorBg .actions button:last-child { flex:1; min-width:0; }
.appVisual30 #editorBg .editorDelete30:has(.hidden) { display:none; }
.appVisual30 #editorBg .editorDelete30 button { width:100%; min-height:50px; background:#fff; color:#a53b38; border:1px solid #ecd9d5; font-size:calc(14px * var(--mc-text-scale,1)); }
.appVisual30 :is(.cardDetailSheet,.cardDetailTop,.collectionControlSheet) { background:var(--ui30-bg); }
.appVisual30 .cardDetailImage { background:#F2F3F5; border-radius:20px; }
.appVisual30 .cardDetailIdentity h1 { font-size:calc(28px * var(--mc-text-scale,1)); font-weight:650; line-height:1.25; }
.appVisual30 :is(.cardPricePanel,.cardDetailSection) { border:1px solid var(--ui30-line); border-radius:18px; box-shadow:none; }
.appVisual30 .cardPricePanel > strong { font-size:calc(32px * var(--mc-text-scale,1)); font-weight:650; overflow-wrap:anywhere; }
.appVisual30 .cardDetailActions button { min-height:60px; height:auto; padding:10px 3px; font-size:calc(12px * var(--mc-text-scale,1)); }
.appVisual30 :is(.filterFormV3 input,.filterFormV3 select,.sortOptionsV3 button) { min-height:48px; height:auto; }
.appVisual30 .sortOptionsV3 button { padding:14px 12px; background:#fff; line-height:1.5; }
.appVisual30 .toast { z-index:2000; max-width:calc(100vw - 40px); text-align:center; line-height:1.5; background:var(--ui30-ink); }
@media(max-width:350px) {
  .appVisual30 .app { padding-left:16px; padding-right:16px; }
  .appVisual30 .collectionGrid { gap:12px 9px; }
  .appVisual30 .collectionBodyV3 { padding:12px 10px; }
  .appVisual30 .collectionPriceV3 strong { font-size:calc(16px * var(--mc-text-scale,1)); }
  .appVisual30 .listPriceV3 { max-width:88px; overflow-wrap:anywhere; }
  .appVisual30 #editorBg .editorGroup30 { padding-left:13px; padding-right:13px; }
  .appVisual30 .editorScroll30 { padding-left:14px; padding-right:14px; }
  .appVisual30 #editorBg .editorGroup30 > .form { grid-template-columns:1fr; }
  .appVisual30 .assetChartTop { flex-wrap:wrap; }
}
@media(prefers-reduced-motion:no-preference) {
  .appVisual30 .nav button { transition:color .15s ease,background-color .15s ease; }
  .appVisual30 #editorBg.open .sheet { animation:editorEnter30 .2s ease-out; }
  @keyframes editorEnter30 { from { transform:translateY(18px); opacity:.8; } to { transform:none; opacity:1; } }
}
@media(prefers-reduced-motion:reduce) {
  .appVisual30 *, .appVisual30 *:before, .appVisual30 *:after { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
}
