:root {
  --ink: #242321;
  --muted: #68645f;
  --paper: #f5f1ea;
  --cream: #e9e2d8;
  --pink: #f3a8ad;
  --blue: #a7c8dd;
  --lime: #d8e98c;
  --lilac: #c7b7df;
  --bar-height: 34px;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --font-macos: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", sans-serif;
}

* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body { overflow: hidden; background: #9cc7d9; color: var(--ink); font-family: var(--font-macos); }
button, a { font: inherit; }
button { color: inherit; }
button:focus-visible, a:focus-visible { outline: 3px solid #5b79ff; outline-offset: 3px; }
.skip-link { position: fixed; top: -100px; left: 1rem; z-index: 999; padding: .7rem 1rem; background: white; color: black; border-radius: .6rem; }
.skip-link:focus { top: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.desktop { position: relative; width: 100%; height: 100%; min-height: 610px; overflow: hidden; isolation: isolate; background-color: #254584; background-image: url("assets/wpbg.png"); background-position: center center; background-repeat: no-repeat; background-size: cover; }

.menu-bar { position: relative; z-index: 100; height: var(--bar-height); display: flex; align-items: center; justify-content: space-between; padding: 0 .85rem; color: #fff; background: transparent; border-bottom: 0; backdrop-filter: none; font-size: .78rem; letter-spacing: -.01em; text-shadow: 0 1px 3px rgba(23,43,55,.42); box-shadow: none; }
.menu-left, .menu-right { display: flex; align-items: center; gap: 1rem; }
.menu-bar button { border: 0; background: transparent; padding: .2rem 0; cursor: pointer; }
.apple-mark { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 0; color: #fff !important; background: transparent !important; font-weight: 800; font-size: .78rem; }

.desktop-stage { position: relative; height: calc(100% - var(--bar-height)); }
.eyebrow { display: inline-block; font-size: .7rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; color: #6e6862; }

.desktop-icons { position: absolute; display: grid; gap: 1.6rem; z-index: 3; }
.desktop-icons--left { left: 5.8%; top: 24%; bottom: auto; grid-template-columns: repeat(3, 92px); }
.desktop-icons--right { right: 4.3%; top: 11%; grid-template-columns: 92px; }
.desktop-icon { width: 92px; padding: .2rem; border: 0; border-radius: .5rem; background: transparent; cursor: grab; text-align: center; touch-action: none; user-select: none; transition: transform .25s var(--ease); }
.desktop-icon:hover { transform: translateY(-4px); }
.desktop-icon:active { transform: translateY(-1px) scale(.97); }
.desktop-icon.is-dragging { z-index: 8; cursor: grabbing; transform: scale(1.03); }
.desktop-icon > span:last-child { display: inline-block; margin-top: .48rem; padding: .18rem .34rem; border-radius: .3rem; color: #fff; font-size: .72rem; line-height: 1.15; text-shadow: 0 1px 3px rgba(18,35,22,.82), 0 0 8px rgba(18,35,22,.28); }
.desktop-icon:focus > span:last-child { color: #fff; background: #3c65b0; text-shadow: none; }
.folder-icon { position: relative; display: block; width: 68px; height: 58px; margin: 0 auto; background: url("assets/folder-icon.png") center / contain no-repeat; filter: drop-shadow(0 7px 8px rgba(32,65,78,.2)); }
.folder-icon::before, .folder-icon::after, .folder-icon i { display: none; }
.folder-icon--blue, .folder-icon--coral { background-color: transparent; }
.document-icon { position: relative; display: grid; place-items: center; width: 49px; height: 61px; margin: 0 auto; border-radius: 6px 6px 8px 8px; background: #fffdf8; box-shadow: 0 7px 16px rgba(67,56,47,.17), inset 0 0 0 1px rgba(74,63,54,.08); overflow: hidden; }
.document-icon::after { content: ""; position: absolute; left: 8px; right: 8px; bottom: 11px; height: 10px; border-top: 2px solid #d7d2c9; border-bottom: 2px solid #d7d2c9; }
.document-icon i { margin-top: -12px; font-style: normal; font-weight: 800; font-size: 1.1rem; }
.document-icon--grid { background: #f7f6f2; }
.document-icon--grid i { border: 2px solid var(--ink); padding: .15rem .28rem; font-family: var(--font-macos); }
.document-icon--art { background: linear-gradient(145deg, #ffd0c4, #bbb0e1); }
.document-icon--art::after { border-color: rgba(255,255,255,.65); }

.profile-widget { position: absolute; z-index: 5; right: 13%; bottom: 12%; width: min(252px, 24vw); height: min(374px, 58vh); min-width: 235px; min-height: 340px; overflow: hidden; border: 1px solid rgba(255,255,255,.42); border-radius: 1.48rem; background: rgba(255,255,255,.08); box-shadow: 0 18px 48px rgba(7,20,45,.2), inset 0 1px 0 rgba(255,255,255,.72), inset 0 -1px 0 rgba(255,255,255,.12), inset 0 0 6px 2px rgba(255,255,255,.25); -webkit-backdrop-filter: blur(9px) saturate(1.12); backdrop-filter: blur(9px) saturate(1.12); cursor: grab; touch-action: none; user-select: none; transform: rotate(-.35deg); }
.profile-widget.is-dragging { z-index: 9; cursor: grabbing; box-shadow: 0 36px 88px rgba(13,30,63,.33), 0 9px 22px rgba(13,30,63,.18), inset 0 1px 0 rgba(255,255,255,.75); }
.profile-widget button, .profile-widget a { cursor: pointer; touch-action: auto; }
.profile-widget::after { content: ""; position: absolute; z-index: 5; inset: 0; display: block; border-radius: inherit; background: linear-gradient(90deg, transparent, rgba(255,255,255,.8), transparent) top / 100% 1px no-repeat, linear-gradient(180deg, rgba(255,255,255,.8), transparent, rgba(255,255,255,.3)) left / 1px 100% no-repeat; pointer-events: none; }
.profile-card-top { position: absolute; z-index: 4; top: .82rem; left: .72rem; right: .72rem; color: #fff; text-align: center; text-shadow: 0 1px 10px rgba(7,16,29,.65), 0 2px 22px rgba(7,16,29,.32); }
.profile-card-top h2 { margin: 0; font-size: 1.16rem; font-weight: 650; line-height: 1; letter-spacing: -.045em; }
.profile-card-top p { display: flex; align-items: center; justify-content: center; gap: .3rem; margin: .18rem 0 0; color: rgba(255,255,255,.8); font-size: .48rem; }
.profile-card-top p span { width: 6px; height: 6px; border-radius: 50%; background: #35c759; box-shadow: 0 0 0 3px rgba(53,199,89,.16), 0 0 8px rgba(53,199,89,.5); }
.profile-photo { position: absolute; z-index: 2; inset: 0; overflow: hidden; border: 0; border-radius: inherit; background: rgba(214,215,220,.72); box-shadow: inset 0 1px 0 rgba(255,255,255,.28); }
.profile-photo::before { content: ""; position: absolute; z-index: 1; inset: auto 0 0; display: block; height: 38%; background: linear-gradient(to top, rgba(8,15,27,.82) 0%, rgba(10,18,31,.58) 40%, rgba(12,22,37,.18) 76%, transparent 100%); -webkit-backdrop-filter: blur(4px) saturate(1.08); backdrop-filter: blur(4px) saturate(1.08); -webkit-mask-image: linear-gradient(to top, #000 0%, #000 62%, transparent 100%); mask-image: linear-gradient(to top, #000 0%, #000 62%, transparent 100%); pointer-events: none; }
.profile-photo::after { content: ""; position: absolute; z-index: 2; inset: 0; display: block; border-radius: inherit; box-shadow: inset 0 1px 0 rgba(255,255,255,.34), inset 0 0 22px rgba(255,255,255,.05); pointer-events: none; }
.profile-photo img { position: relative; z-index: 0; display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; pointer-events: none; }
.profile-content { position: absolute; z-index: 4; right: .9rem; bottom: .78rem; left: .9rem; display: grid; grid-template-columns: 1fr; gap: .52rem; color: #fff; text-shadow: 0 1px 8px rgba(5,13,25,.45); }
.profile-identity { display: flex; align-items: center; min-width: 0; gap: .42rem; }
.profile-avatar { position: relative; display: grid; place-items: center; flex: 0 0 25px; width: 25px; height: 25px; overflow: visible; border: 1px solid rgba(255,255,255,.65); border-radius: 50%; color: transparent; background: #aeb4bd url("assets/bttna.png") center 25% / cover no-repeat; box-shadow: 0 3px 8px rgba(20,34,57,.16); font-size: .62rem; font-weight: 750; }
.profile-avatar i { position: absolute; right: -1px; bottom: -1px; width: 8px; height: 8px; border: 2px solid #fff; border-radius: 50%; background: #34c759; }
.profile-identity > div { min-width: 0; }.profile-identity b { display: block; overflow: hidden; color: #fff; font-size: .55rem; text-overflow: ellipsis; white-space: nowrap; }
.profile-content p { margin: .1rem 0 0; color: rgba(255,255,255,.72); font-size: .45rem; }
.profile-content .role { overflow: hidden; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.profile-actions { display: grid; grid-template-columns: minmax(0,.72fr) minmax(0,1.28fr); align-items: stretch; gap: .32rem; margin: 0; }
.profile-button { position: relative; display: flex; align-items: center; justify-content: center; gap: .18rem; min-width: 0; min-height: 31px; padding: .48rem .42rem; border-radius: .58rem; font-size: .5rem; font-weight: 680; line-height: 1; text-decoration: none; text-shadow: none; white-space: nowrap; cursor: pointer; transition: transform .22s cubic-bezier(.22,1,.36,1), background .22s ease, box-shadow .22s ease; }
.profile-button:hover { transform: translateY(-2px); }
.profile-button:active { transform: translateY(0) scale(.97); transition-duration: .1s; }
.profile-button--contact { color: rgba(255,255,255,.9); border: 1px solid rgba(255,255,255,.38); background: rgba(14,23,39,.18); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.profile-button--contact:hover { color: #fff; background: rgba(255,255,255,.18); }
.profile-button--cv { isolation: isolate; color: #17213a; border: 0; background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(237,244,255,.96)); box-shadow: 0 4px 8px rgba(6,14,30,.18); overflow: visible; }
.profile-button--cv::before { position: absolute; z-index: -2; inset: -3px; border-radius: calc(.58rem + 3px); background: linear-gradient(110deg, #8bd6ff, #8b8cff, #efa1da, #f5ca86, #8bd6ff); background-size: 240% 100%; content: ""; filter: blur(4px); opacity: .74; animation: cv-gradient-glow 3.8s linear infinite, cv-glow-breathe 2.4s ease-in-out infinite; pointer-events: none; }
.profile-button--cv::after { position: absolute; z-index: -1; inset: 0; border-radius: inherit; background: linear-gradient(135deg, rgba(255,255,255,.99), rgba(235,243,255,.98)); content: ""; pointer-events: none; }
.profile-button--cv:hover { color: #0e1730; box-shadow: 0 6px 8px rgba(6,14,30,.23); transform: translateY(-3px) scale(1.015); }
.profile-button--cv:hover::before, .profile-button--cv:focus-visible::before { opacity: 1; filter: blur(5px); }
.profile-button--cv span { transition: transform .22s cubic-bezier(.22,1,.36,1); }
.profile-button--cv:hover span { transform: translate(1px,-1px); }

@keyframes cv-gradient-glow { to { background-position: 240% 0; } }
@keyframes cv-glow-breathe { 0%,100% { opacity: .58; } 50% { opacity: .9; } }

.window { position: absolute; top: 8%; left: 8%; z-index: 20; display: flex; flex-direction: column; width: min(1120px, 84vw); height: min(720px, 81vh); overflow: hidden; border: 1px solid rgba(255,255,255,.58); border-radius: 1rem; background: rgba(244,241,235,.86); box-shadow: 0 30px 90px rgba(37,30,26,.28), 0 3px 10px rgba(37,30,26,.12); backdrop-filter: blur(28px) saturate(1.25); opacity: 0; transform: translateY(20px) scale(.96); visibility: hidden; transition: opacity .26s var(--ease), transform .34s var(--ease), visibility 0s .34s; }
.window.is-open { opacity: 1; transform: translateY(0) scale(1); visibility: visible; transition-delay: 0s; }
.window.is-active { z-index: 50; }
.window.is-maximized { inset: calc(var(--bar-height) + 6px) 6px 80px !important; width: auto !important; height: auto !important; }
.window.is-minimizing { opacity: 0; transform: translateY(55vh) scale(.2); }
.window.is-being-dragged, .window.is-being-resized { transition: none; }
.window--compact { width: min(860px, 78vw); height: min(610px, 74vh); top: 12%; left: 14%; }
.window--note { width: min(560px, 75vw); height: auto; min-height: 510px; top: 13%; left: 30%; background: rgba(249,245,222,.94); }
.window--contact { width: min(680px, 78vw); height: min(510px, 68vh); min-height: 420px; top: 14%; left: 25%; background: rgba(248,248,249,.96); }
.window-bar { flex: 0 0 42px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 .85rem; border-bottom: 1px solid rgba(55,48,42,.12); background: rgba(255,255,255,.4); cursor: grab; user-select: none; }
.window-bar:active { cursor: grabbing; }
.window-resizer { position: absolute; z-index: 20; display: block; touch-action: none; }
.window-resizer--n, .window-resizer--s { right: 10px; left: 10px; height: 8px; }.window-resizer--n { top: 0; cursor: ns-resize; }.window-resizer--s { bottom: 0; cursor: ns-resize; }
.window-resizer--e, .window-resizer--w { top: 10px; bottom: 10px; width: 8px; }.window-resizer--e { right: 0; cursor: ew-resize; }.window-resizer--w { left: 0; cursor: ew-resize; }
.window-resizer--ne, .window-resizer--nw, .window-resizer--se, .window-resizer--sw { width: 14px; height: 14px; }
.window-resizer--ne { top: 0; right: 0; cursor: nesw-resize; }.window-resizer--nw { top: 0; left: 0; cursor: nwse-resize; }.window-resizer--se { right: 0; bottom: 0; cursor: nwse-resize; }.window-resizer--sw { bottom: 0; left: 0; cursor: nesw-resize; }
.window-title { font-size: .72rem; font-weight: 650; color: #514c47; }
.traffic-lights { display: flex; gap: 7px; }
.traffic { position: relative; display: grid; place-items: center; width: 12px; height: 12px; padding: 0; border: 0; border-radius: 50%; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.traffic::after { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--font-macos); font-size: 10px; font-weight: 900; line-height: 12px; opacity: 0; transform: scale(.72); transition: opacity .12s ease, transform .12s ease; }
.traffic-lights:hover .traffic::after { opacity: 1; transform: scale(1); }
.traffic--close { background: #ff5f57; }.traffic--close::after { content: "×"; color: #a72724; }
.traffic--min { background: #febc2e; }.traffic--min::after { content: "−"; color: #a66b00; }
.traffic--max { background: #28c840; }.traffic--max::after { content: ""; inset: 3px; display: block; border-radius: 1px; background: linear-gradient(135deg, #087826 0 42%, transparent 43% 57%, #087826 58% 100%); }
.view-switch { justify-self: end; font-size: 1rem; color: #77716b; }
.finder-window { border-color: rgba(255,255,255,.78); background: rgba(250,250,250,.93); box-shadow: 0 28px 80px rgba(22,31,49,.28), 0 2px 8px rgba(22,31,49,.14); backdrop-filter: blur(34px) saturate(1.25); }
.finder-window .window-bar { flex-basis: 48px; border-bottom-color: rgba(48,53,61,.1); background: rgba(245,245,245,.82); }
.finder-window .window-title { color: #45474b; font-size: .69rem; font-weight: 650; }
.window-body { flex: 1; min-height: 0; overflow: auto; }
.finder-layout { display: grid; grid-template-columns: 168px 1fr; }
.finder-sidebar { padding: .55rem .5rem .75rem; border-right: 1px solid rgba(55,60,68,.09); background: rgba(229,230,232,.72); }
.finder-sidebar small { display: block; margin: .55rem .48rem .22rem; color: #777b81; font-size: .55rem; font-weight: 700; letter-spacing: 0; }
.finder-sidebar button, .finder-sidebar span { display: flex; align-items: center; width: 100%; gap: .42rem; padding: .36rem .48rem; border: 0; border-radius: .4rem; background: transparent; text-align: left; font-size: .66rem; white-space: nowrap; }
.finder-sidebar button { color: #4f5359; cursor: pointer; }.finder-sidebar button:hover, .finder-sidebar button.active { color: #26282b; background: rgba(121,126,134,.18); }
.finder-nav-icon { display: inline-grid !important; place-items: center; flex: 0 0 17px; width: 17px !important; padding: 0 !important; color: #69a8e0; font-size: .86rem !important; font-style: normal; font-weight: 750; }
.tag-dot { flex: 0 0 8px; width: 8px; height: 8px; padding: 0 !important; border-radius: 50%; }.tag-dot--pink { background: #ed8c9d; }.tag-dot--blue { background: #79a9ca; }.tag-dot--yellow { background: #e4ba55; }
.finder-content-area, .project-area { min-width: 0; overflow: auto; background: rgba(255,255,255,.78); }
.project-area { padding: 1rem 1.25rem; }
.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: .9rem; }
.finder-location { color: #9a9ca0; font-size: .62rem; }.finder-window .section-heading h2 { margin: .02rem 0 0; font-size: clamp(1.55rem, 2.5vw, 2.1rem); letter-spacing: -.04em; }
.section-heading h2 { margin: .35rem 0 0; font-family: var(--font-macos); font-size: clamp(2rem, 4vw, 3.8rem); font-weight: 700; letter-spacing: -.055em; }
.project-count { align-self: end; padding-bottom: .4rem; font-size: .65rem; color: #777069; }
.project-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(205px, 1fr)); gap: .45rem .55rem; align-items: start; }
.project-card { display: flex; min-width: 0; flex-direction: row; align-items: center; padding: .38rem .42rem; border-radius: .55rem; transition: transform .22s var(--ease), background .18s ease; }
.project-card:hover { background: rgba(110,151,201,.11); transform: translateY(-3px); }
.project-card[hidden] { display: none; }
.project-visual { position: relative; flex: 0 0 72px; width: 72px; height: 56px; overflow: hidden; border: 1px solid rgba(47,54,66,.08); border-radius: .42rem; box-shadow: 0 4px 9px rgba(38,45,58,.12); }
.project-meta { display: block; min-width: 0; max-width: none; padding: 0 0 0 .58rem; text-align: left; }
.project-meta small { display: none; }
.project-meta h3 { margin: 0; font-size: .65rem; font-weight: 550; line-height: 1.25; letter-spacing: 0; }
.project-meta > span { display: none; }
.notion-preview { padding: .48rem; background: #dda2a7; }.notion-preview span { display: grid; place-items: center; width: 21px; height: 21px; border-radius: 4px; background: #202020; color: white; font-size: .5rem; font-weight: 800; }.notion-preview b { display: block; margin: .3rem 0 .12rem; font-family: var(--font-macos); font-size: .5rem; }.notion-preview i { display: inline-block; width: 27%; height: 7px; margin-right: 3%; border-radius: 2px; background: rgba(255,255,255,.45); }
.poster-preview { display: flex; flex-direction: column; justify-content: center; padding: .55rem; background: var(--lime); font-size: 1rem; line-height: .75; letter-spacing: -.08em; font-weight: 900; text-transform: uppercase; }.poster-preview span:nth-child(2) { align-self: center; font-family: var(--font-macos); font-style: italic; font-weight: 500; }.poster-preview span:last-child { align-self: end; }
.chart-preview { display: grid; place-items: center; background: #a5cadf; }.chart-preview b { position: relative; z-index: 1; font-family: var(--font-macos); font-size: 1.3rem; }.chart-preview small { font-size: .27rem; letter-spacing: .12em; }.chart-line { position: absolute; width: 70%; height: 55%; border: 2px solid rgba(255,255,255,.7); border-left: 0; border-bottom: 0; transform: skewY(-20deg) rotate(-8deg); }
.tiles-preview { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; background: #e4c36c; }.tiles-preview i:nth-child(1){background:#ef938f}.tiles-preview i:nth-child(2){background:#6c6a91}.tiles-preview i:nth-child(3){background:#dde7b3}.tiles-preview i:nth-child(4){background:#f8ecda}
.table-preview { padding: .5rem; background: #c9b9df; }.table-preview b { font-family: var(--font-macos); font-size: .48rem; }.table-preview i { display: block; height: 7px; margin-top: 4px; border-radius: 2px; background: rgba(255,255,255,.52); box-shadow: inset 0 0 0 1px rgba(87,66,115,.18); }
.type-preview { display: flex; align-items: center; padding: .5rem; background: #292829; color: #f4eee6; font-size: .78rem; font-weight: 900; line-height: .85; letter-spacing: -.05em; }.type-preview span { align-self: flex-start; margin-left: .2rem; font-size: .32rem; }

.experience-body { padding: 1rem 1.35rem; }
.timeline { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(45,40,35,.2); }
.timeline li { display: grid; grid-template-columns: 96px 1fr 24px; gap: .75rem; align-items: start; padding: .78rem .2rem; border-bottom: 1px solid rgba(45,40,35,.16); }
.timeline li > span { font-size: .58rem; font-weight: 800; letter-spacing: .07em; color: #8a645c; }
.timeline h3 { margin: 0 0 .14rem; font-family: var(--font-macos); font-size: .92rem; font-weight: 650; }.timeline p { margin: 0; max-width: 560px; color: #5f5953; font-size: .66rem; line-height: 1.46; text-wrap: pretty; }.timeline p strong { color: #45403b; font-weight: 650; }.timeline b { color: #aaa39b; font-size: .6rem; }
.note-body { padding: clamp(2rem, 5vw, 3.6rem); background: linear-gradient(150deg, rgba(255,255,255,.7), rgba(241,246,252,.72)); }
.note-stamp { display: inline-block; padding: .35rem .55rem; border: 1px solid #9e725e; border-radius: 999px; color: #865e4f; font-size: .57rem; font-weight: 800; letter-spacing: .1em; transform: rotate(-4deg); }
.note-body h2 { margin: 1.35rem 0 1.15rem; max-width: 13ch; font-family: var(--font-macos); font-size: clamp(2.2rem, 5vw, 3.4rem); line-height: .97; letter-spacing: -.035em; font-weight: 700; text-wrap: balance; }.note-body p { max-width: 68ch; color: #504c46; font-family: var(--font-macos); font-size: .84rem; line-height: 1.68; text-wrap: pretty; }.note-body p + p { margin-top: .85rem; }.signature { margin-top: 1.1rem; font-family: var(--font-macos); font-size: 1.7rem; font-weight: 650; transform: rotate(-3deg); }
.contact-body { min-height: 0; padding: 0; color: #2f3135; background: rgba(250,250,251,.97); }.mail-compose { display: grid; height: 100%; min-height: 0; grid-template-rows: auto auto auto minmax(150px,1fr) auto; }.mail-compose-toolbar { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: .55rem .72rem; border-bottom: 1px solid #dedfe2; background: #f1f2f4; }.mail-compose-toolbar a { color: #6f737b; font-size: .58rem; text-decoration: none; }.mail-compose-toolbar a:hover { color: #292c31; }.mail-send { display: inline-flex; align-items: center; gap: .34rem; min-height: 31px; padding: .42rem .7rem; border: 0; border-radius: 7px; color: #fff; background: #2879db; box-shadow: 0 2px 6px rgba(24,92,174,.24); font: inherit; font-size: .6rem; font-weight: 680; cursor: pointer; }.mail-send:hover { background: #1f6ecb; }.mail-send:active { transform: translateY(1px); }.mail-send span { display: grid; width: 17px; height: 17px; place-items: center; border-radius: 50%; background: rgba(255,255,255,.17); font-size: .68rem; }.mail-field { display: grid; grid-template-columns: 58px minmax(0,1fr); align-items: center; min-height: 43px; padding: 0 .85rem; border-bottom: 1px solid #e1e2e5; }.mail-field > span { color: #858991; font-size: .62rem; }.mail-field input { width: 100%; min-width: 0; padding: .5rem 0; border: 0; outline: 0; color: #303238; background: transparent; font: inherit; font-size: .68rem; }.mail-field input[readonly] { color: #315f9b; }.mail-message { display: block; min-height: 0; }.mail-message textarea { width: 100%; height: 100%; min-height: 150px; padding: 1rem .9rem; resize: none; border: 0; outline: 0; color: #2f3135; background: #fff; font: inherit; font-size: .76rem; line-height: 1.58; }.mail-message textarea::placeholder { color: #8a8e96; opacity: 1; }.mail-privacy { display: flex; align-items: center; gap: .35rem; margin: 0; padding: .48rem .85rem; border-top: 1px solid #e1e2e5; color: #747982; background: #f6f7f8; font-size: .52rem; line-height: 1.4; }.mail-privacy span { color: #3a7f55; }
.notion-demo { display: grid; grid-template-columns: 165px minmax(0,1fr) 238px; height: 100%; color: #37352f; background: #fff; }
.notion-sidebar { display: flex; flex-direction: column; min-width: 0; padding: .8rem .55rem; border-right: 1px solid #e7e5e2; background: #f7f6f3; }
.notion-workspace-name { display: flex; align-items: center; gap: .55rem; padding: .35rem .4rem .85rem; }
.notion-workspace-name > span { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 5px; color: #fff; background: #222; font-family: var(--font-macos); font-weight: 800; }
.notion-workspace-name div { display: flex; min-width: 0; flex-direction: column; }.notion-workspace-name b { overflow: hidden; font-size: .66rem; text-overflow: ellipsis; white-space: nowrap; }.notion-workspace-name small { margin: .12rem 0 0 !important; color: #9b9791 !important; font-size: .53rem !important; letter-spacing: 0 !important; }
.notion-sidebar > small { margin: .8rem .5rem .32rem; color: #9b9791; font-size: .5rem; font-weight: 750; letter-spacing: .08em; }
#notion-database-list { display: flex; flex-direction: column; gap: .12rem; }
.notion-sidebar button, .notion-template { display: flex; align-items: center; gap: .5rem; width: 100%; padding: .42rem .5rem; border: 0; border-radius: 5px; color: #595651; background: transparent; font-size: .63rem; text-align: left; }
.notion-sidebar button { cursor: pointer; }.notion-sidebar button:hover, .notion-sidebar button.active { color: #282622; background: #e9e7e3; }.notion-sidebar button span, .notion-template i { width: 15px; color: #8b8781; font-style: normal; text-align: center; }
.notion-sidebar .notion-academy-card { display: grid; grid-template-columns: 25px minmax(0, 1fr) auto; align-items: center; gap: .45rem; margin: 0 0 .55rem; padding: .55rem !important; border: 1px solid #d7e4f2; border-radius: 7px; color: #344358; background: linear-gradient(145deg, #edf5fc, #f8fbfe); box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 2px 7px rgba(52,77,104,.07); }.notion-sidebar .notion-academy-card:hover { color: #253449; background: linear-gradient(145deg, #e2f0fb, #f6fafe); }.notion-academy-card .notion-academy-mark { display: grid; place-items: center; width: 25px !important; height: 25px; border-radius: 6px; color: #fff !important; background: #2383e2; box-shadow: 0 3px 8px rgba(35,131,226,.24); }.notion-academy-card > span:nth-child(2) { display: flex; width: auto !important; min-width: 0; flex-direction: column; align-items: flex-start; color: inherit !important; text-align: left !important; }.notion-academy-card b { overflow: hidden; width: 100%; font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }.notion-academy-card small { margin-top: .1rem; color: #718198; font-size: .44rem; }.notion-academy-card i { color: #7f91a8; font-size: .9rem; font-style: normal; }
.notion-database-item { align-items: flex-start !important; padding: .55rem .48rem !important; }.notion-database-item > span { flex: 0 0 17px; width: 17px !important; }.notion-database-item > div { display: flex; min-width: 0; flex-direction: column; gap: .14rem; }.notion-database-item b { overflow: hidden; font-size: .61rem; text-overflow: ellipsis; white-space: nowrap; }.notion-database-item small { color: #98948e; font-size: .49rem; }
.notion-privacy { display: flex; align-items: center; gap: .35rem; margin: auto .45rem 0; color: #85817b; font-size: .5rem; line-height: 1.35; }.notion-privacy span { display: grid; place-items: center; width: 14px; height: 14px; border-radius: 50%; color: #377b4a; background: #dceee1; }
.notion-workspace { position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; padding: 1rem 1.35rem .7rem; }
.notion-breadcrumb { color: #aaa69f; font-size: .55rem; }
.notion-title-row { display: flex; align-items: end; justify-content: space-between; gap: 1rem; padding: 1rem 0 .8rem; }.notion-title-row > div { min-width: 0; }.notion-page-icon { display: block; margin-bottom: .25rem; font-size: 1.25rem; }.notion-title-row h2 { margin: 0; overflow: hidden; font-size: 1.55rem; letter-spacing: -.035em; text-overflow: ellipsis; white-space: nowrap; }.notion-title-row p { margin: .25rem 0 0; color: #8a8680; font-size: .59rem; }
.notion-new { padding: .42rem .7rem; border: 0; border-radius: 5px; color: #fff; background: #2383e2; font-size: .6rem; font-weight: 700; cursor: pointer; }.notion-new:hover { background: #1b6fbd; }
.notion-view-tabs { display: flex; flex: 0 0 auto; gap: .08rem; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid #e7e5e2; }.notion-view-tabs::-webkit-scrollbar { display: none; }.notion-view-tabs button { position: relative; display: flex; align-items: center; flex: 0 0 auto; gap: .28rem; padding: .42rem .46rem; border: 0; color: #77736d; background: transparent; font-size: .51rem; white-space: nowrap; cursor: pointer; }.notion-view-tabs button:hover { color: #37352f; background: #f5f4f2; }.notion-view-tabs button.active { color: #37352f; font-weight: 650; }.notion-view-tabs button.active::after { content: ""; position: absolute; right: .38rem; bottom: -1px; left: .38rem; height: 2px; background: #37352f; }.notion-view-tabs span { color: #99958f; }
.notion-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .7rem; min-height: 32px; border-bottom: 1px solid #e7e5e2; }.notion-view-label { display: flex; align-items: center; gap: .35rem; min-width: 0; font-size: .58rem; }.notion-view-label span { color: #8b8781; }.notion-view-label em { padding: .12rem .35rem; border-radius: 999px; color: #8a8680; background: #f0efed; font-size: .5rem; font-style: normal; }
.notion-toolbar-actions { display: flex; align-items: center; gap: .28rem; }.notion-properties-toggle, .notion-badges-toggle { display: flex; align-items: center; gap: .28rem; padding: .27rem .38rem; border: 0; border-radius: 4px; color: #77736d; background: transparent; font-size: .53rem; cursor: pointer; }.notion-properties-toggle:hover, .notion-properties-toggle[aria-expanded="true"], .notion-badges-toggle:hover, .notion-badges-toggle[aria-expanded="true"] { color: #37352f; background: #f0efed; }.notion-properties-toggle em, .notion-badges-toggle em { display: grid; place-items: center; min-width: 17px; height: 17px; padding: 0 .2rem; border-radius: 999px; color: #77736d; background: #e5e3df; font-size: .45rem; font-style: normal; }.notion-badges-toggle > span { color: #2383e2; }
.notion-search { display: flex; align-items: center; gap: .2rem; color: #9b9791; }.notion-search input { width: 92px; padding: .26rem .35rem; border: 0; border-radius: 4px; outline: 0; background: transparent; font: inherit; font-size: .56rem; }.notion-search:focus-within { border-radius: 4px; background: #f3f2f0; }
.notion-table { flex: 1; min-height: 0; overflow: auto; }
.notion-table-row { display: grid; grid-template-columns: var(--notion-columns, minmax(175px, 1.5fr) minmax(105px, .9fr) minmax(92px, .75fr) minmax(88px, .72fr) 62px); align-items: stretch; width: 100%; min-width: var(--notion-min-width, 570px); border: 0; border-bottom: 1px solid #eceae7; background: transparent; text-align: left; }
button.notion-table-row { color: inherit; cursor: pointer; }.notion-table-row:not(.notion-table-head):hover { background: #f8f7f5; }.notion-table-head { position: sticky; z-index: 1; top: 0; color: #8a8680; background: #fff; font-size: .5rem; }
.notion-cell { display: flex; align-items: center; min-width: 0; min-height: 34px; padding: .38rem .42rem; border-right: 1px solid #eceae7; font-size: .57rem; line-height: 1.25; }.notion-cell:last-child { border-right: 0; }.notion-cell--task { gap: .4rem; font-weight: 650; }.notion-cell--task > span:first-child { flex: 0 0 auto; }.notion-cell-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notion-client, .notion-assignee, .notion-file { display: flex; align-items: center; min-width: 0; gap: .32rem; }.notion-client i, .notion-assignee i { display: grid; place-items: center; flex: 0 0 auto; width: 17px; height: 17px; border-radius: 50%; color: #fff; background: #7aa7b2; font-size: .43rem; font-style: normal; font-weight: 800; }.notion-assignee i { color: #514b43; background: #e5c9a9; }.notion-file i { display: grid; place-items: center; flex: 0 0 auto; width: 21px; height: 24px; border-radius: 3px; color: #5d7191; background: #e4ebf4; font-size: .36rem; font-style: normal; font-weight: 800; }.notion-file span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notion-tag { display: inline-flex; align-items: center; max-width: 100%; padding: .18rem .38rem; border-radius: 4px; overflow: hidden; font-size: .51rem; text-overflow: ellipsis; white-space: nowrap; }.notion-tag--blue { color: #276889; background: #dcecf3; }.notion-tag--yellow { color: #89632c; background: #f7edcf; }.notion-tag--purple { color: #765989; background: #eee5f2; }.notion-tag--green { color: #3a7250; background: #deeee3; }.notion-tag--red { color: #9b4747; background: #f6dddd; }.notion-tag--gray { color: #66615b; background: #eceae7; }
.notion-channel { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-right: -3px; border: 2px solid #fff; border-radius: 50%; color: #fff; background: #6f79a8; font-size: .43rem; font-weight: 800; }.notion-channel:nth-child(2) { background: #c65c88; }.notion-channel:nth-child(3) { background: #4b9671; }
.notion-multi { display: inline-flex; max-width: 100%; margin: .08rem .18rem .08rem 0; padding: .16rem .34rem; overflow: hidden; border-radius: 4px; color: #566277; background: #e5eaf2; font-size: .47rem; text-overflow: ellipsis; white-space: nowrap; }
.notion-demo-note { margin: .5rem 0 0; color: #aaa69f; font-size: .48rem; text-align: right; }
.notion-case-study { min-height: 0; overflow: auto; padding: .92rem .82rem 1rem; border-left: 1px solid #e2e0dc; color: #514d47; background: #f7f8fa; scrollbar-width: thin; }.notion-case-study > header { margin-bottom: .82rem; padding-bottom: .76rem; border-bottom: 1px solid #dedfe3; }.notion-case-study > header > span { display: inline-flex; padding: .26rem .4rem; border-radius: 999px; color: #315f92; background: #e7f0f9; font-size: .47rem; font-weight: 750; letter-spacing: .045em; text-transform: uppercase; }.notion-case-study h3 { margin: .5rem 0 .34rem; color: #292d34; font-size: 1.04rem; letter-spacing: -.025em; text-wrap: balance; }.notion-case-study p { margin: 0; font-size: .62rem; line-height: 1.6; text-wrap: pretty; }.notion-case-study > header p { color: #5e646d; }.notion-case-study > section { margin-top: .74rem; padding-bottom: .72rem; border-bottom: 1px solid #e1e2e5; }.notion-case-study > section small,.notion-case-study footer small { display: block; margin-bottom: .26rem; color: #6c727c; font-size: .47rem; font-weight: 760; letter-spacing: .045em; text-transform: uppercase; }.notion-case-study > section p { color: #454a52; }.notion-case-study > section.notion-case-study-value { padding: .68rem; border: 0; border-radius: 8px; color: #365d43; background: #eaf4ed; }.notion-case-study-value small { color: #4d765a !important; }.notion-case-study-value p { color: #365d43 !important; font-weight: 620; }.notion-case-study footer { margin-top: .84rem; padding-top: .74rem; border-top: 1px solid #dedfe3; }.notion-case-study footer b { display: block; color: #343941; font-size: .57rem; line-height: 1.55; }.notion-case-study footer p { margin-top: .5rem; color: #737982; font-size: .5rem; line-height: 1.55; }
.notion-empty { display: grid; place-items: center; height: 160px; color: #aaa69f; font-size: .62rem; }
.notion-group { display: flex; align-items: center; gap: .38rem; min-width: var(--notion-min-width, 570px); padding: .65rem .42rem .28rem; color: #4e4a45; border-bottom: 1px solid #eceae7; font-size: .56rem; font-weight: 700; }.notion-group span { display: grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; color: #fff; background: #8ab0b9; font-size: .45rem; }.notion-group em { margin-left: .1rem; color: #aaa69f; font-size: .47rem; font-style: normal; font-weight: 500; }
.notion-calendar { min-width: 560px; padding-bottom: .4rem; }.notion-calendar-head { display: grid; grid-template-columns: repeat(7, 1fr); position: sticky; z-index: 1; top: 0; background: #fff; }.notion-calendar-head span { padding: .38rem; color: #99958f; border-right: 1px solid #eceae7; border-bottom: 1px solid #eceae7; font-size: .48rem; text-align: center; }.notion-calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); }.notion-day { min-height: 67px; padding: .3rem; border-right: 1px solid #eceae7; border-bottom: 1px solid #eceae7; background: #fff; }.notion-day--muted { background: #faf9f8; }.notion-day-number { display: block; margin-bottom: .25rem; color: #817d77; font-size: .47rem; }.notion-calendar-task { display: block; width: 100%; margin-top: .2rem; padding: .25rem .3rem; overflow: hidden; border: 0; border-radius: 3px; color: #3d5f75; background: #e1eef5; font-size: .44rem; line-height: 1.2; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }.notion-calendar-task:hover { background: #d1e5ef; }
.notion-board { display: flex; align-items: flex-start; gap: .65rem; min-width: max-content; padding: .65rem .05rem 1rem; }.notion-board-column { width: 205px; padding: .48rem; border-radius: 7px; background: #f5f4f2; }.notion-board-column > header { display: flex; align-items: center; gap: .35rem; min-height: 24px; padding: 0 .15rem .42rem; color: #57534d; font-size: .56rem; }.notion-board-column > header span { display: grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; color: #fff; background: #8eaaa9; font-size: .44rem; font-weight: 750; }.notion-board-column > header b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.notion-board-column > header em { margin-left: auto; color: #9a9690; font-size: .49rem; font-style: normal; }.notion-board-column > div { display: grid; gap: .42rem; }.notion-board-card { position: relative; display: block; width: 100%; padding: .62rem; border: 1px solid #e7e4df; border-radius: 6px; color: #37352f; background: #fff; box-shadow: 0 1px 2px rgba(55,53,47,.06); text-align: left; cursor: pointer; }.notion-board-card:hover { border-color: #d8d4ce; box-shadow: 0 3px 9px rgba(55,53,47,.09); transform: translateY(-1px); }.notion-board-card strong { display: flex; gap: .35rem; font-size: .59rem; line-height: 1.35; }.notion-board-card strong > span { flex: 0 0 auto; }.notion-board-card p { display: flex; flex-wrap: wrap; gap: .2rem; margin: .48rem 0; }.notion-board-card footer { display: flex; align-items: center; justify-content: space-between; gap: .4rem; color: #8f8b84; font-size: .48rem; }.notion-board-card footer time { white-space: nowrap; }.notion-board-card small { display: block; margin-top: .4rem; color: #a34848; font-size: .46rem; font-weight: 650; }.notion-board-card .notion-assignee i { width: 15px; height: 15px; }
.notion-client-gallery { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)); gap: .65rem; padding: .72rem .05rem 1rem; }.notion-client-card { position: relative; overflow: hidden; padding: 0; border: 1px solid #dedbd6; border-radius: 9px; color: #37352f; background: #fff; box-shadow: 0 2px 8px rgba(55,53,47,.06); text-align: left; cursor: pointer; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }.notion-client-card:hover { z-index: 1; border-color: #c9c5bf; box-shadow: 0 10px 26px rgba(55,53,47,.14); transform: translateY(-3px); }.notion-client-card:focus-visible { outline: 2px solid #2383e2; outline-offset: 2px; }.notion-client-cover { position: relative; display: grid; place-items: center; height: 82px; overflow: hidden; color: #fff; background: radial-gradient(circle at 32% 32%, rgba(71,207,238,.85), transparent 30%), radial-gradient(circle at 78% 68%, rgba(36,144,200,.88), transparent 32%), linear-gradient(135deg, #08265d, #0d4588); }.notion-client-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 28%, rgba(255,255,255,.14) 48%, transparent 66%); transform: translateX(-100%); transition: transform .5s ease; }.notion-client-card:hover .notion-client-cover::after { transform: translateX(100%); }.notion-client-card--2 .notion-client-cover { background: radial-gradient(circle at 75% 24%, rgba(96,204,194,.78), transparent 31%), radial-gradient(circle at 22% 82%, rgba(47,126,178,.85), transparent 34%), linear-gradient(135deg, #0b3156, #167991); }.notion-client-card--3 .notion-client-cover { background: radial-gradient(circle at 30% 36%, rgba(125,186,221,.86), transparent 30%), radial-gradient(circle at 77% 72%, rgba(46,111,184,.78), transparent 34%), linear-gradient(135deg, #132c68, #275ca8); }.notion-client-card--4 .notion-client-cover { background: radial-gradient(circle at 70% 31%, rgba(117,210,220,.8), transparent 30%), radial-gradient(circle at 26% 78%, rgba(36,139,180,.76), transparent 34%), linear-gradient(135deg, #123567, #17667e); }.notion-client-cover > i { position: relative; z-index: 1; display: grid; place-items: center; width: 39px; height: 39px; border: 1px solid rgba(255,255,255,.55); border-radius: 11px; background: rgba(255,255,255,.13); box-shadow: 0 9px 25px rgba(1,25,56,.22), inset 0 1px rgba(255,255,255,.42); font-size: .72rem; font-style: normal; font-weight: 800; letter-spacing: .04em; backdrop-filter: blur(10px); }.notion-client-cover > small { position: absolute; right: .45rem; bottom: .35rem; left: .45rem; overflow: hidden; color: rgba(255,255,255,.72); font-size: .42rem; text-align: center; text-overflow: ellipsis; white-space: nowrap; }.notion-client-card-body { display: block; padding: .58rem .62rem .5rem; }.notion-client-card-body > strong { display: flex; min-height: 2.2em; gap: .3rem; font-size: .62rem; line-height: 1.25; }.notion-client-card-body > strong i { font-style: normal; }.notion-client-card-meta { display: flex; align-items: center; justify-content: space-between; gap: .3rem; margin: .45rem 0 .38rem; }.notion-client-card-meta .notion-assignee { font-size: .48rem; }.notion-client-card-body > small { display: block; overflow: hidden; color: #928d86; font-size: .45rem; text-overflow: ellipsis; white-space: nowrap; }.notion-client-open { display: flex; align-items: center; justify-content: space-between; padding: .4rem .62rem; border-top: 1px solid #efedea; color: #77726c; background: #faf9f7; font-size: .45rem; font-weight: 650; }.notion-client-open i { color: #2383e2; font-size: .6rem; font-style: normal; }
.notion-client-page { position: absolute; z-index: 7; inset: 0; overflow: auto; color: #37352f; background: #fff; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .2s ease, transform .28s var(--ease), visibility 0s .28s; }.notion-client-page[aria-hidden="false"] { opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 0s; }.notion-client-page-nav { position: sticky; z-index: 4; top: 0; display: flex; align-items: center; justify-content: space-between; min-height: 38px; padding: 0 .9rem; border-bottom: 1px solid rgba(220,217,212,.9); background: rgba(255,255,255,.86); backdrop-filter: blur(16px) saturate(1.4); }.notion-client-page-nav button { padding: .3rem .42rem; border: 0; border-radius: 5px; color: #625e58; background: transparent; font: inherit; font-size: .55rem; font-weight: 650; cursor: pointer; }.notion-client-page-nav button:hover { background: #f0efed; }.notion-client-page-nav > span { color: #aaa59e; font-size: .45rem; }.notion-client-hero { padding-bottom: .85rem; }.notion-client-hero-cover { position: relative; display: flex; align-items: end; justify-content: space-between; height: 112px; padding: .75rem 1.25rem; overflow: hidden; color: #fff; background: radial-gradient(circle at 24% 28%, rgba(69,204,235,.9), transparent 28%), radial-gradient(circle at 78% 62%, rgba(52,143,207,.8), transparent 32%), linear-gradient(135deg, #082657, #0c5c89); }.notion-client-hero-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(255,255,255,.08), transparent 42%, rgba(255,255,255,.1)); }.notion-client-hero-cover > span { position: relative; z-index: 1; display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid rgba(255,255,255,.62); border-radius: 15px; background: rgba(255,255,255,.15); box-shadow: 0 12px 30px rgba(2,25,53,.24), inset 0 1px rgba(255,255,255,.45); font-size: 1rem; font-weight: 800; backdrop-filter: blur(12px); }.notion-client-hero-cover > small { position: relative; z-index: 1; font-size: .48rem; letter-spacing: .05em; text-transform: uppercase; opacity: .78; }.notion-client-identity { display: grid; grid-template-columns: 48px 1fr; gap: .7rem; margin: -.2rem 1.25rem 0; padding-top: .85rem; }.notion-client-identity > span { display: grid; place-items: center; width: 48px; height: 48px; border: 4px solid #fff; border-radius: 14px; background: #f1efec; box-shadow: 0 4px 13px rgba(55,53,47,.12); font-size: 1.25rem; transform: translateY(-1.35rem); }.notion-client-identity small { color: #aaa59e; font-size: .43rem; font-weight: 750; letter-spacing: .1em; }.notion-client-identity h2 { margin: .12rem 0 .15rem; font-size: 1.42rem; letter-spacing: -.035em; }.notion-client-identity p { max-width: 560px; margin: 0; color: #77726c; font-size: .57rem; line-height: 1.45; }.notion-client-overview { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: .85rem; padding: 0 1.25rem 1.15rem; }.notion-client-property-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; border: 1px solid #e8e5e1; border-radius: 8px; }.notion-client-property-grid article { min-height: 58px; padding: .55rem .62rem; border-right: 1px solid #ece9e5; border-bottom: 1px solid #ece9e5; }.notion-client-property-grid article:nth-child(3n) { border-right: 0; }.notion-client-property-grid article:nth-last-child(-n+2) { border-bottom: 0; }.notion-client-property-grid article > small { display: block; margin-bottom: .3rem; color: #99948d; font-size: .45rem; }.notion-client-property-grid article > b, .notion-client-property-grid article > a { display: block; overflow: hidden; color: #49453f; font-size: .53rem; font-weight: 600; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }.notion-client-property-grid article > a { color: #2383e2; text-decoration: none; }.notion-client-property-wide { grid-column: span 3; border-right: 0 !important; }.notion-client-property-wide > div { display: flex; flex-wrap: wrap; }.notion-client-system-note { align-self: start; display: grid; grid-template-columns: 27px 1fr; gap: .5rem; padding: .72rem; border: 1px solid #d9e7f4; border-radius: 8px; background: linear-gradient(145deg, #eef6fd, #f9fcff); }.notion-client-system-note > span { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 7px; color: #fff; background: #2383e2; font-size: .75rem; }.notion-client-system-note b { font-size: .58rem; }.notion-client-system-note p { margin: .25rem 0 0; color: #6f7d8d; font-size: .49rem; line-height: 1.5; }.notion-client-systems { display: grid; gap: .78rem; padding: 0 1.25rem 1.1rem; }.notion-client-system { overflow: hidden; border: 1px solid #e4e1dc; border-radius: 8px; background: #fff; }.notion-client-system > header { display: grid; grid-template-columns: 30px 1fr auto; align-items: center; gap: .5rem; padding: .58rem .68rem; background: #f7f6f3; }.notion-client-system > header > span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 7px; background: #fff; box-shadow: 0 1px 4px rgba(55,53,47,.09); }.notion-client-system h3 { margin: 0; font-size: .63rem; }.notion-client-system header p { margin: .12rem 0 0; color: #928d86; font-size: .45rem; }.notion-client-system header em { display: grid; place-items: center; min-width: 21px; height: 21px; padding: 0 .25rem; border-radius: 999px; color: #77726c; background: #e6e3df; font-size: .47rem; font-style: normal; }.notion-client-synced-list { min-width: 560px; }.notion-client-synced-row { display: grid; grid-template-columns: 23px minmax(150px, 1fr) auto 72px 82px; align-items: center; gap: .4rem; min-height: 44px; padding: .38rem .62rem; border-top: 1px solid #efedea; }.notion-client-synced-row:first-child { border-top: 0; }.notion-client-synced-row:hover { background: #fbfaf8; }.notion-client-synced-icon { font-size: .66rem; }.notion-client-synced-row > div { min-width: 0; }.notion-client-synced-row > div b, .notion-client-synced-row > div small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.notion-client-synced-row > div b { font-size: .54rem; }.notion-client-synced-row > div small { margin-top: .14rem; color: #99948d; font-size: .43rem; }.notion-client-synced-owner, .notion-client-synced-row time { overflow: hidden; color: #77726c; font-size: .45rem; text-overflow: ellipsis; white-space: nowrap; }.notion-client-empty { display: grid; grid-template-columns: 25px 1fr; align-items: center; gap: .5rem; padding: .68rem; border-top: 1px solid #efedea; color: #918c85; }.notion-client-empty > span { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; color: #4d8a63; background: #e3f1e8; }.notion-client-empty b, .notion-client-empty small { display: block; }.notion-client-empty b { color: #66615b; font-size: .52rem; }.notion-client-empty small { margin-top: .12rem; font-size: .45rem; }.notion-client-page-foot { padding: .7rem 1.25rem 1rem; color: #aaa59e; font-size: .45rem; text-align: center; }
.notion-schema-panel { position: absolute; z-index: 6; top: 0; right: 0; bottom: 0; width: min(390px, 86%); overflow: auto; padding: 1.45rem 1rem 1rem; border-left: 1px solid #dfdcd8; background: rgba(255,255,255,.97); box-shadow: -18px 0 42px rgba(55,50,45,.14); transform: translateX(105%); transition: transform .28s var(--ease); }.notion-schema-panel[aria-hidden="false"] { transform: translateX(0); }.notion-schema-close { position: absolute; top: .55rem; right: .65rem; width: 26px; height: 26px; border: 0; border-radius: 5px; color: #77716a; background: transparent; font-size: 1rem; cursor: pointer; }.notion-schema-close:hover { background: #f0efed; }.notion-schema-kicker { color: #9a9690; font-size: .48rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }.notion-schema-panel h3 { margin: .3rem 0 .45rem; font-size: 1.18rem; letter-spacing: -.03em; }.notion-schema-intro { margin: 0; color: #77726c; font-size: .57rem; line-height: 1.5; }.notion-schema-summary { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .35rem; margin: .85rem 0; padding: .62rem .68rem; border: 1px solid #e8e5e1; border-radius: 7px; background: #f7f6f3; }.notion-schema-summary b { font-size: 1.05rem; }.notion-schema-summary span { color: #5f5a54; font-size: .54rem; }.notion-schema-summary i { color: #908b84; font-size: .48rem; font-style: normal; }.notion-property-list { display: grid; gap: .36rem; }.notion-property-item { display: grid; grid-template-columns: 27px 1fr; gap: .48rem; padding: .55rem; border: 1px solid #ece9e5; border-radius: 6px; background: #fff; }.notion-property-icon { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 5px; color: #68635d; background: #f0efed; font-size: .52rem; font-weight: 700; }.notion-property-item > div { display: grid; grid-template-columns: 1fr auto; min-width: 0; gap: .12rem .45rem; }.notion-property-item b { overflow: hidden; font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }.notion-property-item small { color: #96918a; font-size: .46rem; }.notion-property-item p { grid-column: 1 / -1; margin: .12rem 0 0; color: #77726c; font-size: .5rem; line-height: 1.42; }
.notion-badges-panel { position: absolute; z-index: 6; inset: 0; overflow: auto; padding: 1.5rem 1.35rem 1.2rem; background: rgba(249,248,246,.98); opacity: 0; transform: translateY(12px) scale(.985); visibility: hidden; transition: opacity .22s ease, transform .28s var(--ease), visibility 0s .28s; }.notion-badges-panel[aria-hidden="false"] { opacity: 1; transform: translateY(0) scale(1); visibility: visible; transition-delay: 0s; }.notion-badges-close { position: absolute; top: .65rem; right: .75rem; width: 27px; height: 27px; border: 0; border-radius: 5px; color: #77716a; background: transparent; font-size: 1rem; cursor: pointer; }.notion-badges-close:hover { background: #eceae7; }.notion-badges-panel h3 { margin: .3rem 0 .3rem; font-size: 1.35rem; letter-spacing: -.035em; }.notion-badges-intro { max-width: 510px; margin: 0 0 1rem; color: #77726c; font-size: .59rem; line-height: 1.5; }.notion-badge-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }.notion-badge-card { overflow: hidden; border: 1px solid #e3e0db; border-radius: 9px; color: #37352f; background: #fff; box-shadow: 0 3px 12px rgba(55,53,47,.06); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }.notion-badge-card:hover { transform: translateY(-3px); box-shadow: 0 10px 25px rgba(55,53,47,.12); }.notion-badge-card img { display: block; width: 100%; aspect-ratio: 1.5; object-fit: cover; border-bottom: 1px solid #ece9e5; }.notion-badge-card > div { position: relative; padding: .68rem; }.notion-badge-card > div > span { position: absolute; top: .68rem; right: .68rem; color: #aaa59e; font-size: .44rem; }.notion-badge-card b { display: block; font-size: .68rem; }.notion-badge-card p { min-height: 3.8em; margin: .3rem 0 .55rem; color: #77726c; font-size: .5rem; line-height: 1.45; }.notion-badge-card small { color: #2383e2; font-size: .48rem; font-weight: 650; }
.notion-detail { position: absolute; z-index: 5; top: 0; right: 0; bottom: 0; width: min(310px, 78%); overflow: auto; padding: 2rem 1.2rem 1.2rem; border-left: 1px solid #dfdcd8; background: #fff; box-shadow: -16px 0 35px rgba(55,50,45,.12); transform: translateX(105%); transition: transform .28s var(--ease); }.notion-detail[aria-hidden="false"] { transform: translateX(0); }.notion-detail-close { position: absolute; top: .65rem; right: .7rem; width: 24px; height: 24px; border: 0; border-radius: 5px; color: #77716a; background: transparent; font-size: 1rem; cursor: pointer; }.notion-detail-close:hover { background: #f0efed; }
.notion-detail-icon { font-size: 1.6rem; }.notion-detail h3 { margin: .45rem 0 1rem; font-size: 1.25rem; line-height: 1.15; letter-spacing: -.03em; }.notion-properties { display: grid; grid-template-columns: 80px 1fr; gap: .55rem; padding-bottom: 1rem; border-bottom: 1px solid #eceae7; font-size: .57rem; }.notion-properties dt { color: #9a9690; }.notion-properties dd { margin: 0; }.notion-detail h4 { margin: 1rem 0 .4rem; font-size: .6rem; }.notion-detail-copy { margin: 0; color: #625e58; font-size: .6rem; line-height: 1.55; }
.notion-client-page:focus { outline: 0; }.notion-client-page-nav { min-height: 32px; padding: 0 .7rem; background: rgba(255,255,255,.94); }.notion-client-page-nav button { color: #6d6963; font-size: .48rem; font-weight: 600; }.notion-client-page-nav > span { font-size: .42rem; }
.notion-native-page { width: min(100%, 820px); margin: 0 auto; padding: 1.6rem 1.35rem 1rem; }.notion-native-title { margin-bottom: .8rem; }.notion-native-page-icon { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: .75rem; border: 3px solid #e5e3df; border-radius: 50%; background: #eff2f1; box-shadow: inset 0 0 0 2px #81b8c2; font-size: 1.35rem; }.notion-native-title h2 { margin: 0; font-size: 1.38rem; letter-spacing: -.035em; }.notion-native-title > button { margin-top: .22rem; padding: 0; border: 0; color: #9b9791; background: transparent; font: inherit; font-size: .44rem; cursor: pointer; }.notion-native-title > button:hover { color: #37352f; text-decoration: underline; }
.notion-native-properties { display: grid; gap: .05rem; max-width: 650px; padding-bottom: .75rem; }.notion-native-properties > div { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: start; min-height: 26px; padding: .22rem .2rem; border-radius: 4px; }.notion-native-properties > div:hover { background: #f7f6f3; }.notion-native-properties > div > span { overflow: hidden; color: #88847e; font-size: .48rem; text-overflow: ellipsis; white-space: nowrap; }.notion-native-properties p { display: flex; flex-wrap: wrap; align-items: center; min-width: 0; gap: .2rem; margin: 0; color: #4b4741; font-size: .49rem; line-height: 1.45; }.notion-native-properties p > a { color: #4b4741; text-decoration: underline; text-decoration-color: #aaa59e; text-underline-offset: 2px; }.notion-native-property-notes p { white-space: normal; }.notion-native-extra-property[hidden] { display: none; }.notion-native-file { padding: .14rem .32rem; border-radius: 3px; background: #eceae7; }.notion-native-more { justify-self: start; margin: .14rem 0 0 .15rem; padding: .18rem .28rem; border: 0; border-radius: 4px; color: #9a9690; background: transparent; font: inherit; font-size: .45rem; cursor: pointer; }.notion-native-more:hover { color: #5f5a54; background: #f1f0ee; }
.notion-native-comment { display: flex; align-items: center; gap: .45rem; width: 100%; margin: .2rem 0 1rem; padding: .45rem .18rem .65rem; border: 0; border-bottom: 1px solid #e6e3df; color: #a09c95; background: transparent; font: inherit; font-size: .48rem; text-align: left; cursor: pointer; }.notion-native-comment > span { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #e9e7e3; font-size: .6rem; }.notion-native-comment:hover { color: #66615b; }
.notion-native-linked-layout { display: grid; grid-template-columns: 125px minmax(0, 1fr); align-items: start; gap: .7rem; }.notion-native-side-column { display: grid; gap: .65rem; }.notion-native-callout { padding: .58rem; border-radius: 5px; background: #efeeeb; }.notion-native-callout h3 { margin: 0 0 .42rem; padding-bottom: .3rem; border-bottom: 1px solid rgba(80,76,70,.13); font-size: .58rem; }.notion-native-callout p { margin: 0; color: #6d6963; font-size: .44rem; line-height: 1.45; }.notion-native-callout > span { display: block; margin-bottom: .35rem; padding: .24rem .3rem; border-radius: 3px; color: #fff; background: rgba(39,76,110,.72); font-size: .4rem; }.notion-native-callout > div { display: grid; gap: .18rem; padding: .4rem; border-radius: 4px; background: rgba(255,255,255,.22); }.notion-native-callout > div b { overflow: hidden; font-size: .45rem; text-overflow: ellipsis; white-space: nowrap; }.notion-native-callout > div small { color: #77726c; font-size: .4rem; }.notion-native-callout--shoots, .notion-native-callout--reports { color: #fff; background: #335f86; }.notion-native-callout--shoots h3, .notion-native-callout--reports h3 { border-color: rgba(255,255,255,.18); }.notion-native-callout--shoots > div small, .notion-native-callout--reports > div small { color: rgba(255,255,255,.7); }.notion-native-callout--reports { background: #356b94; }
.notion-native-linked-layout .notion-client-systems { display: grid; gap: .9rem; min-width: 0; padding: 0; }.notion-native-linked-layout .notion-client-system { overflow: hidden; border: 0; border-radius: 0; background: transparent; }.notion-native-linked-layout .notion-client-system > header { display: flex; align-items: center; gap: .4rem; min-height: 32px; padding: .45rem .55rem; border-radius: 4px; background: #efeeeb; }.notion-native-linked-layout .notion-client-system > header > span { display: inline; width: auto; height: auto; border-radius: 0; background: transparent; box-shadow: none; font-size: .62rem; }.notion-native-linked-layout .notion-client-system h3 { margin: 0; font-size: .62rem; }.notion-native-db-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .5rem; min-width: 560px; padding: .3rem .2rem; }.notion-native-db-toolbar > div { display: flex; align-items: center; gap: .16rem; }.notion-native-db-toolbar button { padding: .2rem .3rem; border: 0; border-radius: 3px; color: #77726c; background: transparent; font: inherit; font-size: .42rem; cursor: pointer; }.notion-native-db-toolbar button:hover, .notion-native-db-toolbar button.active { color: #37352f; background: #eeece9; }.notion-native-db-toolbar > div:last-child > span { color: #94908a; font-size: .46rem; }.notion-native-db-toolbar > div:last-child > button { color: #fff; background: #2383e2; font-weight: 700; }.notion-native-db-scroll { min-width: 560px; overflow: hidden; border-top: 1px solid #dedbd6; }.notion-native-db-head, .notion-native-db-row { display: grid; grid-template-columns: minmax(175px, 1.45fr) 78px 76px 88px 86px; align-items: stretch; width: 100%; }.notion-native-db-head { color: #8e8982; background: #fff; }.notion-native-db-head > span, .notion-native-db-row > span { display: flex; align-items: center; min-width: 0; min-height: 26px; padding: .25rem .34rem; overflow: hidden; border-right: 1px solid #e8e5e1; border-bottom: 1px solid #e8e5e1; font-size: .42rem; text-overflow: ellipsis; white-space: nowrap; }.notion-native-db-head > span:last-child, .notion-native-db-row > span:last-child { border-right: 0; }.notion-native-db-row { border: 0; color: #37352f; background: transparent; text-align: left; cursor: pointer; }.notion-native-db-row:hover { background: #f7f6f3; }.notion-native-db-row > span:first-child { font-weight: 600; }.notion-native-db-row .notion-tag { font-size: .39rem; }.notion-native-db-row .notion-assignee { font-size: .4rem; }.notion-native-db-row .notion-assignee i { width: 14px; height: 14px; font-size: .35rem; }.notion-native-db-empty { display: flex; align-items: center; min-height: 30px; gap: .25rem; padding: .3rem .34rem; border-bottom: 1px solid #e8e5e1; color: #aaa59e; font-size: .42rem; }.notion-native-new-page { width: 100%; padding: .3rem .34rem; border: 0; color: #a09c95; background: transparent; font: inherit; font-size: .42rem; text-align: left; cursor: pointer; }.notion-native-new-page:hover { color: #66615b; background: #f7f6f3; }
.notion-native-page .notion-client-page-foot { padding: .8rem 0 0; font-size: .4rem; text-align: left; }
.photos-window { top: 5.5%; left: 5%; width: min(1240px, 90vw); height: min(790px, 87vh); background: rgba(245,246,248,.9); }
.photos-app { position: relative; display: grid; min-width: 0; min-height: 0; grid-template-columns: 188px minmax(0,1fr); overflow: hidden; background: #f5f6f8; }
.photos-sidebar { display: flex; min-height: 0; flex-direction: column; padding: .78rem .58rem; border-right: 1px solid #dfe2e7; background: rgba(238,239,242,.94); }
.photos-sidebar-title { display: grid; grid-template-columns: 30px minmax(0,1fr); align-items: center; gap: .48rem; padding: .15rem .36rem .75rem; }
.photos-sidebar-title > span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 8px; background: linear-gradient(145deg,#fff,#e1e3e8); box-shadow: 0 3px 9px rgba(40,44,53,.1); font-size: .8rem; }
.photos-sidebar-title b,.photos-sidebar-title small { display: block; }.photos-sidebar-title b { font-size: .62rem; }.photos-sidebar-title small { margin-top: .1rem; color: #9398a2; font-size: .43rem; }
.photos-sidebar > small { margin: .45rem .42rem .3rem; color: #989da6; font-size: .41rem; font-weight: 760; letter-spacing: .09em; }
.photos-sidebar > button { display: grid; grid-template-columns: 24px minmax(0,1fr); align-items: center; gap: .42rem; width: 100%; margin-bottom: .12rem; padding: .48rem .42rem; border: 0; border-radius: 7px; color: #5f6570; background: transparent; text-align: left; cursor: pointer; }
.photos-sidebar > button:hover,.photos-sidebar > button.active { color: #202633; background: rgba(204,208,216,.65); }
.photos-sidebar > button > span { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 6px; color: #fff; background: linear-gradient(145deg,#6bb4ed,#7968d8); font-size: .62rem; }
.photos-sidebar button b,.photos-sidebar button small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.photos-sidebar button b { font-size: .54rem; }.photos-sidebar button small { margin-top: .08rem; color: #959aa4; font-size: .4rem; }
.photos-sidebar-note { display: grid; grid-template-columns: 17px 1fr; gap: .38rem; margin-top: auto; padding: .55rem .45rem; border: 1px solid #d9dce2; border-radius: 8px; color: #707680; background: rgba(255,255,255,.55); }.photos-sidebar-note > span { display: grid; width: 17px; height: 17px; place-items: center; border-radius: 50%; color: #fff; background: #7e8998; font-size: .4rem; }.photos-sidebar-note p { margin: 0; font-size: .4rem; line-height: 1.45; }.photos-sidebar-note b { color: #4d535d; }
.photos-library { min-width: 0; min-height: 0; overflow: auto; padding: 1rem 1rem 1.3rem; background: rgba(252,252,253,.96); }
.photos-library-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: .82rem; }.photos-library-head > div > span { color: #8e949e; font-size: .43rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }.photos-library-head h2 { margin: .16rem 0 .18rem; font-size: 1.35rem; letter-spacing: -.045em; }.photos-library-head p { max-width: 520px; margin: 0; color: #7b818b; font-size: .52rem; line-height: 1.45; }.photos-library-head em { flex: none; color: #9297a0; font-size: .48rem; font-style: normal; }
.photos-grid { display: grid; grid-template-columns: repeat(3,minmax(150px,1fr)); gap: .62rem; }
.photos-grid figure { min-width: 0; margin: 0; animation: photoIn .25s ease; }.photos-grid figure[hidden] { display: none; }
.photos-grid figure > button { display: block; width: 100%; aspect-ratio: 4/5; padding: 0; overflow: hidden; border: 0; border-radius: 10px; background: #e7e7e8; box-shadow: 0 4px 13px rgba(34,39,48,.08); cursor: zoom-in; }
.photos-grid img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s var(--ease),filter .25s ease; }.photos-grid figure:hover img { filter: saturate(1.04); transform: scale(1.025); }
.photos-grid figcaption { padding: .38rem .12rem .12rem; }.photos-grid figcaption b,.photos-grid figcaption span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.photos-grid figcaption b { color: #343943; font-size: .52rem; }.photos-grid figcaption span { margin-top: .1rem; color: #959aa3; font-size: .4rem; }
.photos-lightbox { position: absolute; z-index: 20; inset: 0; display: grid; grid-template-columns: 52px minmax(0,1fr) 52px; align-items: center; padding: 3.35rem 1rem .9rem; color: #fff; background: rgba(20,22,27,.94); opacity: 0; pointer-events: none; transform: scale(.985); transition: opacity .2s ease,transform .25s var(--ease); }.photos-lightbox.is-open { opacity: 1; pointer-events: auto; transform: scale(1); }.photos-lightbox > figure { display: grid; width: 100%; height: 100%; min-width: 0; min-height: 0; grid-template-rows: minmax(0,1fr) auto; margin: 0; }.photos-lightbox-canvas { min-width: 0; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-color: rgba(255,255,255,.28) transparent; }.photos-lightbox-image-stage { display: grid; width: max-content; min-width: 100%; height: max-content; min-height: 100%; place-items: center; }.photos-lightbox img { display: block; max-width: none; max-height: none; border-radius: 8px; object-fit: contain; box-shadow: 0 10px 32px rgba(0,0,0,.42); }.photos-lightbox figcaption { width: 100%; padding-top: .55rem; text-align: center; }.photos-lightbox figcaption b,.photos-lightbox figcaption span { display: block; }.photos-lightbox figcaption b { font-size: .7rem; }.photos-lightbox figcaption span { margin-top: .12rem; color: rgba(255,255,255,.68); font-size: .45rem; }.photos-lightbox-close,.photos-lightbox-nav,.photos-lightbox-zoom button { border: 0; color: #fff; background: rgba(255,255,255,.1); cursor: pointer; backdrop-filter: blur(10px); }.photos-lightbox-close { position: absolute; top: .75rem; right: .75rem; display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; font-size: 1rem; }.photos-lightbox-nav { display: grid; width: 34px; height: 48px; place-items: center; justify-self: center; border-radius: 9px; font-size: 1.5rem; }.photos-lightbox-close:hover,.photos-lightbox-nav:hover,.photos-lightbox-zoom button:hover { background: rgba(255,255,255,.2); }.photos-lightbox-zoom { position: absolute; top: .68rem; left: 50%; display: flex; align-items: center; overflow: hidden; border-radius: 8px; background: rgba(45,47,53,.78); box-shadow: 0 4px 8px rgba(0,0,0,.22); transform: translateX(-50%); backdrop-filter: blur(14px); }.photos-lightbox-zoom button { min-width: 30px; height: 31px; padding: 0 .48rem; border-radius: 0; font: inherit; font-size: .75rem; }.photos-lightbox-zoom output { min-width: 48px; padding: 0 .45rem; color: rgba(255,255,255,.88); font-size: .48rem; text-align: center; font-variant-numeric: tabular-nums; }.photos-lightbox-zoom .photos-lightbox-fit { min-width: 42px; box-shadow: inset 1px 0 rgba(255,255,255,.12); font-size: .48rem; font-weight: 650; }.photos-lightbox-zoom button:disabled { color: rgba(255,255,255,.3); cursor: default; }
@media (prefers-reduced-motion: reduce) { .photos-lightbox img { transition: none; } }
@keyframes photoIn { from { opacity: .3; transform: translateY(4px); } }

.dashboard-window { top: 5.5%; left: 3%; width: min(1440px, 94vw); height: min(820px, 88vh); }.dashboard-library { display: grid; grid-template-columns: 190px minmax(0, 1fr); overflow: hidden; background: #edf1f7; }.dashboard-library-sidebar { display: flex; min-height: 0; flex-direction: column; padding: .75rem .58rem; border-right: 1px solid #dce2eb; background: rgba(248,250,253,.96); }.dashboard-library-brand { display: grid; grid-template-columns: 31px minmax(0, 1fr); align-items: center; gap: .5rem; padding: .15rem .35rem .8rem; }.dashboard-library-brand > span { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 9px; color: #fff; background: linear-gradient(145deg, #315f9e, #6a8fc2); box-shadow: 0 5px 12px rgba(34,72,122,.2); font-size: .55rem; font-weight: 800; }.dashboard-library-brand b, .dashboard-library-brand small { display: block; }.dashboard-library-brand b { font-size: .63rem; }.dashboard-library-brand small { margin-top: .1rem; color: #9299a4; font-size: .45rem; }.dashboard-library-sidebar > small { margin: .45rem .42rem .3rem; color: #a1a7b0; font-size: .42rem; font-weight: 750; letter-spacing: .08em; }.dashboard-library-sidebar > button { display: grid; grid-template-columns: 25px minmax(0, 1fr); align-items: center; gap: .45rem; width: 100%; margin-bottom: .14rem; padding: .5rem .42rem; border: 0; border-radius: 7px; color: #626a77; background: transparent; text-align: left; cursor: pointer; }.dashboard-library-sidebar > button:hover, .dashboard-library-sidebar > button.active { color: #243047; background: #e5ebf4; }.dashboard-library-sidebar > button > span { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 7px; color: #4775ad; background: #fff; box-shadow: 0 2px 7px rgba(45,67,98,.1); font-size: .7rem; font-weight: 750; }.dashboard-library-sidebar button b, .dashboard-library-sidebar button small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.dashboard-library-sidebar button b { font-size: .55rem; }.dashboard-library-sidebar button small { margin-top: .12rem; color: #9ba1aa; font-size: .41rem; }.dashboard-privacy { display: grid; grid-template-columns: 17px 1fr; gap: .38rem; margin-top: auto; padding: .55rem .45rem; border: 1px solid #dce7df; border-radius: 7px; color: #63736a; background: #f2f8f4; }.dashboard-privacy > span { display: grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; color: #387651; background: #dceee3; font-size: .42rem; }.dashboard-privacy p { margin: 0; font-size: .41rem; line-height: 1.45; }.dashboard-privacy b { color: #41574a; }.dashboard-preview-shell { min-width: 0; overflow: auto; }.dashboard-preview-shell > div { min-width: 700px; padding: 1rem; }
.dashboard-demo-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }.dashboard-demo-header > div:first-child { max-width: 620px; }.dashboard-demo-header span { color: #70809a; font-size: .44rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }.dashboard-demo-header h2 { margin: .16rem 0 .2rem; color: #1d2c48; font-size: 1.35rem; letter-spacing: -.04em; }.dashboard-demo-header p { margin: 0; color: #6f7b8e; font-size: .52rem; line-height: 1.5; }.dashboard-demo-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: .2rem; }.dashboard-demo-header-actions em { margin-right: .3rem; padding: .23rem .4rem; border: 1px solid #d7e7dd; border-radius: 999px; color: #3f7354; background: #eff8f2; font-size: .41rem; font-style: normal; white-space: nowrap; }.dashboard-range { padding: .3rem .46rem; border: 1px solid #d8dee8; color: #717c8e; background: #f7f9fc; font-size: .43rem; cursor: pointer; }.dashboard-range:first-of-type { border-radius: 5px 0 0 5px; }.dashboard-range:last-child { margin-left: -1px; border-radius: 0 5px 5px 0; }.dashboard-range.active { z-index: 1; color: #fff; border-color: #4777b2; background: #4777b2; }
.dashboard-metrics { display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)); gap: .5rem; margin-bottom: .55rem; }.dashboard-metric { display: grid; grid-template-columns: 31px 1fr; align-items: start; gap: .5rem; min-width: 0; padding: .68rem; border: 1px solid #dfe4eb; border-radius: 9px; background: #fff; box-shadow: 0 2px 8px rgba(38,52,75,.04); }.dashboard-metric > span { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 8px; color: #396fae; background: #e8f0fa; font-size: .76rem; }.dashboard-metric--purple > span { color: #765d9d; background: #f0eafa; }.dashboard-metric--amber > span { color: #9b7133; background: #fbf0dc; }.dashboard-metric--green > span { color: #3c7855; background: #e5f3e9; }.dashboard-metric small, .dashboard-metric b, .dashboard-metric p { display: block; }.dashboard-metric small { color: #7c8798; font-size: .43rem; }.dashboard-metric b { margin-top: .12rem; color: #1f2d48; font-size: .95rem; }.dashboard-metric p { margin: .14rem 0 0; overflow: hidden; color: #8791a0; font-size: .39rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-content-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: .55rem; margin-bottom: .55rem; }.dashboard-content-grid--wide { grid-template-columns: 1.45fr .75fr; }.dashboard-panel { min-width: 0; overflow: hidden; border: 1px solid #dfe4eb; border-radius: 9px; background: #fff; box-shadow: 0 2px 8px rgba(38,52,75,.035); }.dashboard-panel > header, .dashboard-modules > header { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .62rem .7rem .45rem; }.dashboard-panel header span, .dashboard-modules header span { display: block; color: #8893a3; font-size: .39rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }.dashboard-panel h3, .dashboard-modules h3 { margin: .12rem 0 0; color: #25334e; font-size: .62rem; }.dashboard-panel header small, .dashboard-modules header small { color: #929ba9; font-size: .4rem; }.dashboard-panel header button, .dashboard-modules header button { padding: .25rem .38rem; border: 1px solid #dce2eb; border-radius: 4px; color: #667185; background: #f8fafc; font-size: .4rem; cursor: pointer; }
.dashboard-bars { display: flex; align-items: end; gap: 4px; height: 112px; padding: .8rem .7rem .3rem; background: repeating-linear-gradient(to top, transparent 0 27px, #edf0f5 28px); }.dashboard-bars i { position: relative; flex: 1; height: var(--bar); min-height: 8px; border-radius: 3px 3px 1px 1px; background: linear-gradient(to top, #4778b5, #72a2d7); }.dashboard-bars i:hover { filter: saturate(1.25); }.dashboard-bars i span { position: absolute; bottom: -13px; left: 50%; color: #a0a8b4; font-size: .32rem; font-style: normal; transform: translateX(-50%); }.dashboard-chart-panel > footer { display: flex; justify-content: space-between; padding: .35rem .7rem .55rem; color: #9ba3ae; font-size: .35rem; }.dashboard-source-panel { display: grid; grid-template-columns: 1fr 1.1fr; align-items: center; }.dashboard-source-panel > header { grid-column: 1 / -1; }.dashboard-donut { display: grid; place-items: center; width: 86px; height: 86px; margin: .35rem auto .7rem; border-radius: 50%; background: conic-gradient(#4c7fbd 0 44%, #8b72b3 44% 76%, #68a27d 76% 92%, #dda752 92%); }.dashboard-donut > div { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #fff; }.dashboard-donut b, .dashboard-donut small { display: block; }.dashboard-donut b { color: #263650; font-size: .74rem; }.dashboard-donut small { color: #9ba3af; font-size: .34rem; }.dashboard-source-panel ul { display: grid; gap: .38rem; margin: 0; padding: .3rem .7rem .7rem .2rem; list-style: none; }.dashboard-source-panel li { display: grid; grid-template-columns: 7px 1fr auto; align-items: center; gap: .3rem; color: #687488; font-size: .4rem; }.dashboard-source-panel li i { width: 7px; height: 7px; border-radius: 2px; background: #4c7fbd; }.dashboard-source-panel li i.is-purple { background: #8b72b3; }.dashboard-source-panel li i.is-green { background: #68a27d; }.dashboard-source-panel li i.is-amber { background: #dda752; }.dashboard-source-panel li b { color: #34425b; }
.dashboard-pipeline { margin-bottom: .55rem; }.dashboard-pipeline-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .42rem; padding: .2rem .65rem .65rem; }.dashboard-pipeline-grid article { padding: .55rem; border: 1px solid #e3e7ed; border-radius: 7px; background: #f8fafc; }.dashboard-pipeline-grid article span, .dashboard-pipeline-grid article b, .dashboard-pipeline-grid article small { display: block; }.dashboard-pipeline-grid article span { color: #7e8999; font-size: .4rem; }.dashboard-pipeline-grid article b { margin: .12rem 0; color: #263650; font-size: .85rem; }.dashboard-pipeline-grid article small { color: #9aa2ad; font-size: .35rem; }
.dashboard-demo-filter { padding: .23rem .36rem; border: 1px solid #dfe4eb; border-radius: 4px; color: #7e8998; background: #f9fafc; font-size: .39rem; }.dashboard-demo-table { min-width: 650px; padding-bottom: .18rem; }.dashboard-demo-table > div { display: grid; grid-template-columns: 1.25fr .75fr .72fr .6fr 1fr; align-items: center; min-height: 34px; border-top: 1px solid #e9ecf1; }.dashboard-demo-table > div.head { min-height: 27px; color: #919aa7; background: #f8fafc; font-size: .38rem; }.dashboard-demo-table > div > span { min-width: 0; padding: .38rem .55rem; overflow: hidden; color: #59667a; font-size: .41rem; text-overflow: ellipsis; white-space: nowrap; }.dashboard-demo-table > div:not(.head) > span:first-child { color: #2d3b54; }.dashboard-demo-table span b, .dashboard-demo-table span small { display: block; overflow: hidden; text-overflow: ellipsis; }.dashboard-demo-table span b { font-size: .43rem; }.dashboard-demo-table span small { margin-top: .06rem; color: #9aa2ae; font-size: .34rem; }.dashboard-demo-table em { padding: .16rem .28rem; border-radius: 999px; font-size: .35rem; font-style: normal; }.tag-green { color: #3d7653; background: #e2f0e6; }.tag-blue { color: #3d6792; background: #e3edf8; }.tag-amber { color: #8b6632; background: #f8edd8; }
.dashboard-capacity > div { padding: .25rem .7rem .65rem; }.dashboard-capacity article { display: grid; grid-template-columns: 75px 1fr 33px; align-items: center; gap: .45rem; min-height: 29px; }.dashboard-capacity article > span, .dashboard-capacity article > b { color: #667286; font-size: .39rem; }.dashboard-capacity article > b { text-align: right; }.dashboard-capacity article > div, .dashboard-workload article > div { height: 7px; overflow: hidden; border-radius: 999px; background: #ebeff4; }.dashboard-capacity article i, .dashboard-workload article em { display: block; width: var(--capacity); height: 100%; border-radius: inherit; background: linear-gradient(90deg, #5b87ba, #7ea7d2); }.dashboard-leave { padding-bottom: .45rem; }.dashboard-mini-calendar { display: grid; grid-template-columns: repeat(5, 1fr); gap: .2rem; padding: .2rem .65rem .55rem; }.dashboard-mini-calendar span, .dashboard-mini-calendar i { display: grid; place-items: center; min-height: 24px; color: #8e98a6; font-size: .38rem; font-style: normal; }.dashboard-mini-calendar i { border-radius: 5px; color: #59667a; background: #f4f6f9; }.dashboard-mini-calendar i.has-leave { color: #866030; background: #faedd7; }.dashboard-leave ul { display: grid; gap: .3rem; margin: 0; padding: 0 .65rem; list-style: none; }.dashboard-leave li { display: grid; grid-template-columns: 22px 1fr; align-items: center; gap: .38rem; }.dashboard-leave li > i { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; background: #6b8db7; font-size: .36rem; font-style: normal; }.dashboard-leave li b, .dashboard-leave li small { display: block; }.dashboard-leave li b { color: #3b4961; font-size: .4rem; }.dashboard-leave li small { color: #969faa; font-size: .35rem; }
.dashboard-attention { margin-bottom: .55rem; padding: .7rem; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #243d68, #426b9f); box-shadow: 0 8px 24px rgba(38,64,105,.18); }.dashboard-attention > header { display: flex; justify-content: space-between; margin-bottom: .55rem; }.dashboard-attention header span { color: rgba(255,255,255,.65); font-size: .4rem; }.dashboard-attention h3 { margin: .1rem 0 0; font-size: .78rem; }.dashboard-attention header small { color: rgba(255,255,255,.55); font-size: .37rem; }.dashboard-attention > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; }.dashboard-attention article { display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: .4rem; padding: .48rem; border: 1px solid rgba(255,255,255,.13); border-radius: 7px; background: rgba(255,255,255,.08); }.dashboard-attention article > i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 6px; background: rgba(255,255,255,.15); font-size: .55rem; font-style: normal; }.dashboard-attention article b, .dashboard-attention article small { display: block; }.dashboard-attention article b { font-size: .42rem; }.dashboard-attention article small { margin-top: .08rem; color: rgba(255,255,255,.62); font-size: .33rem; }.dashboard-attention article button { padding: .2rem .3rem; border: 0; border-radius: 4px; color: #274269; background: #fff; font-size: .34rem; cursor: pointer; }
.dashboard-modules { margin-bottom: .55rem; }.dashboard-modules > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: .42rem; }.dashboard-module { display: grid; grid-template-columns: 29px 1fr auto; align-items: center; gap: .46rem; padding: .58rem; border: 1px solid #dfe4eb; border-radius: 8px; color: #35445d; background: #fff; box-shadow: 0 2px 7px rgba(38,52,75,.035); text-align: left; cursor: pointer; }.dashboard-module:hover { border-color: #c7d3e2; transform: translateY(-1px); }.dashboard-module > span { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 7px; background: #e7eff9; }.dashboard-module b, .dashboard-module strong, .dashboard-module small { display: block; }.dashboard-module b { font-size: .43rem; }.dashboard-module strong { margin-top: .13rem; color: #27364f; font-size: .51rem; }.dashboard-module small { margin-top: .08rem; color: #969faa; font-size: .34rem; }.dashboard-module > i { color: #a1a8b2; font-style: normal; }.dashboard-module--purple > span { background: #efe9f7; }.dashboard-module--green > span { background: #e5f1e8; }.dashboard-module--coral > span { background: #f8e7e5; }.dashboard-module--amber > span { background: #faeedb; }.dashboard-module--teal > span { background: #e1f0f0; }
.dashboard-workload > div { padding: .2rem .7rem .65rem; }.dashboard-workload article { display: grid; grid-template-columns: 22px 78px 1fr 30px; align-items: center; gap: .38rem; min-height: 32px; }.dashboard-workload article > i { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; background: #6c8caf; font-size: .35rem; font-style: normal; }.dashboard-workload article span b, .dashboard-workload article span small { display: block; }.dashboard-workload article span b { color: #3f4d64; font-size: .39rem; }.dashboard-workload article span small { color: #9aa2ad; font-size: .33rem; }.dashboard-workload article em { width: var(--workload); }.dashboard-workload article strong { color: #6d7889; font-size: .38rem; }.dashboard-decisions ul { margin: 0; padding: .15rem .7rem .65rem; list-style: none; }.dashboard-decisions li { display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: .4rem; padding: .35rem 0; border-top: 1px solid #edf0f4; }.dashboard-decisions li:first-child { border-top: 0; }.dashboard-decisions li > span { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 5px; color: #4c749d; background: #e8f0f8; font-size: .38rem; }.dashboard-decisions li b, .dashboard-decisions li small { display: block; }.dashboard-decisions li b { color: #3a4961; font-size: .39rem; }.dashboard-decisions li small { color: #979faa; font-size: .33rem; }.dashboard-decisions time { color: #a0a7b1; font-size: .32rem; }
.dashboard-approval-toolbar { display: flex; align-items: center; justify-content: space-between; margin: .2rem 0 .5rem; }.dashboard-approval-toolbar span { color: #8792a2; font-size: .39rem; text-transform: uppercase; }.dashboard-approval-toolbar h3 { margin: .12rem 0 0; color: #27364f; font-size: .66rem; }.dashboard-approval-toolbar label { color: #778294; font-size: .4rem; }.dashboard-approval-toolbar select { margin-left: .25rem; padding: .28rem .4rem; border: 1px solid #d9e0e9; border-radius: 5px; color: #45536a; background: #fff; font: inherit; font-size: .4rem; }.dashboard-approval-grid { display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: .5rem; }.dashboard-approval-card { overflow: hidden; border: 1px solid #dfe4eb; border-radius: 9px; background: #fff; box-shadow: 0 3px 10px rgba(38,52,75,.05); }.dashboard-approval-visual { position: relative; display: flex; height: 105px; flex-direction: column; justify-content: flex-end; padding: .65rem; overflow: hidden; color: #fff; background: linear-gradient(135deg, #d18b79, #edb69c); }.dashboard-approval-visual--blue { background: linear-gradient(135deg, #4c72a3, #87a9cd); }.dashboard-approval-visual--green { background: linear-gradient(135deg, #56856c, #9bb796); }.dashboard-approval-visual > span { position: absolute; top: .5rem; left: .5rem; padding: .18rem .3rem; border-radius: 999px; background: rgba(255,255,255,.18); font-size: .34rem; backdrop-filter: blur(8px); }.dashboard-approval-visual > i { position: absolute; top: 18%; right: -8%; width: 75px; height: 75px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; box-shadow: 0 0 0 16px rgba(255,255,255,.08), 0 0 0 30px rgba(255,255,255,.04); }.dashboard-approval-visual b { position: relative; z-index: 1; max-width: 90%; font-size: .6rem; line-height: 1.15; }.dashboard-approval-copy { padding: .58rem; }.dashboard-approval-copy header { display: flex; justify-content: space-between; gap: .3rem; }.dashboard-approval-copy small { color: #9099a7; font-size: .32rem; }.dashboard-approval-copy h3 { margin: .1rem 0 0; color: #2c3b54; font-size: .44rem; line-height: 1.3; }.dashboard-approval-copy header em { flex: 0 0 auto; color: #8d744e; font-size: .32rem; font-style: normal; }.dashboard-approval-copy > p { min-height: 3em; margin: .4rem 0; color: #7f8998; font-size: .36rem; line-height: 1.45; }.dashboard-approval-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; }.dashboard-approval-actions button { padding: .34rem .3rem; border: 1px solid #dce2ea; border-radius: 5px; color: #677285; background: #f8fafc; font-size: .36rem; cursor: pointer; }.dashboard-approval-actions button:last-child { color: #fff; border-color: #4777b2; background: #4777b2; }.dashboard-approval-actions > span { align-self: center; color: #477a59; font-size: .37rem; font-weight: 650; }.dashboard-approval-card.needs-revision .dashboard-approval-actions > span { color: #99683c; }.dashboard-approval-card.is-approved { border-color: #bcd9c5; }.dashboard-approval-card.needs-revision { border-color: #e3c8a5; }

/* Full local dashboard previews */
.dashboard-preview-shell { overflow: hidden; }
.dashboard-preview-shell > #dashboard-preview { display: flex; width: 100%; height: 100%; min-width: 0; padding: 0; flex-direction: column; }
.dashboard-live-toolbar { display: flex; min-height: 42px; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 1rem; padding: .45rem .75rem; border-bottom: 1px solid #dce2eb; background: rgba(255,255,255,.96); }
.dashboard-live-toolbar div { display: flex; min-width: 0; align-items: baseline; gap: .45rem; }
.dashboard-live-toolbar span { color: #8c96a5; font-size: .39rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.dashboard-live-toolbar b { overflow: hidden; color: #33425b; font-size: .56rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-live-toolbar small { overflow: hidden; color: #8d97a5; font-size: .38rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-live-toolbar em { flex: none; padding: .2rem .35rem; border-radius: 999px; color: #3f7954; background: #e7f2ea; font-size: .37rem; font-style: normal; font-weight: 700; }
.dashboard-preview-layout { display: grid; min-width: 0; min-height: 0; flex: 1 1 auto; grid-template-columns: minmax(0, 1fr) 264px; overflow: hidden; }
.dashboard-demo-frame { display: block; width: 100%; height: 100%; min-height: 0; border: 0; background: #edf1f7; }
.dashboard-case-study { min-height: 0; overflow: auto; padding: .85rem .8rem 1rem; border-left: 1px solid #dce2eb; color: #4f5c70; background: linear-gradient(180deg, rgba(250,251,253,.98), rgba(242,246,251,.98)); scrollbar-width: thin; }
.dashboard-case-study > header { margin-bottom: .75rem; padding-bottom: .7rem; border-bottom: 1px solid #e0e5ed; }
.dashboard-case-study > header > span { display: inline-flex; padding: .26rem .4rem; border: 1px solid #d7e3f2; border-radius: 999px; color: #426991; background: #edf4fb; font-size: .47rem; font-weight: 750; letter-spacing: .045em; text-transform: uppercase; }
.dashboard-case-study h3 { margin: .5rem 0 .32rem; color: #25344e; font-size: 1.04rem; letter-spacing: -.025em; text-wrap: balance; }
.dashboard-case-study p { margin: 0; font-size: .62rem; line-height: 1.6; text-wrap: pretty; }
.dashboard-case-study > header p { color: #657187; }
.dashboard-case-study > section { position: relative; margin-top: .7rem; padding-left: .68rem; }
.dashboard-case-study > section::before { position: absolute; top: .12rem; bottom: .05rem; left: 0; width: 2px; border-radius: 999px; background: #ced9e7; content: ""; }
.dashboard-case-study > section small, .dashboard-case-study footer small { display: block; margin-bottom: .25rem; color: #707d91; font-size: .47rem; font-weight: 780; letter-spacing: .045em; text-transform: uppercase; }
.dashboard-case-study > section p { color: #46556a; }
.dashboard-case-study > section.dashboard-case-study-outcome { padding: .58rem .62rem; border: 1px solid #d9e5dc; border-radius: 8px; background: #f1f7f3; }
.dashboard-case-study > section.dashboard-case-study-outcome::before { display: none; }
.dashboard-case-study-outcome small { color: #4e725a !important; }
.dashboard-case-study-outcome p { color: #405e49 !important; font-weight: 620; }
.dashboard-case-study footer { margin-top: .75rem; padding-top: .65rem; border-top: 1px solid #e0e5ed; }
.dashboard-case-study footer b { display: block; color: #34445d; font-size: .57rem; line-height: 1.55; }
.dashboard-case-study footer p { margin-top: .48rem; color: #7f8999; font-size: .5rem; line-height: 1.55; }

.dock { position: absolute; z-index: 110; left: 50%; bottom: .8rem; display: flex; align-items: end; gap: .45rem; padding: .45rem .55rem; border: 1px solid rgba(255,255,255,.5); border-radius: 1rem; background: rgba(238,233,227,.53); box-shadow: 0 12px 35px rgba(42,34,29,.2), inset 0 1px rgba(255,255,255,.6); backdrop-filter: blur(20px) saturate(1.3); transform: translateX(-50%); }
.dock-item { position: relative; display: block; padding: 0; border: 0; background: transparent; text-decoration: none; cursor: pointer; transition: transform .2s var(--ease); }.dock-item:hover { transform: translateY(-8px) scale(1.1); }.dock-item small { position: absolute; left: 50%; top: -31px; padding: .28rem .42rem; border-radius: .35rem; color: white; background: rgba(25,24,23,.88); font-size: .56rem; opacity: 0; pointer-events: none; transform: translateX(-50%) translateY(5px); transition: .18s ease; }.dock-item:hover small, .dock-item:focus-visible small { opacity: 1; transform: translateX(-50%) translateY(0); }.dock-icon { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 10px; box-shadow: inset 0 1px rgba(255,255,255,.5), 0 4px 8px rgba(47,38,33,.16); color: white; font-weight: 750; }.dock-icon--app { background-color: transparent; background-position: center; background-repeat: no-repeat; background-size: contain; box-shadow: 0 4px 8px rgba(47,38,33,.18); }.dock-icon--finder { background-image: url("assets/icon-finder.png"); }.dock-icon--notes { background-image: url("assets/icon-notes.png"); }.dock-icon--photos { background-image: url("assets/icon-photos.png"); }.dock-icon--notion { background-image: url("assets/icon-notion.png"); background-size: 94%; }.dock-icon--mail { background: linear-gradient(145deg, #a78cc5, #705797); }.dock-icon--cv { color: #4c4743; background: linear-gradient(145deg, #fffdf5, #e9e1d4); font-size: .7rem; }.dock-divider { width: 1px; height: 35px; margin: 0 .15rem; background: rgba(57,49,44,.2); }
.toast { position: fixed; z-index: 150; left: 50%; bottom: 6rem; padding: .55rem .75rem; border-radius: .5rem; background: rgba(30,29,28,.88); color: white; font-size: .68rem; opacity: 0; transform: translate(-50%, 10px); transition: .25s ease; pointer-events: none; }.toast.show { opacity: 1; transform: translate(-50%, 0); }

@keyframes turn { to { transform: rotate(360deg); } }

@media (max-width: 1180px) {
  .dashboard-preview-layout { grid-template-columns: minmax(0, 1fr) 236px; }
  .dashboard-case-study { padding: .72rem .65rem .85rem; }
  .notion-demo { grid-template-columns: 155px minmax(0,1fr) 218px; }
  .notion-case-study { padding: .76rem .68rem .86rem; }
}

@media (max-width: 900px) {
  .profile-widget { right: 7%; bottom: 14%; width: 242px; height: 360px; }
  .desktop-icons--left { left: 5%; top: 19%; bottom: auto; grid-template-columns: repeat(2, 82px); }.desktop-icons--right { display: none; }
  .project-grid { grid-template-columns: repeat(2, minmax(170px, 1fr)); }
  .window { left: 4%; width: 92vw; }.window--compact { left: 9%; width: 82vw; }.window--note, .window--contact { left: 13%; width: 74vw; }
  .dashboard-window { left: 4%; width: 92vw; }.dashboard-library { grid-template-columns: 165px minmax(0, 1fr); }.dashboard-preview-layout { display: flex; overflow: auto; flex-direction: column; }.dashboard-demo-frame { min-height: 620px; flex: 0 0 74%; }.dashboard-case-study { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; flex: none; border-top: 1px solid #dce2eb; border-left: 0; }.dashboard-case-study > header, .dashboard-case-study > footer { grid-column: 1 / -1; }.dashboard-case-study > header { margin: 0; }.dashboard-case-study > section { margin: 0; }.dashboard-metrics { grid-template-columns: repeat(2, minmax(150px, 1fr)); }.dashboard-approval-grid { grid-template-columns: repeat(2, minmax(190px, 1fr)); }.dashboard-attention > div { grid-template-columns: 1fr; }.dashboard-attention article { grid-template-columns: 24px 1fr 42px; }
  .notion-demo { grid-template-columns: 150px minmax(0,1fr); overflow: auto; }.notion-case-study { grid-column: 1 / -1; display: grid; min-height: 330px; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .68rem; border-top: 1px solid #e2e0dc; border-left: 0; }.notion-case-study > header,.notion-case-study > footer { grid-column: 1 / -1; }.notion-case-study > section { margin-top: 0; }
  .notion-client-overview { grid-template-columns: 1fr; }.notion-client-system-note { grid-template-columns: 27px 1fr; }
  .photos-window { left: 4%; width: 92vw; }.photos-app { grid-template-columns: 155px minmax(0,1fr); }.photos-grid { grid-template-columns: repeat(2,minmax(150px,1fr)); }
}

@media (max-width: 620px) {
  :root { --bar-height: 38px; }
  .menu-left button:not(.apple-mark), .menu-left strong, .status-pill, .menu-right > span[aria-hidden] { display: none; }
  .menu-left, .menu-right { gap: .55rem; }.menu-right { font-size: .7rem; }
  .desktop { min-height: 560px; }
  .profile-widget { width: 210px; height: 318px; min-width: 0; min-height: 0; right: 1rem; bottom: 14%; border-width: 1px; transform: rotate(-.35deg); }.profile-card-top { top: .68rem; left: .55rem; right: .55rem; }.profile-card-top h2 { font-size: 1rem; }.profile-card-top p { margin-top: .1rem; font-size: .43rem; }.profile-photo { inset: 0; border-radius: inherit; }.profile-content { right: .68rem; bottom: .62rem; left: .68rem; grid-template-columns: 1fr; gap: .4rem; }.profile-content .role { display: none; }.profile-avatar { flex-basis: 22px; width: 22px; height: 22px; }.profile-actions { gap: .22rem; }.profile-button { min-height: 28px; padding: .42rem .3rem; font-size: .43rem; border-radius: .52rem; }.profile-button--cv::before { border-radius: calc(.52rem + 3px); }
  .desktop-icons--left { left: .8rem; top: 15%; bottom: auto; grid-template-columns: 72px; gap: .7rem; }.desktop-icon { width: 72px; }.desktop-icons--left .desktop-icon:nth-child(4) { display: none; }.folder-icon { width: 54px; height: 46px; }.desktop-icon > span:last-child { font-size: .62rem; }
  .dock { gap: .25rem; bottom: .5rem; padding: .38rem .44rem; }.dock-icon { width: 38px; height: 38px; }
  .window, .window--compact, .window--note, .window--contact { position: fixed; inset: calc(var(--bar-height) + 6px) 5px 68px; width: auto; height: auto; min-height: 0; border-radius: .8rem; }
  .window-resizer { display: none; }
  .finder-layout { grid-template-columns: 1fr; }.finder-sidebar { display: none; }.project-area { padding: 1rem; }.project-grid { grid-template-columns: 1fr; gap: .4rem; }.project-visual { flex-basis: 64px; width: 64px; height: 50px; }.section-heading h2 { font-size: 1.8rem; }
  .timeline li { grid-template-columns: 85px 1fr; gap: .7rem; }.timeline li b { display: none; }
  .note-body h2 { font-size: 2.4rem; }.note-body { padding: 1.6rem; }
  .contact-body { padding: 0; }.mail-compose-toolbar { min-height: 46px; }.mail-field { grid-template-columns: 50px minmax(0,1fr); }.mail-message textarea { padding: .8rem; }
  .dashboard-library { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }.dashboard-library-sidebar { display: block; overflow-x: auto; padding: .32rem .42rem; border-right: 0; border-bottom: 1px solid #dce2eb; white-space: nowrap; }.dashboard-library-brand, .dashboard-library-sidebar > small, .dashboard-privacy { display: none; }.dashboard-library-sidebar > button { display: inline-grid; width: auto; min-width: 142px; margin: 0 .12rem 0 0; vertical-align: top; }.dashboard-preview-shell > div { min-width: 680px; padding: .75rem; }.dashboard-preview-shell > #dashboard-preview { min-width: 0; padding: 0; }.dashboard-preview-layout { min-width: 680px; }.dashboard-case-study { min-width: 680px; grid-template-columns: 1fr; }.dashboard-case-study > header, .dashboard-case-study > footer { grid-column: auto; }.dashboard-demo-header h2 { font-size: 1.05rem; }.dashboard-demo-header p { max-width: 430px; }.dashboard-content-grid, .dashboard-content-grid--wide { grid-template-columns: 1.2fr .8fr; }.dashboard-modules > div { grid-template-columns: repeat(3, 1fr); }.dashboard-approval-grid { grid-template-columns: repeat(3, minmax(190px, 1fr)); }
  .notion-demo { grid-template-columns: 1fr; grid-template-rows: auto minmax(560px,1fr) auto; }.notion-sidebar { display: block; overflow-x: auto; padding: .3rem .45rem; border-right: 0; border-bottom: 1px solid #e7e5e2; scrollbar-width: none; }.notion-sidebar::-webkit-scrollbar, .notion-workspace-name, .notion-academy-card, .notion-sidebar > small, .notion-privacy { display: none !important; }#notion-database-list { flex-direction: row; width: max-content; }.notion-database-item { width: auto !important; min-width: 128px; }.notion-workspace { padding: .8rem .8rem .55rem; }.notion-case-study { grid-column: auto; min-height: 420px; grid-template-columns: 1fr; }.notion-case-study > header,.notion-case-study > footer { grid-column: auto; }.notion-title-row h2 { font-size: 1.15rem; }.notion-title-row p { max-width: 250px; }.notion-view-tabs button { padding: .4rem .38rem; font-size: .48rem; }.notion-demo-note { text-align: left; }.notion-toolbar { gap: .35rem; }.notion-toolbar-actions { gap: .12rem; }.notion-properties-toggle, .notion-badges-toggle { padding: .25rem .3rem; }.notion-properties-toggle em { display: none; }.notion-badges-toggle { font-size: 0; }.notion-badges-toggle > span { font-size: .55rem; }.notion-search input { width: 70px; }.notion-badges-panel { padding: 1.35rem .75rem .8rem; }.notion-badge-gallery { grid-template-columns: 1fr; }.notion-badge-card { display: grid; grid-template-columns: 112px 1fr; }.notion-badge-card img { height: 100%; aspect-ratio: auto; border-right: 1px solid #ece9e5; border-bottom: 0; }.notion-badge-card p { min-height: 0; }
  .notion-client-gallery { grid-template-columns: repeat(2, minmax(135px, 1fr)); gap: .5rem; }.notion-client-cover { height: 72px; }.notion-client-page-nav { padding: 0 .65rem; }.notion-client-hero-cover { height: 94px; padding: .62rem .75rem; }.notion-client-identity { grid-template-columns: 40px 1fr; margin-right: .75rem; margin-left: .75rem; }.notion-client-identity > span { width: 40px; height: 40px; }.notion-client-identity h2 { font-size: 1.1rem; }.notion-client-overview, .notion-client-systems { padding-right: .75rem; padding-left: .75rem; }.notion-client-property-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.notion-client-property-grid article:nth-child(3n) { border-right: 1px solid #ece9e5; }.notion-client-property-grid article:nth-child(2n) { border-right: 0; }.notion-client-property-wide { grid-column: span 2; }.notion-client-property-grid article:nth-last-child(-n+2) { border-bottom: 1px solid #ece9e5; }.notion-client-property-grid article:last-child { border-bottom: 0; }.notion-client-system { overflow-x: auto; }
  .notion-native-page { padding: 1.1rem .75rem .8rem; }.notion-native-page-icon { width: 40px; height: 40px; margin-bottom: .55rem; font-size: 1.1rem; }.notion-native-title h2 { font-size: 1.12rem; }.notion-native-properties > div { grid-template-columns: 104px minmax(0, 1fr); }.notion-native-linked-layout { grid-template-columns: 1fr; }.notion-native-side-column { grid-template-columns: repeat(3, minmax(120px, 1fr)); overflow-x: auto; padding-bottom: .2rem; }.notion-native-callout { min-height: 104px; }.notion-native-linked-layout .notion-client-system { overflow-x: auto; }.notion-native-linked-layout .notion-client-systems { padding: 0; }.notion-native-db-toolbar { min-width: 520px; }.notion-native-db-scroll { min-width: 520px; }.notion-native-db-head, .notion-native-db-row { grid-template-columns: minmax(160px, 1.45fr) 72px 70px 82px 78px; }
  .photos-app { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }.photos-sidebar { display: block; overflow-x: auto; padding: .32rem .42rem; border-right: 0; border-bottom: 1px solid #dfe2e7; white-space: nowrap; }.photos-sidebar-title,.photos-sidebar > small,.photos-sidebar-note { display: none; }.photos-sidebar > button { display: inline-grid; width: auto; min-width: 135px; margin: 0 .12rem 0 0; vertical-align: top; }.photos-library { padding: .75rem; }.photos-library-head p { max-width: 320px; }.photos-grid { grid-template-columns: repeat(2,minmax(130px,1fr)); gap: .45rem; }.photos-lightbox { grid-template-columns: 38px minmax(0,1fr) 38px; padding: .6rem; }.photos-lightbox-nav { width: 30px; }
}

@media (max-width: 620px) {
  .dashboard-preview-shell > #dashboard-preview { min-width: 0; padding: 0; }
  .dashboard-live-toolbar { min-height: 36px; padding: .35rem .55rem; }
  .dashboard-live-toolbar span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}