@import"https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;600&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,700&display=swap";:root{--bg-color: #0c0c0c;--card-bg: #1a1a1a;--accent-gold: #d4af37;--text-main: #f0f0f0;--text-dim: #a0a0a0;--sidebar-w: 350px;--transition: all .3s cubic-bezier(.4, 0, .2, 1)}.city-item{padding:1rem 1.2rem;border-radius:8px;cursor:pointer;transition:var(--transition);color:var(--text-dim);font-size:1.25rem;font-weight:500;white-space:nowrap;letter-spacing:.5px}.city-item:hover{background:#d4af371a;color:var(--text-main);padding-left:1.5rem}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Outfit,sans-serif;background-color:var(--bg-color);color:var(--text-main);overflow-x:hidden;-webkit-text-size-adjust:none;text-size-adjust:none}h1,h2,h3{font-family:Playfair Display,serif}.app-container{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-w);height:100vh;position:fixed;left:0;top:0;background:#111;border-right:1px solid #333;padding:2rem 1.5rem;display:flex;flex-direction:column;gap:2rem;z-index:100;transition:var(--transition)}.logo{font-size:1.8rem;font-weight:700;color:var(--accent-gold);letter-spacing:1px;border-bottom:2px solid var(--accent-gold);padding-bottom:1rem;margin-bottom:2rem;display:flex;flex-direction:column;gap:.6rem;white-space:nowrap;cursor:pointer;transition:opacity .3s ease}.logo:hover{opacity:.8}.logo-subtext{font-size:1.2rem;font-weight:300;color:#666;letter-spacing:0;text-transform:none;font-family:Outfit,sans-serif;white-space:normal;line-height:1.5}.logo-subtitle{display:block;font-size:.65rem;font-weight:300;color:#666;letter-spacing:1px;margin-top:2px;white-space:nowrap}.city-nav{display:flex;flex-direction:column;gap:.5rem}.city-item{padding:.8rem 1rem;border-radius:8px;cursor:pointer;transition:var(--transition);color:var(--text-dim);font-size:1.2rem;font-weight:500}.city-item:hover{background:#d4af371a;color:var(--text-main)}.city-item.active{background:var(--accent-gold);color:#000}.main-content{margin-left:var(--sidebar-w);flex:1;padding:3rem}header{margin-bottom:3rem}header h2{font-size:3.5rem;color:var(--text-main);margin-bottom:.5rem}header p{color:var(--text-dim);font-size:1.4rem}.arch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:2.5rem;align-items:stretch}.arch-card{background:var(--card-bg);border-radius:6px;overflow:hidden;transition:var(--transition);border:1px solid #333;cursor:pointer;position:relative;display:flex;flex-direction:column}.arch-card:hover{transform:translateY(-8px);border-color:var(--accent-gold);box-shadow:0 15px 30px #0009}.card-image-container{width:100%;aspect-ratio:1 / 1;background-color:#0c0c0c;border-bottom:1px solid #333;position:relative}.card-image-container img{width:100%;height:100%;object-fit:contain;background-color:#111;display:block;transition:transform .5s ease}.arch-card:hover .card-image-container img{transform:scale(1.05)}.card-img-placeholder{width:100%;height:100%;background:linear-gradient(45deg,#1f1f1f,#252525);display:flex;align-items:center;justify-content:center;font-style:italic;color:#555;padding:1rem}.card-body{padding:1.5rem;display:flex;flex-direction:column;flex:1;position:relative}.card-body h3{font-size:1.85rem;color:var(--accent-gold);margin-bottom:.8rem;letter-spacing:1px}.features{color:var(--text-dim);font-size:1rem;margin-bottom:1rem;line-height:1.6}.history{font-size:1.05rem;color:#888;line-height:1.6;opacity:1;margin-bottom:2rem}.lightbox{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;display:flex;justify-content:center;align-items:center;z-index:3000;padding:2rem}.lightbox-content{position:relative;max-width:90vw;max-height:90vh}.lightbox-content img{max-width:100%;max-height:90vh;object-fit:contain;box-shadow:0 0 50px #000c;border:1px solid #333}.close-btn{position:absolute;top:-40px;right:0;background:none;border:none;color:#fff;font-size:2rem;cursor:pointer;z-index:1001}.portal-container{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2000;background-color:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;transition:opacity .8s cubic-bezier(.4,0,.2,1)}.portal-bg{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat}.portal-content{position:relative;z-index:10;display:flex;flex-direction:column;align-items:center;gap:clamp(2rem,5vh,4rem);text-align:center;animation:fadeIn 1.5s ease-out}.portal-logo{font-family:Playfair Display,serif;font-size:clamp(3.5rem,15vw,7.5rem);font-weight:400;letter-spacing:.25em;color:var(--accent-gold);margin:0;text-transform:uppercase;text-shadow:0 0 30px rgba(0,0,0,.6),0 0 60px rgba(255,255,255,.05);opacity:.9;animation:fadeInLogo 2.5s ease-out forwards;-webkit-user-select:none;user-select:none;pointer-events:none;line-height:1.1}@keyframes fadeInLogo{0%{opacity:0;transform:translateY(15px) scale(.98);letter-spacing:.1em}to{opacity:.9;transform:translateY(0) scale(1);letter-spacing:.25em}}.portal-subtitle{font-size:1.2rem;color:var(--accent-gold);letter-spacing:4px;margin-bottom:3rem;font-weight:300;text-transform:uppercase;border-top:1px solid var(--accent-gold);padding-top:1rem;display:inline-block}.portal-menu{display:flex;gap:1.5rem;z-index:10;padding:1.5rem 3rem;background:transparent}.portal-menu-item{color:#fffc;text-decoration:none;font-size:1.3rem;font-weight:400;letter-spacing:.1em;transition:all .6s cubic-bezier(.4,0,.2,1);cursor:pointer;padding:.6rem 1rem;background:transparent;border:none;outline:none;position:relative;font-family:Outfit,sans-serif;text-transform:uppercase;white-space:nowrap;text-shadow:0 2px 10px rgba(0,0,0,.5)}.portal-menu-item:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:1px;background:#fffc;transition:all .6s cubic-bezier(.4,0,.2,1);transform:translate(-50%)}.portal-menu-item:hover{color:#fff;letter-spacing:.35em;text-shadow:0 0 20px rgba(255,255,255,.4)}.portal-menu-item:hover:after{width:60%}.portal-quote{margin-top:4rem;text-align:center;opacity:.8;animation:fadeIn 3s ease-out;max-width:90%;text-wrap:balance}.quote-zh{font-family:Playfair Display,serif;font-size:1.4rem;letter-spacing:.2em;color:#fff;margin-bottom:.8rem;font-weight:300}.quote-en{font-family:Outfit,sans-serif;font-size:.9rem;letter-spacing:.1em;color:var(--accent-gold);text-transform:uppercase;font-weight:200;opacity:.7}.sandbox-container{height:100vh;width:100vw;background:#111;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:2rem;overflow-y:auto}.interaction-area{display:flex;gap:2rem;margin-top:2rem;flex-wrap:wrap;justify-content:center;width:100%;max-width:1200px}.preview-pane{flex:1;min-width:300px;max-width:500px}.postcard-preview{width:100%;background:#fff;padding:1rem;box-shadow:0 10px 30px #00000080;transform:rotate(-1deg);transition:transform .3s ease}.postcard-preview:hover{transform:rotate(0) scale(1.02)}.controls-pane{flex:1;min-width:300px;background:#222;padding:2rem;border-radius:8px;border:1px solid #333}.control-group{margin-bottom:1.5rem}.control-group label{display:block;color:var(--accent-gold);margin-bottom:.5rem;font-size:.9rem;letter-spacing:1px}.control-input,.control-textarea{width:100%;background:#111;border:1px solid #444;color:#fff;padding:.8rem;border-radius:4px;font-family:Outfit,sans-serif}.control-textarea{min-height:100px;resize:vertical}.grand-ui-control{width:100%;padding:1.2rem;font-size:1.2rem;border-radius:8px;font-family:Outfit,sans-serif;transition:all .3s ease;outline:none}@media(max-width:768px){.app-container{flex-direction:column}.sidebar{width:100%;height:auto;position:sticky;top:0;padding:1.5rem 1.5rem .5rem;border-right:none;border-bottom:1px solid #333;flex-direction:column;align-items:flex-start;gap:.8rem;background:#111111f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);justify-content:flex-start;z-index:1000}.logo{font-size:1.4rem;margin-bottom:0;padding-bottom:0;border-bottom:none;width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center}.logo-subtitle{display:inline-block!important;margin-left:10px;margin-top:0!important}.logo-subtext{display:block!important;text-align:right;font-size:.85rem;line-height:1.2;background:transparent;padding:0;border:none;position:static;transform:none}.city-nav{display:flex;flex-direction:row;width:100%;overflow-x:visible;white-space:normal;gap:.3rem;padding-bottom:0;justify-content:space-between;max-width:100%}.city-nav::-webkit-scrollbar{display:none}.grand-ui-control{padding:.75rem 1rem;font-size:1rem}.city-item{flex:1;width:auto;min-width:0;text-align:center;font-size:.65rem;letter-spacing:-.3px;padding:.35rem .1rem;background:transparent;border:1px solid #333;border-radius:6px;color:#888;overflow:hidden}.city-item.active{background:var(--accent-gold);color:#000;border-color:var(--accent-gold);font-weight:600}.main-content{margin-left:0;padding:.8rem 1.2rem 1.2rem}header{margin-bottom:2rem}header h2{font-size:1.7rem}.card-body h3{font-size:1.7rem!important}header p{font-size:.75rem}.arch-grid{grid-template-columns:1fr;gap:2rem}input[type=text]{font-size:.9rem;padding:.6rem .8rem!important}.sidebar>div:last-child{display:none!important}.sidebar>div:last-child>div{border-top:none!important;padding-top:0!important;text-align:left!important;padding-bottom:.2rem;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.sidebar>div:last-child br{display:none}}@media(max-width:768px){.portal-content{gap:3rem;padding:0 20px}.portal-logo{font-size:3.5rem;letter-spacing:.2em;padding-left:.2em;line-height:1.1}.portal-menu{flex-direction:column;gap:1.5rem}.portal-menu-item{font-size:1.4rem;letter-spacing:.1em;padding:.5rem 0;width:100%}.portal-quote{margin-top:3rem}.quote-zh{font-size:.95rem;letter-spacing:.1em;line-height:1.6;padding:0 10px}.quote-en{font-size:.65rem;letter-spacing:.05em;line-height:1.4}}@media print{.sidebar,.btn-primary,.control-btn,.portal-container{display:none!important}.main-content{margin-left:0!important;padding:2rem!important;width:100%!important}.app-container{height:auto!important;overflow:visible!important}body{background-color:#fff!important;color:#000!important}.journey-container h2{color:#000!important}.journey-item{background:#fff!important;border:1px solid #ddd!important;box-shadow:none!important;color:#000!important;page-break-inside:avoid}.journey-item h3{color:#000!important}.journey-timeline-line{background:#ccc!important}.journey-timeline-dot{border-color:#000!important;background:#000!important}.history{-webkit-line-clamp:unset!important}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.journey-timeline{position:relative;border-left:2px solid var(--accent-gold);margin-left:50%;padding-bottom:4rem}.journey-item{position:relative;width:45%;margin-bottom:3rem}.journey-item:nth-child(odd){margin-left:-52%;text-align:right}.journey-item:nth-child(2n){margin-left:7%;text-align:left}.journey-dot{position:absolute;top:10px;width:16px;height:16px;background:var(--accent-gold);border-radius:50%;box-shadow:0 0 10px var(--accent-gold)}.journey-item:nth-child(odd) .journey-dot{right:-13.5%}.journey-item:nth-child(2n) .journey-dot{left:-13.5%}.journey-meta{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;color:#888;font-size:.85rem}.journey-item:nth-child(odd) .journey-meta{justify-content:flex-end}.journey-item:nth-child(2n) .journey-meta{justify-content:flex-start}@media(max-width:768px){.journey-timeline{margin-left:1.5rem;border-left:2px solid var(--accent-gold);padding-left:0}.journey-item{width:85%;margin-left:2rem!important;text-align:left!important;margin-bottom:2.5rem}.journey-item:nth-child(odd),.journey-item:nth-child(2n){margin-left:2rem!important}.journey-dot{left:-2.45rem!important;right:auto!important}.journey-meta{justify-content:flex-start!important}}.journey-input{background:transparent;border:none;border-bottom:1px solid transparent;color:#fff;font-size:inherit;font-family:inherit;width:auto;min-width:200px;max-width:400px;outline:none;padding:0 4px;transition:border-color .3s ease;text-shadow:0 2px 10px rgba(0,0,0,.5);font-size:2.2rem;font-weight:500;text-align:right;margin-right:-2px}.journey-input:focus{border-bottom:1px solid var(--accent-gold)}@media(max-width:768px){.journey-input{text-align:center;min-width:150px;margin-right:0;margin-bottom:-4px;font-size:2.2rem!important}}.journey-container{width:100%;max-width:1000px;height:100%;padding:8rem 2rem 4rem;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.journey-container::-webkit-scrollbar{display:none}@media(max-width:768px){.journey-container{padding-top:9rem;padding-left:1rem;padding-right:1rem}}.action-buttons-grid{margin-top:auto;padding-top:1.5rem;display:flex!important;flex-direction:row!important;overflow:hidden!important;white-space:normal;gap:.3rem;width:100%;margin-left:0;margin-right:0;padding-left:0;padding-right:0;scrollbar-width:none;padding-bottom:0;justify-content:space-between}.action-buttons-grid::-webkit-scrollbar{display:none}.action-btn,.action-btn-footprint{flex:1;width:auto;min-width:0;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:600;letter-spacing:-.4px;padding:.4rem .05rem;white-space:nowrap;border-radius:4px;cursor:pointer;transition:all .2s ease;overflow:hidden;text-overflow:clip}.btn-primary.action-btn{background-color:var(--accent-gold);color:#000;border:none}.btn-secondary.action-btn,.action-btn-footprint{background:transparent;border:1px solid #444;color:#ccc}.journey-title{color:var(--accent-gold);font-size:2.2rem;font-family:Playfair Display,serif;font-weight:500;text-align:center;margin-bottom:4rem;text-shadow:0 4px 20px rgba(0,0,0,.8);display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:8px;letter-spacing:1px}.journey-title span{font-size:.8em}@media(max-width:768px){.journey-title{flex-direction:row;flex-wrap:nowrap;justify-content:center;align-items:baseline;gap:8px;margin-top:0}.journey-title span{white-space:nowrap}}.journey-name-static{display:none;font-family:inherit;font-size:inherit;font-weight:inherit;color:inherit;margin:0;padding:0;border:none;letter-spacing:inherit}#journey-modal.snapshot-mode .journey-input{display:none!important}#journey-modal.snapshot-mode .journey-name-static{display:inline!important}#journey-modal.snapshot-mode .journey-control-btn,#journey-modal.export-mode .journey-title,#journey-modal.export-mode .journey-control-btn{display:none!important}
