hsinyu's blog

/*v1.1.0 2025.05.15*/a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}pre{white-space:pre-wrap;word-wrap:break-word;-moz-tab-size:4;tab-size:4}#banner,.article-content-inner,.box-text,.main-list table{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}#banner #blog-category,#banner .skiplink{display:none}.box-more{text-align:right}.back-to-top,#blog-main .back-to-top,#category-main .back-to-top{display:none}#footer #bottom::before{display:block;content:"版權所有 © hsinyu / Copyright © hsinyu. All rights reserved.";width:100%;text-align:center;margin-top:1em;font-size:0.9rem}#trialsquad-post{display:none !important}.article-content-inner p{margin:1em 0;font-size:1rem}.article-content-inner ol{list-style-type:decimal;padding:1em .5em 1em 2.5em}.article-content-inner ul{list-style-type:disc;padding:1em 0 1em 2.5em}.article-content-inner img{margin:10px 0;max-width:100%;height:auto}.article-content-inner h1{font-size:1.4rem;font-weight:700;margin:.5em 0}.article-content-inner h2{font-size:1.3rem;font-weight:700;margin:.5em 0}.article-content-inner h3{font-size:1.2rem;font-weight:700;margin:.5em 0}.article-content-inner h4,.article-content-inner h5,.article-content-inner h6{margin:.5em 0;font-weight:700;font-size:1.1rem}.article-content-inner b,.article-content-inner strong{font-weight:700}.article-content-inner em{font-style:italic}.article-content-inner blockquote{padding-left:20px;padding-right:8px;border-left-width:5px;font-style:italic;font-family:Georgia,Times,"Times New Roman",serif;border-style:solid}.article-content-inner{padding:0 0.1rem}.article-keyword a{border-bottom:none}:root{--background-color:#121212;--primary-color:#bb86fc;--secondary-color:#03dac6}html{font-size:16px;font-family:'Noto Sans TC','微軟正黑體',sans-serif !important;line-height:165%;color:white;background-color:var(--background-color)}a{color:var(--primary-color);text-decoration:none}a:hover{text-shadow:0 0 3px currentColor}#main{margin:2rem auto;display:flex;flex-direction:row;gap:2rem}#content{flex:70%}#links{flex:30%}#header{margin:0;display:flex;flex-direction:column}#banner{text-align:center;height:fit-content;order:2}#banner h1{font-size:3rem;font-weight:600;padding:2rem 1rem}@media (max-width:767px){#banner h1{font-size:1.8rem;line-height:2rem;padding:1rem}}#banner h1 a{background:linear-gradient(to right,var(--secondary-color) 0%,var(--primary-color) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;transition:all 0.3s ease-in-out}#banner h1 a:hover{background:none;background-clip:none;-webkit-background-clip:none;-webkit-text-fill-color:white;color:white;text-shadow:0 0 20px #fff,0 0 40px var(--primary-color)}@keyframes particles{0%{transform:scale(1);opacity:0.3}100%{transform:scale(1.1);opacity:0.5}}#banner h2{margin:0.2rem auto;padding:0.2rem 1rem;color:white;max-width:60vw;font-size:1rem;letter-spacing:0.1rem}@media (max-width:767px){#banner h2{line-height:1.2rem}}#banner h2:before{display:block;width:100%;padding:40px;height:100px;border-top:1px solid white;position:absolute;top:50%;z-index:-10;left:-40px}#navigation{display:none}#spotlight{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:1rem 2rem;margin:1rem auto;width:92%;height:fit-content;text-align:left;box-shadow:0px 1px 3px 2px var(--primary-color);opacity:1;transform:scale(1);overflow:hidden;border:1px solid transparent;background:linear-gradient(var(--background-color),var(--background-color)) padding-box,linear-gradient(90deg,var(--primary-color),var(--secondary-color)) border-box}@media (max-width:767px){#spotlight{width:80dvw;max-width:78%}}#spotlight:before{content:"";position:absolute;width:0.2rem;height:calc(100% - 2rem);top:1rem;left:1rem;z-index:0;background:var(--primary-color);opacity:0.9}#spotlight h5{line-height:30px;margin:0;font-weight:600;color:var(--primary-color)}#spotlight-text{color:white;animation:fade-in .65s ease-in forwards}@keyframes fade-in{0%{opacity:0}100%{opacity:1}}.article{margin-bottom:30px;display:flex;flex-direction:column;padding-bottom:20px;border-bottom:1px dotted gray}.article-content{padding-top:12px;line-height:165%;letter-spacing:1px;color:white}.article-content a{text-decoration:underline}.article-content a:hover{text-decoration:none}#article-area{padding:1rem}.article-head{display:flex;justify-content:start;align-items:center;gap:1rem;margin-bottom:1rem}.title{padding:12px 0;position:relative;display:inline-flex;flex-grow:1;color:white;text-decoration:none;font-weight:600;font-size:1rem;transition:color 0.3s ease;h2{display:flex;justify-content:center;align-items:center}}.title a{font-size:1.4rem;font-weight:700;line-height:1.6rem;color:white;display:inline-block;padding:8px 10px;text-decoration:none}.title a::after{content:'';position:absolute;left:0;bottom:0;height:3px;width:0;background:linear-gradient(to right,var(--secondary-color),var(--primary-color));transition:width 0.4s ease;opacity:0}.title a:hover::after{width:100%;opacity:1;box-shadow:0 0 10px var(--primary-color)}.publish{flex-shrink:0;display:grid;grid-template-columns:repeat(2,1fr);gap:0.1rem;text-align:center;padding:0.2rem 0.6rem;background-color:var(--primary-color);font-size:0.95em;font-family:"Space Mono",monospace,"微軟正黑體";color:white;box-shadow:0 1px 3px rgba(0,0,0,0.1)}.publish .month,.publish .date{font-weight:500;color:white}.publish .date:before{content:"/";padding:0 4px 0 0;color:white}.publish .year{grid-column:1 / span 2;font-weight:500;font-size:1.6rem;color:white}.publish .day,.publish .time{display:none}.author,.author a{line-height:1rem;color:white}.author{float:right;font-size:.8rem}.author a img,.forward{display:none}.author a:nth-child(4):after,.reply-text{content:"\7de8\8f2f";color:var(--primary-color);padding-left:4px}.author a:nth-child(5):after{content:"\522a\9664";color:var(--primary-color);padding-left:4px}#article-main .article-footer{font-size:.9rem}.more{height:48px;text-align:right;position:relative}.more a{position:relative;display:inline-block;text-align:center;font-size:1rem;font-weight:bold;padding:0.8rem;width:1em;overflow:hidden;white-space:nowrap;background:var(--primary-color);color:transparent;transition:all .5s ease;text-decoration:none}.more a::before{content:'\2192';color:white;position:absolute;left:0;top:0;width:1em;padding:0.8rem;text-align:center;transition:opacity .3s ease}.more a:hover{width:auto;color:white;transform:translateY(-2px);background:linear-gradient(to left,var(--primary-color),var(--secondary-color));box-shadow:0 1px 3px rgba(0,0,0,0.1);text-decoration:none}.more a:hover::before{opacity:0}.article-keyword{margin:1rem 0 !important}.tag__header{font-size:0.9rem;font-weight:700;margin:0}.tag__main{display:flex;flex-wrap:wrap;gap:0.5em}.tag__main a{color:white;text-decoration:none;border:none}.tag__link{display:inline-block;padding:0.2rem 0.4rem;background:var(--primary-color);text-decoration:none;border-radius:2px;font-size:0.9rem;transition:background 0.3s ease,transform 0.2s ease}.article-keyword a:hover,.tag-container-parent .tag-container .tag:hover{opacity:1}.page{margin:10px auto;font-size:1rem;text-align:center}.page span{padding:0.2rem 0.6rem;color:white;background:var(--primary-color)}.page a{padding:0.2rem 0.6rem;margin:0 0.2rem;color:white;text-decoration:none}#search ul{margin:16px 0 0;border:1px solid #ccc;border-radius:24px;display:table;padding:0 1rem}#search li{display:table-cell;background:0;padding:0;border:none;margin:0;height:2rem}#search li:first-child{width:100%;max-width:fit-content}#search li:last-child{margin-right:8px}#search-target{margin-left:2px;width:100%;max-width:280px;box-sizing:border-box;height:32px;border:none;padding-left:30px;display:inline-block;background:url("data:image/svg+xml,%0A%3Csvg width='25' height='25' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='18.5' cy='18.5' r='17.5' stroke='%239B9B9B' stroke-width='2'/%3E%3Cpath d='M30.5 30.5L33.5 33.5' stroke='%239B9B9B' stroke-width='2'/%3E%3Crect x='35.6569' y='31.4142' width='17' height='6' rx='2' transform='rotate(45 35.6569 31.4142)' stroke='%239B9B9B' stroke-width='2'/%3E%3C/svg%3E%0A") left center no-repeat;background-color:var(--background-color);color:white}#search input#search-submit{border-radius:20px;letter-spacing:2px;border:none;display:inline-block;margin-top:5px;text-align:center;padding:0.2rem 1rem;transition:all 0.1s ease-in-out}#search input#search-submit:hover{background:var(--primary-color);cursor:pointer}#comment_text:focus,#search-target:focus{outline:0}.box{margin:0 0 1rem;box-shadow:0 4px 12px rgba(0,0,0,0.05);padding:1rem;font-weight:300}.box-title{font-size:1.5em;font-weight:bold;color:white;border-left:4px solid var(--primary-color);padding-left:0.5rem;margin-bottom:0.8rem;display:flex;align-items:center;justify-content:space-between}#announce li a,#last-article-box li a,#latest-comment .box-text ul li,#hot-article li{margin-bottom:0.2rem;padding:0.6rem 1rem;color:white}#announce li a,#last-article-box li a{text-decoration:none;color:white;font-size:0.9rem;display:flex;align-items:center;justify-content:start}#user-info .box-text.entry-content{display:flex;align-items:center;padding:1.5em;position:relative}.user-img{flex-shrink:0;margin-right:2rem;transition:transform 0.3s ease}.user-img:hover{transform:translateY(-2px)}.user-img img{width:100px;height:100px;border:1px solid var(--primary-color);object-fit:cover}#user-info .box-text dl{margin:0;padding:0;flex-grow:1}#user-info .box-text dt{font-weight:700;color:white}#user-info .box-text dd{margin:0 0 0.5rem 0;color:var(--side-text-color)}#user-info .user-action{position:absolute;top:-46px;right:0}#user-info-open-friends-iframe{color:var(--primary-color);text-decoration:none;margin-left:0.5rem;font-size:0.9rem}#user-info-open-friends-iframe:hover{color:var(--primary-color)}#latest-comment .box-text ul li,#latest-comment .box-text ul li span{font-weight:500;font-size:0.9rem}#latest-comment .box-text ul li span{color:white;font-weight:900}#latest-comment .box-text ul li a{text-decoration:none;color:white;font-size:0.9rem;font-weight:300;display:block}#latest-comment .box-text ul li a:hover{text-decoration:underline}#hot-article li{padding-left:1.8rem}#hot-article li a>:not(span){word-break:break-word}#hot-article li a{text-decoration:none;color:white;font-size:0.9rem;display:flex;align-items:start;justify-content:start;gap:0.2rem;line-height:1rem;position:relative}#hot-article span{display:none}#hot-article li a::before{content:"🔥";color:red;font-size:0.9rem;position:absolute;top:0;left:-1rem}#archive select{width:100%;padding:0.6rem 0.6rem;font-size:0.9rem}#archive .box-more{margin:0.6rem;font-size:.9rem;text-decoration:none;color:white}#archive .box-more a{text-decoration:none;color:white}#archive .box-more a:hover{color:var(--primary-color)}#category .inner-box,#mylink .inner-box{font-size:1rem;font-weight:normal;margin-bottom:0.2em;display:flex;flex-direction:column;justify-content:start;align-items:start;color:white;padding:0.1rem 1rem}#category .inner-box:hover,#mylink .inner-box:hover,.tag__link:hover,.page a:hover,#announce li a:hover,#last-article-box li a:hover,#latest-comment .box-text ul li:hover,#hot-article li:hover,#calendar td a:hover,body #newsfeed ul li:hover,.post-comment a:hover,#search input#search-submit:hover{background:var(--background-color);transition:all 0.3s ease-in-out;transform:scale(1);box-shadow:0 0 15px var(--primary-color);color:white;outline:2px solid transparent;outline-offset:4px;background-clip:padding-box;position:relative}.tag__link:hover::before,.page a:hover::before,#announce li a:hover::before,#last-article-box li a:hover::before,#hot-article li:hover::before,#calendar td a:hover::before,body #newsfeed ul li:hover::before,.post-comment a:hover::before,#search input#search-submit:hover::before,#mylink .inner-box:hover::before,#category .inner-box:hover::before,#latest-comment .box-text ul li:hover::before{content:"";position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));z-index:-1;border-radius:inherit;pointer-events:none}#category .inner-box ul,#mylink .inner-box ul{padding:0 1rem}#category .inner-box li,#mylink .inner-box li{padding:0;margin:0}#category ul li,#mylink ul li{font-size:0.9rem;margin:1rem 0}#category ul li a,#mylink ul li a{text-decoration:none;color:white;transition:all 0.3s ease}#category ul li a::before,#mylink ul li a::before{content:"•";color:white;margin-right:0.2rem;font-size:1rem}#category ul li a:hover,#mylink ul li a:hover{font-weight:900}#calendar table{width:100%;margin:0 auto}#calendar .current-month,#calendar .cal-backward,#calendar .cal-forward{font-weight:700;font-size:1.2rem}#calendar th,#calendar td{color:white;font:1rem Century Gothic;text-align:center;line-height:2rem;width:2rem}#calendar td{padding:0.2rem}#calendar td a{display:block;padding:0px 1px;background-color:var(--primary-color);color:white;transition:background-color 0.3s ease,transform 0.3s ease;text-decoration:none}#friendbox ul,#crumb ul,#visitor ul{overflow:hidden;height:auto !important}#friendbox li,#crumb li,#visitor li{float:left;margin:0.2rem;display:inline;line-height:0;padding:0}#friendbox li img,#crumb li img,#visitor li img{width:50px;height:50px;box-shadow:0 1px 3px 1px rgba(0,0,0,0.1);transition:transform 0.2s ease}#friendbox li img:hover,#crumb li img:hover,#visitor li img:hover{transform:translateY(-2px);box-shadow:0 0 15px var(--primary-color);outline:1px solid white}#friendbox ul.friendlist li{margin:0.2rem 2px}body #newsfeed ul li{text-align:left;padding:0.4rem 0.6rem;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis;font-family:'Noto Sans TC','微軟正黑體',sans-serif !important;border-bottom:1px dotted gray}body #newsfeed .newsfeed-photo img{border:1px solid var(--primary-color);height:30px;width:30px;padding:1px;background:white}body #newsfeed ul span.update-link a{color:white}body #newsfeed ul li .newsfeed-author a{color:white;text-decoration:none}body #newsfeed a.show-all-newsfeed{font-size:1rem;text-decoration:none;color:white;display:inline-flex}body #newsfeed{text-align:center}body #newsfeed a.show-all-newsfeed:hover{color:var(--primary-color)}#footer{clear:both;text-align:center;min-height:20dvh;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}#footer p{margin:0 0 1rem 0;font-size:1rem;font-weight:500}#bottom{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0.1rem;font-size:0.8rem;font-weight:300}#bottom a{color:white;text-decoration:none;transition:color 0.3s ease}#bottom a:hover{color:var(--primary-color)}@media (max-width:767px){#main{flex-direction:column;width:90vw;padding:0 1rem;max-width:80%}#content{width:100%;padding-right:0}#links{width:100%}}@media (min-width:768px) and (max-width:1024px){#main{flex-direction:column;max-width:90vw;padding:0 1rem}#content{width:100%}#links{width:100%}}@media (min-width:1025px){#main{padding:0 1rem;max-width:1300px}#content{width:100%;max-width:70%}#links{width:100%;margin-top:-2rem}}.author-profile .author-profile__main{max-width:100% !important;background-color:var(--background-color) !important}.article-footer:has(.history){padding:1.5em;border-radius:8px;font-size:14px;line-height:1.6}.history h6{margin:1rem 0 0.5rem;padding-top:1rem;font-size:0.9rem;font-weight:500}.history li{margin:0.5rem 0;align-self:baseline}.history li img{display:none}.history li a{color:white;text-decoration:none}.history li a:hover{color:var(--primary-color)}#comment-title{min-height:3rem;display:flex;justify-content:center;align-items:center;font-weight:700}.post-comment{margin:1rem auto 0 auto;width:fit-content}.post-comment a{padding:0.4rem 2rem;text-decoration:none;transition:0.5s;color:white;text-shadow:0px 0px 10px rgba(0,0,0,0.2);box-shadow:0 0 5px white;border-radius:4px;background-color:var(--primary-color)}#comment-text:has(.single-post){padding:15px;margin:1rem 0}#comment-text .single-post{list-style:none;padding:1rem;border-bottom:1px dotted gray;content:"";display:table;clear:both;width:95%}#comment-text .single-post li{margin-bottom:10px}#comment-text .post-info{position:relative;font-size:1rem;color:white;display:flex;justify-content:start;align-items:center;flex-wrap:wrap;gap:0.6rem}#comment-text .post-info .floor{position:absolute;right:0;top:0;font-size:1.2rem;color:var(--primary-color);@media (max-width:767px){position:relative}}#comment-text .post-info .user-name img{display:none !important}#comment-text .post-info .user-name,#comment-text .post-info .user-name a{color:var(--primary-color)}#comment-text .post-info .user-name a{text-decoration:none}#comment-text .post-photo{float:left;width:fit-content;@media (max-width:767px){float:none}}#comment-text .post-photo img{width:80px;height:80px}#comment-text .post-text{align-content:center;height:fit-content;min-height:80px;padding:0 1rem}#comment-text .reply-text{text-align:right}#comment-text .reply-text:has(p){text-align:left;margin-left:96px;padding:0.5rem 1rem;color:white;outline:1px dotted var(--primary-color)}#comment-text .reply-text p{padding:10px;margin:0;text-align:right}#comment-text .reply-text p a{color:white;text-decoration:none}#comment-area-2{margin:0 auto;color:var(--background-color)}@media (max-width:767px){#comment-text .reply-text:has(p){margin-left:0px;padding:0.6rem 1rem;text-align:left}#comment-area{max-width:90%;overflow-x:scroll}}#article-box .main-list{margin:2rem auto;max-width:100%;padding:0;overflow:hidden}.main-list table{width:100%;border-collapse:collapse;table-layout:fixed}.main-list th,.main-list td{padding:0.4rem 1rem;text-align:left;border-bottom:1px dotted white;vertical-align:middle}.main-list th{color:white;font-weight:700;font-size:1rem;text-align:center}.main-list tr:hover{outline:1px dotted var(--primary-color)}.list-date{width:5rem;font-size:0.9rem;color:white;border-right:1px dotted white}.list-title a{font-size:0.9rem;text-decoration:none;color:white;margin-right:8px;word-break:break-word}.list-title a:hover{color:var(--primary-color)}.list-visit,.list-comment{width:40px;margin:0 auto;font-size:0.8rem;text-align:right;color:white}@media (max-width:767px){#article-box .main-list{overflow:visible;border:none;box-shadow:none}.main-list table,.main-list thead,.main-list tbody,.main-list th,.main-list td,.main-list tr{display:block;width:100%}.main-list tbody{display:flex;flex-direction:column;gap:1rem;width:95%}.main-list tr{border:1px solid #ddd;padding:12px;box-shadow:0 2px 6px rgba(0,0,0,0.05)}.main-list th,.main-list tr:first-child{display:none}.main-list td{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border:none;font-size:0.9rem}.main-list td::before{content:attr(class);text-transform:capitalize;font-weight:bold;color:#888;flex:1}.list-title a{word-break:break-word;display:inline-block;max-width:70%}#content{border-bottom:1px solid white}}#side_gb{width:auto;box-shadow:0 4px 12px rgba(0,0,0,0.05);-webkit-box-shadow:0 4px 12px rgba(0,0,0,0.05)}#side_gb_content,#side_gb_article{width:90%}#side_gb_article .gb_text,#side_gb_article .gb_title{width:100%}#side_gb .button-arrow{display:none}#side_gb_btn{position:relative;left:30%}#side_gb_btn a{text-decoration:none}#side_gb_btn .button{text-shadow:none;height:auto;transition:background-color 0.3s ease,transform 0.3s ease;text-decoration:none}#side_gb_btn .button:hover{background:linear-gradient(to left,var(--primary-color),var(--secondary-color));transform:translateY(-2px)}#side_gb_content{margin-left:-50%;padding:0.5rem 1rem}.gb_photo img{width:50px;height:50px;border-radius:50%;border:1px solid var(--primary-color);box-shadow:0 1px 1px 1px rgba(0,0,0,0.05)}.gb_account,.gb_date{margin-left:1rem}summary{cursor:pointer}summary:hover{color:var(--primary-color)}.themeTable{width:100%;border-collapse:collapse;background-color:#1a1a1a;color:white;border-radius:8px;overflow:hidden;box-shadow:0 0 15px rgba(187,134,252,0.2);thead{background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));color:#000}thead th{padding:0.6rem 1rem;text-align:left;font-weight:bold}tbody tr{transition:background 0.3s ease,box-shadow 0.3s ease}tbody tr:nth-child(even){background-color:#181818}tbody tr:hover{background-color:var(--background-color);outline:1px solid transparent;position:relative}td{padding:0.75rem 1rem;border-bottom:1px solid rgba(255,255,255,0.05)}}.pixnavbar{background-color:var(--primary-color)!important;}