:root{--bg:#f4efe7;--bg-strong:#e6ddd0;--surface:#fffcf7d6;--surface-strong:#fffaf2;--surface-dark:#11211f;--text:#152220;--muted:#546560;--line:#1522201f;--accent:#0d7a67;--accent-strong:#095748;--accent-soft:#0d7a671f;--danger:#b93a32;--shadow-xl:0 24px 60px #1826231f;--shadow-lg:0 18px 36px #1826231a;--radius-lg:28px;--radius-md:18px;--radius-sm:12px;--display-font:"Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;--body-font:"Avenir Next", "Segoe UI", "Helvetica Neue", sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;color:var(--text);font-family:var(--body-font);background:radial-gradient(circle at 0 0,#0d7a6724,#0000 28%),radial-gradient(circle at 100% 0,#feba6b47,#0000 24%),linear-gradient(#f9f4ed 0%,#f3ece2 42%,#ede4d7 100%);margin:0}body:before{pointer-events:none;content:"";background-image:linear-gradient(#ffffff2e 1px,#0000 1px),linear-gradient(90deg,#ffffff2e 1px,#0000 1px);background-size:44px 44px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#00000052,#0000 75%);mask-image:linear-gradient(#00000052,#0000 75%)}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}.app-shell{padding:32px;position:relative}.home-page{background:#f7f4ee;height:100svh;position:relative;overflow:hidden}.home-screen{min-height:100%;transition:opacity .42s,transform .52s cubic-bezier(.22,1,.36,1),visibility .42s;position:absolute;inset:0}.cover-screen{z-index:2;opacity:1;visibility:visible;background:radial-gradient(circle at 0 0,#12201e0f,#0000 28%),radial-gradient(circle at 100% 100%,#0d7a6714,#0000 30%),linear-gradient(#f8f5ef 0%,#f2eee6 100%);padding:24px;transform:translate(0,0)scale(1)}.cover-panel{isolation:isolate;background:radial-gradient(circle at 0 0,#12201e0f,#0000 28%),radial-gradient(circle at 100% 100%,#0d7a6714,#0000 30%),linear-gradient(#ffffffd6,#faf7f0eb),#f8f5ef;border:1px solid #15222014;border-radius:36px;grid-template-rows:auto 1fr auto;gap:32px;min-height:calc(100svh - 48px);padding:clamp(28px,5vw,56px);display:grid;position:relative;overflow:hidden;box-shadow:0 28px 72px #19211f14}.cover-panel:before{z-index:-1;content:"";background-image:linear-gradient(#12201e0d 1px,#0000 1px),linear-gradient(90deg,#12201e0d 1px,#0000 1px);background-size:64px 64px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#0000006b,#0000 82%);mask-image:linear-gradient(#0000006b,#0000 82%)}.cover-meta,.cover-footer{align-items:center;gap:16px;display:flex}.cover-meta{justify-content:space-between}.cover-footer{justify-content:center}.cover-meta,.cover-footer span{color:#152220a3;letter-spacing:.12em;text-transform:uppercase;font-size:.88rem}.cover-copy{text-align:center;align-content:center;place-items:center;gap:22px;display:grid}.cover-kicker{color:#15222080;letter-spacing:.16em;text-transform:uppercase;font-size:.92rem}.cover-title{font-family:var(--display-font);letter-spacing:-.07em;color:#182321;margin:0;font-size:clamp(4rem,13vw,10rem);line-height:.88}.cover-link{min-width:190px;padding-inline:28px}.browser-screen{z-index:1;opacity:0;visibility:hidden;background:#f7f4ee;transform:translateY(36px)scale(.985)}.browser-screen-frame{height:100%;min-height:100%}.home-page.is-browser-open .cover-screen{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-28px)scale(.985)}.home-page.is-browser-open .browser-screen{opacity:1;visibility:visible;transform:translate(0,0)scale(1)}.browser-shell{color:#1a1f1e;background:#f7f4ee;flex-direction:column;height:100svh;min-height:100svh;display:flex}.browser-topbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#f7f4eee0;border-bottom:1px solid #1a1f1e1a;justify-content:space-between;align-items:flex-end;gap:24px;padding:28px 36px;display:flex}.browser-topbar-copy{gap:10px;display:grid}.browser-topbar-copy h2{letter-spacing:-.05em;margin:0;font-size:clamp(2rem,4vw,3.2rem);line-height:.95}.browser-home-button{width:fit-content;color:inherit;font:inherit;letter-spacing:-.05em;background:0 0;border:0;padding:0;font-size:clamp(2rem,4vw,3.2rem);font-weight:700;line-height:.95;text-decoration:none;transition:opacity .18s,transform .18s}.browser-home-button:hover{opacity:.72;transform:translate(-2px)}.browser-topbar-copy p,.browser-empty p,.browser-card-copy p,.browser-detail-block p{color:#1a1f1ea3;margin:0;line-height:1.7}.browser-topbar-meta{text-align:right;gap:4px;min-width:160px;display:grid}.browser-topbar-meta strong{font-family:var(--display-font);font-size:2rem;line-height:1}.browser-topbar-meta span{color:#1a1f1e94;letter-spacing:.1em;text-transform:uppercase;font-size:.86rem}.browser-stage{flex:1;min-height:0;position:relative;overflow:hidden}.browser-grid-scroll{height:100%;padding:34px 36px 40px;transition:padding-right .26s;overflow-y:auto}.browser-stage.has-selection .browser-grid-scroll{padding-right:468px}.browser-grid{grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:20px;display:grid}.browser-card{text-align:left;opacity:0;background:#ffffffe0;border:1px solid #1a1f1e1a;border-radius:26px;align-content:start;gap:18px;min-height:280px;padding:22px;transition:transform .18s,border-color .18s,box-shadow .18s,background .18s;animation:.52s forwards browser-card-enter;display:grid;transform:translateY(14px);box-shadow:0 14px 28px #161d1c0a}.browser-card:hover{border-color:#1a1f1e38;transform:translateY(-2px);box-shadow:0 22px 44px #161d1c14}.browser-card.is-active{background:#fff;border-color:#1a1f1e70;transform:translateY(-2px)scale(1.01);box-shadow:0 24px 48px #161d1c1a}.browser-card-top,.browser-drawer-head,.browser-drawer-footer{justify-content:space-between;align-items:center;gap:12px;display:flex}.browser-card-index{color:#1a1f1e6b;letter-spacing:.14em;text-transform:uppercase;font-size:.84rem;font-weight:700}.browser-card-download{color:#1a1f1ead;letter-spacing:.08em;text-transform:uppercase;opacity:0;font-size:.84rem;font-weight:700;transition:opacity .18s}.browser-card:hover .browser-card-download,.browser-card:focus-visible .browser-card-download,.browser-card.is-active .browser-card-download{opacity:1}.browser-card-copy{gap:12px;display:grid}.browser-card-copy h3,.browser-drawer-title h2,.browser-empty h3{font-family:var(--display-font);letter-spacing:-.04em;margin:0}.browser-card-copy h3{font-size:1.5rem;line-height:1}.browser-card-copy p{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.browser-card-trigger{background:#f6f4ef;border:1px solid #1a1f1e14;border-radius:18px;gap:8px;padding:14px 15px;display:grid}.browser-card-trigger strong,.browser-detail-block h3{color:#1a1f1e7a;letter-spacing:.12em;text-transform:uppercase;font-size:.8rem;font-weight:700}.browser-card-trigger span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.browser-card-tags,.browser-detail-tags{flex-wrap:wrap;gap:10px;margin-top:auto;display:flex}.browser-tag{color:#1a1f1ead;background:#ffffffc2;border:1px solid #1a1f1e1a;border-radius:999px;align-items:center;min-height:32px;padding:0 12px;font-size:.84rem;font-weight:600;display:inline-flex}.browser-tag-strong{background:#f7f4ee}.browser-drawer{opacity:0;visibility:hidden;pointer-events:none;z-index:3;background:#fbf9f4fa;border-left:1px solid #1a1f1e1a;grid-template-rows:minmax(0,1fr) auto;width:420px;height:100%;transition:transform .28s,opacity .22s,visibility .22s;display:grid;position:absolute;top:0;right:0;transform:translate(100%);box-shadow:-24px 0 60px #11161514}.browser-drawer.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translate(0)}.browser-drawer-main{align-content:start;gap:24px;padding:28px;display:grid;overflow-y:auto}.browser-drawer-close{min-width:96px}.browser-drawer-title{gap:12px;display:grid}.browser-drawer-title h2{font-size:2.35rem;line-height:.98}.browser-detail-block{border-top:1px solid #1a1f1e1a;gap:14px;padding-top:22px;display:grid}.browser-trigger-panel{color:#1a1f1e;background:#f6f4ef;border:1px solid #1a1f1e14;border-radius:20px;padding:16px 18px;line-height:1.7}.browser-drawer-footer{background:#fbf9f4fa;border-top:1px solid #1a1f1e1a;padding:20px 28px 28px}.browser-empty{text-align:center;place-content:center;justify-items:center;gap:16px;height:100%;padding:32px;display:grid}.browser-empty h3{font-size:clamp(2rem,4vw,3rem);line-height:.95}@keyframes browser-card-enter{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes browser-screen-enter{0%{opacity:0;transform:translateY(36px)}to{opacity:1;transform:translateY(0)}}.hero-card,.panel,.skill-card,.admin-card,.login-card,.modal-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:var(--surface);box-shadow:var(--shadow-xl);border:1px solid #ffffff8c}.eyebrow{color:var(--accent-strong);letter-spacing:.08em;text-transform:uppercase;background:#ffffffb8;border:1px solid #0d7a6724;border-radius:999px;align-items:center;gap:10px;padding:8px 14px;font-size:13px;font-weight:700;display:inline-flex}.section-title{font-family:var(--display-font);letter-spacing:-.04em;margin:0;font-size:clamp(2.2rem,5vw,4.7rem);line-height:.95}.section-copy{max-width:640px;color:var(--muted);margin:0;font-size:1.02rem;line-height:1.75}.button{border:none;border-radius:999px;justify-content:center;align-items:center;gap:10px;min-height:48px;padding:0 18px;text-decoration:none;transition:transform .18s,background .18s,box-shadow .18s,opacity .18s;display:inline-flex}.button:hover{transform:translateY(-1px)}.button:disabled{cursor:wait;opacity:.6;transform:none}.button-primary{color:#fff8f1;background:linear-gradient(135deg,#0f7e6b 0%,#0d5c4c 100%);box-shadow:0 16px 32px #0d5c4c3d}.button-secondary{color:var(--text);background:#ffffffc7;border:1px solid #11211f14}.button-danger{color:#fff4f1;background:linear-gradient(135deg,#c24b40 0%,#8f2d29 100%);box-shadow:0 16px 32px #8f2d2933}.status-pill,.tag-pill{white-space:nowrap;border-radius:999px;align-items:center;min-height:32px;padding:0 12px;display:inline-flex}.tag-pill{color:var(--accent-strong);background:#09574814;border:1px solid #09574814;font-size:.9rem;font-weight:600}.status-pill{text-transform:uppercase;letter-spacing:.05em;font-size:.82rem;font-weight:700}.status-pill[data-status=published]{color:#075f4f;background:#087e681f}.status-pill[data-status=private]{color:#6b5647;background:#6b56471f}.field{gap:10px;display:grid}.field label{font-size:.92rem;font-weight:700}.input,.textarea,.select{width:100%;color:var(--text);background:#ffffffeb;border:1px solid #11211f1f;border-radius:16px;outline:none;transition:border-color .18s,box-shadow .18s}.input,.select{min-height:48px;padding:0 14px}.textarea{resize:vertical;min-height:120px;padding:14px}.input:focus,.textarea:focus,.select:focus{border-color:#0d7a678c;box-shadow:0 0 0 4px #0d7a671f}.helper-text{color:var(--muted);font-size:.9rem;line-height:1.6}.notice{border-radius:16px;padding:12px 16px;font-size:.95rem;line-height:1.6}.notice-success{color:#075f4f;background:#097b661f}.notice-error{color:#8f2d29;background:#b93a321f}.empty-state{color:var(--muted);text-align:center;border:1px dashed #11211f2e;border-radius:28px;padding:32px;line-height:1.7}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.showcase-shell,.admin-shell,.login-shell{gap:24px;display:grid}.inline-form{margin:0}.showcase-hero,.admin-hero{border-radius:34px;gap:24px;padding:30px;display:grid}.showcase-heading,.login-copy,.detail-empty,.detail-block,.admin-editor-head,.admin-card-head>div:first-child{gap:14px;display:grid}.hero-metrics{flex-wrap:wrap;gap:16px;display:flex}.hero-metrics div{background:#11211f0f;border-radius:22px;gap:6px;min-width:180px;padding:18px 20px;display:grid}.hero-metrics strong{font-family:var(--display-font);font-size:1.7rem}.hero-metrics span{color:var(--muted)}.showcase-grid{grid-template-columns:minmax(0,1.8fr) minmax(340px,.9fr);align-items:start;gap:24px;display:grid}.skills-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;display:grid}.skill-card{text-align:left;transform-origin:50%;border:1px solid #ffffff8c;border-radius:26px;gap:18px;padding:22px;display:grid}.skill-card.is-active{background:#fffaf2f2;border-color:#0d7a6733;box-shadow:0 28px 48px #0d5c4c26}.skill-card-top,.skill-card-footer,.detail-panel-header,.admin-actions,.admin-card-head,.admin-card-title,.admin-card-actions,.modal-actions,.tag-editor-item{justify-content:space-between;align-items:center;gap:12px;display:flex}.skill-card-copy{gap:12px;display:grid}.skill-card-copy h2,.detail-panel h2,.admin-card-title h2,.admin-editor h2,.modal-card h2{font-family:var(--display-font);letter-spacing:-.03em;margin:0}.skill-card-copy h2{font-size:1.55rem;line-height:1}.skill-card-copy p,.admin-card-head p,.detail-block p,.detail-empty p,.modal-card p{color:var(--muted);margin:0;line-height:1.7}.skill-meta{gap:4px;display:grid}.skill-meta strong,.detail-block h3,.admin-card-grid strong{text-transform:uppercase;letter-spacing:.06em;color:var(--accent-strong);font-size:.9rem}.skill-meta span,.admin-card-grid span{color:var(--text);line-height:1.7}.skill-tags,.detail-tags,.admin-tag-list{flex-wrap:wrap;gap:10px;display:flex}.skill-toggle{color:var(--muted);font-size:.88rem;font-weight:700}.detail-panel{border-radius:30px;align-content:start;gap:22px;min-height:520px;padding:24px;display:grid;position:sticky;top:32px}.detail-panel-header{align-items:flex-start}.detail-panel h2{font-size:2.2rem}.detail-block{border-top:1px solid var(--line);padding-top:18px}.detail-block h3{margin:0}.detail-download{gap:14px}.detail-empty{align-content:center;height:100%}.detail-close{min-width:88px}.login-shell{place-items:center;min-height:calc(100vh - 64px)}.login-card{border-radius:34px;gap:20px;width:min(560px,100%);padding:36px;display:grid}.admin-hero{grid-template-columns:minmax(0,1.5fr) auto;align-items:end}.admin-actions{flex-wrap:wrap;justify-content:flex-end}.admin-list{gap:18px;display:grid}.admin-card{border-radius:28px;gap:24px;padding:24px;display:grid}.admin-card-head{align-items:flex-start}.admin-card-title{flex-wrap:wrap;justify-content:flex-start}.admin-card-title h2{font-size:2rem}.admin-card-grid{border-top:1px solid var(--line);grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding-top:18px;display:grid}.admin-card-grid>div{gap:8px;display:grid}.admin-editor{background:#fff9f0f0}.editor-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.editor-grid-full{grid-column:1/-1}.tag-editor-list{gap:12px;display:grid}.tag-editor-item{justify-content:stretch}.tag-editor-item .input{flex:1}.file-input{align-items:center;padding-top:10px;display:flex}.modal-backdrop{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0c161466;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.modal-card{border-radius:28px;gap:18px;width:min(520px,100%);padding:28px;display:grid}.modal-actions{justify-content:flex-end}@media (max-width:1280px){.browser-grid,.skills-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:1080px){.browser-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.browser-stage.has-selection .browser-grid-scroll{padding-right:36px}.browser-drawer{width:min(100%,520px)}.showcase-grid,.admin-hero,.editor-grid,.admin-card-grid{grid-template-columns:1fr}.detail-panel{min-height:auto;position:relative;top:0}.admin-card-head,.admin-card-actions,.detail-panel-header{flex-direction:column;align-items:stretch}}@media (max-width:900px){.cover-screen{padding:16px}.cover-panel{border-radius:28px;gap:24px;min-height:calc(100svh - 32px)}.cover-meta,.cover-footer,.browser-topbar{flex-direction:column;align-items:stretch}.browser-topbar{padding:24px 20px}.browser-topbar-meta{text-align:left}.browser-grid-scroll{padding:20px 20px 28px}.browser-grid{grid-template-columns:1fr}.browser-drawer{width:100%}.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.app-shell{padding:20px}.cover-title{font-size:clamp(3.2rem,18vw,5rem)}.cover-subtitle{font-size:.98rem}.cover-link{width:100%}.browser-drawer-main,.browser-drawer-footer{padding-left:20px;padding-right:20px}.browser-drawer-title h2{font-size:2rem}.showcase-hero,.admin-hero,.login-card,.skill-card,.detail-panel,.admin-card,.modal-card{border-radius:24px;padding:20px}.section-title{font-size:clamp(2rem,8vw,3rem)}}@media (max-width:640px){.skills-grid{grid-template-columns:1fr}.cover-meta,.cover-footer{gap:12px}.browser-card-top,.browser-drawer-head,.browser-drawer-footer{flex-direction:column;align-items:stretch}.browser-card-download,.browser-card:hover .browser-card-download,.browser-card:focus-visible .browser-card-download,.browser-card.is-active .browser-card-download{opacity:1}.skill-card-top,.skill-card-footer,.admin-actions,.modal-actions,.tag-editor-item{flex-direction:column;align-items:stretch}.button{width:100%}}
