@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial}}}.container{width:100%}.flex{display:flex}.flex-shrink{flex-shrink:1}.flex-grow{flex-grow:1}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.flex-wrap{flex-wrap:wrap}.border{border-style:var(--tw-border-style);border-width:1px}.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.delay-1{transition-delay:1ms}.delay-2{transition-delay:2ms}.delay-3{transition-delay:3ms}:root{--bg-main:#eaf4fa;--bg-sidebar:#fff;--bg-card:#fff;--bg-bento-item:#f2f8fd;--text-main:#2a435d;--text-light:#7a9eba;--accent-color:#5dade2;--accent-light:#d6eaf8;--border-color:#d4e6f1;--shadow-sm:0 4px 15px #5dade214;--shadow-md:0 10px 40px #2980b914;--shadow-hover:0 15px 45px #5dade240;--shadow-photo:0 12px 35px #00000014;--font-serif:"Noto Serif TC", serif;--font-sans:"Noto Sans TC", sans-serif;--radius-md:12px;--radius-lg:20px;--radius-xl:30px}::selection{background-color:var(--accent-color);color:#fff}body{background-color:var(--bg-main);color:var(--text-main);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;min-height:100vh;margin:0;padding:0;line-height:1.8}.container{background-color:var(--bg-main);box-sizing:border-box;align-items:center;gap:30px;max-width:1300px;height:100vh;margin:0 auto;padding:40px 20px;display:flex;position:relative;overflow:hidden}.fullscreen-btn{border:1px solid var(--border-color);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);cursor:pointer;z-index:100;width:40px;height:40px;box-shadow:var(--shadow-sm);color:var(--text-main);background:#fffc;border-radius:50%;justify-content:center;align-items:center;transition:all .3s;display:flex;position:absolute;top:20px;right:25px}.fullscreen-btn:hover{color:var(--accent-color);background:#fff;transform:scale(1.1)}.fullscreen-btn svg{fill:currentColor;width:18px;height:18px}@keyframes fadeUpIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.animate-fade-up{opacity:0;animation:.7s cubic-bezier(.16,1,.3,1) forwards fadeUpIn}.delay-1{animation-delay:.1s}.delay-2{animation-delay:.2s}.delay-3{animation-delay:.3s}.fade-enter-active,.fade-leave-active{transition:opacity .25s,transform .25s}.fade-enter-from{opacity:0;transform:translateY(15px)}.fade-leave-to{opacity:0;transform:translateY(-15px)}@keyframes floating{0%{transform:translate(0)rotate(0)}25%{transform:translate(2px,-5px)rotate(.2deg)}50%{transform:translate(-2px,-3px)rotate(-.2deg)}75%{transform:translate(1px,2px)rotate(.1deg)}to{transform:translate(0)rotate(0)}}aside{z-index:1000;flex-direction:column;flex-shrink:0;width:260px;height:85vh;display:flex}.sidebar-card{background-color:var(--bg-sidebar);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);box-sizing:border-box;flex-direction:column;height:100%;padding:25px 20px 20px;display:flex}.profile-pic{background-color:#f1f1f1;border:3px solid #fff;border-radius:50%;flex-shrink:0;width:90px;height:90px;margin:0 auto 12px;overflow:hidden;box-shadow:0 0 20px #5dade24d}.profile-pic img{object-fit:cover;width:100%;height:100%}.profile-info{text-align:center;flex-shrink:0;margin-bottom:20px}.profile-name{font-family:var(--font-serif);letter-spacing:.15em;color:var(--text-main);margin-bottom:.5rem;font-size:1.4rem;font-weight:600}.profile-status{color:#4a90e2;letter-spacing:.1em;background:var(--accent-light);border-radius:15px;padding:3px 10px;font-size:.75rem;font-weight:500;display:inline-block}nav{flex-direction:column;flex-grow:1;gap:10px;min-height:0;display:flex}.nav-btn{border-radius:var(--radius-md);cursor:pointer;box-shadow:var(--shadow-sm);background-color:#a9cce3;background-position:50%;background-size:cover;border:none;flex:1;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.165,.84,.44,1);display:flex;position:relative;overflow:hidden}.nav-btn:before{content:"";background:#2c3e5066;transition:background .3s;position:absolute;inset:0}.nav-btn span{z-index:1;color:#fff;font-family:var(--font-sans);letter-spacing:.15em;text-shadow:0 2px 4px #0006;font-size:1.05rem;font-weight:700;position:relative}.nav-btn:hover,.nav-btn.active{box-shadow:var(--shadow-hover);transform:translateY(-3px)}.nav-btn:hover:before{background:#2c3e5033}.nav-btn.active:before{background:#5dade2bf}main{scroll-behavior:smooth;-ms-overflow-style:none;scrollbar-width:none;background-color:var(--bg-card);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);box-sizing:border-box;flex-grow:1;height:85vh;padding:40px;position:relative;overflow-y:auto}main::-webkit-scrollbar{display:none}.bento-grid{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.bento-hero{border-radius:var(--radius-lg);height:320px;box-shadow:inset 0 0 0 1px var(--border-color);color:#fff;background-color:#aed6f1;background-position:50%;background-size:cover;grid-column:1/-1;align-items:center;display:flex;position:relative;overflow:hidden}.bento-hero:before{content:"";z-index:0;background:linear-gradient(135deg,#5dade2e6,#2980b9cc);position:absolute;inset:0}.bento-hero-content{z-index:2;pointer-events:none;max-width:45%;padding:40px;position:relative}.bento-hero-title{font-family:var(--font-serif);letter-spacing:.05em;text-shadow:0 2px 4px #0000001a;margin:0 0 15px;font-size:1.8rem;font-weight:600}.bento-hero-desc{opacity:.95;white-space:pre-wrap;text-shadow:0 1px 3px #0000001a;margin:0;font-size:.95rem;line-height:1.8}#three-canvas-container{z-index:1;cursor:grab;width:60%;height:100%;position:absolute;top:0;right:0}#three-canvas-container:active{cursor:grabbing}.copylove-dialog{z-index:10;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transform-origin:100% 0;background:#fffffff2;border:2px solid #ffdfd3;border-radius:20px;flex-direction:column;width:260px;padding:20px;display:flex;position:absolute;top:20px;right:20px;box-shadow:0 15px 35px #0000001a}.dialog-enter-active,.dialog-leave-active{transition:all .3s cubic-bezier(.34,1.56,.64,1)}.dialog-enter-from,.dialog-leave-to{opacity:0;transform:scale(.8)translateY(-20px)}.copylove-tag{color:#d35400;background:#ffdfd3;border-radius:10px;align-self:flex-start;margin-bottom:10px;padding:4px 10px;font-size:.75rem;font-weight:700}.copylove-text{color:#2c3e50;text-align:justify;max-height:160px;margin:0 0 15px;padding-right:5px;font-size:.95rem;line-height:1.6;overflow-y:auto}.copylove-text::-webkit-scrollbar{width:6px}.copylove-text::-webkit-scrollbar-thumb{background-color:#d6eaf8;border-radius:10px}.copylove-btn-group{flex-shrink:0;gap:10px;display:flex}.copylove-btn{cursor:pointer;border:none;border-radius:8px;flex:1;padding:8px;font-size:.85rem;font-weight:600;transition:all .2s}.btn-refresh{color:#fff;background:#5dade2}.btn-refresh:hover{background:#3498db}.btn-close{color:#7f8c8d;background:#f2f3f4}.btn-close:hover{background:#e5e7e9}.interaction-hint{z-index:2;color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none;background:#0000004d;border-radius:15px;padding:5px 12px;font-size:.8rem;position:absolute;bottom:15px;right:20px}.bento-item{background:var(--bg-bento-item);border-radius:var(--radius-lg);border:1px solid var(--border-color);flex-direction:column;padding:25px;transition:transform .3s;display:flex}.bento-item:hover{box-shadow:var(--shadow-sm);transform:translateY(-5px)}.bento-item-header{color:var(--text-main);font-weight:700;font-family:var(--font-serif);letter-spacing:.05em;align-items:center;gap:10px;margin-bottom:20px;display:flex}.skill-tags{flex-wrap:wrap;gap:10px;display:flex}.skill-tag{border:1px solid var(--border-color);color:var(--text-main);background:#fff;border-radius:20px;padding:6px 14px;font-size:.9rem;font-weight:500;transition:all .3s;box-shadow:0 2px 5px #00000005}.skill-tag:hover{border-color:var(--accent-color);color:var(--accent-color);transform:translateY(-2px);box-shadow:0 4px 10px #5dade226}.grid-list{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:25px;display:grid}.fade-wrapper{height:100%;display:block}.item-card{border-radius:var(--radius-lg);color:inherit;box-shadow:var(--shadow-sm);border:1px solid var(--border-color);box-sizing:border-box;background:#fff;flex-direction:column;height:100%;padding:20px;text-decoration:none;transition:all .5s cubic-bezier(.165,.84,.44,1);animation:12s ease-in-out infinite floating;display:flex;position:relative;overflow:hidden}.item-card:hover{box-shadow:var(--shadow-hover);border-color:var(--accent-light);animation-play-state:paused;transform:translateY(-10px)scale(1.02)!important}.cute-frame{box-sizing:border-box;background-color:#f8f9fa;border-radius:28px;justify-content:center;align-items:center;width:100%;height:200px;margin-bottom:20px;padding:20px;display:flex}.cute-frame img{object-fit:contain;border-radius:12px;max-width:100%;max-height:100%;box-shadow:0 6px 16px #00000014}.fade-wrapper:nth-child(5n+1) .cute-frame{background-color:#ffdfd3}.fade-wrapper:nth-child(5n+2) .cute-frame{background-color:#e0ece4}.fade-wrapper:nth-child(5n+3) .cute-frame{background-color:#d4dfe6}.fade-wrapper:nth-child(5n+4) .cute-frame{background-color:#fdf6f0}.fade-wrapper:nth-child(5n+5) .cute-frame{background-color:#eae4e9}.item-title{font-family:var(--font-serif);color:var(--text-main);margin:0 0 10px;font-size:1.2rem}.item-desc{color:var(--text-light);text-align:justify;flex-grow:1;margin:0;font-size:.9rem;line-height:1.7}.gallery-container{grid-template-columns:repeat(2,1fr);justify-items:center;gap:30px;display:grid}.gallery-item{box-shadow:var(--shadow-photo);cursor:pointer;border:1px solid var(--border-color);background-color:#fff;border-radius:8px;width:100%;padding:10px;transition:all .6s cubic-bezier(.165,.84,.44,1);animation:15s ease-in-out infinite floating;position:relative;overflow:hidden}.fade-wrapper:nth-child(2n) .gallery-item{transform:rotate(1.5deg)}.fade-wrapper:nth-child(odd) .gallery-item{transform:rotate(-1.5deg)}.gallery-item:hover{z-index:100;box-shadow:var(--shadow-hover);animation-play-state:paused;transform:rotate(0)scale(1.05)!important}.gallery-img{border-radius:4px;width:100%;height:auto;display:block}.gallery-overlay{background:linear-gradient(#0000 40%,#2a435dd9 100%);border-radius:4px;align-items:flex-end;padding:20px;display:flex;position:absolute;inset:10px}.gallery-caption{font-family:var(--font-serif);color:#fff;text-shadow:0 1px 3px #0000004d;font-size:.95rem}.hamburger-btn,.mobile-overlay{display:none}@media (max-width:960px){.container{flex-direction:column;align-items:stretch;height:100vh;padding:0}.fullscreen-btn{display:none}.hamburger-btn{z-index:1001;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);width:45px;height:45px;box-shadow:var(--shadow-sm);cursor:pointer;background:#ffffffe6;border:none;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:5px;display:flex;position:fixed;top:15px;left:15px}.hamburger-btn span{background:var(--text-main);border-radius:3px;width:22px;height:3px;transition:all .3s}.hamburger-btn.is-open span:first-child{transform:translateY(8px)rotate(45deg)}.hamburger-btn.is-open span:nth-child(2){opacity:0}.hamburger-btn.is-open span:nth-child(3){transform:translateY(-8px)rotate(-45deg)}.mobile-overlay{z-index:999;opacity:0;pointer-events:none;background:#00000080;transition:opacity .3s;display:block;position:fixed;inset:0}.mobile-overlay.is-open{opacity:1;pointer-events:auto}aside{background:var(--bg-sidebar);width:280px;height:100vh;box-shadow:var(--shadow-md);z-index:1000;border-radius:0 20px 20px 0;margin:0;transition:left .3s cubic-bezier(.4,0,.2,1);position:fixed;top:0;left:-300px;opacity:1!important;animation:none!important;transform:none!important}aside.is-open{left:0}.sidebar-card{width:auto;height:100%;box-shadow:none;border-radius:0;padding:70px 20px 20px}nav{flex-direction:column;gap:10px}.nav-btn{flex:0 0 50px;height:50px}main{border-radius:0;flex-grow:1;height:100vh;padding:70px 20px 20px}.bento-grid{grid-template-columns:1fr;gap:15px}.bento-hero{background-color:var(--accent-light);border-radius:var(--radius-lg);flex-direction:column;height:auto;padding:0;background-image:none!important}.bento-hero:before{display:none}#three-canvas-container{flex-shrink:0;width:100%;height:320px;position:relative}.bento-hero-content{text-align:center;border-radius:0 0 var(--radius-lg) var(--radius-lg);pointer-events:auto;background:linear-gradient(135deg,#5dade2,#2980b9);max-width:100%;padding:25px 20px;position:relative}.interaction-hint{top:15px;bottom:auto;right:15px}.copylove-dialog{width:85%;top:10px;right:50%;transform:translate(50%)}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}
