/* V2 VISUAL RECONSTRUCTION - governed by 9 supplied UI references and real Handy Wallet screenshot in handoff PDF p.3.
   Additive stylesheet intentionally preserves the existing action/state/business demo logic. */
:root{--brand:#057fd9;--brand-dark:#0969b7;--brand-soft:#e7f8f8;--brand-pale:#f5fcfe;--ink:#091d4d;--muted:#7387a0;--line:#e2eaf3;--white:#fff;--bg:#f4f7fc;--shadow:0 2px 8px rgba(9,34,87,.035);--r:11px;color-scheme:light;font-family: -apple-system,BlinkMacSystemFont,"Pretendard","Noto Sans KR","Apple SD Gothic Neo",Arial,sans-serif;}
body{background:#edf3f9;color:var(--ink);font-size:13px;letter-spacing:-.15px}
h1,h2,h3,b,strong{letter-spacing:-.45px} h1{font-size:24px}h2{font-size:16px}h3{font-size:14px}
.card{border:1px solid #e3ebf5;border-radius:12px;box-shadow:0 2px 6px #112c6010}
.cardpad{padding:15px}
.btn{border-radius:8px;font-weight:750;min-height:44px;box-shadow:none}
.btn-primary{border:0;background:linear-gradient(105deg,#0b6feb 0%,#078edb 64%,#08baa9 100%);color:#fff}
.btn-outline{border-color:#9ccbe4;background:#fff;color:#096fc8}
.btn-soft{border:1px solid #d7eff7;background:#e2f7f8;color:#008f95;font-weight:750}
.btn-ghost{border:1px solid #d7eff7;background:#eaf7fa;color:#0e88b2}
.btn-sm{min-height:31px;border-radius:7px;padding:5px 10px;font-size:11px}
.link-button{color:#0574d7}
.tag{font-size:10px;background:#def9f2;color:#098f79;padding:4px 8px;border-radius:8px}
.tag.gray{background:#f0f3f7;color:#8c99a8}.tag.amber{background:#fff2dc;color:#c88d25}.tag.red{background:#ffe7e7;color:#e45f5f}
.positive{color:#078bb7}.progress{background:#d6e8f6;height:8px}.progress>span{background:linear-gradient(90deg,#07d0bf,#057ee8)}
.section-title{margin:20px 0 9px}.section-title h2{font-size:15px;font-weight:800}
.fine-print{font-size:10px;line-height:1.7;color:#8596aa;margin:12px 1px 8px}
/* Keep the original Handy mobile visual skeleton: white header, quiet cards, fixed 5-icon bottom nav. */
#app .mobile-shell{max-width:430px;background:#fff;min-height:100dvh;box-shadow:none;overflow:visible}
.mobile-ui{min-height:100dvh;background:#fff}
.mobile-header{height:58px;padding:9px 15px;background:#fff}
.brand{font-size:15px;color:#081b51;gap:6px}
.brand img{height:29px;width:29px}
.icon-btn{color:#061b51;min-width:34px;min-height:34px;font-weight:850}
.screen-head{border-bottom:1px solid #f0f4f8;position:relative}
.screen-title{font-size:15px;font-weight:800}
.help-symbol{font-size:19px;color:#243968}
.wallet-chip{display:flex;align-items:center;gap:5px;background:#f4f9fc;border:1px solid #dfe9f4;border-radius:9px;min-height:31px;padding:5px 8px;color:#33527a;font-size:10px}
.wallet-chip-dot{background:#cefaf0;border-radius:6px;color:#06a58a;padding:2px 4px;font-size:10px}
.mobile-content{background:#fff;min-height:calc(100dvh - 128px);padding:13px 14px 92px}
.mobile-bottom{border-top:1px solid #dce7f2;box-shadow:0 -3px 7px #0b2a4a07;height:65px;max-width:430px;z-index:20;background:#fff}
.nav-item{color:#758ba6;font-size:10px;gap:4px;background:#fff}
.nav-item svg{width:20px;height:20px;stroke-width:1.85}
.nav-item.active{color:#0575dc}.nav-item.active svg{stroke-width:2.8}
.demo-floating{position:fixed;z-index:5;top:7px;left:calc(50% + 240px);border:1px solid #c9d7e9;background:#fff;color:#71849a;font-size:11px;border-radius:8px;padding:7px 12px;pointer-events:none}
/* Landing: hero coin is artwork (not a new app screen/UI bitmap), while all user controls remain native HTML. */
.page-home{padding:0 0 78px;background:linear-gradient(#f5fdff,#fff 84%)}
.landing-screen{padding-bottom:16px}.hero-stage{height:420px;position:relative;overflow:hidden;background:linear-gradient(180deg,#f8feff,#e9faff)}
.hero-copy{position:relative;z-index:2;text-align:center;padding-top:21px;color:#071e59}
.hero-overline{font-size:9px;font-weight:800;letter-spacing:1.5px;color:#1387bb;display:none}
.hero-copy h1{font-size:30px;line-height:1.1;font-weight:900;letter-spacing:-1.2px}
.hero-copy p{font-size:14px;font-weight:650;line-height:1.45;margin:12px auto 8px;color:#12295d}
.hero-copy small{font-size:10px;color:#46638c}
.hero-art{position:absolute;left:0;right:0;bottom:-7px;height:310px;background-image:linear-gradient(180deg,#effcff 0%,#effcff00 17%),url('../assets/handy-burn-hero.webp');background-repeat:no-repeat;background-position:center bottom;background-size:cover}
.landing-summary{background:#fff;margin:-9px 14px 0;position:relative;z-index:2;border:1px solid #eef3f8;border-radius:12px;padding:10px;box-shadow:0 6px 22px #1b609b13}
.hero-value-pair{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.quick-stat{display:flex;align-items:center;gap:7px;min-width:0;border:1px solid #e7eef8;padding:11px 7px;border-radius:9px}
.quick-icon{background:#dcf9fb;color:#0c9cb0;border-radius:50%;width:30px;height:30px;display:grid;place-items:center;flex-shrink:0}
.quick-icon svg{width:19px;height:19px}
.quick-stat small,.landing-mini small{display:block;font-size:10px;color:#637d99}
.quick-stat strong{display:block;font-size:19px;line-height:1.15;color:#037dcf;margin-top:2px}
.landing-mini{margin:8px 0 12px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.landing-mini>div{text-align:center;border:1px solid #e8f0f7;border-radius:8px;padding:10px 4px;background:#fbfdfd}
.landing-mini strong{display:block;margin-top:3px;font-size:20px;color:#008cc3}
.landing-summary .btn+.btn{margin-top:7px}
.landing-disclosure{text-align:center;padding:15px 18px;color:#91a0b0;font-size:10px;line-height:1.7}
/* Tier list - screenshot 02: wallet card, 2-column segments on reference v1, single-column selection on latest 9-screen board.
   Mobile uses the latest supplied board as canonical. */
.page-tiers{padding-top:10px}.wallet-card{background:#f6faff;padding:11px 12px;border-color:#e1eaf4;border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:7px}
.wallet-left{display:flex;align-items:center;gap:9px;min-width:0}
.coin-circle{width:42px;height:42px;flex-shrink:0;border-radius:12px;border:2px solid #d3f4fd;background:linear-gradient(145deg,#35e6e4,#0879e8);font-size:25px;color:#fff;text-shadow:0 1px 3px #1364a9;box-shadow:0 2px 7px #3c95ce50}
.wallet-balance{font-size:21px;letter-spacing:-.7px;font-weight:900;color:#051b59;line-height:1.2}
.wallet-balance span{font-size:9px;font-weight:650;letter-spacing:0}
.wallet-sub{font-size:9px}.demo-flag{font-size:9px;color:#8d9cad}.wallet-card .btn{font-size:10px;white-space:nowrap;padding:5px 8px}
.tier-tabs{margin:16px -1px 14px}.tier-tabs .tab{font-size:12px;padding:10px 5px}
.tabs .tab.active{color:#087acf;border-bottom-color:#0688db}
.tier-section-title{margin:8px 1px 12px}.tier-section-title h2{font-size:14px}.tier-section-title small{font-size:10px}
.tier-list{gap:8px}
.tier-card{border:1px solid #dfe9f4;border-radius:10px;padding:12px 13px;box-shadow:0 1px 7px #12357009;transition:background .15s,border-color .15s}
.tier-card:hover{border-color:#9fc9f0}
.tier-card.selected{border:2px solid #0699e4;padding:11px 12px;background:#fafdff;box-shadow:0 2px 9px #168dcc18}
.tier-first{display:flex;justify-content:space-between;align-items:center}.tier-amount{font-weight:900;font-size:14px}
.tier-rate{font-size:18px;font-weight:900;margin-top:4px;line-height:1.1;color:#0784da}
.tier-hint{font-size:11px;color:#657c97;margin-top:4px}
.tier-foot{display:flex;gap:9px;justify-content:flex-start;margin-top:7px}.tier-foot small{font-size:10px;color:#72869e;white-space:nowrap}
.tier-foot .progress{width:64px;height:6px}
.pick-dot{width:22px;height:22px;border-radius:50%;background:#087ee5;color:#fff;display:grid;place-items:center;flex:none;font-size:14px}
.tier-chevron{font-size:24px;color:#0c88dc;line-height:20px}
.tier-continue{margin-top:13px}.page-tiers .fine-print{margin:7px auto 0}
/* Participation view - four-step bar, selected-tier summary, guided instruction, QR is deliberately non-transactional. */
.page-detail{padding-top:10px}.stepper{padding:8px 0 16px}.stepcircle{width:28px;height:28px;background:#dfeaf6;color:#7891b1}
.step.active .stepcircle,.step.done .stepcircle{background:linear-gradient(135deg,#04c6ae,#0488d8);color:#fff}
.step label{color:#66839e;font-size:10px}
.selected-overview{padding:15px;background:#f6faff}.selected-overview>.between:first-child{margin-bottom:10px}
.selected-overview .align-end{align-items:end}.selected-overview strong{font-size:21px}.selected-overview .large-rate{font-size:19px;color:#0884d8}
.overview-rows{display:grid;gap:8px;margin-top:11px;border-top:1px solid #e7edf5;padding-top:12px}
.overview-rows .info-row>span:first-child{font-size:11px}.overview-rows .info-row>span:last-child{font-size:11px;color:#263e62}
.timeline-layout{margin:19px 5px 14px}.timeline-entry{gap:12px;padding-bottom:9px}.timeline-entry .circle{width:29px;height:29px;border-radius:50%;background:#0a84d9;color:#fff;font-size:13px;font-weight:800}
.timeline-entry .circle.done{background:#07bfb0}.timeline-entry .timeline-text{border:0;padding-top:2px;padding-bottom:10px}
.timeline-text b{font-size:12px}.timeline-text p{margin-top:5px;font-size:11px;color:#7087a2}
.burn-address{padding:12px;background:#f9fbff}.burn-subtitle{font-weight:800;color:#092657}.burn-subtitle span{font-weight:450;color:#718ca6}
.burn-address-panel{margin:10px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid #ebf0f7;border-radius:9px;padding:10px}
.burn-address-panel b{font-size:11px;display:block}.burn-address-panel small{display:block;margin-top:5px;font-size:10px;line-height:1.5}
.burn-address-panel img{width:80px;height:80px;object-fit:contain;flex-shrink:0}
.burn-warning{margin:12px 0;padding:10px;background:#f3fafe;border-radius:9px;color:#6a7c96;font-size:10px;line-height:1.75;border:1px solid #ebf1f8}
.reservation-note{font-size:10px;color:#708a9e;text-align:center;margin-top:12px}
/* My rewards: one primary summary, 2x2 data panels, history rows, two wallet actions. */
.page-reward,.page-referral{padding-top:10px}.total-reward-card{padding:13px 14px;background:#f6faff}
.reward-head{margin:15px 0 13px;align-items:center}.reward-head strong{font-size:20px;color:#091d4f}.reward-head small{font-size:11px}
.reward-progress-title{margin-top:6px;margin-bottom:6px}.reward-progress-title b{font-size:17px;color:#087ed0}
.reward-metrics{margin:9px 0 16px;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.reward-metrics>div{border:1px solid #e5eef7;border-radius:9px;padding:12px 11px;min-width:0;background:#fbfdff}
.reward-metrics small{display:block;font-size:10px;color:#72869e}
.reward-metrics b{display:block;font-size:16px;letter-spacing:-.5px;margin-top:6px;color:#071b4e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.participation-card{padding:11px}.participation-row{display:flex;align-items:flex-start;gap:10px}.coin-circle.mini{border-radius:50%;width:34px;height:34px;font-size:20px}
.part-body{flex:1;min-width:0}.part-body .between{margin-bottom:8px}.part-body .between>b{font-size:12px}
.participation-dates{display:flex;justify-content:space-between;gap:4px;margin-top:10px;flex-wrap:wrap}.participation-dates small{font-size:10px}
.payout-table{overflow:hidden}.payout-row{display:grid;grid-template-columns:.75fr 1fr 1fr .6fr;gap:3px;align-items:center;padding:10px 8px;border-bottom:1px solid #f0f4f8;font-size:10px;text-align:center;white-space:nowrap}
.payout-row.head{background:#f1f6fc;color:#8193aa;font-weight:700}.payout-row:last-child{border-bottom:0}.payout-row .tag{padding:4px}.reward-actions{margin-top:13px}.reward-actions .btn{font-size:12px;padding:9px 5px}
/* Referral screenshot 05: code, 2 metrics, compact bonus rows, tabs and real tree indentation. */
.referral-code{padding:14px;background:#f9fcff}.referral-code .between{margin:5px 0}.referral-code strong{font-size:22px}.ref-url{font-size:10px;color:#637f9e;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:6px 0 10px}
.referral-two{display:grid;grid-template-columns:1fr 1fr;margin:10px 0 15px;border:1px solid #e9f0f7;border-radius:10px;background:#fff}
.referral-two>div{padding:12px 8px;text-align:center}.referral-two>div+div{border-left:1px solid #eaf0f7}
.referral-two small{font-size:10px}.referral-two strong{display:block;font-size:25px;color:#087ad3;margin:3px 0}.referral-two em{font-style:normal;font-size:11px}
.referral-rewards{display:grid;gap:0;border-bottom:1px solid #eef3f8}.mini-pay{display:flex;align-items:center;gap:9px;border-top:1px solid #edf2f8;padding:12px 5px}
.mini-pay>div{flex:1;display:flex;justify-content:space-between;align-items:center;gap:10px;min-width:0}.mini-pay b{font-size:12px;white-space:nowrap}.mini-pay b small{font-size:9px}
.mini-icon{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#0bddc7,#01a1b7);color:#fff}.mini-icon.purple{background:linear-gradient(135deg,#be7fff,#747ce4)}
.referral-tabs{margin:12px 0}.tree{padding:0}.tree-node.child{border-left:1px solid #95cce3;margin-left:20px}.tree-node.grandchild{border-left:1px solid #bbd5e2;margin-left:39px}
.node-letter{display:grid;place-items:center;border-radius:50%;width:28px;height:28px;background:#0b8bdf;color:#fff;font-weight:850;flex-shrink:0}
.node-letter.light{background:#d8e6f5;color:#56799b}.node-letter.lime{background:#a1ce37;color:#fff}
/* Dense settings and admin: navy navigation + discreet tables, not a second independent visual language. */
body[data-mode="admin"]{background:#f3f7fd;color:#0d2755}
.admin-sidebar{width:214px;background:#091c3b;color:#dde6f6;padding:15px 9px}
.admin-brand{padding:9px 10px 23px;font-size:13px;color:#fff}.admin-brand img{height:31px;width:31px}
.admin-sidebar .navhead{padding-left:11px;color:#637f9e;font-size:10px}
.admin-nav{font-size:12px;color:#b8c8dd;border-radius:6px;padding:11px 12px;gap:10px;font-weight:700}
.admin-nav.active{background:linear-gradient(90deg,#0865b6,#0c8ed5);color:#fff}
.admin-nav:hover:not(.active){background:#173355}.admin-menu-icon{width:21px;display:flex;justify-content:center;flex-shrink:0}
.admin-menu-icon svg{stroke-width:1.7}
.admin-sidebar .admin-foot{font-size:10px;color:#8293aa;border-color:#294265}.admin-foot a{color:#57d6e6}
.admin-content{padding:20px 25px 50px;background:#f5f8fd}
.admin-top{margin-bottom:15px;padding-bottom:15px;border-bottom:1px solid #e6edf6}
.admin-top-left,.admin-top-actions{display:flex;align-items:center;gap:12px}.admin-top h1{font-size:19px;color:#0a2151}.admin-note{color:#8394ad;font-size:11px}
.preview-badge{display:inline-block;padding:5px 8px;font-size:10px;border-radius:6px;background:#e8f7ff;color:#187db6;font-weight:750}
.admin-demo-line{font-size:11px;color:#7990a8;margin-bottom:12px;line-height:1.5}
.admin-stat{padding:14px}.admin-stat .stat-number{color:#087bca;font-size:20px;font-weight:850}.admin-grid{gap:9px}
.admin-split{gap:12px;margin-top:12px}.admin-split .cardpad{padding:15px}
.chart-bar{background:linear-gradient(180deg,#22cad6,#0a80cc)}
.data-table th{background:#f3f7fc;color:#647e9d;padding:12px 13px}
.data-table td{padding:12px 13px;color:#1b3863}.data-table strong{color:#067ecb}
.data-table th,.data-table td{border-bottom-color:#edf2fa}
.admin-surface{border-radius:10px;box-shadow:none;border-color:#e3ebf6}
.admin-toolbar{gap:8px}.admin-toolbar .search{border-color:#dde7f3;border-radius:7px}
.admin-stat small{color:#7b8ea7}.filter-select{border-color:#dfe7f3}
.toggle input:checked{background:#07baa9}
.settings-grid{gap:12px}.settings-grid .cardpad{padding:17px}
.setting-fields{gap:10px}.field input,.field select,.field-control{border-radius:7px;border-color:#dce7f2}
.admin-demo-line,.admin-content .alert{border-radius:8px}
@media(max-width:720px){.admin-content{padding:13px 12px 28px}.admin-top h1{font-size:17px}.admin-grid{grid-template-columns:repeat(2,1fr)}.admin-sidebar{width:220px}.preview-badge{display:none}}
@media(max-width:430px){.demo-floating{display:none}}
@media(min-width:500px){body[data-mode="user"]{background:#edf3fb}body[data-mode="user"] .mobile-shell{margin:18px auto;border:1px solid #cbdbe9;border-radius:27px;box-shadow:0 15px 38px #11376f23;min-height:calc(100vh - 36px);overflow:hidden}body[data-mode="user"] .mobile-bottom{bottom:18px;border-radius:0 0 26px 26px}}
@media(max-width:360px){.hero-stage{height:390px}.hero-art{height:286px}.hero-copy h1{font-size:27px}.landing-mini strong{font-size:18px}.tier-card{padding:10px}.tier-card.selected{padding:9px}}
/* Pixel review pass: no dark hairline below hero; primary participation action clear of bottom navigation. */
.hero-art{height:282px}
.landing-summary{margin:0 14px;transform:none}
.page-detail .stepper{padding:3px 0 11px}
.page-detail .selected-overview{padding:12px}
.page-detail .selected-overview>.between:first-child{margin-bottom:7px}
.page-detail .overview-rows{padding-top:8px;gap:6px;margin-top:8px}
.page-detail .timeline-layout{margin:12px 5px 7px}
.page-detail .timeline-entry{padding-bottom:4px}
.page-detail .timeline-text{padding-bottom:5px}
.page-detail .burn-address{padding:10px}
.page-detail .burn-address-panel{margin:7px 0;padding:8px}
.page-detail .burn-address-panel img{width:61px;height:61px}
.page-detail .burn-warning{margin:8px 0;padding:8px;font-size:10px}

/* V3 policy patch: visibility + simple stats + user-safe burn info */
.btn-primary{color:#fff!important;text-shadow:0 1px 1px rgba(0,0,0,.08)}
.tabs .tab.active{color:#075da8!important;font-weight:850}
.burn-address-simple{margin:10px 0;display:flex;align-items:center;gap:8px;background:#f7fafe;border:1px solid #e2eaf4;border-radius:10px;padding:10px}
.burn-address-simple code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2d4668;font-size:11px}
.burn-address-note{font-size:10px;line-height:1.7;color:#6d819a;background:#f6fbfc;border-radius:9px;padding:10px}
.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.stat-card{padding:14px}.stat-card small{display:block;color:#758aa2;font-size:10px}.stat-card b{display:block;color:#0b2e58;font-size:16px;margin-top:7px}
.stat-tier-row{display:grid;grid-template-columns:1.35fr 1fr .8fr;align-items:center;gap:9px;padding:10px 0;border-bottom:1px solid #edf2f7;font-size:10px}.stat-tier-row:last-child{border-bottom:0}.stat-tier-row b{text-align:right}
.announcement-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #edf2f7}.announcement-row:last-child{border-bottom:0}.announcement-row b{font-size:11px}.announcement-row p{font-size:10px;color:#7b8ea4;margin-top:5px}.announcement-row strong{font-size:11px;color:#087ac8;white-space:nowrap}
.withdraw-head,.withdraw-row{grid-template-columns:.7fr 1fr 1.1fr .65fr}