/* Shared accents and direct contact controls. */
.text-mark{color:#f4e4cd;background:linear-gradient(transparent 28%,rgba(233,154,81,.20) 28%,rgba(233,154,81,.20) 94%,transparent 94%);padding:0 .1em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.text-mark.cool{color:#d4e7f7;background:linear-gradient(transparent 28%,rgba(120,179,219,.17) 28%,rgba(120,179,219,.17) 94%,transparent 94%)}
.telegram-button{display:inline-flex;align-items:center;justify-content:center;gap:14px;padding:12px 19px;min-height:44px;border:1px solid #c8dce433;border-radius:999px;background:linear-gradient(120deg,#d4e4f011,#d4e4f003);color:#edece8;font-size:12px;line-height:1.35;text-decoration:none;cursor:pointer;transition:border-color .2s,background-color .2s}
.telegram-button:hover{border-color:#e5b18377;background-color:#c8996910}
.telegram-button:focus-visible,.telegram-qr:focus-visible{outline:2px solid #eab583;outline-offset:5px}
.telegram-button .arrow-icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5}
.telegram-button-large{font-size:23px;padding:17px 25px}
.hero-method{font-size:12px;line-height:1.8;color:#a8b2bd;margin:0 0 18px}
.hero-proof{margin-bottom:0}
#canvas .contact-node.contact-action{display:flex;align-items:center;justify-content:center;gap:24px;width:min(650px,100%);min-height:112px;padding:28px 36px;text-align:center;border-radius:28px}
.contact-action-title{position:relative;z-index:2;font-size:34px;line-height:1.2;letter-spacing:-1px}
#canvas .contact-action>.arrow-icon{position:relative;z-index:2;width:27px;height:27px}
.ai-overview{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:stretch;margin-bottom:26px}
.ai-overview .ai-page-intro{display:flex;flex-direction:column;justify-content:center;max-width:none;margin:0;padding:34px;border-color:#c8dce444;background:linear-gradient(125deg,#0d1724ed,#0b131de3)}
.ai-page .ai-overview h1{font-size:54px;line-height:1.09;letter-spacing:-2px;margin:0 0 28px}
.ai-page .ai-overview p{font-size:14px;line-height:1.8;margin:0 0 18px}
.ai-page .ai-overview p:last-child{margin-bottom:0}
.tool-board{padding:26px 24px;border:1px solid #c8dce442;border-radius:24px;background:radial-gradient(ellipse at 25% 12%,#df995e1b,transparent 62%),radial-gradient(ellipse at 88% 90%,#7ab8dd1a,transparent 65%),#0b141ee8;display:flex;flex-direction:column;justify-content:center}
.tool-board-heading{margin:0 0 22px}
.ai-page .tool-board-heading h2{font-size:17px;letter-spacing:-.3px;line-height:1.35;margin:0 0 7px}
.ai-page .tool-board-heading p{color:#8f9daa;font-size:11px;margin:0}
.tool-board-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.tool-tile{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;min-width:0;min-height:76px;padding:11px 5px;border:1px solid #c8dce41c;border-radius:14px;background:linear-gradient(145deg,#b9d4e509,#080f1755);box-shadow:inset 0 1px 0 #d6ebf00a}
.tool-tile:nth-child(-n+4){border-color:#db9c6444;background:linear-gradient(145deg,#a6743c16,#080f1755)}
.tool-tile>img{width:30px;height:30px;object-fit:contain;filter:invert(1)}
.tool-tile>span{font-size:9px;line-height:1.2;color:#bfc8d1;text-align:center;white-space:nowrap}
.tool-tile .app-mark{display:grid;place-items:center;width:30px;height:30px;font-size:15px;background:#191042;color:#c4adff;border:1px solid #8163b750;border-radius:7px}
.tool-tile .app-mark.ps{background:#001e36;color:#48bbff;border-color:#1b638c66}
.ai-page-grid article{padding:28px;background:linear-gradient(150deg,#112033df,#0c1420eb);border-color:#a6c3da32}
.ai-page-grid h2{font-size:26px;line-height:1.18;letter-spacing:-.8px;margin:0 0 22px;max-width:260px}
.ai-page-grid p{font-size:14px;line-height:1.85;margin:0}
.ai-page .ai-contact{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center;padding:30px 34px;margin-top:28px;background:#0b1420e6}
.ai-contact p{max-width:440px;margin:19px 0 0}
.telegram-qr{display:flex;flex-direction:column;align-items:center;gap:10px;color:#bdc8d3;text-decoration:none}
.telegram-qr img{display:block;background:#fff;border-radius:14px;width:148px;height:148px;padding:8px}
.telegram-qr span{font-size:12px}
.compact-tools{margin:18px 0 26px;gap:8px}
.compact-tools .tool-tile{min-height:74px}
#detail-content .telegram-button{margin:20px 0 2px;color:#f2dfcb;font-size:14px}
@media(max-width:960px){.ai-overview{grid-template-columns:minmax(0,1fr)}.tool-board-grid{grid-template-columns:repeat(8,minmax(0,1fr))}.tool-board{padding:24px}.ai-page .ai-overview h1{font-size:52px}.ai-page-grid{grid-template-columns:1fr}.ai-page-grid h2{max-width:none}}
@media(max-width:600px){.ai-page{padding:24px 16px 46px}.ai-overview{gap:18px}.ai-overview .ai-page-intro{padding:26px 24px}.ai-page .ai-overview h1{font-size:42px;letter-spacing:-1.5px}.ai-page .ai-overview p{font-size:15px}.tool-board{padding:22px 18px}.tool-board-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.tool-tile{min-height:76px}.ai-page-grid{gap:18px}.ai-page-grid article{padding:25px 24px}.ai-page-grid p{font-size:15px}.ai-page .ai-contact{grid-template-columns:1fr;gap:25px;padding:26px 24px}.telegram-button-large{font-size:19px;padding:16px 21px}.telegram-qr{justify-self:start;flex-direction:row;gap:18px}.telegram-qr img{width:124px;height:124px}.telegram-qr span{font-size:13px}.compact-tools{grid-template-columns:repeat(3,minmax(0,1fr))}header .telegram-button{font-size:10px;padding:8px 13px;min-height:38px}.hero-proof{margin-bottom:0}}
@media(prefers-reduced-motion:reduce){.telegram-button{transition:none}}
.telegram-button,.ai-page-contact .telegram-button{color:#f0d4bb}
@media(max-width:600px){.ai-page .ai-overview h1{font-size:clamp(34px,10.5vw,42px)}}
/* Equal tool tiles, clearer typography, and a complete closing contact. */
.tool-board{justify-content:center;padding:24px;background:#0d1723e8}
.tool-board-heading{margin-bottom:18px}
.tool-board-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}
.tool-tile,.tool-tile:nth-child(-n+4){min-height:59px;padding:9px 4px;gap:7px;border:1px solid #c8dce41c;border-radius:10px;background:#c8dce405;box-shadow:none}
.tool-tile>img,.tool-tile .app-mark{width:22px;height:22px}
.tool-tile .app-mark{font-size:11px;border-radius:5px}
.tool-tile>span{font-size:8px}
.text-mark,.text-mark.cool{color:inherit;background:linear-gradient(transparent 25%,#c9874933 25%,#c9874933 94%,transparent 94%)}
#canvas{padding-top:46px}
#about .hero-description,#about .hero-detail,#about .hero-method,#about .hero-proof{font-size:15px;line-height:1.7;color:#d0d6dc;margin:0 0 18px;max-width:none}
#about .hero-description{font-size:17px}
#about .hero-proof{margin-bottom:0}
.intro-stage .ai-node{margin-top:62px}
.ai-top-contact{position:absolute;top:-62px;right:0;width:100%;height:44px;min-height:44px;box-sizing:border-box;z-index:4}
.ai-top-contact svg{width:17px;height:17px}
#ai .node-content{padding:28px;gap:20px;justify-content:center}
#ai h2{font-size:28px;line-height:1.16}
.ai-section-icon{width:35px;height:35px;fill:none;stroke:#caa585;stroke-width:1.25;flex:none}
#ai .ai-detail-link::after{display:none}
#canvas .project .node-bar{justify-content:space-between;gap:14px}
.project-category{font-size:9px;line-height:1.4;text-align:right;color:#c1cbd5;max-width:55%}
#canvas .project .project-overlay{display:none}
#canvas .project .case-description{padding:22px}
#canvas .project .case-description h3{font-size:24px;line-height:1.2;letter-spacing:-.6px;font-weight:400;margin:0 0 13px}
#canvas .project .case-description>p{min-height:0;margin:0;color:#bdc8d2}
#canvas .contact-footer{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:55px;width:100%;min-height:290px;margin:80px 0 0;padding:42px 46px;text-align:left;border-radius:28px}
#canvas .contact-footer-copy{position:relative;z-index:2;max-width:650px}
#canvas .contact-footer h2{font-size:43px;font-weight:400;letter-spacing:-1.6px;line-height:1.15;margin:0 0 14px}
.contact-footer h2 span{color:#e8a265}
#canvas .contact-footer p{font-size:15px;line-height:1.7;color:#c1cbd5;margin:0 0 20px}
#canvas .contact-footer .contact-footer-role{font-size:12px;margin-bottom:14px;color:#c1cbd5}
#canvas .contact-footer .telegram-qr{position:relative;z-index:2}
.contact-footer .telegram-button{margin-top:8px}
.gallery-track{overflow-x:auto;scrollbar-width:none;gap:8px}
.gallery-track::-webkit-scrollbar{display:none}
.gallery-track .gallery-card{flex-shrink:0!important}
.gallery-track .gallery-content button{pointer-events:auto}
.gallery-project-link{border:1px solid #d8e5f333;padding:11px 14px;border-radius:30px;cursor:pointer;background:#d8e5f309;color:#f0d4bb}
.gallery-tab>span:first-child{max-height:85%;overflow:hidden}
.spec-badge{display:inline-block;font-size:10px;line-height:1.4;border:1px solid #c4977155;padding:4px 8px;border-radius:6px;color:#eed3b8;margin:0 0 12px 10px}
#project-player{width:min(1000px,90vw);max-height:90svh;overflow:auto;overscroll-behavior:contain;border:1px solid #adbacb55;border-radius:22px;padding:24px;background:#0e1722;color:#eef0f3;box-shadow:0 30px 100px #000b}
#project-player::backdrop{background:#030609e8}
.player-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px}
.player-heading h2{font-size:23px;font-weight:400;margin:0}
.player-heading button{font:inherit;cursor:pointer;border:1px solid #adbacb33;border-radius:30px;padding:12px 18px;color:inherit;background:#adbacb0c}
#player-video{display:block;width:100%;max-height:65svh;object-fit:contain;background:#000;border-radius:10px}
#player-category{font-size:13px;color:#bdc8d4;margin:20px 0 0}
.player-open{overflow:hidden}
.detail-video{width:100%;aspect-ratio:16/9;object-fit:contain;background:#000;border-radius:10px;margin-bottom:20px}
.panel-category{position:absolute;left:14px;bottom:12px;z-index:1;font-size:8px;color:#dce4eb;line-height:1.35}
#gallery-cards .panel-category{font-size:11px;left:20px;bottom:16px}
#gallery-cards .project-panel .panel-title{bottom:45px}
.contact-card-qr{position:absolute;right:14px;top:18px;width:49px;height:49px;padding:3px;border-radius:5px;background:#fff}
.deck .contact .panel-title{font-size:23px!important;max-width:65%;top:30px}
.deck .contact .panel-foot{max-width:85%;font-size:8px!important}
#detail-content .profile-copy>p:not(.lead){font-size:16px;color:#c9d2db;line-height:1.7}
@media(max-width:960px){.tool-board-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:600px){.tool-board-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.tool-tile,.tool-tile:nth-child(-n+4){min-height:60px}.tool-board{padding:24px 18px}.tool-tile>span{font-size:9px}#detail-content .compact-tools{grid-template-columns:repeat(4,minmax(0,1fr))}}

#about .hero-description,#about .hero-detail,#about .hero-method,#about .hero-proof{font-size:16px}

#canvas .contact-footer h2{color:#eef1f3}
.deck .featured-entry{background:linear-gradient(145deg,#4b3526,#151c24 80%)}
.deck .featured-entry .panel-title{font-size:23px;line-height:1.15}
.deck .gallery-entry .panel-title{font-size:21px;line-height:1.13;max-width:90%}
.deck .gallery-entry .panel-foot{display:none}
.deck .card:not(.project-panel) .panel-title{font-weight:400}

/* Crisp project labels and readable AI introduction. */
.gallery-track .gallery-card{filter:none!important}
.gallery-tab>span:first-child{font-size:12px;color:#d8e1e9;text-shadow:none;font-weight:400;filter:none}
#ai .node-content{gap:22px;padding:30px}
#ai h2{font-size:34px;line-height:1.12;letter-spacing:-1.1px}
#ai .node-content>p:not(.eyebrow){font-size:16px;line-height:1.7;color:#cbd3dc}
#ai .ai-detail-link{font-size:14px;line-height:1.5;margin-top:2px}
#ai .ai-section-icon{width:38px;height:38px}

.gallery-tab>span:first-child{left:min(17px,max(5px,calc(50% - 9px)));font-size:13px;font-weight:500}

/* Thin gradient rims and a small interior highlight, without backdrop filters. */
#canvas .node{border-color:transparent;box-shadow:inset 0 1px 1px rgba(255,255,255,.25),0 18px 45px #0006}
#canvas .node::before{padding:1px;background:linear-gradient(135deg,#d9eaf58c 0%,#d9eaf51f 35%,#ffffff0d 60%,#e7b98c66 100%)}
.deck .card,#gallery-cards .card{border-color:transparent;box-shadow:inset 0 1px 1px rgba(255,255,255,.25),0 -19px 24px #000c,0 -5px 9px #0009,0 9px 18px #0008}
.deck .card::before,#gallery-cards .card::before,.ai-page-intro::before,.tool-board::before,.ai-page-grid article::before,.ai-page .ai-contact::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,#d9eaf58c,#d9eaf51f 35%,#ffffff0d 60%,#e7b98c66);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:6}
.ai-page-intro,.tool-board,.ai-page-grid article,.ai-page .ai-contact{position:relative;border-color:transparent;box-shadow:inset 0 1px 1px rgba(255,255,255,.25)}

/* Clear, consistent emphasis and explicit social destinations. */
.text-mark,.text-mark.cool{color:#21170f;background:#edba85;padding:0 .14em;border-radius:2px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.social-links{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.social-links .telegram-button{margin-top:0}
.contact-card-links{position:absolute;left:5.5%;right:5.5%;bottom:8%;display:flex;gap:9px;z-index:2}
.contact-card-links a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 13px;border:1px solid #d8e5f34d;border-radius:999px;color:#f0d4bb;font-size:clamp(11px,3vw,15px);line-height:1.2;background:#d8e5f30b}
.contact-card-links a:hover{background:#d8e5f31c}
.deck .contact .panel-open{display:none}

/* Put teaching and the current role at the start of career details. */
.experience-summary:has([aria-expanded="true"]){height:auto}
.experience-summary .experience-toggle{height:78px}
.experience-training-intro{display:none;padding:0 24px 24px;position:relative;z-index:2}
.experience-summary:has([aria-expanded="true"]) .experience-training-intro{display:block}
.experience-training-intro h3{font-size:16px;font-weight:400;margin:0 0 9px}
.experience-training-intro p{font-size:12px;line-height:1.65;color:#c1cbd5;margin:0}
#detail-content .experience-training h3{margin:6px 0 9px}
#detail-content .experience-training p{margin:0 0 20px}
#detail-content .experience-role h3{margin:24px 0 8px}
#detail-content .experience-role .detail-role{color:#edc6a4;margin:0 0 8px}
#detail-content .experience-role p:last-child{margin:0}
