/* Native adaptations of the supplied motion references. No extra WebGL runtime. */
.hub-metal{position:relative}
.hub-metal-surface{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 8%,#ffffff14 29%,transparent 46%,#ffffff24 60%,transparent 82%);background-size:220% 100%;background-position:90% 0;transition:background-position .65s ease}
.hub-metal:focus-visible{outline:2px solid var(--acc,#c8922a);outline-offset:4px}
@media(hover:hover){.hub-metal:hover>.hub-metal-surface{background-position:10% 0}}
.hub-metal:active>.hub-metal-surface{background-position:35% 0}
.hub-scan-host{isolation:isolate}
.hero.hub-scan-host>.hub-scanner,.aura.hub-scan-host>.hub-scanner{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:.22;mask-image:linear-gradient(90deg,transparent,#000 65%,transparent);border-radius:inherit}
.hub-scanner::before{content:'';position:absolute;inset:-40%;background:repeating-linear-gradient(168deg,transparent 0 15px,color-mix(in srgb,var(--acc,#c8922a) 25%,transparent) 16px,transparent 17px 28px);transform:rotate(-8deg);mask-image:linear-gradient(180deg,transparent,#000,transparent)}
.hub-scanner::after{content:'';position:absolute;inset:-20%;background:linear-gradient(110deg,transparent 35%,color-mix(in srgb,var(--acc,#c8922a) 34%,transparent) 49%,#ffffff08 50%,transparent 61%);transform:translateX(-85%)}
.hub-scanner.hub-scan-run::after{animation:hubScanSweep 9s ease-in-out 1 both}
@keyframes hubScanSweep{0%{transform:translateX(-85%);opacity:0}20%,70%{opacity:1}100%{transform:translateX(85%);opacity:0}}
.hub-edge-blur{position:absolute;left:0;right:0;bottom:100%;height:22px;pointer-events:none!important;overflow:hidden;mask-image:linear-gradient(transparent,#000);z-index:-1}
.hub-edge-blur i{position:absolute;inset:0;pointer-events:none;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);mask-image:linear-gradient(transparent,#000 70%)}
.hub-edge-blur i:nth-child(2){top:35%;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.hub-edge-blur i:nth-child(3){top:70%;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.hub-fx-paused .hub-scanner::after{animation-play-state:paused}
.hub-fx-off .hub-scanner,.hub-fx-off .hub-edge-blur{display:none}
.hub-fx-off .hub-metal{background-image:none;transition:none}
.hub-fx-off .hub-metal-surface{display:none}
.hub-fx-light .hub-scanner::after{animation:none}
.hub-fx-light .hub-edge-blur{display:none}
@media(max-width:600px){.hub-scanner{opacity:.14!important}.hub-edge-blur{height:14px}.hub-edge-blur i:nth-child(3){display:none}}
@media(prefers-reduced-motion:reduce){.hub-scanner,.hub-metal-surface{display:none}.hub-metal{transition:none}}
@supports not (backdrop-filter:blur(2px)){.hub-edge-blur{background:linear-gradient(transparent,var(--bg,#0b0c0f))}}

/* 21st references: Gradient Borders Button (emerald-ui) / Pill Morph Tabs.
   Native implementation, business palette, no imported React or shader runtime. */
.acmais.hub-options{border:0;background:none;overflow:visible}
.acmais.hub-options>summary{position:relative;min-height:48px;border:1px solid transparent;border-radius:var(--r-pill,99px);color:var(--ice);background:linear-gradient(var(--pit),var(--pit)) padding-box,radial-gradient(ellipse 170px 70px at var(--hub-glow-x,50%) var(--hub-glow-y,50%),color-mix(in srgb,var(--acc) 78%,#fff),color-mix(in srgb,var(--acc) 22%,var(--edge-soft)) 80%) border-box;box-shadow:inset 0 1px 0 #ffffff08;transition:box-shadow .24s ease,color .24s ease}
.acmais.hub-options>summary span{position:relative;z-index:1}
.acmais.hub-options>summary:focus-visible{outline:2px solid var(--acc);outline-offset:4px}
.acmais.hub-options[open]>summary{border-bottom:1px solid transparent;box-shadow:0 4px 18px color-mix(in srgb,var(--acc) 9%,transparent)}
.hub-options>.aclist{margin-top:10px;border:1px solid var(--edge-soft);border-radius:var(--r-s);overflow:hidden;background:var(--pit)}
.hub-protection .field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;min-width:0}
.hub-protection .field label{font-size:var(--fs-sm);font-weight:600;color:var(--fog)}
.hub-protection input,.hub-protection select{width:100%;min-width:0;font-size:max(16px,var(--fs-sm))}
.prot-clockboard{padding:16px;border:1px solid color-mix(in srgb,var(--acc) 22%,var(--line));border-radius:22px;margin:18px 0;background:linear-gradient(135deg,color-mix(in srgb,var(--acc) 5%,var(--carbon)),var(--pit));box-shadow:inset 0 1px 0 #ffffff09}
.prot-clockhead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.prot-clockhead h3{margin:0;font:650 var(--fs-md)/1.2 var(--ff-b);color:var(--ice);letter-spacing:-.02em}
.prot-step{color:var(--fog);font:600 var(--fs-xs)/1 var(--ff-b);border:1px solid var(--edge);border-radius:99px;padding:7px 9px;white-space:nowrap}
.prot-period+.prot-period{margin-top:18px}.prot-period h4{margin:0;display:flex;align-items:center;gap:8px;color:var(--fog);font:500 var(--fs-xs)/1.3 var(--ff-b)}
.prot-period h4:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,var(--edge),transparent)}
.hub-protection .prot-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0 0}
.hub-protection .prot-slots .prot-slot{min-height:56px;border:1px solid color-mix(in srgb,var(--fog) 26%,var(--edge));background:linear-gradient(150deg,var(--carbon),var(--pit));color:var(--ice);border-radius:14px;font:650 max(14px,var(--fs-sm))/1.2 var(--ff-b);font-variant-numeric:tabular-nums;box-shadow:inset 0 1px 0 #ffffff0a,0 2px 4px #0002;transition:transform 140ms var(--ease-out),border-color 180ms ease,box-shadow 180ms ease;overflow:hidden;isolation:isolate}
.prot-slot:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(100px 70px at var(--hub-glow-x,50%) var(--hub-glow-y,0),color-mix(in srgb,var(--acc) 15%,transparent),transparent);opacity:0;transition:opacity 180ms ease}
.prot-time{position:relative;z-index:1}.prot-slot-check{position:absolute;right:4px;top:4px;width:14px;height:14px;border-radius:50%;display:grid;place-items:center;background:var(--acc);color:var(--acc-ink);opacity:0;transform:scale(.8);transition:opacity 160ms ease,transform 180ms var(--ease-out)}
.prot-slot-check svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hub-protection .prot-slots .prot-slot.on{border-color:transparent;background:linear-gradient(145deg,color-mix(in srgb,var(--acc) 21%,var(--carbon)),color-mix(in srgb,var(--acc) 10%,var(--pit))) padding-box,linear-gradient(130deg,color-mix(in srgb,var(--acc) 64%,#fff),var(--acc),color-mix(in srgb,var(--acc) 42%,var(--edge))) border-box;box-shadow:inset 0 1px 0 #ffffff18,0 3px 12px color-mix(in srgb,var(--acc) 9%,transparent)}
.prot-slot.on .prot-slot-check{opacity:1;transform:none}.prot-slot.on:before{opacity:.7}
.prot-slot:after{content:'';position:absolute;left:8px;right:8px;top:1px;height:1px;background:linear-gradient(90deg,transparent,#ffffff3a,transparent);pointer-events:none}
.prot-modes.hub-liquid-ready{position:relative;isolation:isolate;padding:5px;gap:4px;border:1px solid var(--edge);background:linear-gradient(130deg,#ffffff08,transparent),var(--pit)}
.prot-modes .hub-liquid-pill{background:linear-gradient(145deg,color-mix(in srgb,var(--acc) 22%,var(--slab)),color-mix(in srgb,var(--acc) 10%,var(--pit)));box-shadow:inset 0 1px 0 #ffffff25,inset 0 0 0 1px color-mix(in srgb,var(--acc) 55%,var(--edge)),0 4px 12px #0003}
.prot-modes.hub-liquid-ready>button{position:relative;z-index:1;font-size:max(12px,var(--fs-xs));transition:color 160ms ease}
.prot-modes.hub-liquid-ready>button.on{background:none;color:var(--ice)}
.hub-fx-off .prot-modes.hub-liquid-ready>button.on{background:var(--slab);box-shadow:inset 0 0 0 1px var(--acc)}
.hub-protection .prot-slots .prot-slot:focus-visible{outline:2px solid var(--ice);outline-offset:3px;border-color:var(--acc)}
.hub-protection .prot-slots .prot-slot:active{transform:scale(.97)}
.prot-slot:disabled{opacity:.5;cursor:wait}
.prot-selection{margin-top:18px;border-top:1px solid var(--edge);padding-top:14px;color:var(--fog)}
.prot-selection-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px}.prot-selection-title strong{font:600 var(--fs-xs)/1.4 var(--ff-b);color:var(--ice)}.prot-selection-title>span{font-size:var(--fs-xs)}
.prot-ranges{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.prot-ranges:empty{display:none}
.prot-ranges>span{display:flex;align-items:center;gap:8px;font:600 var(--fs-xs)/1 var(--ff-b);font-variant-numeric:tabular-nums;padding:9px 11px;border-radius:99px;background:color-mix(in srgb,var(--acc) 9%,var(--pit));border:1px solid color-mix(in srgb,var(--acc) 24%,var(--edge));color:var(--ice)}.prot-ranges i{font-style:normal;color:var(--steel)}
.prot-clear{display:block;margin-top:8px;min-height:44px;padding:8px 0;color:var(--fog);font:500 var(--fs-xs)/1.3 var(--ff-b);text-decoration:underline;text-underline-offset:4px}.prot-clear:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:6px}
@media(hover:hover) and (pointer:fine){.hub-protection .prot-slots .prot-slot:hover{border-color:var(--acc);transform:perspective(500px) rotateX(var(--prot-tilt-x,0deg)) rotateY(var(--prot-tilt-y,0deg)) translateY(-2px);box-shadow:inset 0 1px 0 #ffffff20,0 7px 0 -4px color-mix(in srgb,var(--acc) 14%,var(--edge)),0 9px 18px #0004}.prot-slot:hover:before{opacity:1}}
@media(max-width:350px){.prot-clockboard{padding:12px}.hub-protection .prot-slots{grid-template-columns:repeat(3,minmax(0,1fr))}}
.hub-fx-off .prot-slot,.hub-fx-light .prot-slot{transition:none!important;transform:none!important}.hub-fx-off .prot-slot:before,.hub-fx-light .prot-slot:before{display:none}.hub-fx-off .prot-slot-check,.hub-fx-light .prot-slot-check{transition:none}
@media(prefers-reduced-motion:reduce){.hub-protection .prot-slot,.prot-slot:before,.prot-slot-check{transition:none!important;animation:none!important;transform:none!important}}
.hub-protection .segm{margin-top:12px}.hub-protection .segm button{min-height:48px}
.clih-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:16px 0}
.clih-stats>div{padding:12px 8px;background:var(--pit);border:1px solid var(--edge-soft);border-radius:var(--r-s)}
.clih-stats strong{display:block;color:var(--acc);font:700 var(--fs-xl)/1.1 var(--ff-b);font-variant-numeric:tabular-nums}
.clih-stats span{display:block;margin-top:6px;color:var(--fog);font-size:var(--fs-xs);line-height:1.35}
.hub-protection textarea{width:100%;font-size:max(16px,var(--fs-sm));resize:vertical}
.hub-chip>.hub-thumb{display:grid;place-items:center;width:30px;height:30px;flex:none;overflow:hidden;background:transparent}
.hub-thumb>img{width:100%;height:100%;object-fit:contain;display:block}
.hub-thumb.redonda{border-radius:50%;background:var(--pit)}
.hub-thumb.redonda>img{border-radius:50%;object-fit:contain}
.hub-thumb.figurinha{overflow:visible}
.hub-thumb-icon{border-radius:50%;background:color-mix(in srgb,var(--acc) 12%,var(--pit))!important}
.hub-thumb-icon .sico,.hub-thumb-icon .semfoto{display:grid;place-items:center;width:24px!important;height:24px!important;position:static!important;padding:0!important;margin:0!important;background:none!important}
.hub-thumb-icon svg{width:21px!important;height:21px!important}
.agprofs.hub-liquid-ready{position:relative;isolation:isolate;gap:4px;padding:4px;border:1px solid var(--edge-soft);border-radius:99px;background:var(--pit)}
.hub-liquid-pill{position:absolute;z-index:0;pointer-events:none;border-radius:99px;background:linear-gradient(130deg,color-mix(in srgb,var(--acc) 82%,#fff),var(--acc));box-shadow:inset 0 1px 0 #ffffff40,0 2px 8px color-mix(in srgb,var(--acc) 16%,transparent)}
.agprofs.hub-liquid-ready>button{position:relative;z-index:1;min-height:44px;background:none;border-color:transparent;transition:color .2s}
.agprofs.hub-liquid-ready>button.on{background:none;border-color:transparent;color:var(--acc-ink)}
.agprofs>button:focus-visible{outline:2px solid var(--acc);outline-offset:-3px}
.hub-fx-off .hub-liquid-pill{display:none}
.hub-fx-off .agprofs.hub-liquid-ready>button.on{background:var(--acc)}
.hub-fx-off .acmais.hub-options>summary{background:var(--pit);border-color:var(--edge);box-shadow:none;transition:none}
@media(hover:hover){.hub-options>summary:hover{box-shadow:0 3px 20px color-mix(in srgb,var(--acc) 12%,transparent)}}
@media(prefers-reduced-motion:reduce){.hub-options>summary,.agprofs.hub-liquid-ready>button{transition:none!important}}
/* Work showcase: native glass, finite entrance, confirmation-only heart burst. */
.mt-feed,.mt-admin-list,.mt-editor-preview{--card:var(--carbon);--ink:var(--ice);--mut:var(--steel)}
.mt-feed{max-width:620px;margin-inline:auto;gap:22px!important}
.mt-heading{padding:12px 0 2px}.mt-title{font-size:clamp(29px,7vw,42px)!important;line-height:1.07!important;letter-spacing:-.035em}
.mt-title span{color:var(--acc);background:linear-gradient(110deg,var(--ink),var(--acc));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.mt-post{border:1px solid color-mix(in srgb,var(--acc) 25%,var(--edge));border-radius:24px;overflow:hidden;background:color-mix(in srgb,var(--card) 87%,transparent);box-shadow:0 12px 32px #0002;isolation:isolate;position:relative}
.mt-post:before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;background:linear-gradient(135deg,#ffffff0c,transparent 30%),radial-gradient(230px circle at var(--hub-glow-x,70%) var(--hub-glow-y,0),#ffffff0b,transparent 75%)}
.mt-motion-off .mt-post:before{background:linear-gradient(135deg,#ffffff08,transparent 30%)}
.mt-photo{aspect-ratio:1;background:linear-gradient(145deg,color-mix(in srgb,var(--acc) 12%,transparent),transparent);display:flex;align-items:center;justify-content:center;overflow:hidden}
.mt-photo img{display:block;width:100%;height:100%;object-fit:contain}
.mt-content{padding:16px;position:relative;background:linear-gradient(130deg,color-mix(in srgb,var(--acc) 8%,transparent),transparent 65%)}
@supports(backdrop-filter:blur(1px)){.mt-content{backdrop-filter:blur(10px)}}
.mt-byline{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px}.mt-byline b{min-width:0;overflow-wrap:anywhere}.mt-byline time{font-size:11px;color:var(--mut);flex-shrink:0}
.mt-caption{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.55;font-size:14px;margin:12px 0;color:var(--ink)}
.mt-actions{display:flex;gap:10px;align-items:center;margin:14px 0 4px}.mt-actions button{min-height:48px;touch-action:manipulation}
.mt-heart,.mt-share{border:1px solid var(--edge);border-radius:999px;color:var(--ink);background:color-mix(in srgb,var(--card) 75%,transparent);padding:10px 16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;position:relative;font-weight:650;font-size:12px}
.mt-heart{min-width:76px}.mt-heart svg{height:22px;width:22px;stroke:currentColor;stroke-width:1.5;fill:transparent;overflow:visible}.mt-heart.liked{color:#ef6592;border-color:#ef659260;background:#ef65921a}.mt-heart.liked svg{fill:currentColor;stroke:currentColor}
.mt-heart i{position:absolute;left:25px;top:50%;pointer-events:none}.mt-pop svg{animation:mt-heart .55s cubic-bezier(.2,.8,.3,1)}.mt-pop i:before{content:'';display:block;width:4px;height:4px;border-radius:50%;background:#ef6592;box-shadow:0 -20px #ef6592,17px -10px #f4b160,17px 10px #ef6592,0 20px #ef6592,-17px 10px #f4b160,-17px -10px #ef6592;animation:mt-burst .6s ease-out both}
.mt-heart:focus-visible,.mt-share:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.mt-post.mt-enter{animation:mt-enter .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--mt-order)*55ms)}
.mt-admin-list{display:grid;gap:12px;margin:18px 0}.mt-admin-item{display:flex;gap:12px;padding:12px}.mt-admin-item img{width:64px;height:64px;border-radius:14px;object-fit:contain;background:#0001}.mt-admin-item>div{min-width:0}.mt-admin-item p{font-size:12px;overflow-wrap:anywhere;max-height:4em;overflow:hidden;margin:4px 0}
.mt-editor-preview{height:210px;display:grid;place-items:center;border:1px dashed var(--edge);border-radius:20px;overflow:hidden;background:linear-gradient(140deg,color-mix(in srgb,var(--acc) 12%,transparent),transparent);margin-bottom:16px;color:var(--mut)}
.mt-editor-preview img{width:100%;height:100%;object-fit:contain}.mt-empty{padding:24px}
.mt-motion-off .mt-post,.mt-motion-off .mt-heart svg,.mt-motion-off .mt-heart i:before{animation:none!important}
@keyframes mt-heart{0%,100%{transform:scale(1)}30%{transform:scale(1.34) rotate(-9deg)}65%{transform:scale(.93) rotate(5deg)}}
@keyframes mt-burst{0%{transform:translate(-2px,-2px) scale(.3);opacity:0}25%{opacity:1}100%{transform:translate(-2px,-2px) scale(1.5);opacity:0}}
@keyframes mt-enter{from{opacity:.4;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.mt-post,.mt-heart svg,.mt-heart i:before{animation:none!important}}
