@import url('/port-fonts.css');:root{--bg:#090e16;--panel:#131c29;--panel2:#1a2637;--line:#29374b;--ink:#edf3fc;--muted:#8f9fb6;--blue:#adceff;--dim:#667e9e}body{font-family:'DM Sans',Geist,sans-serif;background:#090e16;font-size:14px}.workspace{margin-left:92px;min-height:100vh}.rail{position:fixed;inset:0 auto 0 0;width:92px;background:#0d141f;border-right:1px solid #202d40;z-index:50;display:flex;align-items:center;flex-direction:column;padding:22px 12px}.rail-brand img{width:38px;height:38px}.rail-create{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:#adceff;color:#0f233e;width:62px;height:65px;border-radius:15px;font-size:10px;font-weight:600;margin:30px 0 18px;box-shadow:0 4px 20px #a9caff12}.rail svg{width:22px;height:22px}.rail nav{display:flex;flex-direction:column;gap:8px;margin:0;width:100%}.rail nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;height:62px;border-radius:12px;color:#7c8ea8;font-size:10px;transition:.2s}.rail nav a:hover,.rail nav a.active{color:#b9d7ff;background:#1c2e46}.rail nav a[data-nav='/routes'] svg{color:#bcaadd}.rail nav a[data-nav='/saved'] svg{color:#d6b98c}.rail-bottom{margin-top:auto;font-size:9px;color:#7290b4;display:grid;justify-items:center;gap:9px}.rail-bottom img{height:21px;width:21px}.port-header{height:76px;padding:0 35px;border-color:#223044;background:#101823f5;gap:25px}.port-header .logo{font-size:22px;letter-spacing:-1px}.port-header .logo img{display:none}.workspace-label{font:8px 'IBM Plex Mono',monospace;color:#5a708d;letter-spacing:1.4px;border-left:1px solid #30415b;padding-left:25px}.header-controls{margin-left:auto;display:flex;align-items:center;gap:12px}.network{font-size:11px;color:#9db1ce;display:flex;align-items:center;gap:7px;margin-right:10px}.network img{width:16px;height:16px}.button,.outline{border-radius:10px;font-family:inherit;transition:background .2s,transform .2s;padding:11px 17px}.button:hover{transform:translateY(-2px)}.outline{background:#172333;border-color:#2a3c53}.wrap{max-width:1380px;padding:0 38px}.port-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:35px;align-items:center;padding:54px 0 45px}.port-copy>h1{font-size:clamp(34px,3.6vw,51px);line-height:1.13;letter-spacing:-2px;margin:20px 0}.port-copy em{font-style:normal;color:#adceff}.port-copy>p{font-size:16px;line-height:1.7;color:#95aac8}.port-copy .hero-actions{margin:28px 0 24px}.hero-under{display:flex;gap:20px}.hero-under>span{display:flex;align-items:center;gap:7px;color:#6481a6;font-size:10px}.hero-under img{height:15px;width:15px}.port-film{border:1px solid #2a3e59;border-radius:22px;background:radial-gradient(ellipse at 50% 50%,#2b527a27,transparent 70%),#101a29;overflow:hidden;position:relative}.film-top{display:flex;justify-content:space-between;padding:22px 24px;font:8px 'IBM Plex Mono',monospace;letter-spacing:1px;color:#6b86aa}.film-top>span:last-child{display:flex;gap:6px;align-items:center;color:#9cbdde}.film-top i{width:4px;height:4px;background:#a4d5c5;border-radius:50%}.film-scene{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:22px 26px 35px;min-height:210px}.film-node{position:relative;display:flex;align-items:center;flex-direction:column;z-index:2;width:105px}.film-node>div{width:66px;height:66px;background:linear-gradient(145deg,#294263,#122238);border:1px solid #4c6c93;border-radius:20px;display:grid;place-items:center;box-shadow:0 8px 25px #0004;animation:node-float 6s ease-in-out infinite}.film-node img{width:32px;height:32px}.film-node.middle>div{background:linear-gradient(145deg,#aacbff,#6b94cd);border-color:#c7dfff;width:82px;height:82px;border-radius:24px;animation-delay:-2s}.film-node.middle img{filter:brightness(.23);width:40px;height:40px}.film-node.destination>div{background:linear-gradient(145deg,#2b494a,#152c32);border-color:#4e7a78;animation-delay:-4s}.film-node>b{font-size:12px;font-weight:500;margin-top:18px}.film-node>span{font-size:8px;color:#5e7d9f;margin-top:5px;text-align:center;white-space:nowrap}.film-track{position:absolute;left:65px;right:65px;top:71px;height:1px;background:linear-gradient(90deg,#416c94,#a7ceff,#4d958c)}.film-track i,.film-track>b{position:absolute;top:-3px;background:#c1ddff;width:7px;height:7px;border-radius:50%;box-shadow:0 0 14px #a9caff;animation:packet 4s linear infinite}.film-track>b{animation-delay:-2s}.film-caption{border-top:1px solid #273c55;padding:16px 22px;display:flex;justify-content:space-between;gap:15px;font-size:9px;color:#6080a6;background:#0c1726}.film-caption a{color:#a6c8f5;white-space:nowrap}.port-metrics{display:grid;grid-template-columns:1fr 1fr 1fr 1.45fr;border:1px solid #27394f;border-radius:16px;overflow:hidden;background:#121d2c;margin-bottom:35px}.port-metrics>div{padding:22px 25px;border-right:1px solid #25364e}.port-metrics>div>span{font-size:11px;color:#839aba}.port-metrics>div>b{display:block;font-size:27px;font-weight:500;margin:8px 0;letter-spacing:-1px}.port-metrics small{display:block;font-size:9px;color:#5d789b}.port-metrics>a{display:flex;align-items:center;gap:15px;padding:20px}.port-metrics>a>img{width:47px;height:47px}.port-metrics>a b{font-size:12px;font-weight:500}.port-metrics>a small{margin:7px 0}.port-metrics>a em{font-style:normal;font-size:9px;color:#a9caff}.market-heading h2{font-size:25px;font-weight:500}.market-heading>span{border:0;background:#1d2c42;border-radius:20px;font-size:9px}.toolbar{border:0;background:transparent;padding:0;margin-bottom:25px}.tabs{background:#142135;padding:4px;border-radius:10px}.tabs>button{border-radius:7px;font-size:11px}.tabs>button.active{background:#293f5d;color:#c4dcff;border-color:transparent}.search{border-radius:10px;background:#101c2c}.views{border:0;padding:4px;background:#142135;border-radius:10px}.views>button{border-radius:7px}.views>button.active{background:#293f5d;color:#c4dcff;border-color:transparent}select{border-radius:9px;background:#101c2c}.coin-card{border-radius:13px;border-color:#27394e;background:#111d2c;box-shadow:none}.coin-image{border-radius:11px}.rows .coin-card:hover{transform:translateY(-2px);border-left-width:1px;padding-left:20px}.metric strong{font:12px 'IBM Plex Mono',monospace}.coin-list.grid{gap:20px;grid-template-columns:repeat(4,minmax(0,1fr))}.grid .coin-card{border-radius:17px;padding-bottom:20px;background:#111e30}.grid .coin-name>.coin-image{height:170px;border-radius:0;border:0;object-fit:cover}.grid .coin-name b{font-size:16px}.save{border-radius:9px}.table .coin-card{border-radius:0}.table-labels{border-radius:12px 12px 0 0;background:#182a40}.table .coin-card:last-child{border-radius:0 0 12px 12px}.explore-intro{padding:45px 0 10px}.explore-intro h1,.route-page>h1{font-size:43px;margin:15px 0;line-height:1.1;letter-spacing:-1.7px}.explore-intro p{font-size:14px}.detail-panel,.next-card,.draft-preview,.coin-stat-grid{border-radius:17px}.preview-art{border-radius:16px 16px 0 0}.create-page{padding-top:5px}.create-page>h1{font-size:43px}.create-grid{gap:28px}.detail-panel input,.detail-panel textarea{border-radius:9px}.detail-panel p{color:#8fa8c8}.coin-stat-grid>div{border-color:#2a3d55}.coin-page-heading>.coin-image{border-radius:18px}.coin-stat-grid b{font-family:'IBM Plex Mono',monospace}.empty{border-radius:15px}.how-number{border-radius:13px}.route-page{padding-top:45px;padding-bottom:80px;max-width:1170px}.route-page>p{max-width:650px;font-size:14px}.route-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:25px;margin-top:35px}.route-preview{background:radial-gradient(ellipse at 50% 0%,#3c659333,transparent 60%),#101e30;border:1px solid #3b587b;border-radius:19px;padding:30px}.route-preview-heading{display:flex;align-items:center;gap:15px;border-bottom:1px solid #2e4662;padding-bottom:25px;margin-bottom:30px}.route-preview-heading img{width:37px;height:37px}.route-preview-heading span{font:9px 'IBM Plex Mono',monospace;color:#83a9d6;letter-spacing:1.4px}.allocation{padding:20px 0}.allocation>span{font-size:12px;color:#7d9cc4}.allocation strong{display:block;font-size:44px;letter-spacing:-2px;color:#b7d5ff;font-weight:500;margin-top:8px}.allocation small{display:block;color:#6f9c98;font-size:10px;margin-top:4px}.allocation.mint strong{color:#a6d9c5}.allocation-bar{height:7px;background:#83b9af;border-radius:20px;overflow:hidden;margin:20px 0}.allocation-bar>i{display:block;height:100%;background:#adcfff;transition:width .2s}.route-preview>p{font-size:10px;color:#627d9f;margin:15px 0 25px}.route-note{font-size:11px!important;margin:22px 0}.route-grid form label{margin:25px 0}.route-grid select{width:100%;padding:12px;margin-top:10px}.route-grid input[type=range]{accent-color:#adceff;padding:0;margin-top:15px}.route-grid output{float:right;font-size:11px;color:#a9caff}.route-grid .form-actions{display:flex;gap:12px;align-items:center;margin-top:30px}.route-grid .button{margin:0}#route-status{font-size:11px;margin-top:15px}.eyebrow{font-family:'IBM Plex Mono',monospace}footer{border-color:#263449;padding:23px 38px;font-size:9px;color:#617c9f}@keyframes packet{from{left:0;opacity:0}15%,85%{opacity:1}to{left:100%;opacity:0}}@keyframes node-float{50%{transform:translateY(-6px)}}@media(max-width:1200px){.wrap{padding-inline:28px}.port-hero{gap:25px}.port-copy>h1{font-size:40px}.film-scene{padding-inline:18px}.film-node{width:90px}.film-caption{padding:15px}.film-caption>span{display:none}.film-caption>a{margin:auto}.port-metrics>div{padding:20px 18px}.port-metrics small{font-size:8px}.port-metrics>a{gap:10px;padding:18px 14px}.coin-list.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.workspace-label{display:none}}@media(max-width:950px){.port-hero{grid-template-columns:1fr;padding-top:35px;gap:30px}.port-copy>h1{font-size:47px}.port-film{max-width:650px}.port-metrics{grid-template-columns:repeat(3,1fr)}.port-metrics>a{grid-column:1/-1;border-top:1px solid #27394f;padding:17px 22px}.port-metrics>a>img{width:40px;height:40px}.port-metrics>a>span{display:flex;align-items:center;gap:20px;width:100%;flex-wrap:wrap}.port-metrics>a em{margin-left:auto}.port-metrics>a small{margin:0}.coin-list.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.header-controls{gap:8px}.network{display:none}}@media(max-width:650px){.workspace{margin-left:0;padding-bottom:70px}.rail{inset:auto 0 0;width:100%;height:70px;padding:5px 8px;flex-direction:row;border-right:0;border-top:1px solid #2b3c54;background:#0e1928f5;backdrop-filter:blur(20px)}.rail-brand,.rail-bottom{display:none}.rail nav{flex-direction:row;justify-content:space-around;gap:3px}.rail nav a{height:56px;flex:1;gap:4px;font-size:8px;border-radius:9px}.rail svg{width:19px;height:19px}.rail-create{margin:0 7px 0 0;width:48px;height:54px;flex-shrink:0;font-size:8px;gap:3px;border-radius:10px}.port-header{height:65px;padding:0 18px;gap:10px}.port-header .logo{font-size:21px}.port-header .logo img{display:block;width:25px;height:25px}.header-controls>.outline{display:none}.header-controls>.button{padding:9px 12px;font-size:10px}.wrap{padding-inline:20px}.port-hero{padding:30px 0}.port-copy>h1{font-size:37px;letter-spacing:-1.4px;margin:18px 0}.port-copy>p{font-size:14px}.hero-under{gap:15px}.hero-under>span{font-size:9px}.film-top{padding:18px;font-size:7px}.film-scene{padding-inline:12px;min-height:200px}.film-node{width:90px}.film-node>div{width:55px;height:55px;border-radius:16px}.film-node.middle>div{width:69px;height:69px;border-radius:20px}.film-node img{width:26px;height:26px}.film-node.middle img{width:34px;height:34px}.film-node>b{font-size:11px}.film-node>span{font-size:7px}.film-track{top:64px;left:50px;right:50px}.port-metrics>div{padding:17px 12px}.port-metrics>div>span{font-size:9px}.port-metrics>div>b{font-size:24px}.port-metrics small{font-size:7px;line-height:1.6}.port-metrics>a>span{display:block}.port-metrics>a small{margin:5px 0}.port-metrics>a em{font-size:9px}.coin-list.grid{gap:13px}.grid .coin-name>.coin-image{height:135px}.grid .coin-card{border-radius:12px}.grid .coin-name b{font-size:13px}.metric strong{font-size:11px}.route-grid{grid-template-columns:1fr}.route-page>h1,.explore-intro h1{font-size:35px}.route-preview{padding:25px}.route-page{padding-top:30px}.create-page>h1{font-size:35px}.create-grid{grid-template-columns:1fr}.port-copy .hero-actions{gap:20px}.port-copy .button{font-size:11px}.port-copy .text-link{font-size:10px}footer{padding:22px 20px}.hero-under img{height:13px;width:13px}}@media(prefers-reduced-motion:reduce){.film-node>div,.film-track i,.film-track>b{animation:none}.button:hover{transform:none}}
