/* Notebook material and typography. Layout is selected independently below. */
[data-skin=notebook]{--bg:#e5dfd2;--paper:#fffaf0;--ink:#332f28;--muted:#665e51;--brand:#854432;--accent:#345d50;--line:#cfc3ae;--radius:3px;--shadow:0 3px 0 #d8cebc,0 5px 0 #f8f0e1;--nb-rule:#b9c5c34a;--nb-tape:#dccba9a6;color-scheme:light}
[data-skin=notebook] body{background-color:var(--bg);font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
[data-skin=notebook] :is(h1,h2,h3){font-family:"Lora",Georgia,serif;font-weight:400;letter-spacing:-.035em;overflow-wrap:anywhere}
[data-skin=notebook] h1{line-height:1.12}
[data-skin=notebook] .brand{font-family:"Lora",Georgia,serif;font-weight:600;letter-spacing:-1px}
[data-skin=notebook] .button{border-radius:3px}
[data-skin=notebook] :is(input,textarea,select,fieldset){border-radius:3px;border-color:var(--line);background-color:var(--paper);color:var(--ink)}
[data-skin=notebook] textarea{background-image:repeating-linear-gradient(transparent 0 31px,var(--nb-rule) 31px 32px);background-position:0 12px;line-height:32px}
[data-skin=notebook] .tag{border-radius:2px}
[data-skin=notebook] .reading video{border-radius:3px}
[data-skin=notebook] .notice{border-radius:3px;background:var(--paper)}
[data-skin=notebook] .nb-hand{font-family:"Marck Script","Lora",Georgia,cursive;font-size:27px;font-weight:400;line-height:1.2;letter-spacing:0;color:var(--brand)}

/* Layout: continuous sewn notebook on mobile, spacious open journal on desktop. */
[data-layout=notebook]{--nb-rule:#b9c5c34a;--nb-tape:#dccba9a6}
[data-layout=notebook] .wrap{position:relative;isolation:isolate;max-width:1160px;margin:30px auto;padding:0 52px 0 78px;background-color:var(--paper);background-image:radial-gradient(#6a563009 .65px,transparent .8px);background-size:5px 5px;border:1px solid var(--line);border-radius:4px 12px 12px 4px;box-shadow:4px 4px 0 var(--line),7px 7px 0 var(--paper),8px 8px 0 var(--line),0 16px 50px #332f2810}
[data-layout=notebook] .wrap:before{content:"";position:absolute;inset:0 auto 0 20px;width:17px;border-right:1px solid #9e554b42;background:radial-gradient(ellipse at 4px 16px,#6a5b48 0 1.5px,#d4c6b0 2px 3px,transparent 3.5px) 0 0/13px 36px repeat-y,linear-gradient(90deg,transparent,#a4917030,transparent);pointer-events:none;z-index:-1}
[data-layout=notebook] .nb-top{gap:18px;padding:22px 0;border-bottom:1px solid var(--line)}
[data-layout=notebook] .nb-top .brand{display:inline-flex;align-items:center;min-height:44px}
[data-layout=notebook] .nb-brand-note{margin-right:auto;font-size:22px}
[data-layout=notebook] .nb-top nav{gap:14px}
[data-layout=notebook] .nb-top a:not(.brand){display:inline-flex;align-items:center;min-height:44px;padding:0 6px;color:var(--ink)}
[data-layout=notebook] .nb-language{border:1px solid var(--line);min-width:44px;justify-content:center;border-radius:3px}
[data-layout=notebook] :is(.button,.nb-text-link){min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:16px;text-align:center;line-height:1.35}
[data-layout=notebook] .nb-text-link{padding:8px 0}
[data-layout=notebook] :is(a,button,input,textarea,select,summary):focus-visible{outline:3px solid var(--accent);outline-offset:4px}
[data-layout=notebook] .nb-cover{display:grid;grid-template-columns:1.12fr 1fr;gap:56px;align-items:center;padding:70px 0 56px}
[data-layout=notebook] .nb-index{display:flex;justify-content:space-between;gap:12px;font:11px/1.5 "Courier New",monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
[data-layout=notebook] .nb-intro h1{font-size:clamp(40px,4.8vw,61px);max-width:640px;margin:24px 0}
[data-layout=notebook] .lead{font-size:17px;line-height:1.65;margin:20px 0}
[data-layout=notebook] .actions{gap:8px 24px;margin:28px 0 14px}
[data-layout=notebook] .nb-cover-note{font-size:24px;margin:16px 0 0}
[data-layout=notebook] .nb-sheet{position:relative;padding:30px 28px 18px;border:1px solid var(--line);background:var(--paper);box-shadow:3px 4px 0 #e9dfcb,0 14px 24px #332f280b;transform:rotate(1.2deg);scroll-margin-top:24px}
[data-layout=notebook] .nb-sheet:before{content:"";position:absolute;width:104px;height:24px;left:calc(50% - 52px);top:-13px;transform:rotate(-4deg);background:var(--nb-tape);border-inline:1px dashed #b7a689;pointer-events:none}
[data-layout=notebook] .nb-sheet h2{font-size:29px;line-height:1.24;margin:25px 0 18px}
[data-layout=notebook] .nb-caption{font-size:14px;line-height:1.6;color:var(--muted)}
[data-layout=notebook] .nb-sheet blockquote{font-family:"Lora",Georgia,serif;font-size:20px;line-height:1.65;margin:22px 0 12px;padding:12px 0;background:repeating-linear-gradient(transparent 0 32px,var(--nb-rule) 32px 33px)}
[data-layout=notebook] .nb-correction{font-size:25px;margin:4px 0 16px}
[data-layout=notebook] details{border-top:1px solid var(--line)}
[data-layout=notebook] summary{min-height:48px;padding:13px 0;font-size:15px;line-height:1.5;cursor:pointer}
[data-layout=notebook] details p{font-size:16px;line-height:1.65;margin:0;padding:4px 0 20px}
[data-layout=notebook] .nb-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;border-bottom:1px solid var(--line);padding-top:16px}
[data-layout=notebook] .nb-tabs a{min-height:48px;display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid var(--line);border-bottom:0;border-radius:6px 6px 0 0;font-size:14px;color:var(--ink);padding:10px 4px;background:#bfb29312}
[data-layout=notebook] .nb-tabs a:first-child{background:var(--brand);color:var(--paper);border-color:var(--brand)}
[data-layout=notebook] .nb-chapter{padding:48px 0;border-bottom:1px solid var(--line);scroll-margin-top:20px}
[data-layout=notebook] .nb-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:26px}
[data-layout=notebook] .nb-section-heading h2{max-width:530px;font-size:36px;line-height:1.25;margin:12px 0 0}
[data-layout=notebook] .nb-section-heading>.nb-hand{max-width:200px;margin:0 0 4px}
[data-layout=notebook] .nb-syllabus{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}
[data-layout=notebook] .nb-syllabus article{border-top:3px double var(--line);padding-top:20px}
[data-layout=notebook] .nb-syllabus h3{font-size:27px;line-height:1.3}
[data-layout=notebook] .nb-syllabus p{font-size:16px;line-height:1.65}
[data-layout=notebook] .nb-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:30px 0 6px}
[data-layout=notebook] .nb-plan{display:flex;flex-direction:column;position:relative;padding:28px 22px 22px;border:1px solid var(--line);background:var(--paper);box-shadow:var(--shadow)}
[data-layout=notebook] .nb-plan h3{font-size:25px;margin:15px 0 0}
[data-layout=notebook] .nb-plan>p:not(.note){font-size:15px;line-height:1.65;min-height:50px}
[data-layout=notebook] .nb-price{font-family:"Lora",Georgia,serif;font-size:31px;line-height:1.25;letter-spacing:-.04em;padding:15px 0;border-block:1px solid var(--line)}
[data-layout=notebook] .nb-price span{display:block;font:13px/1.7 system-ui,sans-serif;letter-spacing:0;color:var(--muted)}
[data-layout=notebook] .nb-plan ul{padding-left:18px;font-size:14px;line-height:1.6;margin:20px 0 24px;flex:1}
[data-layout=notebook] .nb-plan li+li{margin-top:9px}
[data-layout=notebook] .nb-plan .button{font-size:14px;padding:12px}
[data-layout=notebook] .nb-featured{border:1px solid var(--brand);order:0}
[data-layout=notebook] .nb-bookmark{align-self:flex-start;font:12px/1.4 system-ui,sans-serif;background:var(--brand);color:var(--paper);padding:7px 14px;margin:-43px 0 19px;border-radius:2px 2px 0 0}
[data-layout=notebook] .nb-questions{max-width:760px;margin:auto}
[data-layout=notebook] .nb-questions h2{font-size:36px;margin:15px 0 28px}
[data-layout=notebook] .nb-questions summary{font-size:17px;padding:18px 0}
[data-layout=notebook] .nb-colophon{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:35px 0}
[data-layout=notebook] footer{font-size:13px}
[data-layout=notebook] .skin-nav a{min-height:44px;display:inline-flex;align-items:center}
/* Shared course, lesson and personal-work views keep their existing forms and actions. */
[data-layout=notebook] .reading{margin:40px auto}
[data-layout=notebook] .reading>.card{margin:24px 0}
[data-layout=notebook] .lesson-row{align-items:flex-start;flex-wrap:wrap}
[data-layout=notebook] :is(.card,.lesson-row,.app-nav,.nb-plan,.nb-intro){min-width:0;overflow-wrap:anywhere}
[data-layout=notebook] .app-nav a{min-height:44px;display:inline-flex;align-items:center}
@media(min-width:900px){[data-layout=notebook] .nb-plan:nth-child(2){order:-1}}
@media(max-width:899px){
  [data-layout=notebook] .wrap{margin:16px 14px 22px;padding:0 26px 0 48px}
  [data-layout=notebook] .nb-cover{grid-template-columns:1fr;gap:42px;padding:42px 0 30px}
  [data-layout=notebook] .nb-intro{max-width:620px}
  [data-layout=notebook] .nb-sheet{transform:none;max-width:600px}
  [data-layout=notebook] .nb-plans{grid-template-columns:1fr;gap:34px}
  [data-layout=notebook] .nb-plan>p:not(.note){min-height:0}
  [data-layout=notebook] .nb-brand-note{display:none}
  [data-layout=notebook] .nb-section-heading{align-items:flex-start;flex-direction:column;gap:15px}
  [data-layout=notebook] .nb-section-heading>.nb-hand{max-width:none}
}
@media(max-width:540px){
  [data-layout=notebook] .wrap{margin:8px 6px 16px 4px;padding:0 18px 0 30px;border-radius:2px 7px 7px 2px;box-shadow:2px 3px 0 var(--line),4px 5px 0 var(--paper),5px 6px 0 var(--line)}
  [data-layout=notebook] .wrap:before{left:4px;width:12px;background-size:10px 30px,auto}
  [data-layout=notebook] .nb-top{padding:12px 0;gap:6px;align-items:center;flex-wrap:wrap}
  [data-layout=notebook] .brand{font-size:23px;flex-shrink:0}
  [data-layout=notebook] .nb-top nav{gap:2px;margin-left:auto;max-width:none}
  [data-layout=notebook] .nb-top nav a{font-size:13px}
  [data-layout=notebook] .nb-intro h1{font-size:41px;margin:21px 0}
  [data-layout=notebook] .nb-index{font-size:11px;gap:6px}
  [data-layout=notebook] .nb-intro>.nb-index{flex-wrap:wrap}
  [data-layout=notebook] .actions{display:flex;flex-direction:column;align-items:stretch;margin-top:24px;gap:4px}
  [data-layout=notebook] .nb-cover-note{font-size:24px}
  [data-layout=notebook] .nb-sheet{padding:25px 20px 16px}
  [data-layout=notebook] .nb-sheet h2{font-size:28px}
  [data-layout=notebook] .nb-sheet blockquote{font-size:19px}
  [data-layout=notebook] .nb-chapter{padding:36px 0}
  [data-layout=notebook] .nb-section-heading h2,[data-layout=notebook] .nb-questions h2{font-size:30px}
  [data-layout=notebook] .nb-syllabus{grid-template-columns:1fr;gap:28px}
  [data-layout=notebook] .nb-plan{padding:28px 20px 22px}
  [data-layout=notebook] .nb-tabs a{font-size:12px}
  [data-layout=notebook] .nb-colophon{align-items:flex-start;flex-direction:column;gap:8px}
  [data-layout=notebook] :is(.grid,.tracks){grid-template-columns:1fr}
  [data-layout=notebook] .card{padding:20px}
  [data-layout=notebook] .reading h1{font-size:34px}
}
@media(max-width:359px){[data-layout=notebook] .nb-intro h1{font-size:35px}[data-layout=notebook] .nb-top{row-gap:2px}[data-layout=notebook] .nb-top nav{gap:0}[data-layout=notebook] .nb-top nav a{padding-inline:4px}[data-layout=notebook] .nb-sheet{padding-inline:16px}}
@media(prefers-reduced-motion:reduce){[data-layout=notebook] *{scroll-behavior:auto}}
@media print{[data-layout=notebook] .wrap{margin:0;box-shadow:none;border:0}[data-layout=notebook] .wrap:before{display:none}[data-layout=notebook] .nb-sheet{transform:none;box-shadow:none}}