#portfolio-visit [hidden] { display:none!important; }
#portfolio-visit { scroll-margin-top:100px; }
#portfolio-visit .pf-lead { max-width:720px; color:var(--muted); }
#portfolio-visit .pf-mode { display:flex; flex-wrap:wrap; gap:12px; margin:30px 0; }
#portfolio-visit button { font:inherit; }
#portfolio-visit .pf-mode button { display:flex; flex-direction:column; align-items:flex-start; gap:4px; border:1px solid var(--line); border-radius:12px; padding:16px 22px; min-width:210px; background:var(--surface); color:var(--ink); cursor:pointer; }
#portfolio-visit .pf-mode button span { font-size:17px; font-weight:650; }
#portfolio-visit .pf-mode button small { color:var(--muted); font-size:13px; }
#portfolio-visit .pf-mode button[aria-pressed="true"] { border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); }
#portfolio-visit .pf-controls button[aria-pressed="true"] { color:var(--bg); background:var(--accent); border-color:var(--accent); }
#portfolio-visit .pf-layout { display:grid; grid-template-columns:minmax(240px,.85fr) minmax(0,1.8fr); gap:30px; align-items:start; }
#portfolio-visit .pf-inputs { padding:24px; background:var(--surface); border:1px solid var(--line); border-radius:14px; }
#portfolio-visit .pf-inputs label { display:block; margin:0 0 8px; font-size:14px; color:var(--ink); }
#portfolio-visit input, #portfolio-visit textarea { width:100%; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--ink); font:inherit; padding:11px 13px; margin:0 0 20px; }
#portfolio-visit textarea { min-height:190px; resize:vertical; }
#portfolio-visit input:focus-visible, #portfolio-visit textarea:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
#portfolio-visit input::placeholder, #portfolio-visit textarea::placeholder { color:var(--muted); opacity:1; }
#portfolio-visit .pf-note { font-size:13px; color:var(--muted); margin:16px 0 0; }
#portfolio-visit .pf-button { border:1px solid var(--line); border-radius:8px; padding:10px 16px; min-height:44px; color:var(--ink); background:var(--bg); cursor:pointer; }
#portfolio-visit .pf-button.primary { color:var(--bg); background:var(--accent); border-color:var(--accent); }
#portfolio-visit .pf-controls { display:flex; flex-wrap:wrap; gap:8px; }
#portfolio-visit .pf-controls button { font-size:13px; }
#portfolio-visit .pf-control-label { font-size:13px; color:var(--muted); margin:0 0 10px; }
#portfolio-visit .pf-depth { margin-top:24px; }
#portfolio-visit .pf-result { min-width:0; }
#portfolio-visit .pf-result h3 { font-size:clamp(23px,3vw,34px); line-height:1.2; letter-spacing:-.025em; margin:10px 0 16px; }
#portfolio-visit .pf-result-intro { color:var(--muted); margin:0 0 12px; max-width:760px; }
#portfolio-visit .pf-context { color:var(--accent); text-transform:uppercase; letter-spacing:.07em; font-size:12px; overflow-wrap:anywhere; }
#portfolio-visit .pf-selection-note { color:var(--muted); font-size:12px; margin:0 0 22px; }
#portfolio-visit .pf-projects { display:grid; gap:12px; }
#portfolio-visit .pf-project { border:1px solid var(--line); border-radius:12px; padding:19px 20px; background:var(--surface); }
#portfolio-visit summary { cursor:pointer; }
#portfolio-visit .pf-project summary span { font-weight:600; font-size:16px; }
#portfolio-visit .pf-project summary small { display:block; color:var(--accent); margin:4px 0 0 18px; font-size:12px; }
#portfolio-visit .pf-project p { color:var(--muted); font-size:14px; margin:17px 0 0; }
#portfolio-visit .pf-project .pf-fact { font-size:13px; margin-top:10px; }
#portfolio-visit .pf-project .pf-source { font-size:12px; margin-top:12px; }
#portfolio-visit .pf-caveat { margin:14px 0 0; font-size:12px; color:var(--muted); }
#portfolio-visit .pf-caveat summary { font-size:12px; }
#portfolio-visit .pf-caveat p { font-size:12px; margin:10px 0 0; }
#portfolio-visit .pf-questions { margin-top:24px; }
#portfolio-visit .pf-questions h4 { font-size:15px; margin:0 0 8px; font-weight:600; }
#portfolio-visit .pf-questions ul { padding-left:21px; color:var(--muted); font-size:14px; }
#portfolio-visit .pf-bottom { display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:24px; }
#portfolio-visit .pf-bottom a { color:var(--accent); font-size:14px; text-decoration:underline; text-underline-offset:4px; }
#portfolio-visit .pf-status { color:var(--muted); font-size:12px; margin:18px 0 0; }
#portfolio-visit[data-active-mode="explorer"] .pf-result { padding-top:4px; }
@media(max-width:800px) { #portfolio-visit .pf-layout { grid-template-columns:1fr; gap:24px; } #portfolio-visit .pf-mode button { min-width:0; flex:1 1 180px; } }
@media(max-width:480px) { #portfolio-visit .pf-inputs { padding:18px; } #portfolio-visit input, #portfolio-visit textarea { font-size:16px; } #portfolio-visit .pf-project { padding:16px; } #portfolio-visit .pf-mode { gap:10px; } #portfolio-visit .pf-mode button { width:100%; flex-basis:100%; } }